Swasth-Digital-Health-Foundation · AbhiGaddi · Apr 8, 2024 · Apr 8, 2024
diff --git a/index.html b/index.html
@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <link rel="icon" href="/src/images/swasth_logo_1.jpg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Self Service Portal - HCX</title>
+    <title>Mock Payor - HCX</title>
   </head>
   <body>
     <div id="root"></div>

diff --git a/src/App.tsx b/src/App.tsx
@@ -26,13 +26,13 @@ function App() {
     <>
       <Routes>
         <Route 
-          path="/payor/login" 
+          path="/" 
           element={<SignIn/>}
         >  
         </Route>
         <Route element={<DefaultLayout />}>
           <Route
-            path="/payor/coverageeligibility/list"
+            path="/coverageeligibility/list"
             element={
               <>
                 <PageTitle title="Coverage Eligibility" />
@@ -41,7 +41,7 @@ function App() {
             }
           />
           <Route
-            path="/payor/coverageeligibility/details"
+            path="/coverageeligibility/details"
             element={
               <>
                 <PageTitle title="Coverage Eligibility" />
@@ -50,7 +50,7 @@ function App() {
             }
           />
           <Route
-            path="/payor/preauth/list"
+            path="/preauth/list"
             element={
               <>
                 <PageTitle title="PreAuthorization" />
@@ -60,7 +60,7 @@ function App() {
           />
 
           <Route
-            path="/payor/preauth/detail"
+            path="/preauth/detail"
             element={
               <>
                 <PageTitle title="PreAuthorization" />
@@ -69,7 +69,7 @@ function App() {
             }
           />
            <Route
-            path="/payor/claims/list"
+            path="/claims/list"
             element={
               <>
                 <PageTitle title="Claims" />
@@ -78,7 +78,7 @@ function App() {
             }
           />
           <Route
-            path="/payor/claims/detail"
+            path="/claims/detail"
             element={
               <>
                 <PageTitle title="Claims" />

diff --git a/src/components/DocumentList.tsx b/src/components/DocumentList.tsx
@@ -0,0 +1,75 @@
+import React, { useState } from 'react';
+import ModalFileViewer from './ModalFileViewer';
+import EmptyState from './EmptyState';
+
+interface DocumentsListProps {
+    files: string[];
+}
+
+const DocumentsList: React.FC<DocumentsListProps> = ({ files }: DocumentsListProps) => {
+    const [showFile, setShowFile] = useState(false);
+    const [selectedFile, setSelectedFile] = useState("");
+
+    const onFileView = (file: string) => {
+        setSelectedFile(file);
+        setShowFile(true);
+    }
+
+    return (
+        <div className="rounded-sm border border-stroke bg-white pt-3 pb-2.5 mr-75 shadow-default dark:border-strokedark dark:bg-boxdark sm:px-7.5 xl:pb-1">
+            <div className="text-title-sm2 font-bold pt-3 pb-5 text-black dark:text-white"><h2> Supporting Documents</h2></div>
+            {files.length !== 0 ?
+                <table className="w-full table-auto">
+                    <thead>
+                        <tr className="bg-gray-2 text-left dark:bg-meta-4 px-50 ">
+                            <th className="min-w-[220px] py-4 px-4 font-medium text-black dark:text-white xl:pl-11">
+                                Document Type
+                            </th>
+                            <th className="min-w-[150px] py-4 px-4 font-medium text-black dark:text-white">
+                                Document Name
+                            </th>
+                            <th className="min-w-[220px] py-4 px-4 font-medium text-black dark:text-white xl:pl-11">
+                                Action
+                            </th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        {files.map((file: any, index: number) => (
+                            <tr key={index} className=" text-left dark:bg-meta-4">
+                                <td className="border-b border-[#eee] py-4 px-4 pl-12 dark:border-strokedark">
+                                    <p className="font-medium text-black dark:text-white">{file.category.coding[0].code}</p>
+                                </td>
+                                <td className="border-b border-[#eee] py-5 px-4 dark:border-strokedark">
+                                    <p className="font-medium text-black dark:text-white">
+                                        {decodeURIComponent(file.valueAttachment.url).split("/").at(-1) || "Document"}
+                                    </p>
+                                </td>
+                                <td className="border-b border-[#eee] py-5 px-4 pl-12 dark:border-strokedark" style={{ display: 'flex', gap: '10px' }}>
+                                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" className="w-6 h-6" onClick={() => onFileView(file.valueAttachment.url)}>
+                                        <path stroke-linecap="round" stroke-linejoin="round" d="M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z" />
+                                        <path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" />
+                                    </svg>
+                                    <a href={file.valueAttachment.url} download>
+                                        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" className="w-6 h-6">
+                                            <path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5M16.5 12 12 16.5m0 0L7.5 12m4.5 4.5V3" />
+                                        </svg>
+                                    </a>
+                                </td>
+                            </tr>
+                        ))}
+                    </tbody>
+                </table>
+                :
+                <EmptyState
+                    title="No Documents Found"
+                    description="No documents have been added to this claim."
+                />
+            }
+            {showFile &&
+                <ModalFileViewer file={selectedFile} onClose={() => setShowFile(false)} />
+            }
+        </div>
+    );
+};
+
+export default DocumentsList;
diff --git a/src/components/DropdownUser.tsx b/src/components/DropdownUser.tsx
@@ -159,7 +159,7 @@ const DropdownUser = () => {
           </li>
         </ul> */}
         <button className="flex items-center gap-3.5 py-4 px-6 text-sm font-medium duration-300 ease-in-out hover:text-primary lg:text-base"
-          onClick={() => navigate("/payor/login")}>
+          onClick={() => navigate("/")}>
           <svg
             className="fill-current"
             width="22"

diff --git a/src/components/FileManager.tsx b/src/components/FileManager.tsx
@@ -1,76 +1,78 @@
 import React, { useState } from 'react';
 import ModalFileViewer from './ModalFileViewer';
 import EmptyState from './EmptyState';
-import axios from 'axios';
-import { toast } from 'react-toastify';
 
 interface FileManagerProps {
-  files:string[];
+  files: string[];
 }
 
-const FileManager:React.FC<FileManagerProps> = ({files}:FileManagerProps) => {
+const FileManager: React.FC<FileManagerProps> = ({ files }: FileManagerProps) => {
 
-  const [showFile, setShowFile] =useState(false);
+  const [showFile, setShowFile] = useState(false);
   const [selectedFile, setSelectedFile] = useState("");
-  console.log("files list ", files);
+  console.log("files list ", files.map((fi : any) => {
+      console.log("File url --" ,fi.valueAttachment.url)
+      console.log("File coding" ,fi.category.coding[0].code);
+  } ));
 
-  const onFileView = (file:string) => {
+
+
+  const onFileView = (file: string) => {
     setSelectedFile(file);
     setShowFile(true);
   }
   return (
     <>
-    {showFile ? 
-    <ModalFileViewer file={selectedFile} onClose={() => setShowFile(false)}></ModalFileViewer> :null }
-    <div className="col-span-12">
-    {files.length !== 0 ?
-      <div className="rounded-sm border border-stroke bg-white py-3 shadow-default dark:border-strokedark dark:bg-boxdark">
-
-        <>
-        {files.map((file:any) => {
-          return(        
-          <div className="flex justify-between gap-2.5 py-3 px-6 hover:bg-gray-2 dark:hover:bg-meta-4 sm:items-center sm:justify-start">
-          <div className="flex items-center gap-5.5">
-            <div className="hidden h-14 w-full max-w-14 items-center justify-center rounded-full border border-stroke bg-gray text-black-2 dark:border-strokedark dark:bg-graydark dark:text-white sm:flex">
-              <svg
-                className="fill-current"
-                width="28"
-                height="29"
-                viewBox="0 0 28 29"
-                fill="none"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  fillRule="evenodd"
-                  clipRule="evenodd"
-                  d="M4.72659 3.36759C5.32314 2.77105 6.13222 2.43591 6.97585 2.43591H16.2295L16.2299 2.43591L16.2303 2.43591C16.4817 2.43591 16.7081 2.54281 16.8665 2.71363L23.7604 9.6075C23.9312 9.76594 24.0381 9.99231 24.0381 10.2437C24.0381 10.2568 24.0378 10.2699 24.0372 10.2828V24.1241C24.0372 24.9677 23.7021 25.7768 23.1055 26.3733C22.509 26.9699 21.6999 27.305 20.8563 27.305H6.97585C6.13222 27.305 5.32313 26.9699 4.72659 26.3733C4.13005 25.7768 3.79492 24.9677 3.79492 24.1241V5.61684C3.79492 4.77321 4.13005 3.96413 4.72659 3.36759ZM6.97585 4.17097H15.3628V10.2437C15.3628 10.7228 15.7512 11.1112 16.2303 11.1112H22.3022V24.1241C22.3022 24.5075 22.1498 24.8753 21.8787 25.1465C21.6075 25.4176 21.2397 25.57 20.8563 25.57H6.97585C6.59238 25.57 6.22462 25.4176 5.95346 25.1465C5.68231 24.8753 5.52997 24.5075 5.52997 24.1241V5.61684C5.52997 5.23337 5.68231 4.86561 5.95346 4.59445C6.22462 4.3233 6.59238 4.17097 6.97585 4.17097ZM17.0979 5.3987L21.0753 9.37613H17.0979V5.3987ZM9.2896 15.1596C8.81048 15.1596 8.42208 15.548 8.42208 16.0271C8.42208 16.5062 8.81048 16.8946 9.2896 16.8946H18.5432C19.0223 16.8946 19.4107 16.5062 19.4107 16.0271C19.4107 15.548 19.0223 15.1596 18.5432 15.1596H9.2896ZM8.42208 20.654C8.42208 20.1749 8.81048 19.7865 9.2896 19.7865H18.5432C19.0223 19.7865 19.4107 20.1749 19.4107 20.654C19.4107 21.1332 19.0223 21.5216 18.5432 21.5216H9.2896C8.81048 21.5216 8.42208 21.1332 8.42208 20.654ZM9.2896 10.5328C8.81048 10.5328 8.42208 10.9212 8.42208 11.4003C8.42208 11.8795 8.81048 12.2679 9.2896 12.2679H11.603C12.0821 12.2679 12.4705 11.8795 12.4705 11.4003C12.4705 10.9212 12.0821 10.5328 11.603 10.5328H9.2896Z"
-                  fill=""
-                />
-              </svg>
-            </div>
+      {showFile ?
+        <ModalFileViewer file={selectedFile} onClose={() => setShowFile(false)}></ModalFileViewer> : null}
+      <div className="col-span-12">
+        {files.length !== 0 ?
+          <div className="rounded-sm border border-stroke bg-white py-3 shadow-default dark:border-strokedark dark:bg-boxdark">
+            <>
+              {files.map((file: any) => {
+                return (
+                  <div className="flex justify-between gap-2.5 py-3 px-6 hover:bg-gray-2 dark:hover:bg-meta-4 sm:items-center sm:justify-start">
+                    <div className="flex items-center gap-5.5">
+                      <div className="hidden h-14 w-full max-w-14 items-center justify-center rounded-full border border-stroke bg-gray text-black-2 dark:border-strokedark dark:bg-graydark dark:text-white sm:flex">
+                        <svg
+                          className="fill-current"
+                          width="28"
+                          height="29"
+                          viewBox="0 0 28 29"
+                          fill="none"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            fillRule="evenodd"
+                            clipRule="evenodd"
+                            d="M4.72659 3.36759C5.32314 2.77105 6.13222 2.43591 6.97585 2.43591H16.2295L16.2299 2.43591L16.2303 2.43591C16.4817 2.43591 16.7081 2.54281 16.8665 2.71363L23.7604 9.6075C23.9312 9.76594 24.0381 9.99231 24.0381 10.2437C24.0381 10.2568 24.0378 10.2699 24.0372 10.2828V24.1241C24.0372 24.9677 23.7021 25.7768 23.1055 26.3733C22.509 26.9699 21.6999 27.305 20.8563 27.305H6.97585C6.13222 27.305 5.32313 26.9699 4.72659 26.3733C4.13005 25.7768 3.79492 24.9677 3.79492 24.1241V5.61684C3.79492 4.77321 4.13005 3.96413 4.72659 3.36759ZM6.97585 4.17097H15.3628V10.2437C15.3628 10.7228 15.7512 11.1112 16.2303 11.1112H22.3022V24.1241C22.3022 24.5075 22.1498 24.8753 21.8787 25.1465C21.6075 25.4176 21.2397 25.57 20.8563 25.57H6.97585C6.59238 25.57 6.22462 25.4176 5.95346 25.1465C5.68231 24.8753 5.52997 24.5075 5.52997 24.1241V5.61684C5.52997 5.23337 5.68231 4.86561 5.95346 4.59445C6.22462 4.3233 6.59238 4.17097 6.97585 4.17097ZM17.0979 5.3987L21.0753 9.37613H17.0979V5.3987ZM9.2896 15.1596C8.81048 15.1596 8.42208 15.548 8.42208 16.0271C8.42208 16.5062 8.81048 16.8946 9.2896 16.8946H18.5432C19.0223 16.8946 19.4107 16.5062 19.4107 16.0271C19.4107 15.548 19.0223 15.1596 18.5432 15.1596H9.2896ZM8.42208 20.654C8.42208 20.1749 8.81048 19.7865 9.2896 19.7865H18.5432C19.0223 19.7865 19.4107 20.1749 19.4107 20.654C19.4107 21.1332 19.0223 21.5216 18.5432 21.5216H9.2896C8.81048 21.5216 8.42208 21.1332 8.42208 20.654ZM9.2896 10.5328C8.81048 10.5328 8.42208 10.9212 8.42208 11.4003C8.42208 11.8795 8.81048 12.2679 9.2896 12.2679H11.603C12.0821 12.2679 12.4705 11.8795 12.4705 11.4003C12.4705 10.9212 12.0821 10.5328 11.603 10.5328H9.2896Z"
+                            fill=""
+                          />
+                        </svg>
+                      </div>
 
-            <p className="font-medium text-black dark:text-white">
-             {decodeURIComponent(file.valueAttachment.url).split("/").at(-1) || "Document"}
-            </p>
-          </div>
+                      <p className="font-medium text-black dark:text-white">
+                        {decodeURIComponent(file.valueAttachment.url).split("/").at(-1) || "Document"}
+                      </p>
+                    </div>
 
-          <div className="text-right">
-            <button className="font-medium pr-4 underline text-meta-5"
-              onClick={() => onFileView(file.valueAttachment.url)}>
-              View
-            </button>
-          </div>
-        </div>)
-        })}
+                    <div className="text-right">
+                      <button className="font-medium pr-4 underline text-meta-5"
+                        onClick={() => onFileView(file.valueAttachment.url)}>
+                        View
+                      </button>
+                    </div>
+                  </div>)
+              })}
 
-        </>   
-      </div> : 
-      <EmptyState
-        title="No Documents Found"
-        description="No documents have been added to this claim."
-      />
-      }
-    </div>
+            </>
+          </div> :
+          <EmptyState
+            title="No Documents Found"
+            description="No documents have been added to this claim."
+          />
+        }
+      </div>
     </>
   );
 };

diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx
@@ -87,7 +87,7 @@ const Sidebar = ({ sidebarOpen, setSidebarOpen }: SidebarProps) => {
     >
       {/* <!-- SIDEBAR HEADER --> */}
       <div className="flex items-center justify-between gap-2 px-6 py-5.5 lg:py-6.5">
-        <NavLink to="/payor/coverageeligibility/list">
+        <NavLink to="/coverageeligibility/list">
           <img className="hidden dark:block w-40" src={Logo} alt="Logo" />
           <img className="dark:hidden w-40" src={Logo} alt="Logo" />
         </NavLink>
@@ -129,7 +129,7 @@ const Sidebar = ({ sidebarOpen, setSidebarOpen }: SidebarProps) => {
               {/* <!-- Menu Item Dashboard --> */}
               <li>
                 <NavLink
-                  to="/payor/coverageeligibility/list"
+                  to="/coverageeligibility/list"
                   className={`group relative flex items-center gap-2.5 rounded-sm py-2 px-4 font-medium text-bodydark1 duration-300 ease-in-out hover:bg-graydark dark:hover:bg-meta-4 ${pathname.includes('coverageeligibility') &&
                     'bg-graydark dark:bg-meta-4'
                     }`}
@@ -156,7 +156,7 @@ const Sidebar = ({ sidebarOpen, setSidebarOpen }: SidebarProps) => {
               </li>
               <li>
                 <NavLink
-                  to="/payor/preauth/list"
+                  to="/preauth/list"
                   className={`group relative flex items-center gap-2.5 rounded-sm py-2 px-4 font-medium text-bodydark1 duration-300 ease-in-out hover:bg-graydark dark:hover:bg-meta-4 ${pathname.includes('preauth') &&
                     'bg-graydark dark:bg-meta-4'
                     }`}
@@ -181,7 +181,7 @@ const Sidebar = ({ sidebarOpen, setSidebarOpen }: SidebarProps) => {
               </li>
               <li>
                 <NavLink
-                  to="/payor/claims/list"
+                  to="/claims/list"
                   className={`group relative flex items-center gap-2.5 rounded-sm py-2 px-4 font-medium text-bodydark1 duration-300 ease-in-out hover:bg-graydark dark:hover:bg-meta-4 ${pathname.includes('claims') &&
                     'bg-graydark dark:bg-meta-4'
                     }`}

diff --git a/src/main.tsx b/src/main.tsx
@@ -12,11 +12,11 @@ import "react-toastify/dist/ReactToastify.css";
 
 ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
   <React.StrictMode>
-    <Provider store={store}>
-    <ToastContainer></ToastContainer>
-   <BrowserRouter basename=‘/payor’>
+  <Provider store={store}>
+  <ToastContainer></ToastContainer>
+  <Router basename='/payor'> 
     <App />
-  </BrowserRouter>
-    </Provider>
-  </React.StrictMode>
-);
+  </Router>
+  </Provider>
+</React.StrictMode>
+);
diff --git a/src/pages/Authentication/SignIn.tsx b/src/pages/Authentication/SignIn.tsx
@@ -20,7 +20,6 @@ const SignIn: React.FC = () => {
 
   const [userName, setUserName] = useState('');
   const [password, setPassword] = useState('');
-  const [showLoader, setShowLoader] = useState(false);
   const [userError, setUserError] = useState(false);
   const [passError, setPassError] = useState(false);
   let sessionToken = sessionStorage.getItem("hcx_user_token");
@@ -44,7 +43,7 @@ const SignIn: React.FC = () => {
         console.log("participant token", res);
         getParticipantByCode(userName).then((res: any) => {
             dispatch(addParticipantDetails(res["data"]["participants"][0]));
-            navigate("/payor/coverageeligibility/list");
+            navigate("/coverageeligibility/list");
         }).catch((error) => {
           toast.error("Something went wrong. Please contact the administrator" || "Internal Server Error", {
             position: toast.POSITION.TOP_RIGHT