From 2fdffa22adf8e9898b579faf2cf6c2d877a7b3d8 Mon Sep 17 00:00:00 2001
From: Mohammed Nihal <57055998+nihal467@users.noreply.github.com>
Date: Fri, 22 Nov 2024 17:27:30 +0530
Subject: [PATCH 01/37] Fixed the cypress env config file and removed hardcoded
 fallback (#9184)

---
 cypress.config.ts                                            | 5 ++++-
 .../{PatientFileUpload.ts => PatientFileUpload.cy.ts}        | 0
 cypress/pageobject/Patient/PatientFileupload.ts              | 4 +++-
 package-lock.json                                            | 2 +-
 src/components/Files/AudioCaptureDialog.tsx                  | 2 +-
 5 files changed, 9 insertions(+), 4 deletions(-)
 rename cypress/e2e/patient_spec/{PatientFileUpload.ts => PatientFileUpload.cy.ts} (100%)

diff --git a/cypress.config.ts b/cypress.config.ts
index b6e8fadd462..4da5d989a88 100644
--- a/cypress.config.ts
+++ b/cypress.config.ts
@@ -1,7 +1,10 @@
 import { defineConfig } from "cypress";
 import cypressSplit from "cypress-split";
+import * as dotenv from "dotenv";
 import fs from "fs";
 
+dotenv.config();
+
 export default defineConfig({
   projectId: "wf7d2m",
   defaultCommandTimeout: 10000,
@@ -32,7 +35,7 @@ export default defineConfig({
     requestTimeout: 15000,
   },
   env: {
-    API_URL: process.env.REACT_CARE_API_URL ?? "http://localhost:9000",
+    API_URL: process.env.REACT_CARE_API_URL,
     ENABLE_HCX: process.env.REACT_ENABLE_HCX ?? false,
   },
 });
diff --git a/cypress/e2e/patient_spec/PatientFileUpload.ts b/cypress/e2e/patient_spec/PatientFileUpload.cy.ts
similarity index 100%
rename from cypress/e2e/patient_spec/PatientFileUpload.ts
rename to cypress/e2e/patient_spec/PatientFileUpload.cy.ts
diff --git a/cypress/pageobject/Patient/PatientFileupload.ts b/cypress/pageobject/Patient/PatientFileupload.ts
index 6cde7d78568..c70170a744d 100644
--- a/cypress/pageobject/Patient/PatientFileupload.ts
+++ b/cypress/pageobject/Patient/PatientFileupload.ts
@@ -20,7 +20,9 @@ export class PatientFileUpload {
 
   recordAudio() {
     cy.get("#record-audio").click();
-    cy.wait(5000);
+    cy.wait(2000);
+    cy.get("#start-recording").click();
+    cy.wait(2000);
     cy.get("#stop-recording").click();
     cy.wait(1000);
     cy.get("#save-recording").click();
diff --git a/package-lock.json b/package-lock.json
index 5c703af8fe1..63af1164ef0 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -20862,4 +20862,4 @@
       }
     }
   }
-}
+}
\ No newline at end of file
diff --git a/src/components/Files/AudioCaptureDialog.tsx b/src/components/Files/AudioCaptureDialog.tsx
index 4d60f64a135..5512fad9dc6 100644
--- a/src/components/Files/AudioCaptureDialog.tsx
+++ b/src/components/Files/AudioCaptureDialog.tsx
@@ -133,7 +133,7 @@ export default function AudioCaptureDialog(props: AudioCaptureDialogProps) {
         <div>
           <h2 className="font-bold text-white">{t("audio__record")}</h2>
           <div className="text-secondary-200">{t("audio__record_helper")}</div>
-          <div className="mt-4">
+          <div className="mt-4" id="start-recording">
             <button
               onClick={handleStartRecording}
               className="inline-flex aspect-square w-32 items-center justify-center rounded-full bg-white/10 text-6xl text-white hover:bg-white/20"

From fdfc53dd295a46494ea363bc9ea6c7fe7445a89f Mon Sep 17 00:00:00 2001
From: Aditya Jindal <adityajindal2305@gmail.com>
Date: Mon, 25 Nov 2024 14:01:08 +0530
Subject: [PATCH 02/37] Fix: Spo2 twice rendering and wrong thresholds  (#9182)

---
 src/components/Patient/DailyRounds.tsx | 60 ++++++++------------------
 1 file changed, 17 insertions(+), 43 deletions(-)

diff --git a/src/components/Patient/DailyRounds.tsx b/src/components/Patient/DailyRounds.tsx
index 4e8573d6273..f0c78522e40 100644
--- a/src/components/Patient/DailyRounds.tsx
+++ b/src/components/Patient/DailyRounds.tsx
@@ -59,7 +59,6 @@ import request from "@/Utils/request/request";
 import { formatDateTime } from "@/Utils/utils";
 import { scrollTo } from "@/Utils/utils";
 
-import RangeAutocompleteFormField from "../Form/FormFields/RangeAutocompleteFormField";
 import TextFormField from "../Form/FormFields/TextFormField";
 
 export const DailyRounds = (props: any) => {
@@ -704,27 +703,32 @@ export const DailyRounds = (props: any) => {
                 ]}
               />
 
-              <RangeAutocompleteFormField
+              <TextFormField
                 {...field("ventilator_spo2")}
-                unit="%"
-                start={0}
-                end={100}
-                step={1}
+                labelSuffix="%"
+                type="number"
+                min={0}
+                max={100}
                 thresholds={[
                   {
                     value: 0,
                     className: "text-danger-500",
-                    label: "Low",
+                    label: t("SPO2_LEVEL_SEVERE_HYPOXEMIA"),
                   },
                   {
-                    value: 90,
-                    className: "text-primary-500",
-                    label: "Normal",
+                    value: 86,
+                    className: "text-danger-500",
+                    label: t("SPO2_LEVEL_MODERATE_HYPOXEMIA"),
                   },
                   {
-                    value: 100,
-                    className: "text-danger-500",
-                    label: "High",
+                    value: 91,
+                    className: "text-warning-400",
+                    label: t("SPO2_LEVEL_MILD_HYPOXEMIA"),
+                  },
+                  {
+                    value: 95,
+                    className: "text-primary-500",
+                    label: t("SPO2_LEVEL_NORMAL"),
                   },
                 ]}
               />
@@ -790,36 +794,6 @@ export const DailyRounds = (props: any) => {
                 ]}
               />
 
-              <TextFormField
-                {...field("ventilator_spo2")}
-                labelSuffix="%"
-                type="number"
-                min={0}
-                max={100}
-                thresholds={[
-                  {
-                    value: 0,
-                    className: "text-danger-500",
-                    label: t("SPO2_LEVEL_SEVERE_HYPOXEMIA"),
-                  },
-                  {
-                    value: 86,
-                    className: "text-danger-500",
-                    label: t("SPO2_LEVEL_MODERATE_HYPOXEMIA"),
-                  },
-                  {
-                    value: 91,
-                    className: "text-warning-400",
-                    label: t("SPO2_LEVEL_MILD_HYPOXEMIA"),
-                  },
-                  {
-                    value: 95,
-                    className: "text-primary-500",
-                    label: t("SPO2_LEVEL_NORMAL"),
-                  },
-                ]}
-              />
-
               <SelectFormField
                 {...field("rhythm")}
                 placeholder={t("HEARTBEAT_RHYTHM__UNKNOWN")}

From 10b562e9decaefcfccdcd3341472f8208069385b Mon Sep 17 00:00:00 2001
From: Rithvik Nishad <mail@rithviknishad.dev>
Date: Tue, 26 Nov 2024 11:06:39 +0530
Subject: [PATCH 03/37] Remove special character validations for names
 (patients and users) (#9177)

---
 public/locale/en.json                      |  1 +
 src/common/validation.tsx                  |  3 +--
 src/components/Patient/PatientRegister.tsx | 12 ++++++++----
 src/components/Users/UserAdd.tsx           |  2 +-
 4 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/public/locale/en.json b/public/locale/en.json
index 5faa645b133..8a4a36a1a5c 100644
--- a/public/locale/en.json
+++ b/public/locale/en.json
@@ -869,6 +869,7 @@
   "middleware_hostname": "Middleware Hostname",
   "middleware_hostname_example": "e.g. example.ohc.network",
   "middleware_hostname_sourced_from": "Middleware hostname sourced from {{ source }}",
+  "min_char_length_error": "Must be at least {{ min_length }} characters",
   "min_password_len_8": "Minimum password length 8",
   "min_time_bw_doses": "Min. time b/w doses",
   "minimize": "Minimize",
diff --git a/src/common/validation.tsx b/src/common/validation.tsx
index c7c084354a8..99b4342fbf6 100644
--- a/src/common/validation.tsx
+++ b/src/common/validation.tsx
@@ -38,8 +38,7 @@ export const getRandomNumbers = (min: number, max: number) => {
 };
 
 export const validateName = (name: string) => {
-  const pattern = /^([a-zA-Z]*( [a-zA-Z])?)+$/;
-  return pattern.test(name);
+  return name.length >= 3;
 };
 
 export const validateUsername = (username: string) => {
diff --git a/src/components/Patient/PatientRegister.tsx b/src/components/Patient/PatientRegister.tsx
index 2a15416e337..35d93214385 100644
--- a/src/components/Patient/PatientRegister.tsx
+++ b/src/components/Patient/PatientRegister.tsx
@@ -421,12 +421,16 @@ export const PatientRegister = (props: PatientRegisterProps) => {
     Object.keys(form).forEach((field) => {
       let phoneNumber, emergency_phone_number;
       switch (field) {
-        case "address":
-        case "name":
-          if (!validateName(form[field])) {
-            errors[field] = "Please enter valid name";
+        case "name": {
+          const requiredError = RequiredFieldValidator()(form[field]);
+          if (requiredError) {
+            errors[field] = requiredError;
+          } else if (!validateName(form[field])) {
+            errors[field] = t("min_char_length_error", { min_length: 3 });
           }
           return;
+        }
+        case "address":
         case "gender":
           errors[field] = RequiredFieldValidator()(form[field]);
           return;
diff --git a/src/components/Users/UserAdd.tsx b/src/components/Users/UserAdd.tsx
index 4c6c5edde2a..bfd38d2cae2 100644
--- a/src/components/Users/UserAdd.tsx
+++ b/src/components/Users/UserAdd.tsx
@@ -415,7 +415,7 @@ export const UserAdd = (props: UserProps) => {
               .join(" ")} is required`;
             invalidForm = true;
           } else if (!validateName(state.form[field])) {
-            errors[field] = "Please enter a valid name";
+            errors[field] = t("min_char_length_error", { min_length: 3 });
             invalidForm = true;
           }
           return;

From b2a14481c58315b47360bf9df1b8bd60c163fdab Mon Sep 17 00:00:00 2001
From: Mohammed Nihal <57055998+nihal467@users.noreply.github.com>
Date: Tue, 26 Nov 2024 14:48:05 +0530
Subject: [PATCH 04/37] Modified the Address Variable to use real data in
 cypress test (#9218)

---
 cypress/e2e/patient_spec/PatientRegistration.cy.ts | 6 ++++--
 cypress/pageobject/Patient/PatientPredefined.ts    | 4 +++-
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/cypress/e2e/patient_spec/PatientRegistration.cy.ts b/cypress/e2e/patient_spec/PatientRegistration.cy.ts
index c3647ceac3a..2058760f6d2 100644
--- a/cypress/e2e/patient_spec/PatientRegistration.cy.ts
+++ b/cypress/e2e/patient_spec/PatientRegistration.cy.ts
@@ -40,10 +40,12 @@ describe("Patient Creation with consultation", () => {
   const patientDateOfBirth = "01012001";
   const patientMenstruationStartDate = getRelativeDateString(-10);
   const patientDateOfDelivery = getRelativeDateString(-20);
-  const patientOneName = "Patient With No Consultation";
+  const patientOneName = "Great Napolean 14";
   const patientOneGender = "Male";
   const patientOneUpdatedGender = "Female";
-  const patientOneAddress = "Test Patient Address";
+  const patientOneAddress = `149/J, 3rd Block,
+  Aluva
+  Ernakulam, Kerala - 682001`;
   const patientOnePincode = "682001";
   const patientOneState = "Kerala";
   const patientOneDistrict = "Ernakulam";
diff --git a/cypress/pageobject/Patient/PatientPredefined.ts b/cypress/pageobject/Patient/PatientPredefined.ts
index a3eb41cb86c..445fbaf9b31 100644
--- a/cypress/pageobject/Patient/PatientPredefined.ts
+++ b/cypress/pageobject/Patient/PatientPredefined.ts
@@ -19,7 +19,9 @@ class PatientPredefined {
     patientPage.typePatientDateOfBirth("01012001");
     patientPage.typePatientName("Patient With Predefined Data");
     patientPage.selectPatientGender("Male");
-    patientPage.typePatientAddress("Test Patient Address");
+    patientPage.typePatientAddress(
+      "149/J, 3rd Block, Aluva, Ernakulam - 682001",
+    );
     facilityPage.fillPincode("682001");
     facilityPage.selectStateOnPincode("Kerala");
     facilityPage.selectDistrictOnPincode("Ernakulam");

From 9fb8ec1e2ba0e3e29ae558a520b62c9a9183cdb2 Mon Sep 17 00:00:00 2001
From: keerthi lochan kumar
 <121881902+Keerthilochankumar@users.noreply.github.com>
Date: Tue, 26 Nov 2024 19:54:59 +0530
Subject: [PATCH 05/37] UI enhancement to Sample Test History (#9193)

---
 src/components/Patient/SampleDetails.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/components/Patient/SampleDetails.tsx b/src/components/Patient/SampleDetails.tsx
index c5282a65c1f..edc0b4d53a6 100644
--- a/src/components/Patient/SampleDetails.tsx
+++ b/src/components/Patient/SampleDetails.tsx
@@ -477,7 +477,11 @@ export const SampleDetails = ({ id }: DetailRoute) => {
       <div className="mb-4">
         <h4 className="mt-8">{t("sample_test_history")}</h4>
         {sampleDetails?.flow &&
-          sampleDetails.flow.map((flow: FlowModel) => renderFlow(flow))}
+          sampleDetails.flow.map((flow: FlowModel) => (
+            <div key={flow.id} className="mb-2">
+              {renderFlow(flow)}
+            </div>
+          ))}
       </div>
 
       <FileUpload

From c18d5ea5d257cb417e3c6c30c3a53c8a7d9f1b5c Mon Sep 17 00:00:00 2001
From: Nithish Kumar Siliveru <nithishsiliveru18@gmail.com>
Date: Tue, 26 Nov 2024 19:57:31 +0530
Subject: [PATCH 06/37] Adjusted the view change button position (#9172)

---
 src/components/Common/SortDropdown.tsx   | 2 +-
 src/components/Resource/ResourceList.tsx | 8 ++++----
 src/components/Shifting/ShiftingList.tsx | 6 +++---
 3 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/components/Common/SortDropdown.tsx b/src/components/Common/SortDropdown.tsx
index cf4193deaea..2e5ccd95015 100644
--- a/src/components/Common/SortDropdown.tsx
+++ b/src/components/Common/SortDropdown.tsx
@@ -27,7 +27,7 @@ export default function SortDropdownMenu(props: Props) {
       variant="secondary"
       className="w-full border border-primary-500 bg-white md:w-auto"
       icon={<CareIcon icon="l-sort" />}
-      containerClassName="w-full md:w-auto"
+      containerClassName="w-full md:w-auto z-20"
     >
       {props.options.map(({ isAscending, value }, i) => (
         <DropdownItem
diff --git a/src/components/Resource/ResourceList.tsx b/src/components/Resource/ResourceList.tsx
index 6eecf7fcef2..891c2f3378b 100644
--- a/src/components/Resource/ResourceList.tsx
+++ b/src/components/Resource/ResourceList.tsx
@@ -189,7 +189,7 @@ export default function ListView() {
 
   return (
     <Page
-      title="Resource"
+      title={t("resource")}
       hideBack
       componentRight={
         <ExportButton
@@ -216,13 +216,13 @@ export default function ListView() {
           </div>
 
           <div className="mt-2 flex w-full flex-col gap-2 lg:w-fit lg:flex-row lg:gap-4">
-            <AdvancedFilterButton
-              onClick={() => advancedFilter.setShow(true)}
-            />
             <ButtonV2 className="py-[11px]" onClick={onBoardViewBtnClick}>
               <CareIcon icon="l-list-ul" className="rotate-90" />
               {t("board_view")}
             </ButtonV2>
+            <AdvancedFilterButton
+              onClick={() => advancedFilter.setShow(true)}
+            />
           </div>
         </>
       }
diff --git a/src/components/Shifting/ShiftingList.tsx b/src/components/Shifting/ShiftingList.tsx
index d4746ad434b..db7ec691f79 100644
--- a/src/components/Shifting/ShiftingList.tsx
+++ b/src/components/Shifting/ShiftingList.tsx
@@ -274,9 +274,6 @@ export default function ListView() {
           </div>
 
           <div className="mt-2 flex w-full flex-col gap-2 lg:w-fit lg:flex-row lg:gap-4">
-            <AdvancedFilterButton
-              onClick={() => advancedFilter.setShow(true)}
-            />
             <ButtonV2
               className="py-[11px]"
               onClick={() => navigate("/shifting/board", { query: qParams })}
@@ -284,6 +281,9 @@ export default function ListView() {
               <CareIcon icon="l-list-ul" className="rotate-90" />
               {t("board_view")}
             </ButtonV2>
+            <AdvancedFilterButton
+              onClick={() => advancedFilter.setShow(true)}
+            />
           </div>
         </>
       }

From b7c467fcc4a7690b9702ee4b3d3672b4050d5265 Mon Sep 17 00:00:00 2001
From: Shivank Kacker <kacker.shivank@gmail.com>
Date: Wed, 27 Nov 2024 14:09:08 +0530
Subject: [PATCH 07/37] Patient Home Page redesign (#9203)

Co-authored-by: mahendar <mahendarchikkolla@gmail.com>
Co-authored-by: vinu tv <vinutv91@gmail.com>
---
 .../patient_spec/PatientRegistration.cy.ts    |    5 +-
 .../pageobject/Patient/PatientConsultation.ts |    3 +-
 cypress/pageobject/Patient/PatientCreation.ts |    4 +-
 .../Patient/PatientMedicalHistory.ts          |    4 +-
 cypress/pageobject/Sample/SampleTestCreate.ts |    2 +
 public/locale/en.json                         |   91 +
 public/locale/hi.json                         |    1 +
 public/locale/kn.json                         |    1 +
 public/locale/ml.json                         |    1 +
 public/locale/mr.json                         |   34 +-
 src/CAREUI/display/Chip.tsx                   |    2 +-
 src/Routers/AppRouter.tsx                     |    6 +-
 src/Routers/routes/PatientRoutes.tsx          |   12 +-
 src/common/constants.tsx                      |    2 +
 src/components/Common/Breadcrumbs.tsx         |   20 +-
 src/components/Common/Menu.tsx                |    2 +-
 src/components/Common/Page.tsx                |    4 +-
 src/components/Facility/ConsultationCard.tsx  |  231 +--
 .../Facility/ConsultationDetails/index.tsx    |  179 +-
 src/components/Patient/InsuranceDetails.tsx   |    4 +-
 .../Patient/InsuranceDetailsCard.tsx          |   96 +-
 .../Patient/PatientDetailsTab/Demography.tsx  |  454 +++++
 .../PatientDetailsTab/EncounterHistory.tsx    |   90 +
 .../HealthProfileSummary.tsx                  |  135 ++
 .../PatientDetailsTab/ImmunisationRecords.tsx |  124 ++
 .../Patient/PatientDetailsTab/Notes.tsx       |  184 ++
 .../PatientDetailsTab/SampleTestHistory.tsx   |  107 ++
 .../PatientDetailsTab/ShiftingHistory.tsx     |   73 +
 .../Patient/PatientDetailsTab/index.tsx       |   45 +
 src/components/Patient/PatientHome.tsx        | 1663 +++++------------
 src/components/Patient/PatientInfoCard.tsx    |    2 +-
 src/components/Patient/PatientRegister.tsx    |   35 +-
 src/components/Patient/SampleTestCard.tsx     |    4 +-
 src/components/Patient/models.tsx             |    2 +-
 src/components/Shifting/ShiftingBlock.tsx     |   43 +-
 src/components/Shifting/ShiftingList.tsx      |  228 +--
 src/components/Shifting/ShiftingTable.tsx     |  261 +++
 src/components/Users/ManageUsers.tsx          |    2 +-
 38 files changed, 2390 insertions(+), 1766 deletions(-)
 create mode 100644 src/components/Patient/PatientDetailsTab/Demography.tsx
 create mode 100644 src/components/Patient/PatientDetailsTab/EncounterHistory.tsx
 create mode 100644 src/components/Patient/PatientDetailsTab/HealthProfileSummary.tsx
 create mode 100644 src/components/Patient/PatientDetailsTab/ImmunisationRecords.tsx
 create mode 100644 src/components/Patient/PatientDetailsTab/Notes.tsx
 create mode 100644 src/components/Patient/PatientDetailsTab/SampleTestHistory.tsx
 create mode 100644 src/components/Patient/PatientDetailsTab/ShiftingHistory.tsx
 create mode 100644 src/components/Patient/PatientDetailsTab/index.tsx
 create mode 100644 src/components/Shifting/ShiftingTable.tsx

diff --git a/cypress/e2e/patient_spec/PatientRegistration.cy.ts b/cypress/e2e/patient_spec/PatientRegistration.cy.ts
index 2058760f6d2..2da35c840e0 100644
--- a/cypress/e2e/patient_spec/PatientRegistration.cy.ts
+++ b/cypress/e2e/patient_spec/PatientRegistration.cy.ts
@@ -132,6 +132,7 @@ describe("Patient Creation with consultation", () => {
       "Middle Class",
       "Family member",
     );
+
     patientMedicalHistory.verifyPatientMedicalDetails(
       patientOnePresentHealth,
       patientOneOngoingMedication,
@@ -216,11 +217,9 @@ describe("Patient Creation with consultation", () => {
     patientMedicalHistory.verifyNoSymptosPresent("Diabetes");
     // verify insurance details and dedicatd page
     cy.get("[data-testid=patient-details]")
-      .contains("member id")
+      .contains("Member ID")
       .scrollIntoView();
     cy.wait(2000);
-    patientInsurance.clickPatientInsuranceViewDetail();
-    cy.wait(3000);
     patientInsurance.verifyPatientPolicyDetails(
       patientOneFirstSubscriberId,
       patientOneFirstPolicyId,
diff --git a/cypress/pageobject/Patient/PatientConsultation.ts b/cypress/pageobject/Patient/PatientConsultation.ts
index c8046a39a9e..edd8ae135a4 100644
--- a/cypress/pageobject/Patient/PatientConsultation.ts
+++ b/cypress/pageobject/Patient/PatientConsultation.ts
@@ -122,9 +122,10 @@ export class PatientConsultationPage {
   }
 
   clickViewConsultationButton() {
+    cy.get("a").contains("Encounters").click();
     cy.verifyAndClickElement(
       "#view_consultation_and_log_updates",
-      "View Consultation / Log Updates",
+      "View Updates",
     );
   }
 
diff --git a/cypress/pageobject/Patient/PatientCreation.ts b/cypress/pageobject/Patient/PatientCreation.ts
index a38b8ab6a5c..1f915f5474e 100644
--- a/cypress/pageobject/Patient/PatientCreation.ts
+++ b/cypress/pageobject/Patient/PatientCreation.ts
@@ -181,7 +181,7 @@ export class PatientPage {
       expect($dashboard).to.contain(patientName);
       expect($dashboard).to.contain(phoneNumber);
       expect($dashboard).to.contain(emergencyPhoneNumber);
-      expect($dashboard).to.contain(yearOfBirth);
+      //expect($dashboard).to.contain(yearOfBirth); //Commented out because new proposed UI does not have DOB. Can change later.
       expect($dashboard).to.contain(bloodGroup);
       expect($dashboard).to.contain(occupation);
       socioeconomicStatus && expect($dashboard).to.contain(socioeconomicStatus);
@@ -221,7 +221,7 @@ export class PatientPage {
   }
 
   clickPatientUpdateDetails() {
-    cy.verifyAndClickElement("#update-patient-details", "Update Details");
+    cy.verifyAndClickElement("#update-patient-details", "Edit Profile");
   }
 
   interceptFacilities() {
diff --git a/cypress/pageobject/Patient/PatientMedicalHistory.ts b/cypress/pageobject/Patient/PatientMedicalHistory.ts
index 93fdd1b38b3..bf2296b4471 100644
--- a/cypress/pageobject/Patient/PatientMedicalHistory.ts
+++ b/cypress/pageobject/Patient/PatientMedicalHistory.ts
@@ -33,7 +33,9 @@ class PatientMedicalHistory {
     patientSymptoms6: string,
     patientSymptoms7: string,
   ) {
-    cy.get("[data-testid=patient-details]").then(($dashboard) => {
+    cy.get("a").contains("Health Profile").click();
+    cy.wait(2000);
+    cy.get("[data-test-id=patient-health-profile]").then(($dashboard) => {
       cy.url().should("include", "/facility/");
       expect($dashboard).to.contain(patientPresentHealth);
       expect($dashboard).to.contain(patientOngoingMedication);
diff --git a/cypress/pageobject/Sample/SampleTestCreate.ts b/cypress/pageobject/Sample/SampleTestCreate.ts
index cd2e93e5072..445d08732c3 100644
--- a/cypress/pageobject/Sample/SampleTestCreate.ts
+++ b/cypress/pageobject/Sample/SampleTestCreate.ts
@@ -1,5 +1,6 @@
 export class SampleTestPage {
   visitSampleRequestPage(): void {
+    cy.get("a").contains("Service Request").click();
     cy.verifyAndClickElement("#sample-request-btn", "Request Sample Test");
     cy.url().should("include", "/sample-test");
   }
@@ -60,6 +61,7 @@ export class SampleTestPage {
     fastTrack: string,
     sampleTestResult: string,
   ): void {
+    cy.get("a").contains("Service Request").click();
     cy.verifyContentPresence("#sample-test-status", [sampleTestStatus]);
     cy.verifyContentPresence("#sample-test-type", [sampleTestType]);
     cy.verifyContentPresence("#sample-test-fast-track", [fastTrack]);
diff --git a/public/locale/en.json b/public/locale/en.json
index 8a4a36a1a5c..56f84a1883a 100644
--- a/public/locale/en.json
+++ b/public/locale/en.json
@@ -274,6 +274,7 @@
   "accept_all": "Accept All",
   "access_level": "Access Level",
   "action_irreversible": "This action is irreversible",
+  "actions": "Actions",
   "active": "Active",
   "active_prescriptions": "Active Prescriptions",
   "add": "Add",
@@ -281,7 +282,10 @@
   "add_attachments": "Add Attachments",
   "add_beds": "Add Bed(s)",
   "add_beds_to_configure_presets": "Add beds to this location to configure presets for them.",
+  "add_consultation": "Add consultation",
+  "add_consultation_update": "Add Consultation Update",
   "add_details_of_patient": "Add Details of Patient",
+  "add_insurance_details": "Add Insurance Details",
   "add_location": "Add Location",
   "add_new_beds": "Add New Bed(s)",
   "add_new_user": "Add New User",
@@ -301,11 +305,14 @@
   "administered_on": "Administered on",
   "administration_dosage_range_error": "Dosage should be between start and target dosage",
   "administration_notes": "Administration Notes",
+  "admitted": "Admitted",
+  "admitted_on": "Admitted On",
   "advanced_filters": "Advanced Filters",
   "age": "Age",
   "all_changes_have_been_saved": "All changes have been saved",
   "all_details": "All Details",
   "allergies": "Allergies",
+  "allow_transfer": "Allow Transfer",
   "allowed_formats_are": "Allowed formats are",
   "already_a_member": "Already a member?",
   "ambulance_driver_name": "Name of ambulance driver",
@@ -316,6 +323,7 @@
   "any_id_description": "Currently we support: Aadhaar Number / Mobile Number",
   "any_other_comments": "Any other comments",
   "apply": "Apply",
+  "approve": "Approve",
   "approved_by_district_covid_control_room": "Approved by District COVID Control Room",
   "approving_facility": "Name of Approving Facility",
   "archive": "Archive",
@@ -332,8 +340,14 @@
   "asset_qr_id": "Asset QR ID",
   "asset_type": "Asset Type",
   "assets": "Assets",
+  "assign": "Assign",
+  "assign_a_volunteer_to": "Assign a volunteer to {{name}}",
+  "assign_bed": "Assign Bed",
+  "assign_to_volunteer": "Assign to a Volunteer",
+  "assigned_doctor": "Assigned Doctor",
   "assigned_facility": "Facility assigned",
   "assigned_to": "Assigned to",
+  "assigned_volunteer": "Assigned Volunteer",
   "async_operation_warning": "This operation may take some time. Please check back later.",
   "atypical_presentation_details": "Atypical presentation details",
   "audio__allow_permission": "Please allow microphone permission in site settings",
@@ -365,6 +379,7 @@
   "bed_capacity": "Bed Capacity",
   "bed_created_notification_one": "{{count}} Bed created successfully",
   "bed_created_notification_other": "{{count}} Beds created successfully",
+  "bed_history": "Bed History",
   "bed_not_linked_to_camera": "This bed has not been linked to this camera.",
   "bed_search_placeholder": "Search by beds name",
   "bed_type": "Bed Type",
@@ -397,6 +412,7 @@
   "central_nursing_station": "Central Nursing Station",
   "change_file": "Change File",
   "change_password": "Change Password",
+  "chat_on_whatsapp": "Chat on Whatsapp",
   "check_eligibility": "Check Eligibility",
   "check_for_available_update": "Check for available update",
   "check_for_update": "Check for Update",
@@ -493,6 +509,7 @@
   "consent_request_rejected": "Patient has rejected the consent request",
   "consent_request_waiting_approval": "Waiting for the Patient to approve the consent request",
   "consent_requested_successfully": "Consent requested successfully!",
+  "consultation_history": "Consultation History",
   "consultation_missing_warning": "You have not created a consultation for the patient in",
   "consultation_not_filed": "You have not filed a consultation for this patient yet.",
   "consultation_not_filed_description": "Please file a consultation for this patient to continue.",
@@ -516,6 +533,7 @@
   "countries_travelled": "Countries travelled",
   "covid_19_cat_gov": "Covid_19 Clinical Category as per Govt. of Kerala guideline (A/B/C)",
   "covid_19_death_reporting_form_1": "Covid-19 Death Reporting : Form 1",
+  "covid_details": "Covid Details",
   "create": "Create",
   "create_abha_address": "Create ABHA Address",
   "create_add_more": "Create & Add More",
@@ -533,6 +551,7 @@
   "created_date": "Created Date",
   "created_on": "Created On",
   "csv_file_in_the_specified_format": "Select a CSV file in the specified format",
+  "current_address": "Current Address",
   "current_password": "Current Password",
   "customer_support_email": "Customer Support Email",
   "customer_support_name": "Customer Support Name",
@@ -546,13 +565,16 @@
   "date_of_birth": "Date of birth",
   "date_of_positive_covid_19_swab": "Date of Positive Covid 19 Swab",
   "date_of_result": "Covid confirmation date",
+  "date_of_return": "Date of Return",
   "date_of_test": "Date of sample collection for Covid testing",
   "days": "Days",
+  "death_report": "Death Report",
   "delete": "Delete",
   "delete_facility": "Delete Facility",
   "delete_item": "Delete {{name}}",
   "delete_record": "Delete Record",
   "deleted_successfully": "{{name}} deleted successfully",
+  "demography": "Demography",
   "denied_on": "Denied On",
   "describe_why_the_asset_is_not_working": "Describe why the asset is not working",
   "description": "Description",
@@ -573,6 +595,7 @@
   "diastolic": "Diastolic",
   "differential": "Differential",
   "differential_diagnosis": "Differential diagnosis",
+  "disable_transfer": "Disable Transfer",
   "discard": "Discard",
   "discharge": "Discharge",
   "discharge_from_care": "Discharge from CARE",
@@ -580,6 +603,7 @@
   "discharge_summary": "Discharge Summary",
   "discharge_summary_not_ready": "Discharge summary is not ready yet.",
   "discharged": "Discharged",
+  "discharged_on": "Discharged On",
   "discharged_patients": "Discharged Patients",
   "discharged_patients_empty": "No discharged patients present in this facility",
   "disclaimer": "Disclaimer",
@@ -614,6 +638,7 @@
   "edit_policy": "Edit Insurance Policy",
   "edit_policy_description": "Add or edit patient's insurance details",
   "edit_prescriptions": "Edit Prescriptions",
+  "edit_profile": "Edit Profile",
   "edit_user_profile": "Edit Profile",
   "edited_by": "Edited by",
   "edited_on": "Edited on",
@@ -627,7 +652,11 @@
   "email_discharge_summary_description": "Enter your valid email address to receive the discharge summary",
   "email_success": "We will be sending an email shortly. Please check your inbox.",
   "emergency": "Emergency",
+  "emergency_contact": "Emergency Contact",
   "emergency_contact_number": "Emergency Contact Number",
+  "emergency_contact_person_name": "Emergency Contact Person Name",
+  "emergency_contact_person_name_volunteer": "Emergency Contact Person Name (Volunteer)",
+  "emergency_contact_volunteer": "Emergency Contact (Volunteer)",
   "empty_date_time": "--:-- --; --/--/----",
   "encounter_date_field_label__A": "Date & Time of Admission to the Facility",
   "encounter_date_field_label__DC": "Date & Time of Domiciliary Care commencement",
@@ -643,6 +672,7 @@
   "encounter_suggestion__OP": "Out-patient visit",
   "encounter_suggestion__R": "Consultation",
   "encounter_suggestion_edit_disallowed": "Not allowed to switch to this option in edit consultation",
+  "encounters": "Encounters",
   "end_datetime": "End Date/Time",
   "enter_aadhaar_number": "Enter a 12-digit Aadhaar ID",
   "enter_aadhaar_otp": "Enter OTP sent to the registered mobile with Aadhaar",
@@ -664,6 +694,7 @@
   "events": "Events",
   "expand_sidebar": "Expand Sidebar",
   "expected_burn_rate": "Expected Burn Rate",
+  "expired": "Expired",
   "expired_on": "Expired On",
   "expires_on": "Expires On",
   "facilities": "Facilities",
@@ -721,6 +752,7 @@
   "granted_on": "Granted On",
   "has_domestic_healthcare_support": "Has domestic healthcare support?",
   "has_sari": "Has SARI (Severe Acute Respiratory illness)?",
+  "health-profile": "Health Profile",
   "health_facility__config_registration_error": "Health ID registration failed",
   "health_facility__config_update_error": "Health Facility config update failed",
   "health_facility__config_update_success": "Health Facility config updated successfully",
@@ -757,12 +789,17 @@
   "i_declare": "I hereby declare that:",
   "icd11_as_recommended": "As per ICD-11 recommended by WHO",
   "icmr_specimen_referral_form": "ICMR Specimen Referral Form",
+  "immunisation-records": "Immunisation",
   "incomplete_patient_details_warning": "Patient details are incomplete. Please update the details before proceeding.",
   "inconsistent_dosage_units_error": "Dosage units must be same",
   "indian_mobile": "Indian Mobile",
   "indicator": "Indicator",
   "inidcator_event": "Indicator Event",
   "instruction_on_titration": "Instruction on titration",
+  "insurance__insurer_id": "Insurer ID",
+  "insurance__insurer_name": "Insurer Name",
+  "insurance__member_id": "Member ID",
+  "insurance__policy_name": "Policy ID / Policy Name",
   "insurer_name_required": "Insurer Name is required",
   "international_mobile": "International Mobile",
   "invalid_asset_id_msg": "Oops! The asset ID you entered does not appear to be valid.",
@@ -771,6 +808,7 @@
   "invalid_link_msg": "It appears that the password reset link you have used is either invalid or expired. Please request a new password reset link.",
   "invalid_password": "Password doesn't meet the requirements",
   "invalid_password_reset_link": "Invalid password reset link",
+  "invalid_patient_data": "Invalid Patient Data",
   "invalid_phone": "Please enter valid phone number",
   "invalid_phone_number": "Invalid Phone Number",
   "invalid_pincode": "Invalid Pincode",
@@ -789,6 +827,8 @@
   "investigations__result": "Result",
   "investigations__unit": "Unit",
   "investigations_suggested": "Investigations Suggested",
+  "investigations_summary": "Investigations Summary",
+  "ip_encounter": "IP Encounter",
   "is": "Is",
   "is_antenatal": "Is Antenatal",
   "is_atypical_presentation": "Is Atypical presentation",
@@ -796,21 +836,26 @@
   "is_emergency": "Is emergency",
   "is_emergency_case": "Is emergency case",
   "is_it_upshift": "is it upshift",
+  "is_pregnant": "Is pregnant",
   "is_this_an_emergency": "Is this an emergency?",
   "is_this_an_upshift": "Is this an upshift?",
   "is_unusual_course": "Is unusual course",
   "is_up_shift": "Is up shift",
   "is_upshift_case": "Is upshift case",
   "is_vaccinated": "Whether vaccinated",
+  "kasp_enabled_date": "{{kasp_string}} enabled date",
   "label": "Label",
   "landline": "Indian landline",
   "language_selection": "Language Selection",
   "last_administered": "Last administered",
+  "last_discharge_reason": "Last Discharge Reason",
   "last_edited": "Last Edited",
   "last_modified": "Last Modified",
   "last_name": "Last Name",
   "last_online": "Last Online",
   "last_serviced_on": "Last Serviced On",
+  "last_updated_by": "Last updated by",
+  "last_vaccinated_on": "Last Vaccinated on",
   "latitude_invalid": "Latitude must be between -90 and 90",
   "left": "Left",
   "length": "Length ({{unit}})",
@@ -859,6 +904,7 @@
   "max_size_for_image_uploaded_should_be": "Max size for image uploaded should be",
   "measured_after": "Measured after",
   "measured_before": "Measured before",
+  "medical": "Medical",
   "medical_council_registration": "Medical Council Registration",
   "medical_worker": "Medical Worker",
   "medicine": "Medicine",
@@ -903,6 +949,8 @@
   "no_beds_available": "No beds available",
   "no_changes": "No changes",
   "no_changes_made": "No changes made",
+  "no_consultation_filed": "No consultation filed",
+  "no_consultation_history": "No consultation history available",
   "no_consultation_updates": "No consultation updates",
   "no_data_found": "No data found",
   "no_duplicate_facility": "You should not create duplicate facilities",
@@ -915,6 +963,7 @@
   "no_linked_facilities": "No Linked Facilities",
   "no_log_update_delta": "No changes since previous log update",
   "no_log_updates": "No log updates found",
+  "no_medical_history_available": "No Medical History Available",
   "no_notices_for_you": "No notices for you.",
   "no_patients_found": "No Patients Found",
   "no_patients_to_show": "No patients to show.",
@@ -924,6 +973,7 @@
   "no_records_found": "No Records Found",
   "no_remarks": "No remarks",
   "no_results_found": "No Results Found",
+  "no_social_profile_details_available": "No Social Profile Details Available",
   "no_staff": "No staff found",
   "no_tests_taken": "No tests taken",
   "no_treating_physicians_available": "This facility does not have any home facility doctors. Please contact your admin.",
@@ -943,6 +993,7 @@
   "number_of_beds": "Number of beds",
   "number_of_beds_out_of_range_error": "Number of beds cannot be greater than 100",
   "number_of_chronic_diseased_dependents": "Number Of Chronic Diseased Dependents",
+  "number_of_covid_vaccine_doses": "Number of Covid vaccine doses",
   "nursing_care": "Nursing Care",
   "nursing_information": "Nursing Information",
   "nutrition": "Nutrition",
@@ -952,6 +1003,8 @@
   "on": "On",
   "ongoing_medications": "Ongoing Medications",
   "only_indian_mobile_numbers_supported": "Currently only Indian numbers are supported",
+  "op_encounter": "OP Encounter",
+  "op_file_closed": "OP file closed",
   "open": "Open",
   "open_camera": "Open Camera",
   "open_live_monitoring": "Open Live Monitoring",
@@ -974,6 +1027,11 @@
   "password_reset_success": "Password Reset successfully",
   "password_sent": "Password Reset Email Sent",
   "patient": "Patient",
+  "patient-notes": "Notes",
+  "patient__general-info": "General Info",
+  "patient__insurance-details": "Insurance Details",
+  "patient__social-profile": "Social Profile",
+  "patient__volunteer-contact": "Volunteer Contact",
   "patient_address": "Patient Address",
   "patient_body": "Patient Body",
   "patient_category": "Patient Category",
@@ -997,6 +1055,8 @@
   "patient_notes_thread__Doctors": "Doctor's Discussions",
   "patient_notes_thread__Nurses": "Nurse's Discussions",
   "patient_phone_number": "Patient Phone Number",
+  "patient_profile": "Patient Profile",
+  "patient_profile_created_by": "Patient profile created by",
   "patient_registration__address": "Address",
   "patient_registration__age": "Age",
   "patient_registration__comorbidities": "Comorbidities",
@@ -1009,12 +1069,15 @@
   "patient_status": "Patient Status",
   "patient_transfer_birth_match_note": "Note: Year of birth must match the patient to process the transfer request.",
   "patients": "Patients",
+  "permanent_address": "Permanent Address",
+  "permission_denied": "You do not have permission to perform this action",
   "personal_information": "Personal Information",
   "phone": "Phone",
   "phone_no": "Phone no.",
   "phone_number": "Phone Number",
   "phone_number_at_current_facility": "Phone Number of Contact person at current Facility",
   "pincode": "Pincode",
+  "please_assign_bed_to_patient": "Please assign a bed to this patient",
   "please_enter_a_reason_for_the_shift": "Please enter a reason for the shift.",
   "please_select_a_facility": "Please select a facility",
   "please_select_breathlessness_level": "Please select Breathlessness Level",
@@ -1036,6 +1099,7 @@
   "policy__subscriber_id__example": "SUB001",
   "policy_id_required": "Policy Id or Policy Name is required",
   "position": "Position",
+  "post_partum": "Post-partum",
   "post_your_comment": "Post Your Comment",
   "powered_by": "Powered By",
   "preferred_facility_type": "Preferred Facility Type",
@@ -1050,6 +1114,7 @@
   "prescriptions__medicine": "Medicine",
   "prescriptions__route": "Route",
   "prescriptions__start_date": "Prescribed On",
+  "present_health": "Present Health",
   "preset_deleted": "Preset deleted",
   "preset_name_placeholder": "Specify an identifiable name for the new preset",
   "preset_updated": "Preset updated",
@@ -1100,9 +1165,11 @@
   "req_atleast_one_lowercase": "Require at least one lower case letter",
   "req_atleast_one_symbol": "Require at least one symbol",
   "req_atleast_one_uppercase": "Require at least one upper case",
+  "request-sample-test": "Service Request",
   "request_consent": "Request Consent",
   "request_description": "Description of Request",
   "request_description_placeholder": "Type your description here",
+  "request_sample_test": "Request Sample Test",
   "request_title": "Request Title",
   "request_title_placeholder": "Type your title here",
   "required": "Required",
@@ -1126,6 +1193,8 @@
   "return_to_login": "Return to Login",
   "return_to_password_reset": "Return to Password Reset",
   "return_to_patient_dashboard": "Return to Patient Dashboard",
+  "review_before": "Review Before",
+  "review_missed": "Review Missed",
   "revoked_on": "Revoked On",
   "right": "Right",
   "route": "Route",
@@ -1173,6 +1242,8 @@
   "send_otp_error": "Failed to send OTP. Please try again later.",
   "send_otp_success": "OTP has been sent to the respective mobile number",
   "send_reset_link": "Send Reset Link",
+  "send_sample_to_collection_centre_description": "Are you sure you want to send the sample to Collection Centre?",
+  "send_sample_to_collection_centre_title": "Send sample to collection centre",
   "serial_number": "Serial Number",
   "serviced_on": "Serviced on",
   "session_expired": "Session Expired",
@@ -1181,6 +1252,8 @@
   "set_your_local_language": "Set your local language",
   "settings_and_filters": "Settings and Filters",
   "severity_of_breathlessness": "Severity of Breathlessness",
+  "sex": "Sex",
+  "shift": "Shift Patient",
   "shift_request_updated_successfully": "Shift request updated successfully",
   "shifting": "Shifting",
   "shifting_approval_facility": "Shifting approval facility",
@@ -1188,6 +1261,7 @@
   "shifting_approving_facility_can_not_be_empty": "Shifting approving facility can not be empty.",
   "shifting_deleted": "Shifting record has been deleted successfully.",
   "shifting_details": "Shifting details",
+  "shifting_history": "Shifting History",
   "shifting_status": "Shifting status",
   "show_abha_profile": "Show ABHA Profile",
   "show_all": "Show all",
@@ -1197,6 +1271,7 @@
   "show_unread_notifications": "Show Unread",
   "sign_out": "Sign Out",
   "skills": "Skills",
+  "social_profile": "Social Profile",
   "socioeconomic_status": "Socioeconomic status",
   "software_update": "Software Update",
   "something_went_wrong": "Something went wrong..!",
@@ -1225,9 +1300,11 @@
   "subscription_error": "Subscription Error",
   "subscription_failed": "Subscription Failed",
   "suggested_investigations": "Suggested Investigations",
+  "suggestion": "Suggestion",
   "summary": "Summary",
   "support": "Support",
   "switch": "Switch",
+  "switch_bed": "Switch Bed",
   "switch_camera_is_not_available": "Switch camera is not available.",
   "symptoms": "Symptoms",
   "systolic": "Systolic",
@@ -1244,7 +1321,10 @@
   "total_users": "Total Users",
   "transcript_edit_info": "You can update this if we made an error",
   "transcript_information": "This is what we heard",
+  "transfer_allowed": "Transfer Allowed",
+  "transfer_blocked": "Transfer Blocked",
   "transfer_in_progress": "TRANSFER IN PROGRESS",
+  "transfer_status_updated": "Transfer Status Updated",
   "transfer_to_receiving_facility": "Transfer to receiving facility",
   "travel_within_last_28_days": "Domestic/international Travel (within last 28 days)",
   "treating_doctor": "Treating Doctor",
@@ -1305,6 +1385,8 @@
   "username": "Username",
   "users": "Users",
   "vacant": "Vacant",
+  "vaccinated": "Vaccinated",
+  "vaccine_name": "Vaccine name",
   "vehicle_preference": "Vehicle preference",
   "vendor_name": "Vendor Name",
   "ventilator_interface": "Respiratory Support Type",
@@ -1320,21 +1402,30 @@
   "verify_otp_success": "OTP has been verified successfully.",
   "verify_patient_identifier": "Please verify the patient identifier",
   "verify_using": "Verify Using",
+  "video_call": "Video Call",
   "video_conference_link": "Video Conference Link",
   "view": "View",
   "view_abdm_records": "View ABDM Records",
+  "view_all_details": "View All Details",
   "view_asset": "View Assets",
   "view_cns": "View CNS",
   "view_consultation_and_log_updates": "View Consultation / Log Updates",
   "view_details": "View Details",
   "view_faciliy": "View Facility",
+  "view_files": "View Files",
   "view_patients": "View Patients",
+  "view_update_patient_files": "View/Update patient files",
+  "view_updates": "View Updates",
   "view_users": "View Users",
+  "village": "Village",
   "virtual_nursing_assistant": "Virtual Nursing Assistant",
   "vitals": "Vitals",
   "vitals_monitor": "Vitals Monitor",
   "vitals_present": "Vitals Monitor present",
   "voice_autofill": "Voice Autofill",
+  "volunteer_assigned": "Volunteer assigned successfuly",
+  "volunteer_contact": "Volunteer Contact",
+  "volunteer_unassigned": "Volunteer unassigned successfuly",
   "ward": "Ward",
   "warranty_amc_expiry": "Warranty / AMC Expiry",
   "what_facility_assign_the_patient_to": "What facility would you like to assign the patient to",
diff --git a/public/locale/hi.json b/public/locale/hi.json
index 0eb0cc28cfd..b3c172021dd 100644
--- a/public/locale/hi.json
+++ b/public/locale/hi.json
@@ -567,6 +567,7 @@
   "patient_name": "मरीज का नाम",
   "patient_no": "ओपी/आईपी संख्या",
   "patient_phone_number": "मरीज़ का फ़ोन नंबर",
+  "patient_profile": "रोगी प्रोफ़ाइल",
   "patient_registration__address": "पता",
   "patient_registration__age": "आयु",
   "patient_registration__comorbidities": "comorbidities",
diff --git a/public/locale/kn.json b/public/locale/kn.json
index be18432e0ce..faf50da3a23 100644
--- a/public/locale/kn.json
+++ b/public/locale/kn.json
@@ -568,6 +568,7 @@
   "patient_name": "ರೋಗಿಯ ಹೆಸರು",
   "patient_no": "OP/IP ಸಂ",
   "patient_phone_number": "ರೋಗಿಯ ಫೋನ್ ಸಂಖ್ಯೆ",
+  "patient_profile": "ರೋಗಿ ಪ್ರೊಫೈಲ್",
   "patient_registration__address": "ವಿಳಾಸ",
   "patient_registration__age": "ವಯಸ್ಸು",
   "patient_registration__comorbidities": "ಸಹವರ್ತಿ ರೋಗಗಳು",
diff --git a/public/locale/ml.json b/public/locale/ml.json
index cf381c32c0e..33dadcf9fb7 100644
--- a/public/locale/ml.json
+++ b/public/locale/ml.json
@@ -567,6 +567,7 @@
   "patient_name": "രോഗിയുടെ പേര്",
   "patient_no": "OP/IP നമ്പർ",
   "patient_phone_number": "രോഗിയുടെ ഫോൺ നമ്പർ",
+  "patient_profile": "രോഗിയുടെ പ്രൊഫൈൽ",
   "patient_registration__address": "വിലാസം",
   "patient_registration__age": "പ്രായം",
   "patient_registration__comorbidities": "കോമോർബിഡിറ്റികൾ",
diff --git a/public/locale/mr.json b/public/locale/mr.json
index 06e9c5bbbde..543278bf867 100644
--- a/public/locale/mr.json
+++ b/public/locale/mr.json
@@ -49,6 +49,7 @@
   "new_password": "नवीन पासवर्ड",
   "no_duplicate_facility": "बनावट हॉस्पिटल सुविधा मुळीच तयार करू नका",
   "no_facilities": "कोणतेही हॉस्पिटल नाही",
+  "patient_profile": "रुग्ण प्रोफाइल",
   "password": "पासवर्ड",
   "password_mismatch": "\"पासवर्ड\" आणि \"पासवर्डची खात्री करा\" दोन्ही सारखे हवेत.",
   "password_reset_failure": "पासवर्ड रिसेट झाला नाही",
@@ -62,5 +63,36 @@
   "send_reset_link": "रीसेट लिंक  पाठवा",
   "sign_out": "साइन आउट",
   "something_wrong": "काहीतरी चूक झाली! पुन्हा प्रयत्न करा",
-  "username": "युजरनेम"
+  "username": "युजरनेम",
+  "general_info": "सामान्य माहिती",
+  "phone": "फोन",
+  "date_of_birth": "जन्म तारीख",
+  "sex": "लिंग",
+  "emergency_contact": "आपत्कालीन संपर्क",
+  "emergency_contact_person_name": "आपत्कालीन संपर्क व्यक्तीचे नाव",
+  "covid_details": "कोविड तपशील",
+  "number_of_covid_vaccine_doses": "कोविड लसीचे डोस",
+  "vaccine_name": "लस नाव",
+  "last_vaccinated_on": "शेवटचा लसीकरणाचा दिवस",
+  "countries_travelled": "प्रवास केलेले देश",
+  "date_of_return": "परतण्याची तारीख",
+  "social_profile": "सामाजिक प्रोफाइल",
+  "no_social_profile_details_available": "कोणतीही सामाजिक प्रोफाइल माहिती उपलब्ध नाही",
+  "location": "स्थान",
+  "current_address": "सध्याचा पत्ता",
+  "permanent_address": "स्थायी पत्ता",
+  "nationality": "राष्ट्रीयत्व",
+  "state": "राज्य",
+  "local_body": "स्थानिक संस्था",
+  "ward": "वॉर्ड",
+  "village": "गाव",
+  "volunteer_contact": "स्वयंसेवक संपर्क",
+  "emergency_contact_volunteer": "आपत्कालीन संपर्क (स्वयंसेवक)",
+  "emergency_contact_person_name_volunteer": "आपत्कालीन संपर्क व्यक्तीचे नाव (स्वयंसेवक)",
+  "medical": "वैद्यकीय",
+  "no_medical_history_available": "कोणताही वैद्यकीय इतिहास उपलब्ध नाही",
+  "present_health": "सध्याचे आरोग्य",
+  "ongoing_medications": "चालू औषधे",
+  "allergies": "अॅलर्जी",
+  "is_pregnant": "गर्भवती आहे"
 }
diff --git a/src/CAREUI/display/Chip.tsx b/src/CAREUI/display/Chip.tsx
index a2bacf8bd61..e501bf26f90 100644
--- a/src/CAREUI/display/Chip.tsx
+++ b/src/CAREUI/display/Chip.tsx
@@ -26,7 +26,7 @@ export default function Chip({
     <span
       id={props?.id}
       className={classNames(
-        "inline-flex items-center gap-2 font-medium leading-4",
+        "inline-flex items-center gap-2 font-medium",
 
         {
           small: "rounded px-2 py-1 text-xs",
diff --git a/src/Routers/AppRouter.tsx b/src/Routers/AppRouter.tsx
index 125ee8c9055..8ba9460e34b 100644
--- a/src/Routers/AppRouter.tsx
+++ b/src/Routers/AppRouter.tsx
@@ -111,7 +111,7 @@ export default function AppRouter() {
 
   return (
     <SidebarShrinkContext.Provider value={{ shrinked, setShrinked }}>
-      <div className="absolute inset-0 flex h-screen overflow-hidden bg-secondary-100 print:overflow-visible">
+      <div className="flex h-screen overflow-hidden bg-secondary-100 print:overflow-visible">
         <>
           <div className="block md:hidden">
             <MobileSidebar open={sidebarOpen} setOpen={setSidebarOpen} />{" "}
@@ -121,7 +121,7 @@ export default function AppRouter() {
           </div>
         </>
 
-        <div className="flex w-full flex-1 flex-col overflow-hidden print:overflow-visible">
+        <div className="relative flex w-full flex-1 flex-col overflow-hidden bg-gray-100 print:overflow-visible">
           <div className="relative z-10 flex h-16 shrink-0 bg-white shadow md:hidden">
             <button
               onClick={() => setSidebarOpen(true)}
@@ -156,7 +156,7 @@ export default function AppRouter() {
 
           <main
             id="pages"
-            className="flex-1 overflow-y-scroll bg-gray-100 pb-4 focus:outline-none md:py-0"
+            className="flex-1 overflow-y-auto bg-gray-100 focus:outline-none md:pb-2 md:pr-2"
           >
             <div
               className="max-w-8xl mx-auto mt-4 min-h-[96vh] rounded-lg border bg-gray-50 p-3 shadow"
diff --git a/src/Routers/routes/PatientRoutes.tsx b/src/Routers/routes/PatientRoutes.tsx
index 0a46190cfd1..31d6d99a037 100644
--- a/src/Routers/routes/PatientRoutes.tsx
+++ b/src/Routers/routes/PatientRoutes.tsx
@@ -3,6 +3,7 @@ import InvestigationReports from "@/components/Facility/Investigations/Reports";
 import FileUploadPage from "@/components/Patient/FileUploadPage";
 import { InsuranceDetails } from "@/components/Patient/InsuranceDetails";
 import { PatientManager } from "@/components/Patient/ManagePatients";
+import { patientTabs } from "@/components/Patient/PatientDetailsTab";
 import { PatientHome } from "@/components/Patient/PatientHome";
 import PatientNotes from "@/components/Patient/PatientNotes";
 import { PatientRegister } from "@/components/Patient/PatientRegister";
@@ -11,7 +12,7 @@ import { AppRoutes } from "@/Routers/AppRouter";
 
 const PatientRoutes: AppRoutes = {
   "/patients": () => <PatientManager />,
-  "/patient/:id": ({ id }) => <PatientHome id={id} />,
+  "/patient/:id": ({ id }) => <PatientHome id={id} page="demography" />,
   "/patient/:id/investigation_reports": ({ id }) => (
     <InvestigationReports id={id} />
   ),
@@ -19,8 +20,15 @@ const PatientRoutes: AppRoutes = {
     <PatientRegister facilityId={facilityId} />
   ),
   "/facility/:facilityId/patient/:id": ({ facilityId, id }) => (
-    <PatientHome facilityId={facilityId} id={id} />
+    <PatientHome facilityId={facilityId} id={id} page="demography" />
   ),
+  ...patientTabs.reduce((acc: AppRoutes, tab) => {
+    acc["/facility/:facilityId/patient/:id/" + tab.route] = ({
+      facilityId,
+      id,
+    }) => <PatientHome facilityId={facilityId} id={id} page={tab.route} />;
+    return acc;
+  }, {}),
   "/facility/:facilityId/patient/:id/insurance": ({ facilityId, id }) => (
     <InsuranceDetails facilityId={facilityId} id={id} />
   ),
diff --git a/src/common/constants.tsx b/src/common/constants.tsx
index d46c42969ee..9d0be731565 100644
--- a/src/common/constants.tsx
+++ b/src/common/constants.tsx
@@ -1717,3 +1717,5 @@ export const HEADER_CONTENT_TYPES = {
   svg: "image/svg+xml",
   xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
 } as const;
+
+export const ADMIN_USER_TYPES = ["DistrictAdmin", "StateAdmin"] as const;
diff --git a/src/components/Common/Breadcrumbs.tsx b/src/components/Common/Breadcrumbs.tsx
index 410df597a5d..0435d7675d9 100644
--- a/src/components/Common/Breadcrumbs.tsx
+++ b/src/components/Common/Breadcrumbs.tsx
@@ -72,12 +72,12 @@ export default function Breadcrumbs({
         <div className="flex items-center">
           <CareIcon icon="l-angle-right" className="h-4 text-gray-400" />
           {isLastItem ? (
-            <span className="text-gray-500">{crumb.name}</span>
+            <span className="text-gray-600">{crumb.name}</span>
           ) : (
             <Button
               asChild
               variant="link"
-              className="p-1 font-light text-gray-500 underline underline-offset-2 hover:text-gray-700"
+              className="p-1 font-normal text-gray-800 underline underline-offset-2 hover:text-gray-700"
             >
               <Link href={crumb.uri}>{crumb.name}</Link>
             </Button>
@@ -91,32 +91,26 @@ export default function Breadcrumbs({
     <nav className={classNames("w-full", className)} aria-label="Breadcrumb">
       <ol className="flex flex-wrap items-center">
         {!hideBack && (
-          <li className="mr-1 flex items-center">
+          <li className="mr-3 flex items-center">
             <Button
               variant="link"
-              className="px-1 text-sm font-normal text-gray-500 underline underline-offset-2"
+              className="rounded bg-gray-200/50 px-1 text-sm font-normal text-gray-800 transition hover:bg-gray-200/75 hover:no-underline"
               size="xs"
               onClick={() => {
                 if (onBackClick && onBackClick() === false) return;
                 goBack(backUrl);
               }}
             >
-              <CareIcon
-                icon="l-angle-left"
-                className="-ml-2 h-4 text-gray-400"
-              />
-              <span className="pr-1">Back</span>
+              <CareIcon icon="l-arrow-left" className="h-5 text-gray-700" />
+              <span className="pr-2">Back</span>
             </Button>
-            <span className="text-xs font-light text-gray-400 no-underline">
-              |
-            </span>
           </li>
         )}
         <li>
           <Button
             asChild
             variant="link"
-            className="p-1 font-light text-gray-500 underline underline-offset-2 hover:text-gray-700"
+            className="p-1 font-normal text-gray-800 underline underline-offset-2 hover:text-gray-700"
           >
             <Link href="/">Home</Link>
           </Button>
diff --git a/src/components/Common/Menu.tsx b/src/components/Common/Menu.tsx
index 035b6f2f342..aa647a3dedb 100644
--- a/src/components/Common/Menu.tsx
+++ b/src/components/Common/Menu.tsx
@@ -55,7 +55,7 @@ export default function DropdownMenu({
 
         <MenuItems
           modal={false}
-          className={`absolute right-0 z-10 mt-2 min-w-full origin-top-right rounded-lg bg-white py-1 shadow-lg ring-1 ring-black/5 focus:outline-none sm:min-w-[250px] md:w-max ${props.itemClassName}`}
+          className={`absolute right-0 z-50 mt-2 min-w-full origin-top-right rounded-lg bg-white py-1 shadow-lg ring-1 ring-black/5 focus:outline-none sm:min-w-[250px] md:w-max ${props.itemClassName}`}
         >
           <>{props.children}</>
         </MenuItems>
diff --git a/src/components/Common/Page.tsx b/src/components/Common/Page.tsx
index 5d542a4fcbc..699f3d47204 100644
--- a/src/components/Common/Page.tsx
+++ b/src/components/Common/Page.tsx
@@ -33,13 +33,13 @@ export default function Page(props: PageProps) {
 
   let padding = "";
   if (!props.noImplicitPadding) {
-    if (!props.hideBack || props.componentRight) padding = "md:px-6 px-3 py-1";
+    if (!props.hideBack || props.componentRight) padding = "py-3 md:p-6";
     else padding = "px-6 py-5";
   }
 
   return (
     <div className={classNames(padding, props.className)} ref={props.ref}>
-      <div className="flex flex-col justify-between gap-2 md:flex-row md:items-center md:gap-6">
+      <div className="flex flex-col justify-between gap-2 px-3 md:flex-row md:items-center md:gap-6 md:px-0">
         <PageTitle
           changePageMetadata={props.changePageMetadata}
           title={props.title}
diff --git a/src/components/Facility/ConsultationCard.tsx b/src/components/Facility/ConsultationCard.tsx
index 1a2ed02d6ad..a2ede9f2667 100644
--- a/src/components/Facility/ConsultationCard.tsx
+++ b/src/components/Facility/ConsultationCard.tsx
@@ -1,13 +1,14 @@
 import careConfig from "@careConfig";
+import dayjs from "dayjs";
 import { t } from "i18next";
 import { navigate } from "raviger";
 import { useState } from "react";
 
 import Chip from "@/CAREUI/display/Chip";
+import CareIcon from "@/CAREUI/icons/CareIcon";
 
 import ButtonV2 from "@/components/Common/ButtonV2";
 import DialogModal from "@/components/Common/Dialog";
-import RelativeDateUserMention from "@/components/Common/RelativeDateUserMention";
 import Beds from "@/components/Facility/Consultations/Beds";
 import { ConsultationModel } from "@/components/Facility/models";
 
@@ -25,10 +26,10 @@ export const ConsultationCard = (props: ConsultationProps) => {
   const { itemData, isLastConsultation, refetch } = props;
   const [open, setOpen] = useState(false);
   const bedDialogTitle = itemData.discharge_date
-    ? "Bed History"
+    ? t("bed_history")
     : !itemData.current_bed
-      ? "Assign Bed"
-      : "Switch Bed";
+      ? t("assign_bed")
+      : t("switch_bed");
   return (
     <>
       <DialogModal
@@ -48,63 +49,59 @@ export const ConsultationCard = (props: ConsultationProps) => {
             hideTitle
           />
         ) : (
-          <div>Invalid Patient Data</div>
+          <div>{t("invalid_patient_data")}</div>
         )}
       </DialogModal>
-      <div className="mt-4 block cursor-pointer rounded-lg border bg-white p-4 text-black shadow hover:border-primary-500">
+      <div className="pb-16 block relative cursor-pointer border-l-2 px-4 border-l-secondary-300 hover:border-primary-500 transition-all before:absolute before:-left-[7px] before:top-0 before:w-3 before:aspect-square before:bg-secondary-400 before:rounded-full hover:before:bg-primary-500 before:transition-all">
+        <Chip
+          size="small"
+          variant={itemData.suggestion === "A" ? "alert" : "primary"}
+          text={
+            itemData.suggestion === "A" ? t("ip_encounter") : t("op_encounter")
+          }
+          className="-translate-y-2"
+        />
+        <div className="text-sm">
+          {dayjs(itemData.created_date).format("DD/MM/YYYY")}
+        </div>
+
         {itemData.is_kasp && (
           <div className="ml-3 mt-2 inline-flex items-center rounded-md bg-yellow-100 px-2.5 py-0.5 text-sm font-medium leading-5 text-yellow-800">
             {careConfig.kasp.string}
           </div>
         )}
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-4 mt-4">
+          {[
+            {
+              label: t("facility"),
+              value: (
+                <>
+                  {itemData.facility_name}
+                  {itemData.is_telemedicine && (
+                    <span className="ml-1">(Telemedicine)</span>
+                  )}
+                </>
+              ),
+            },
+            {
+              label: t("suggestion"),
+              value: itemData.suggestion_text?.toLocaleLowerCase(),
+            },
+            {
+              hide: !itemData.kasp_enabled_date,
+              label: t("kasp_enabled_date", {
+                kasp_string: careConfig.kasp.string,
+              }),
+              value: itemData.kasp_enabled_date
+                ? formatDateTime(itemData.kasp_enabled_date)
+                : undefined,
+            },
 
-        <div className="ml-2 mt-2 grid grid-cols-1 gap-4 md:grid-cols-4">
-          <div className="sm:col-span-1">
-            <div className="sm:col-span-1">
-              <div className="text-sm font-semibold leading-5 text-zinc-400">
-                Facility
-              </div>
-              <div className="mt-1 overflow-x-scroll whitespace-normal break-words text-sm font-medium leading-5">
-                {itemData.facility_name}{" "}
-                {itemData.is_telemedicine && (
-                  <span className="ml-2">(Telemedicine)</span>
-                )}
-              </div>
-            </div>
-          </div>
-          <div className="sm:col-span-1">
-            <div className="capitalize">
-              <div className="sm:col-span-1">
-                <div className="text-sm font-semibold leading-5 text-zinc-400">
-                  Suggestion{" "}
-                </div>
-                <div className="mt-1 overflow-x-scroll whitespace-normal break-words text-sm font-medium leading-5">
-                  {itemData.suggestion_text?.toLocaleLowerCase()}
-                </div>
-              </div>
-            </div>
-          </div>
-          {itemData.kasp_enabled_date && (
-            <div className="sm:col-span-1">
-              <div className="sm:col-span-1">
-                <div className="text-sm font-semibold leading-5 text-zinc-400">
-                  {careConfig.kasp.string} Enabled date{" "}
-                </div>
-                <div className="mt-1 overflow-x-scroll whitespace-normal break-words text-sm font-medium leading-5">
-                  {itemData.kasp_enabled_date
-                    ? formatDateTime(itemData.kasp_enabled_date)
-                    : "-"}
-                </div>
-              </div>
-            </div>
-          )}
-          {itemData.admitted && itemData.encounter_date && (
-            <div className="sm:col-span-1">
-              <div className="sm:col-span-1">
-                <div className="text-sm font-semibold leading-5 text-zinc-400">
-                  Admitted on
-                </div>
-                <div className="mt-1 overflow-x-scroll whitespace-normal break-words text-sm font-medium leading-5">
+            {
+              label: t("admitted_on"),
+              hide: !(itemData.admitted && itemData.encounter_date),
+              value: (
+                <>
                   {formatDateTime(itemData.encounter_date)}
                   {itemData.is_readmission && (
                     <Chip
@@ -115,103 +112,77 @@ export const ConsultationCard = (props: ConsultationProps) => {
                       text="Readmission"
                     />
                   )}
-                </div>
-              </div>
-            </div>
-          )}
-          {!itemData.admitted && (
-            <div className="sm:col-span-1">
-              <div className="sm:col-span-1">
-                <div className="text-sm font-semibold leading-5 text-zinc-400">
-                  Admitted{" "}
-                </div>
-                <div className="mt-1 overflow-x-scroll whitespace-normal break-words text-sm font-medium leading-5">
-                  No
-                </div>
+                </>
+              ),
+            },
+            {
+              label: t("admitted"),
+              hide: itemData.admitted,
+              value: t("no"),
+            },
+            {
+              label: t("discharged_on"),
+              hide: !itemData.discharge_date,
+              value: formatDateTime(itemData.discharge_date),
+            },
+          ]
+            .filter((f) => !f.hide)
+            .map((field, i) => (
+              <div key={i}>
+                <div className="text-sm text-gray-600">{field.label}</div>
+                <div className="font-bold">{field.value}</div>
               </div>
-            </div>
-          )}
-          {itemData.discharge_date && (
-            <div className="sm:col-span-1">
-              <div className="sm:col-span-1">
-                <div className="text-sm font-semibold leading-5 text-zinc-400">
-                  Discharged on{" "}
-                </div>
-                <div className="mt-1 overflow-x-scroll whitespace-normal break-words text-sm font-medium leading-5">
-                  {formatDateTime(itemData.discharge_date)}
-                </div>
-              </div>
-            </div>
-          )}
-        </div>
-        <div className="mt-8 flex flex-col">
-          {
-            <div className="flex flex-col items-center text-sm text-secondary-700 md:flex-row">
-              <div className="font-medium text-black">Created : </div>
-              <div className="ml-1 text-black">
-                <RelativeDateUserMention
-                  tooltipPosition="right"
-                  actionDate={itemData.created_date}
-                  user={itemData.created_by}
-                />
-              </div>
-            </div>
-          }
-          <div className="flex flex-col items-center text-sm text-secondary-700 md:flex-row">
-            <div className="font-medium text-black">Last Modified : </div>
-            <div className="ml-1 text-secondary-700">
-              <RelativeDateUserMention
-                tooltipPosition="right"
-                actionDate={itemData.modified_date}
-                user={itemData.last_edited_by}
-              />
-            </div>
-          </div>
+            ))}
         </div>
-        <div className="mt-4 flex w-full flex-col justify-between gap-1 md:flex-row">
+
+        <div className="flex gap-2 items-center mt-4">
           <ButtonV2
             id="view_consultation_and_log_updates"
-            className="h-auto whitespace-pre-wrap border border-secondary-500 bg-white text-black hover:bg-secondary-300"
+            variant="secondary"
+            className="bg-gray-200 rounded-lg font-semibold shadow-none text-xs"
             onClick={() =>
               navigate(
                 `/facility/${itemData.facility}/patient/${itemData.patient}/consultation/${itemData.id}`,
               )
             }
           >
-            {t("view_consultation_and_log_updates")}
+            {t("view_updates")}
           </ButtonV2>
           <ButtonV2
-            className="h-auto whitespace-pre-wrap border border-secondary-500 bg-white text-black hover:bg-secondary-300"
+            variant="secondary"
+            className="bg-gray-200 rounded-lg font-semibold shadow-none text-xs"
             onClick={() =>
               navigate(
                 `/facility/${itemData.facility}/patient/${itemData.patient}/consultation/${itemData.id}/files/`,
               )
             }
           >
-            View / Upload Consultation Files
+            {t("view_files")}
           </ButtonV2>
-          {isLastConsultation && (
-            <ButtonV2
-              className="h-auto whitespace-pre-wrap border border-secondary-500 bg-white text-black hover:bg-secondary-300"
-              onClick={() => {
-                if (itemData.admitted && !itemData.current_bed) {
-                  Notification.Error({
-                    msg: "Please assign a bed to the patient",
-                  });
-                  setOpen(true);
-                } else {
-                  navigate(
-                    `/facility/${itemData.facility}/patient/${itemData.patient}/consultation/${itemData.id}/log_updates/`,
-                  );
-                }
-              }}
-              disabled={!!itemData.discharge_date}
-              authorizeFor={NonReadOnlyUsers}
-            >
-              {t("add") + " " + t("log_update")}
-            </ButtonV2>
-          )}
         </div>
+        {isLastConsultation && (
+          <ButtonV2
+            variant="secondary"
+            className="mt-2 shadow-none border border-secondary-300"
+            onClick={() => {
+              if (itemData.admitted && !itemData.current_bed) {
+                Notification.Error({
+                  msg: t("please_assign_bed_to_patient"),
+                });
+                setOpen(true);
+              } else {
+                navigate(
+                  `/facility/${itemData.facility}/patient/${itemData.patient}/consultation/${itemData.id}/log_updates/`,
+                );
+              }
+            }}
+            disabled={!!itemData.discharge_date}
+            authorizeFor={NonReadOnlyUsers}
+          >
+            <CareIcon icon="l-plus-circle" />
+            {t("add_consultation_update")}
+          </ButtonV2>
+        )}
       </div>
     </>
   );
diff --git a/src/components/Facility/ConsultationDetails/index.tsx b/src/components/Facility/ConsultationDetails/index.tsx
index 463a4037fc9..08427a5e6ec 100644
--- a/src/components/Facility/ConsultationDetails/index.tsx
+++ b/src/components/Facility/ConsultationDetails/index.tsx
@@ -206,83 +206,81 @@ export const ConsultationDetails = (props: any) => {
       }}
     >
       <div>
-        <div>
-          <nav className="relative flex flex-wrap items-start justify-between">
-            <PageTitle
-              title="Patient Dashboard"
-              className="sm:m-0 sm:p-0"
-              crumbsReplacements={{
-                [facilityId]: { name: patientData?.facility_object?.name },
-                [patientId]: { name: patientData?.name },
-                [consultationId]: {
-                  name:
-                    consultationData.suggestion === "A"
-                      ? `Admitted on ${formatDateTime(
-                          consultationData.encounter_date!,
-                        )}`
-                      : consultationData.suggestion_text,
-                },
-              }}
-              breadcrumbs={true}
-              backUrl="/patients"
-            />
-            <div
-              className="flex w-full flex-col min-[1150px]:w-min min-[1150px]:flex-row min-[1150px]:items-center"
-              id="consultationpage-header"
+        <nav className="relative flex flex-wrap items-start justify-between">
+          <PageTitle
+            title="Patient Dashboard"
+            className="sm:m-0 sm:p-0"
+            crumbsReplacements={{
+              [facilityId]: { name: patientData?.facility_object?.name },
+              [patientId]: { name: patientData?.name },
+              [consultationId]: {
+                name:
+                  consultationData.suggestion === "A"
+                    ? `Admitted on ${formatDateTime(
+                        consultationData.encounter_date!,
+                      )}`
+                    : consultationData.suggestion_text,
+              },
+            }}
+            breadcrumbs={true}
+            backUrl="/patients"
+          />
+          <div
+            className="flex w-full flex-col min-[1150px]:w-min min-[1150px]:flex-row min-[1150px]:items-center"
+            id="consultationpage-header"
+          >
+            {!consultationData.discharge_date && (
+              <>
+                <button
+                  id="doctor-connect-button"
+                  onClick={() => {
+                    triggerGoal("Doctor Connect Clicked", {
+                      consultationId,
+                      facilityId: patientData.facility,
+                      userId: authUser.id,
+                      page: "ConsultationDetails",
+                    });
+                    setShowDoctors(true);
+                  }}
+                  className="btn btn-primary m-1 w-full hover:text-white"
+                >
+                  Doctor Connect
+                </button>
+                {patientData.last_consultation?.id &&
+                  isCameraAttached &&
+                  CameraFeedPermittedUserTypes.includes(authUser.user_type) && (
+                    <Link
+                      href={`/facility/${patientData.facility}/patient/${patientData.id}/consultation/${patientData.last_consultation?.id}/feed`}
+                      className="btn btn-primary m-1 w-full hover:text-white"
+                    >
+                      Camera Feed
+                    </Link>
+                  )}
+              </>
+            )}
+            <Link
+              href={`/facility/${patientData.facility}/patient/${patientData.id}`}
+              className="btn btn-primary m-1 w-full hover:text-white"
+              id="patient-details"
             >
-              {!consultationData.discharge_date && (
-                <>
-                  <button
-                    id="doctor-connect-button"
-                    onClick={() => {
-                      triggerGoal("Doctor Connect Clicked", {
-                        consultationId,
-                        facilityId: patientData.facility,
-                        userId: authUser.id,
-                        page: "ConsultationDetails",
-                      });
-                      setShowDoctors(true);
-                    }}
-                    className="btn btn-primary m-1 w-full hover:text-white"
-                  >
-                    Doctor Connect
-                  </button>
-                  {patientData.last_consultation?.id &&
-                    isCameraAttached &&
-                    CameraFeedPermittedUserTypes.includes(
-                      authUser.user_type,
-                    ) && (
-                      <Link
-                        href={`/facility/${patientData.facility}/patient/${patientData.id}/consultation/${patientData.last_consultation?.id}/feed`}
-                        className="btn btn-primary m-1 w-full hover:text-white"
-                      >
-                        Camera Feed
-                      </Link>
-                    )}
-                </>
-              )}
-              <Link
-                href={`/facility/${patientData.facility}/patient/${patientData.id}`}
-                className="btn btn-primary m-1 w-full hover:text-white"
-                id="patient-details"
-              >
-                Patient Details
-              </Link>
-              <a
-                id="patient_discussion_notes"
-                onClick={() =>
-                  showPatientNotesPopup
-                    ? navigate(
-                        `/facility/${facilityId}/patient/${patientId}/consultation/${consultationId}/notes`,
-                      )
-                    : setShowPatientNotesPopup(true)
-                }
-                className="btn btn-primary m-1 w-full hover:text-white"
-              >
-                Discussion Notes
-              </a>
-            </div>
-          </nav>
+              Patient Details
+            </Link>
+            <a
+              id="patient_discussion_notes"
+              onClick={() =>
+                showPatientNotesPopup
+                  ? navigate(
+                      `/facility/${facilityId}/patient/${patientId}/consultation/${consultationId}/notes`,
+                    )
+                  : setShowPatientNotesPopup(true)
+              }
+              className="btn btn-primary m-1 w-full hover:text-white"
+            >
+              Discussion Notes
+            </a>
+          </div>
+        </nav>
+        <div className="mt-4 w-full border-b-2 border-secondary-200">
           <div className="mt-2 flex w-full flex-col md:flex-row">
             <div className="size-full rounded-lg border bg-white text-black shadow">
               <PatientInfoCard
@@ -399,22 +397,25 @@ export const ConsultationDetails = (props: any) => {
           </div>
           <SelectedTab {...consultationTabProps} />
         </div>
+        <div className="px-3 pb-3 md:px-6 md:pb-6">
+          <SelectedTab {...consultationTabProps} />
+        </div>
+      </div>
 
-        <DoctorVideoSlideover
+      <DoctorVideoSlideover
+        facilityId={facilityId}
+        show={showDoctors}
+        setShow={setShowDoctors}
+      />
+
+      {showPatientNotesPopup && (
+        <PatientNotesSlideover
+          patientId={patientId}
           facilityId={facilityId}
-          show={showDoctors}
-          setShow={setShowDoctors}
+          consultationId={consultationId}
+          setShowPatientNotesPopup={setShowPatientNotesPopup}
         />
-
-        {showPatientNotesPopup && (
-          <PatientNotesSlideover
-            patientId={patientId}
-            facilityId={facilityId}
-            consultationId={consultationId}
-            setShowPatientNotesPopup={setShowPatientNotesPopup}
-          />
-        )}
-      </div>
+      )}
     </ConsultationProvider>
   );
 };
diff --git a/src/components/Patient/InsuranceDetails.tsx b/src/components/Patient/InsuranceDetails.tsx
index 248c7304bfa..3efe7866316 100644
--- a/src/components/Patient/InsuranceDetails.tsx
+++ b/src/components/Patient/InsuranceDetails.tsx
@@ -1,7 +1,7 @@
 import Loading from "@/components/Common/Loading";
 import Page from "@/components/Common/Page";
 import { HCXPolicyModel } from "@/components/HCX/models";
-import { InsuranceDetialsCard } from "@/components/Patient/InsuranceDetailsCard";
+import { InsuranceDetailsCard } from "@/components/Patient/InsuranceDetailsCard";
 
 import routes from "@/Utils/request/api";
 import useQuery from "@/Utils/request/useQuery";
@@ -53,7 +53,7 @@ export const InsuranceDetails = (props: IProps) => {
           data-testid="patient-details"
         >
           {insuranceDetials?.results.map((data: HCXPolicyModel) => (
-            <InsuranceDetialsCard data={data} />
+            <InsuranceDetailsCard data={data} />
           ))}
         </section>
       )}
diff --git a/src/components/Patient/InsuranceDetailsCard.tsx b/src/components/Patient/InsuranceDetailsCard.tsx
index 62098fc6a07..6685e7a99a2 100644
--- a/src/components/Patient/InsuranceDetailsCard.tsx
+++ b/src/components/Patient/InsuranceDetailsCard.tsx
@@ -1,79 +1,53 @@
-import { navigate } from "raviger";
+import { useTranslation } from "react-i18next";
 
-import ButtonV2 from "@/components/Common/ButtonV2";
 import { HCXPolicyModel } from "@/components/HCX/models";
 
 interface InsuranceDetails {
-  data?: HCXPolicyModel;
-  showViewAllDetails?: boolean;
+  data: HCXPolicyModel;
 }
 
-export const InsuranceDetialsCard = (props: InsuranceDetails) => {
-  const { data, showViewAllDetails } = props;
+export const InsuranceDetailsCard = (props: InsuranceDetails) => {
+  const { data } = props;
+
+  const { t } = useTranslation();
 
   return (
     <div className="w-full">
-      <div className="h-full space-y-2 rounded-lg bg-white p-7 shadow">
-        <div className="border-b border-dashed pb-2 text-xl font-bold text-secondary-900">
-          Policy Details
-        </div>
-        {data ? (
-          <div className="grid grid-cols-1 gap-2 sm:grid-cols-2 md:grid-cols-2">
-            <div className=" ">
-              <div className="text-sm font-semibold leading-5 text-zinc-400">
-                Member ID
-              </div>
-              <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
-                {data.subscriber_id || ""}
-              </div>
+      <div className="h-full space-y-2 pr-5">
+        <div className="grid grid-cols-1 gap-2 rounded-md border border-secondary-400 bg-gray-50 p-5 sm:grid-cols-2 md:grid-cols-2">
+          <div className=" ">
+            <div className="text-sm font-semibold leading-5 text-zinc-400">
+              {t("insurance__member_id")}
             </div>
-            <div className=" ">
-              <div className="text-sm font-semibold leading-5 text-zinc-400">
-                Policy ID / Policy Name
-              </div>
-              <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
-                {data.policy_id || ""}
-              </div>
+            <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
+              {data.subscriber_id || ""}
             </div>
-            <div className="sm:col-span-1">
-              <div className="text-sm font-semibold leading-5 text-zinc-400">
-                Insurer ID
-              </div>
-              <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
-                {data.insurer_id || ""}
-              </div>
+          </div>
+          <div className=" ">
+            <div className="text-sm font-semibold leading-5 text-zinc-400">
+              {t("insurance__policy_name")}
             </div>
-            <div className="sm:col-span-1">
-              <div className="text-sm font-semibold leading-5 text-zinc-400">
-                Insurer Name
-              </div>
-              <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
-                {data.insurer_name || ""}
-              </div>
+            <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
+              {data.policy_id || ""}
             </div>
-            {showViewAllDetails && (
-              <div className="first-letter: sm:col-span-2 md:ml-auto md:mt-10">
-                <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
-                  <ButtonV2
-                    id="insurance-view-details"
-                    onClick={() => {
-                      navigate(
-                        `/facility/${data.patient_object?.facility_object?.id}/patient/${data.patient_object?.id}/insurance`,
-                      );
-                    }}
-                    className="h-auto whitespace-pre-wrap border border-secondary-500 bg-white text-black hover:bg-secondary-300"
-                  >
-                    View All Details
-                  </ButtonV2>
-                </div>
-              </div>
-            )}
           </div>
-        ) : (
-          <div className="flex w-full items-center justify-center text-xl font-bold text-secondary-500">
-            No Insurance Details Available
+          <div className="sm:col-span-1">
+            <div className="text-sm font-semibold leading-5 text-zinc-400">
+              {t("insurance__insurer_id")}
+            </div>
+            <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
+              {data.insurer_id || ""}
+            </div>
           </div>
-        )}
+          <div className="sm:col-span-1">
+            <div className="text-sm font-semibold leading-5 text-zinc-400">
+              {t("insurance__insurer_name")}
+            </div>
+            <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
+              {data.insurer_name || ""}
+            </div>
+          </div>
+        </div>
       </div>
     </div>
   );
diff --git a/src/components/Patient/PatientDetailsTab/Demography.tsx b/src/components/Patient/PatientDetailsTab/Demography.tsx
new file mode 100644
index 00000000000..7ac854b8ee6
--- /dev/null
+++ b/src/components/Patient/PatientDetailsTab/Demography.tsx
@@ -0,0 +1,454 @@
+import dayjs from "dayjs";
+import { navigate } from "raviger";
+import { Fragment, useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+
+import Chip from "@/CAREUI/display/Chip";
+import CareIcon from "@/CAREUI/icons/CareIcon";
+
+import ButtonV2 from "@/components/Common/ButtonV2";
+
+import useAuthUser from "@/hooks/useAuthUser";
+
+import { GENDER_TYPES } from "@/common/constants";
+
+import { NonReadOnlyUsers } from "@/Utils/AuthorizeFor";
+import routes from "@/Utils/request/api";
+import useQuery from "@/Utils/request/useQuery";
+import { formatName, formatPatientAge } from "@/Utils/utils";
+
+import { PatientProps } from ".";
+import * as Notification from "../../../Utils/Notifications";
+import { InsuranceDetailsCard } from "../InsuranceDetailsCard";
+import { parseOccupation } from "../PatientHome";
+import { AssignedToObjectModel } from "../models";
+
+export const Demography = (props: PatientProps) => {
+  const { patientData, facilityId, id } = props;
+  const authUser = useAuthUser();
+  const { t } = useTranslation();
+  const [_assignedVolunteerObject, setAssignedVolunteerObject] =
+    useState<AssignedToObjectModel>();
+
+  const [activeSection, setActiveSection] = useState<string | null>(null);
+
+  useEffect(() => {
+    setAssignedVolunteerObject(patientData.assigned_to_object);
+
+    const observedSections: Element[] = [];
+    const sections = document.querySelectorAll("div[id]");
+    const observer = new IntersectionObserver(
+      (entries) => {
+        entries.forEach((entry) => {
+          if (entry.isIntersecting) {
+            setActiveSection(entry.target.id);
+          }
+        });
+      },
+      {
+        threshold: 0.6,
+      },
+    );
+
+    sections.forEach((section) => {
+      observer.observe(section);
+      observedSections.push(section);
+    });
+
+    return () => {
+      observedSections.forEach((section) => observer.unobserve(section));
+    };
+  }, [patientData.assigned_to_object]);
+
+  const { data: insuranceDetials } = useQuery(routes.hcx.policies.list, {
+    query: {
+      patient: id,
+    },
+  });
+
+  const patientGender = GENDER_TYPES.find(
+    (i) => i.id === patientData.gender,
+  )?.text;
+
+  const scrollToSection = (sectionId: string) => {
+    const section = document.getElementById(sectionId);
+    if (section) {
+      section.scrollIntoView({ behavior: "smooth" });
+    }
+  };
+
+  const handleEditClick = (sectionId: string) => {
+    navigate(
+      `/facility/${facilityId}/patient/${id}/update?section=${sectionId}`,
+    );
+  };
+
+  const hasEditPermission = () => {
+    const showAllFacilityUsers = ["DistrictAdmin", "StateAdmin"];
+    if (
+      !showAllFacilityUsers.includes(authUser.user_type) &&
+      authUser.home_facility_object?.id !== patientData.facility
+    ) {
+      Notification.Error({
+        msg: "Oops! Non-Home facility users don't have permission to perform this action.",
+      });
+      return false;
+    }
+    return true;
+  };
+
+  const EmergencyContact = (props: { number?: string; name?: string }) => (
+    <div className="sm:col-span-2">
+      <div className="mr-6 flex flex-col items-start justify-between rounded-md border border-orange-300 bg-orange-50 p-4 sm:flex-row">
+        {/* Emergency Contact Section */}
+        <div className="flex-1">
+          <div className="text-sm font-normal leading-5 text-gray-600">
+            {t("emergency_contact")}
+          </div>
+
+          <div className="mt-1 text-sm leading-5 text-secondary-900">
+            <div>
+              <a
+                href={`tel:${props.number}`}
+                className="text-sm font-medium text-black hover:text-secondary-500"
+              >
+                {props.number || "-"}
+              </a>
+            </div>
+            {props.number && (
+              <div>
+                <a
+                  href={`https://wa.me/${props.number?.replace(/\D+/g, "")}`}
+                  target="_blank"
+                  className="text-sm font-normal text-sky-600 hover:text-sky-300"
+                  rel="noreferrer"
+                >
+                  <CareIcon icon="l-whatsapp" /> {t("chat_on_whatsapp")}
+                </a>
+              </div>
+            )}
+          </div>
+        </div>
+
+        <div className="ml-0 mt-4 flex-1 sm:ml-4 sm:mt-0">
+          <div className="text-sm font-normal leading-5 text-gray-600">
+            {t("emergency_contact_person_name")}
+          </div>
+          <div className="mt-1 text-sm font-semibold leading-5 text-gray-900">
+            {props.name || "-"}
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+
+  const withPermissionCheck = (action: () => void) => () => {
+    if (!hasEditPermission()) {
+      Notification.Error({
+        msg: t("permission_denied"),
+      });
+      return;
+    }
+    action();
+  };
+
+  type Data = {
+    id: string;
+    hidden?: boolean;
+    allowEdit?: boolean;
+    details: (React.ReactNode | { label: string; value: React.ReactNode })[];
+  };
+
+  const data: Data[] = [
+    {
+      id: "general-info",
+      allowEdit: true,
+      details: [
+        { label: t("full_name"), value: patientData.name },
+        {
+          label: t("phone_number"),
+          value: (
+            <div>
+              <a
+                href={`tel:${patientData.phone_number}`}
+                className="text-sm font-medium text-black hover:text-secondary-500"
+              >
+                {patientData.phone_number || "-"}
+              </a>
+              <br />
+              <a
+                href={`https://wa.me/${patientData.phone_number?.replace(/\D+/g, "")}`}
+                target="_blank"
+                className="text-sm font-normal text-sky-600 hover:text-sky-300"
+                rel="noreferrer"
+              >
+                <CareIcon icon="l-whatsapp" /> Chat on WhatsApp
+              </a>
+            </div>
+          ),
+        },
+        {
+          label: t("date_of_birth"),
+          value: (
+            <>
+              {dayjs(patientData.date_of_birth).format("DD MMM YYYY")} (
+              {formatPatientAge(patientData, true)})
+            </>
+          ),
+        },
+        {
+          label: t("sex"),
+          value: patientGender,
+        },
+        <EmergencyContact
+          number={patientData.emergency_phone_number}
+          name={patientData.name}
+        />,
+        {
+          label: t("current_address"),
+          value: patientData.address,
+        },
+        {
+          label: t("permanent_address"),
+          value: patientData.permanent_address,
+        },
+        {
+          label: t("nationality"),
+          value: patientData.nationality,
+        },
+        {
+          label: t("state"),
+          value: patientData.state,
+        },
+        {
+          label: t("district"),
+          value: patientData.district_object?.name,
+        },
+        {
+          label: t("local_body"),
+          value: patientData.local_body_object?.name,
+        },
+        {
+          label: t("ward"),
+          value: (
+            <>
+              {(patientData.ward_object &&
+                patientData.ward_object.number +
+                  ", " +
+                  patientData.ward_object.name) ||
+                "-"}
+            </>
+          ),
+        },
+        {
+          label: t("village"),
+          value: patientData.village,
+        },
+      ],
+    },
+    {
+      id: "social-profile",
+      allowEdit: true,
+      details: [
+        {
+          label: t("occupation"),
+          value: parseOccupation(patientData.meta_info?.occupation),
+        },
+        {
+          label: t("ration_card_category"),
+          value:
+            !!patientData.ration_card_category &&
+            t(`ration_card__${patientData.ration_card_category}`),
+        },
+        {
+          label: t("socioeconomic_status"),
+          value:
+            patientData.meta_info?.socioeconomic_status &&
+            t(
+              `SOCIOECONOMIC_STATUS__${patientData.meta_info?.socioeconomic_status}`,
+            ),
+        },
+        {
+          label: t("domestic_healthcare_support"),
+          value:
+            patientData.meta_info?.domestic_healthcare_support &&
+            t(
+              `DOMESTIC_HEALTHCARE_SUPPORT__${patientData.meta_info?.domestic_healthcare_support}`,
+            ),
+        },
+      ],
+    },
+    {
+      id: "volunteer-contact",
+      hidden: !patientData.assigned_to_object,
+      details: [
+        <EmergencyContact
+          number={patientData.assigned_to_object?.alt_phone_number}
+          name={
+            patientData.assigned_to_object
+              ? formatName(patientData.assigned_to_object)
+              : undefined
+          }
+        />,
+      ],
+    },
+    {
+      id: "insurance-details",
+      details: [
+        <div className="w-full md:col-span-2">
+          {insuranceDetials?.results.map((insurance) => (
+            <InsuranceDetailsCard key={insurance.id} data={insurance} />
+          ))}
+          {!!insuranceDetials?.results &&
+            insuranceDetials.results.length === 0 && (
+              <div className="text-gray-500 text-sm flex items-center justify-center py-10">
+                {t("no_data_found")}
+              </div>
+            )}
+          <ButtonV2
+            border
+            className="mt-4"
+            ghost
+            disabled={!patientData.is_active}
+            onClick={withPermissionCheck(() =>
+              handleEditClick("insurance-details"),
+            )}
+          >
+            <CareIcon icon="l-plus" className="" />
+            {t("add_insurance_details")}
+          </ButtonV2>
+        </div>,
+      ],
+    },
+  ];
+
+  return (
+    <div>
+      <section
+        className="mt-8 w-full items-start gap-6 px-3 md:px-0 lg:flex 2xl:gap-8"
+        data-testid="patient-details"
+      >
+        <div className="sticky top-20 hidden text-sm font-medium text-gray-600 lg:flex lg:basis-1/5 lg:flex-col gap-2">
+          {data
+            .filter((s) => !s.hidden)
+            .map((subtab, i) => (
+              <button
+                key={i}
+                className={`cursor-pointer rounded-lg p-3 transition-colors duration-300 text-left ${
+                  activeSection === subtab.id
+                    ? "bg-white text-green-800"
+                    : "hover:bg-white hover:text-green-800"
+                }`}
+                onClick={() => scrollToSection(subtab.id)}
+              >
+                {t(`patient__${subtab.id}`)}
+              </button>
+            ))}
+        </div>
+
+        <div className="lg:basis-4/5">
+          <div className="mb-2 flex flex-row justify-between">
+            <div className="w-1/2">
+              <div className="text-sm font-normal leading-5 text-secondary-700">
+                {t("patient_status")}
+              </div>
+              <div className="mt-1 text-xl font-semibold leading-5 text-secondary-900">
+                <Chip
+                  size="medium"
+                  variant="custom"
+                  className={
+                    patientData.is_active
+                      ? "bg-blue-100 text-blue-800"
+                      : "bg-red-100 text-red-800"
+                  }
+                  text={patientData.is_active ? "LIVE" : "DISCHARGED"}
+                />
+              </div>
+            </div>
+            <div>
+              <ButtonV2
+                id="update-patient-details"
+                variant="secondary"
+                className="mt-4  text-green-800 "
+                disabled={!patientData.is_active}
+                authorizeFor={NonReadOnlyUsers}
+                onClick={withPermissionCheck(() =>
+                  navigate(
+                    `/facility/${patientData?.facility}/patient/${id}/update`,
+                  ),
+                )}
+              >
+                <CareIcon icon="l-edit-alt" className="text-lg" />
+                {t("edit_profile")}
+              </ButtonV2>
+            </div>
+          </div>
+          {/* <div className="mt-4 rounded-md border border-blue-400 bg-blue-50 p-5 grid grid-cols-1 gap-x-4 gap-y-2 md:grid-cols-2 md:gap-y-8 lg:grid-cols-2">
+            {[
+              { label: t("abha_number"), value: "-" },
+              { label: t("abha_address"), value: "-" },
+            ].map((info, i) => (
+              <div className="sm:col-span-1" key={i}>
+                <p className="text-normal text-sm text-gray-600 sm:col-span-1">
+                  {info.label}:
+                </p>
+                <p className="text-sm font-semibold text-gray-900">
+                  {info.value}
+                </p>
+              </div>
+            ))}
+          </div> */}
+          <div className="flex h-full flex-col gap-y-4">
+            {data
+              .filter((s) => !s.hidden)
+              .map((subtab, i) => (
+                <div
+                  key={i}
+                  id={subtab.id}
+                  className="group mt-4 rounded-md bg-white pb-2 pl-5 pt-5 shadow"
+                >
+                  <hr className="mb-1 mr-5 h-1 w-5 border-0 bg-blue-500" />
+                  <div className="flex flex-row gap-x-4 mb-4">
+                    <h1 className="text-xl">{t(`patient__${subtab.id}`)}</h1>
+                    {subtab.allowEdit && (
+                      <button
+                        className="flex rounded border border-secondary-400 bg-white px-2 py-1 text-sm font-semibold text-green-800 hover:bg-secondary-200"
+                        disabled={!patientData.is_active}
+                        onClick={withPermissionCheck(() =>
+                          handleEditClick(subtab.id),
+                        )}
+                      >
+                        <CareIcon
+                          icon="l-edit-alt"
+                          className="text-md mr-1 mt-1"
+                        />
+                        {t("edit")}
+                      </button>
+                    )}
+                  </div>
+                  <div className="mb-8 mt-2 grid grid-cols-1 gap-x-4 gap-y-2 md:grid-cols-2 md:gap-y-8 lg:grid-cols-2">
+                    {subtab.details.map((detail, j) =>
+                      detail &&
+                      typeof detail === "object" &&
+                      "label" in detail ? (
+                        <div className="sm:col-span-1" key={j}>
+                          <div className="text-sm font-normal leading-5 text-gray-500">
+                            {detail.label}
+                          </div>
+                          <div className="mt-1 text-sm font-semibold leading-5 text-gray-900">
+                            {detail.value || "-"}
+                          </div>
+                        </div>
+                      ) : (
+                        <Fragment key={j}>{detail}</Fragment>
+                      ),
+                    )}
+                  </div>
+                </div>
+              ))}
+          </div>
+        </div>
+      </section>
+    </div>
+  );
+};
diff --git a/src/components/Patient/PatientDetailsTab/EncounterHistory.tsx b/src/components/Patient/PatientDetailsTab/EncounterHistory.tsx
new file mode 100644
index 00000000000..71865483800
--- /dev/null
+++ b/src/components/Patient/PatientDetailsTab/EncounterHistory.tsx
@@ -0,0 +1,90 @@
+import React, { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+
+import PaginatedList from "@/CAREUI/misc/PaginatedList";
+
+import CircularProgress from "@/components/Common/CircularProgress";
+import Loading from "@/components/Common/Loading";
+import { ConsultationCard } from "@/components/Facility/ConsultationCard";
+import { ConsultationModel } from "@/components/Facility/models";
+
+import useAuthUser from "@/hooks/useAuthUser";
+
+import { triggerGoal } from "@/Integrations/Plausible";
+import routes from "@/Utils/request/api";
+import useQuery from "@/Utils/request/useQuery";
+
+import { PatientProps } from ".";
+import { PatientModel } from "../models";
+
+const EncounterHistory = (props: PatientProps) => {
+  const { patientData: initialPatientData, facilityId, id } = props;
+  const [patientData, setPatientData] =
+    useState<PatientModel>(initialPatientData);
+  const authUser = useAuthUser();
+
+  useEffect(() => {
+    setPatientData(initialPatientData);
+  }, [initialPatientData]);
+
+  const { t } = useTranslation();
+
+  const { loading: isLoading, refetch } = useQuery(routes.getPatient, {
+    pathParams: {
+      id,
+    },
+    onResponse: ({ res, data }) => {
+      if (res?.ok && data) {
+        setPatientData(data);
+      }
+      triggerGoal("Patient Profile Viewed", {
+        facilityId: facilityId,
+        userId: authUser.id,
+      });
+    },
+  });
+
+  if (isLoading) {
+    return <Loading />;
+  }
+
+  return (
+    <PaginatedList
+      route={routes.getConsultationList}
+      query={{ patient: id }}
+      perPage={5}
+    >
+      {(_) => (
+        <div className="mt-8">
+          <PaginatedList.WhenLoading>
+            <CircularProgress />
+          </PaginatedList.WhenLoading>
+          <PaginatedList.WhenEmpty className="py-2">
+            <div className="h-full space-y-2 rounded-lg bg-white p-7 border border-secondary-300">
+              <div className="flex w-full items-center justify-center text-xl text-secondary-600">
+                {t("no_consultation_history")}
+              </div>
+            </div>
+          </PaginatedList.WhenEmpty>
+          <PaginatedList.Items<ConsultationModel>>
+            {(item) => (
+              <ConsultationCard
+                itemData={item}
+                isLastConsultation={
+                  !!patientData.last_consultation &&
+                  item.id === patientData.last_consultation.id
+                }
+                refetch={refetch}
+              />
+            )}
+          </PaginatedList.Items>
+          <div className="flex w-full items-center justify-center">
+            <PaginatedList.Paginator hideIfSinglePage />
+          </div>
+        </div>
+      )}
+    </PaginatedList>
+  );
+};
+
+export default EncounterHistory;
diff --git a/src/components/Patient/PatientDetailsTab/HealthProfileSummary.tsx b/src/components/Patient/PatientDetailsTab/HealthProfileSummary.tsx
new file mode 100644
index 00000000000..3fb6b60d330
--- /dev/null
+++ b/src/components/Patient/PatientDetailsTab/HealthProfileSummary.tsx
@@ -0,0 +1,135 @@
+import { navigate } from "raviger";
+import { useTranslation } from "react-i18next";
+
+import CareIcon from "@/CAREUI/icons/CareIcon";
+
+import { UserModel } from "@/components/Users/models";
+
+import useAuthUser from "@/hooks/useAuthUser";
+
+import { ADMIN_USER_TYPES } from "@/common/constants";
+
+import { PatientProps } from ".";
+import * as Notification from "../../../Utils/Notifications";
+import { PatientModel } from "../models";
+
+export const HealthProfileSummary = (props: PatientProps) => {
+  const { patientData, facilityId, id } = props;
+
+  const authUser = useAuthUser();
+  const { t } = useTranslation();
+
+  const handleEditClick = (sectionId: string) => {
+    navigate(
+      `/facility/${facilityId}/patient/${id}/update?section=${sectionId}`,
+    );
+  };
+
+  let patientMedHis: JSX.Element[] = [];
+
+  if (patientData?.medical_history?.length) {
+    const medHis = patientData.medical_history;
+    patientMedHis = medHis
+      .filter((item) => item.disease !== "NO")
+      .map((item, idx) => (
+        <div className="sm:col-span-1" key={`med_his_${idx}`}>
+          <div className="break-words text-sm font-semibold leading-5 text-zinc-400">
+            {item.disease}
+          </div>
+          <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
+            {item.details}
+          </div>
+        </div>
+      ));
+  }
+
+  const canEditPatient = (authUser: UserModel, patientData: PatientModel) => {
+    return (
+      ADMIN_USER_TYPES.includes(
+        authUser.user_type as (typeof ADMIN_USER_TYPES)[number],
+      ) || authUser.home_facility_object?.id === patientData.facility
+    );
+  };
+
+  return (
+    <div className="mt-4 px-4 md:px-0" data-test-id="patient-health-profile">
+      <div className="group my-2 w-full rounded bg-white p-4 shadow">
+        <hr className="mb-1 mr-5 h-1 w-5 border-0 bg-blue-500" />
+        <div className="h-full space-y-2">
+          <div className="flex flex-row">
+            <div className="mr-4 text-xl font-bold text-secondary-900">
+              {t("medical")}
+            </div>
+            <button
+              className="flex rounded border border-secondary-400 bg-white px-1 py-1 text-sm font-semibold text-green-800 hover:bg-secondary-200"
+              disabled={!patientData.is_active}
+              aria-label="Edit medical history"
+              onClick={() => {
+                if (!canEditPatient(authUser, patientData)) {
+                  Notification.Error({
+                    msg: t("permission_denied"),
+                  });
+                } else {
+                  handleEditClick("medical-history");
+                }
+              }}
+            >
+              <CareIcon icon="l-edit-alt" className="text-md mr-1 mt-1" />
+              {t("edit")}
+            </button>
+          </div>
+
+          <div className="mt-2 grid grid-cols-1 gap-x-4 gap-y-2 sm:grid-cols-2 md:gap-y-8">
+            <div className="sm:col-span-1">
+              <div className="text-sm font-semibold leading-5 text-zinc-400">
+                {t("present_health")}
+              </div>
+              <div
+                data-testid="patient-present-health"
+                className="mt-1 overflow-x-scroll whitespace-normal break-words text-sm font-medium leading-5"
+              >
+                {patientData.present_health || "-"}
+              </div>
+            </div>
+
+            <div className="sm:col-span-1">
+              <div className="text-sm font-semibold leading-5 text-zinc-400">
+                {t("ongoing_medications")}
+              </div>
+              <div
+                data-testid="patient-ongoing-medication"
+                className="mt-1 overflow-x-scroll whitespace-normal break-words text-sm font-medium leading-5"
+              >
+                {patientData.ongoing_medication || "-"}
+              </div>
+            </div>
+
+            <div className="sm:col-span-1">
+              <div className="text-sm font-semibold leading-5 text-zinc-400">
+                {t("allergies")}
+              </div>
+              <div
+                data-testid="patient-allergies"
+                className="mt-1 overflow-x-scroll whitespace-normal break-words text-sm font-medium leading-5"
+              >
+                {patientData.allergies || "-"}
+              </div>
+            </div>
+
+            {patientData.gender === 2 && patientData.is_antenatal && (
+              <div className="sm:col-span-1">
+                <div className="text-sm font-semibold leading-5 text-zinc-400">
+                  {t("is_pregnant")}
+                </div>
+                <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
+                  {t("yes")}
+                </div>
+              </div>
+            )}
+            {patientMedHis}
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};
diff --git a/src/components/Patient/PatientDetailsTab/ImmunisationRecords.tsx b/src/components/Patient/PatientDetailsTab/ImmunisationRecords.tsx
new file mode 100644
index 00000000000..eb298737f3c
--- /dev/null
+++ b/src/components/Patient/PatientDetailsTab/ImmunisationRecords.tsx
@@ -0,0 +1,124 @@
+import { navigate } from "raviger";
+import { useTranslation } from "react-i18next";
+
+import CareIcon from "@/CAREUI/icons/CareIcon";
+
+import { UserModel } from "@/components/Users/models";
+
+import useAuthUser from "@/hooks/useAuthUser";
+
+import { ADMIN_USER_TYPES } from "@/common/constants";
+
+import { formatDateTime } from "@/Utils/utils";
+
+import { PatientProps } from ".";
+import * as Notification from "../../../Utils/Notifications";
+import { PatientModel } from "../models";
+
+export const ImmunisationRecords = (props: PatientProps) => {
+  const { patientData, facilityId, id } = props;
+
+  const authUser = useAuthUser();
+  const { t } = useTranslation();
+
+  const handleEditClick = (sectionId: string) => {
+    navigate(
+      `/facility/${facilityId}/patient/${id}/update?section=${sectionId}`,
+    );
+  };
+
+  const canEditPatient = (authUser: UserModel, patientData: PatientModel) => {
+    return (
+      ADMIN_USER_TYPES.includes(
+        authUser.user_type as (typeof ADMIN_USER_TYPES)[number],
+      ) || authUser.home_facility_object?.id === patientData.facility
+    );
+  };
+
+  return (
+    <div className="mt-4 px-4 md:px-0">
+      <div className="w-full rounded-md bg-white p-4 shadow-md">
+        <hr className="mb-1 mr-5 h-1 w-5 border-0 bg-blue-500" />
+        <div>
+          <div className="flex flex-row gap-x-4">
+            <h1 className="text-xl">{t("covid_details")}</h1>
+            <button
+              className="hidden rounded border border-secondary-400 bg-white px-1 py-1 text-sm font-semibold text-green-800 hover:bg-secondary-200 group-hover:flex"
+              disabled={!patientData.is_active}
+              onClick={() => {
+                if (!canEditPatient(authUser, patientData)) {
+                  Notification.Error({
+                    msg: t("permission_denied"),
+                  });
+                } else {
+                  handleEditClick("covid-details");
+                }
+              }}
+            >
+              <CareIcon icon="l-edit-alt" className="text-md mr-1 mt-1" />
+              {t("edit")}
+            </button>
+          </div>
+
+          <div className="mb-8 mt-2 grid grid-cols-1 gap-x-4 gap-y-2 md:grid-cols-2 md:gap-y-8 lg:grid-cols-2">
+            <div className="sm:col-span-1">
+              <div className="text-sm font-semibold leading-5 text-zinc-400">
+                {t("number_of_covid_vaccine_doses")}
+              </div>
+              <div className="mt-1 text-sm font-medium leading-5">
+                {patientData.is_vaccinated && patientData.number_of_doses
+                  ? patientData.number_of_doses
+                  : "-"}
+              </div>
+            </div>
+
+            <div className="sm:col-span-1">
+              <div className="text-sm font-semibold leading-5 text-zinc-400">
+                {t("vaccine_name")}
+              </div>
+              <div className="mt-1 text-sm font-medium leading-5">
+                {patientData.is_vaccinated && patientData.vaccine_name
+                  ? patientData.vaccine_name
+                  : "-"}
+              </div>
+            </div>
+
+            <div className="sm:col-span-1">
+              <div className="text-sm font-semibold leading-5 text-zinc-400">
+                {t("last_vaccinated_on")}
+              </div>
+              <div className="mt-1 text-sm font-medium leading-5">
+                {patientData.is_vaccinated && patientData.last_vaccinated_date
+                  ? formatDateTime(patientData.last_vaccinated_date)
+                  : "-"}
+              </div>
+            </div>
+
+            <div className="sm:col-span-1">
+              <div className="text-sm font-semibold leading-5 text-zinc-400">
+                {t("countries_travelled")}
+              </div>
+              <div className="mt-1 text-sm font-medium leading-5">
+                {patientData.countries_travelled &&
+                patientData.countries_travelled.length > 0
+                  ? patientData.countries_travelled.join(", ")
+                  : "-"}
+              </div>
+            </div>
+
+            <div className="sm:col-span-1">
+              <div className="text-sm font-semibold leading-5 text-zinc-400">
+                {t("date_of_return")}
+              </div>
+              <div className="mt-1 text-sm font-medium leading-5">
+                {patientData.date_of_return
+                  ? formatDateTime(patientData.date_of_return)
+                  : "-"}
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};
diff --git a/src/components/Patient/PatientDetailsTab/Notes.tsx b/src/components/Patient/PatientDetailsTab/Notes.tsx
new file mode 100644
index 00000000000..646e97d3bd5
--- /dev/null
+++ b/src/components/Patient/PatientDetailsTab/Notes.tsx
@@ -0,0 +1,184 @@
+import { t } from "i18next";
+import { useEffect, useState } from "react";
+
+import CareIcon from "@/CAREUI/icons/CareIcon";
+
+import ButtonV2 from "@/components/Common/ButtonV2";
+import DoctorNoteReplyPreviewCard from "@/components/Facility/DoctorNoteReplyPreviewCard";
+import PatientNotesList from "@/components/Facility/PatientNotesList";
+import {
+  PatientNoteStateType,
+  PatientNotesModel,
+} from "@/components/Facility/models";
+import AutoExpandingTextInputFormField from "@/components/Form/FormFields/AutoExpandingTextInputFormField";
+
+import useAuthUser from "@/hooks/useAuthUser";
+import { useMessageListener } from "@/hooks/useMessageListener";
+
+import { PATIENT_NOTES_THREADS } from "@/common/constants";
+
+import { NonReadOnlyUsers } from "@/Utils/AuthorizeFor";
+import routes from "@/Utils/request/api";
+import request from "@/Utils/request/request";
+import { classNames, keysOf } from "@/Utils/utils";
+
+import * as Notification from "../../../Utils/Notifications";
+
+interface PatientNotesProps {
+  id: string;
+  facilityId: string;
+}
+
+const PatientNotes = (props: PatientNotesProps) => {
+  const { id: patientId, facilityId } = props;
+
+  const authUser = useAuthUser();
+  const [thread, setThread] = useState(
+    authUser.user_type === "Nurse"
+      ? PATIENT_NOTES_THREADS.Nurses
+      : PATIENT_NOTES_THREADS.Doctors,
+  );
+
+  const [patientActive, setPatientActive] = useState(true);
+  const [noteField, setNoteField] = useState("");
+  const [reload, setReload] = useState(false);
+  const [reply_to, setReplyTo] = useState<PatientNotesModel | undefined>(
+    undefined,
+  );
+
+  const initialData: PatientNoteStateType = {
+    notes: [],
+    cPage: 1,
+    totalPages: 1,
+  };
+  const [state, setState] = useState(initialData);
+
+  const onAddNote = async () => {
+    if (!/\S+/.test(noteField)) {
+      Notification.Error({
+        msg: "Note Should Contain At Least 1 Character",
+      });
+      return;
+    }
+
+    try {
+      const { res } = await request(routes.addPatientNote, {
+        pathParams: { patientId: patientId },
+        body: {
+          note: noteField,
+          thread,
+          reply_to: reply_to?.id,
+        },
+      });
+      if (res?.status === 201) {
+        setNoteField("");
+        setReload(!reload);
+        setState({ ...state, cPage: 1 });
+        setReplyTo(undefined);
+        Notification.Success({ msg: "Note added successfully" });
+      }
+    } catch (error) {
+      Notification.Error({
+        msg: "Failed to add note. Please try again.",
+      });
+    }
+  };
+
+  useEffect(() => {
+    async function fetchPatientName() {
+      if (patientId) {
+        try {
+          const { data } = await request(routes.getPatient, {
+            pathParams: { id: patientId },
+          });
+          if (data) {
+            setPatientActive(data.is_active ?? true);
+          }
+        } catch (error) {
+          Notification.Error({
+            msg: "Failed to fetch patient status",
+          });
+        }
+      }
+    }
+    fetchPatientName();
+  }, [patientId]);
+
+  useMessageListener((data) => {
+    const message = data?.message;
+    if (
+      (message?.from == "patient/doctor_notes/create" ||
+        message?.from == "patient/doctor_notes/edit") &&
+      message?.facility_id == facilityId &&
+      message?.patient_id == patientId
+    ) {
+      setReload(true);
+    }
+  });
+
+  return (
+    <div className="flex h-screen flex-col">
+      <div className="relative mx-3 my-2 flex grow flex-col rounded-lg border border-secondary-300 bg-white p-2 sm:mx-10 sm:my-5 sm:p-5">
+        <div className="absolute inset-x-0 top-0 z-10 flex bg-secondary-200 text-sm shadow-md">
+          {keysOf(PATIENT_NOTES_THREADS).map((current) => (
+            <button
+              id={`patient-note-tab-${current}`}
+              key={current}
+              className={classNames(
+                "flex flex-1 justify-center border-b-2 py-2",
+                thread === PATIENT_NOTES_THREADS[current]
+                  ? "border-primary-500 font-bold text-secondary-800"
+                  : "border-secondary-300 text-secondary-800",
+              )}
+              onClick={() => setThread(PATIENT_NOTES_THREADS[current])}
+            >
+              {t(`patient_notes_thread__${current}`)}
+            </button>
+          ))}
+        </div>
+        <PatientNotesList
+          state={state}
+          setState={setState}
+          patientId={patientId}
+          facilityId={facilityId}
+          reload={reload}
+          setReload={setReload}
+          thread={thread}
+          setReplyTo={setReplyTo}
+        />
+        <DoctorNoteReplyPreviewCard
+          parentNote={reply_to}
+          cancelReply={() => setReplyTo(undefined)}
+        >
+          <div className="relative mx-4 flex items-center">
+            <AutoExpandingTextInputFormField
+              maxHeight={160}
+              rows={2}
+              name="note"
+              value={noteField}
+              onChange={(e) => setNoteField(e.value)}
+              className="w-full grow"
+              errorClassName="hidden"
+              innerClassName="pr-10"
+              placeholder={t("notes_placeholder")}
+              disabled={!patientActive}
+            />
+            <ButtonV2
+              onClick={onAddNote}
+              border={false}
+              className="absolute right-2"
+              ghost
+              size="small"
+              disabled={!patientActive}
+              authorizeFor={NonReadOnlyUsers}
+            >
+              <CareIcon icon="l-message" className="text-lg" />
+            </ButtonV2>
+          </div>
+        </DoctorNoteReplyPreviewCard>
+      </div>
+    </div>
+  );
+};
+
+export default PatientNotes;
diff --git a/src/components/Patient/PatientDetailsTab/SampleTestHistory.tsx b/src/components/Patient/PatientDetailsTab/SampleTestHistory.tsx
new file mode 100644
index 00000000000..b7a907fe662
--- /dev/null
+++ b/src/components/Patient/PatientDetailsTab/SampleTestHistory.tsx
@@ -0,0 +1,107 @@
+import { navigate } from "raviger";
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+
+import CareIcon from "@/CAREUI/icons/CareIcon";
+import PaginatedList from "@/CAREUI/misc/PaginatedList";
+
+import ButtonV2 from "@/components/Common/ButtonV2";
+import CircularProgress from "@/components/Common/CircularProgress";
+
+import { NonReadOnlyUsers } from "@/Utils/AuthorizeFor";
+import routes from "@/Utils/request/api";
+
+import { PatientProps } from ".";
+import { SampleTestCard } from "../SampleTestCard";
+import { PatientModel, SampleTestModel } from "../models";
+
+export const SampleTestHistory = (props: PatientProps) => {
+  const { patientData, facilityId, id } = props;
+  const [_selectedStatus, setSelectedStatus] = useState<{
+    status: number;
+    sample: SampleTestModel | null;
+  }>({ status: 0, sample: null });
+  const [_showAlertMessage, setShowAlertMessage] = useState(false);
+
+  const isPatientInactive = (patientData: PatientModel, facilityId: string) => {
+    if (!patientData) return true;
+    return (
+      !patientData.is_active ||
+      !(
+        patientData?.last_consultation &&
+        patientData.last_consultation.facility === facilityId
+      )
+    );
+  };
+
+  const confirmApproval = (status: number, sample: SampleTestModel) => {
+    setSelectedStatus({ status, sample });
+    setShowAlertMessage(true);
+  };
+
+  const { t } = useTranslation();
+
+  return (
+    <div className="mt-4 px-3 md:px-0">
+      <div>
+        <div className="flex justify-between items-center">
+          <h2 className="my-4 ml-0 text-2xl font-semibold leading-tight">
+            {t("sample_test_history")}
+          </h2>
+          <ButtonV2
+            className="bg-green-600 px-3 py-2 font-semibold text-white hover:bg-green-500"
+            disabled={isPatientInactive(patientData, facilityId)}
+            size="default"
+            onClick={() =>
+              navigate(
+                `/facility/${patientData?.facility}/patient/${id}/sample-test`,
+              )
+            }
+            authorizeFor={NonReadOnlyUsers}
+            id="sample-request-btn"
+          >
+            <span className="flex w-full items-center justify-start gap-2">
+              <CareIcon icon="l-medkit" className="text-xl" />
+              {t("request_sample_test")}
+            </span>
+          </ButtonV2>
+        </div>
+      </div>
+
+      <PaginatedList
+        route={routes.sampleTestList}
+        pathParams={{ patientId: id }}
+        perPage={5}
+      >
+        {(_, query) => (
+          <div>
+            <PaginatedList.WhenLoading>
+              <CircularProgress />
+            </PaginatedList.WhenLoading>
+            <PaginatedList.WhenEmpty className="py-2">
+              <div className="h-full space-y-2 rounded-lg bg-white p-7 shadow">
+                <div className="flex w-full items-center justify-center text-xl font-bold text-secondary-500">
+                  {t("no_records_found")}
+                </div>
+              </div>
+            </PaginatedList.WhenEmpty>
+            <PaginatedList.Items<SampleTestModel>>
+              {(item) => (
+                <SampleTestCard
+                  refetch={query.refetch}
+                  itemData={item}
+                  handleApproval={confirmApproval}
+                  facilityId={facilityId}
+                  patientId={id}
+                />
+              )}
+            </PaginatedList.Items>
+            <div className="flex w-full items-center justify-center">
+              <PaginatedList.Paginator hideIfSinglePage />
+            </div>
+          </div>
+        )}
+      </PaginatedList>
+    </div>
+  );
+};
diff --git a/src/components/Patient/PatientDetailsTab/ShiftingHistory.tsx b/src/components/Patient/PatientDetailsTab/ShiftingHistory.tsx
new file mode 100644
index 00000000000..b7ef154bf4d
--- /dev/null
+++ b/src/components/Patient/PatientDetailsTab/ShiftingHistory.tsx
@@ -0,0 +1,73 @@
+import { navigate } from "raviger";
+import { useTranslation } from "react-i18next";
+
+import CareIcon from "@/CAREUI/icons/CareIcon";
+
+import ButtonV2 from "@/components/Common/ButtonV2";
+import { formatFilter } from "@/components/Resource/ResourceCommons";
+import ShiftingTable from "@/components/Shifting/ShiftingTable";
+
+import useFilters from "@/hooks/useFilters";
+
+import { NonReadOnlyUsers } from "@/Utils/AuthorizeFor";
+import routes from "@/Utils/request/api";
+import useQuery from "@/Utils/request/useQuery";
+
+import { PatientProps } from ".";
+import { PatientModel } from "../models";
+
+const ShiftingHistory = (props: PatientProps) => {
+  const { patientData, facilityId, id } = props;
+  const { t } = useTranslation();
+  const { qParams, Pagination, resultsPerPage } = useFilters({
+    cacheBlacklist: ["patient_name"],
+  });
+
+  const isPatientInactive = (patientData: PatientModel, facilityId: string) => {
+    return (
+      !patientData.is_active ||
+      !(patientData?.last_consultation?.facility === facilityId)
+    );
+  };
+
+  const { data: shiftData, loading } = useQuery(routes.listShiftRequests, {
+    query: {
+      ...formatFilter({
+        ...qParams,
+        offset: (qParams.page ? qParams.page - 1 : 0) * resultsPerPage,
+      }),
+      patient: id,
+    },
+    prefetch: !!id,
+  });
+
+  return (
+    <section className="mt-4">
+      <div className="flex justify-between items-center">
+        <h2 className="my-4 ml-0 text-2xl font-semibold leading-tight">
+          {t("shifting_history")}
+        </h2>
+        <ButtonV2
+          className=""
+          disabled={isPatientInactive(patientData, facilityId)}
+          size="default"
+          onClick={() =>
+            navigate(`/facility/${facilityId}/patient/${id}/shift/new`)
+          }
+          authorizeFor={NonReadOnlyUsers}
+        >
+          <span className="flex w-full items-center justify-start gap-2">
+            <CareIcon icon="l-ambulance" className="text-xl" />
+            {t("shift")}
+          </span>
+        </ButtonV2>
+      </div>
+      <ShiftingTable hidePatient data={shiftData?.results} loading={loading} />
+      <div>
+        <Pagination totalCount={shiftData?.count || 0} />
+      </div>{" "}
+    </section>
+  );
+};
+
+export default ShiftingHistory;
diff --git a/src/components/Patient/PatientDetailsTab/index.tsx b/src/components/Patient/PatientDetailsTab/index.tsx
new file mode 100644
index 00000000000..effc9b667f8
--- /dev/null
+++ b/src/components/Patient/PatientDetailsTab/index.tsx
@@ -0,0 +1,45 @@
+import { PatientModel } from "../models";
+import { Demography } from "./Demography";
+import EncounterHistory from "./EncounterHistory";
+import { HealthProfileSummary } from "./HealthProfileSummary";
+import { ImmunisationRecords } from "./ImmunisationRecords";
+import PatientNotes from "./Notes";
+import { SampleTestHistory } from "./SampleTestHistory";
+import ShiftingHistory from "./ShiftingHistory";
+
+export interface PatientProps {
+  facilityId: string;
+  id: string;
+  patientData: PatientModel;
+}
+
+export const patientTabs = [
+  {
+    route: "demography",
+    component: Demography,
+  },
+  {
+    route: "encounters",
+    component: EncounterHistory,
+  },
+  {
+    route: "health-profile",
+    component: HealthProfileSummary,
+  },
+  {
+    route: "immunisation-records",
+    component: ImmunisationRecords,
+  },
+  {
+    route: "shift",
+    component: ShiftingHistory,
+  },
+  {
+    route: "request-sample-test",
+    component: SampleTestHistory,
+  },
+  {
+    route: "patient-notes",
+    component: PatientNotes,
+  },
+];
diff --git a/src/components/Patient/PatientHome.tsx b/src/components/Patient/PatientHome.tsx
index a7b08bdea58..d6b9844b699 100644
--- a/src/components/Patient/PatientHome.tsx
+++ b/src/components/Patient/PatientHome.tsx
@@ -1,26 +1,9 @@
-import { navigate } from "raviger";
+import { Link, navigate } from "raviger";
 import { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 
-import Chip from "@/CAREUI/display/Chip";
-import CareIcon from "@/CAREUI/icons/CareIcon";
-import PaginatedList from "@/CAREUI/misc/PaginatedList";
-
-import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";
-import { Button } from "@/components/ui/button";
-
-import ButtonV2 from "@/components/Common/ButtonV2";
-import CircularProgress from "@/components/Common/CircularProgress";
 import ConfirmDialog from "@/components/Common/ConfirmDialog";
-import Loading from "@/components/Common/Loading";
-import Page from "@/components/Common/Page";
-import RelativeDateUserMention from "@/components/Common/RelativeDateUserMention";
 import UserAutocomplete from "@/components/Common/UserAutocompleteFormField";
-import { ConsultationCard } from "@/components/Facility/ConsultationCard";
-import { ConsultationModel, ShiftingModel } from "@/components/Facility/models";
-import { InsuranceDetialsCard } from "@/components/Patient/InsuranceDetailsCard";
-import { SampleTestCard } from "@/components/Patient/SampleTestCard";
-import { PatientModel, SampleTestModel } from "@/components/Patient/models";
 
 import useAuthUser from "@/hooks/useAuthUser";
 
@@ -31,98 +14,67 @@ import {
   SAMPLE_TEST_STATUS,
 } from "@/common/constants";
 
-import { triggerGoal } from "@/Integrations/Plausible";
-import { NonReadOnlyUsers } from "@/Utils/AuthorizeFor";
-import * as Notification from "@/Utils/Notifications";
 import dayjs from "@/Utils/dayjs";
 import routes from "@/Utils/request/api";
-import request from "@/Utils/request/request";
-import useQuery from "@/Utils/request/useQuery";
+
+import Chip from "../../CAREUI/display/Chip";
+import CareIcon from "../../CAREUI/icons/CareIcon";
+import { triggerGoal } from "../../Integrations/Plausible";
+import { NonReadOnlyUsers } from "../../Utils/AuthorizeFor";
+import * as Notification from "../../Utils/Notifications";
+import request from "../../Utils/request/request";
+import useQuery from "../../Utils/request/useQuery";
 import {
-  classNames,
-  formatDate,
   formatDateTime,
   formatName,
   formatPatientAge,
+  humanizeStrings,
   isAntenatal,
   isPostPartum,
-} from "@/Utils/utils";
+  relativeDate,
+} from "../../Utils/utils";
+import { Avatar } from "../Common/Avatar";
+import ButtonV2 from "../Common/ButtonV2";
+import Loading from "../Common/Loading";
+import Page from "../Common/Page";
+import { SkillModel, UserBareMinimum } from "../Users/models";
+import { patientTabs } from "./PatientDetailsTab";
+import { isPatientMandatoryDataFilled } from "./Utils";
+import { AssignedToObjectModel, PatientModel, SampleTestModel } from "./models";
 
 export const parseOccupation = (occupation: string | undefined) => {
   return OCCUPATION_TYPES.find((i) => i.value === occupation)?.text;
 };
 
-export const PatientHome = (props: any) => {
-  const { facilityId, id } = props;
-  const [showShifts, setShowShifts] = useState(false);
-  const [isShiftClicked, setIsShiftClicked] = useState(false);
+export const PatientHome = (props: {
+  facilityId?: string;
+  id: string;
+  page: (typeof patientTabs)[0]["route"];
+}) => {
+  const { facilityId, id, page } = props;
   const [patientData, setPatientData] = useState<PatientModel>({});
-  const [assignedVolunteerObject, setAssignedVolunteerObject] =
-    useState<any>(null);
+
   const authUser = useAuthUser();
   const { t } = useTranslation();
-  const [selectedStatus, setSelectedStatus] = useState<{
+  const [selectedStatus, _setSelectedStatus] = useState<{
     status: number;
-    sample: any;
+    sample: SampleTestModel | null;
   }>({ status: 0, sample: null });
-  const [showAlertMessage, setShowAlertMessage] = useState(false);
-  const [modalFor, setModalFor] = useState<ShiftingModel>();
-  const [openAssignVolunteerDialog, setOpenAssignVolunteerDialog] =
-    useState(false);
 
-  const initErr: any = {};
-  const errors = initErr;
+  const [assignedVolunteer, setAssignedVolunteer] = useState<
+    AssignedToObjectModel | undefined
+  >(patientData.assigned_to_object);
 
   useEffect(() => {
-    setAssignedVolunteerObject(patientData.assigned_to_object);
+    setAssignedVolunteer(patientData.assigned_to_object);
   }, [patientData.assigned_to_object]);
 
-  const handleTransferComplete = async (shift: ShiftingModel) => {
-    if (!shift) return;
-    await request(routes.completeTransfer, {
-      pathParams: { externalId: shift.external_id },
-    });
-    navigate(
-      `/facility/${shift.assigned_facility}/patient/${shift.patient}/consultation`,
-    );
-  };
-
-  const { data: insuranceDetials } = useQuery(routes.hcx.policies.list, {
-    query: {
-      patient: id,
-      limit: 1,
-    },
-  });
-
-  const handlePatientTransfer = async (value: boolean) => {
-    const dummyPatientData = Object.assign({}, patientData);
-    dummyPatientData["allow_transfer"] = value;
-
-    await request(routes.patchPatient, {
-      pathParams: {
-        id: patientData.id as string,
-      },
-
-      body: { allow_transfer: value },
-
-      onResponse: ({ res }) => {
-        if ((res || {}).status === 200) {
-          const dummyPatientData = Object.assign({}, patientData);
-          dummyPatientData["allow_transfer"] = value;
-          setPatientData(dummyPatientData);
-
-          Notification.Success({
-            msg: "Transfer status updated.",
-          });
-        }
-      },
-    });
-  };
-
-  const handleVolunteerSelect = (volunteer: any) => {
-    setAssignedVolunteerObject(volunteer.value);
-  };
+  const [showAlertMessage, setShowAlertMessage] = useState(false);
+  const [openAssignVolunteerDialog, setOpenAssignVolunteerDialog] =
+    useState(false);
 
+  const initErr: any = {};
+  const errors = initErr;
   const { loading: isLoading, refetch } = useQuery(routes.getPatient, {
     pathParams: {
       id,
@@ -144,20 +96,18 @@ export const PatientHome = (props: any) => {
         id: patientData.id as string,
       },
       body: {
-        assigned_to: assignedVolunteerObject
-          ? assignedVolunteerObject.id
-          : null,
+        assigned_to: (assignedVolunteer as UserBareMinimum)?.id || null,
       },
     });
     if (res?.ok && data) {
       setPatientData(data);
-      if (assignedVolunteerObject) {
+      if (!assignedVolunteer) {
         Notification.Success({
-          msg: "Volunteer assigned successfully.",
+          msg: t("volunteer_assigned"),
         });
       } else {
         Notification.Success({
-          msg: "Volunteer unassigned successfully.",
+          msg: t("volunteer_unassigned"),
         });
       }
       refetch();
@@ -166,34 +116,41 @@ export const PatientHome = (props: any) => {
     if (errors["assignedVolunteer"]) delete errors["assignedVolunteer"];
   };
 
-  const { loading: isShiftDataLoading, data: activeShiftingData } = useQuery(
-    routes.listShiftRequests,
-    {
-      query: {
-        patient: id,
-      },
-      prefetch: isShiftClicked,
+  const consultation = patientData?.last_consultation;
+  const skillsQuery = useQuery(routes.userListSkill, {
+    pathParams: {
+      username: consultation?.treating_physician_object?.username ?? "",
     },
-  );
+    prefetch: !!consultation?.treating_physician_object?.username,
+  });
+  const formatSkills = (arr: SkillModel[]) => {
+    const skills = arr.map((skill) => skill.skill_object.name);
+
+    if (skills.length === 0) {
+      return "";
+    }
 
-  const confirmApproval = (status: number, sample: any) => {
-    setSelectedStatus({ status, sample });
-    setShowAlertMessage(true);
+    if (skills.length <= 3) {
+      return humanizeStrings(skills);
+    }
+
+    const [first, second, ...rest] = skills;
+    return `${first}, ${second} and ${rest.length} other skills...`;
   };
 
   const handleApproval = async () => {
     const { status, sample } = selectedStatus;
     const sampleData = {
-      id: sample.id,
+      id: sample?.id,
       status: status.toString(),
-      consultation: sample.consultation,
+      consultation: sample?.consultation,
     };
     const statusName = SAMPLE_TEST_STATUS.find((i) => i.id === status)?.desc;
 
     await request(routes.patchSample, {
       body: sampleData,
       pathParams: {
-        id: sample.id,
+        id: sample?.id || "",
       },
       onResponse: ({ res }) => {
         if (res?.ok) {
@@ -214,351 +171,390 @@ export const PatientHome = (props: any) => {
     (i) => i.id === patientData.gender,
   )?.text;
 
-  let patientMedHis: any[] = [];
-  if (
-    patientData &&
-    patientData.medical_history &&
-    patientData.medical_history.length
-  ) {
-    const medHis = patientData.medical_history;
-    patientMedHis = medHis
-      .filter((item) => item.disease !== "NO")
-      .map((item, idx) => (
-        <div className="sm:col-span-1" key={`med_his_${idx}`}>
-          <div className="break-words text-sm font-semibold leading-5 text-zinc-400">
-            {item.disease}
-          </div>
-          <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
-            {item.details}
-          </div>
-        </div>
-      ));
-  }
-
-  const isPatientInactive = (patientData: PatientModel, facilityId: string) => {
-    return (
-      !patientData.is_active ||
-      !(patientData?.last_consultation?.facility === facilityId)
-    );
+  const handlePatientTransfer = async (value: boolean) => {
+    await request(routes.patchPatient, {
+      pathParams: {
+        id: patientData.id as string,
+      },
+      body: { allow_transfer: value },
+      onResponse: ({ res }) => {
+        if (res?.status === 200) {
+          setPatientData((prev) => ({
+            ...prev,
+            allow_transfer: value,
+          }));
+          Notification.Success({
+            msg: t("transfer_status_updated"),
+          });
+        }
+      },
+    });
   };
 
+  const Tab = patientTabs.find((t) => t.route === page)?.component;
+
   return (
     <Page
       title={t("patient_details")}
       crumbsReplacements={{
-        [facilityId]: { name: patientData?.facility_object?.name },
+        [facilityId || ""]: { name: patientData?.facility_object?.name },
         [id]: { name: patientData?.name },
       }}
       backUrl={facilityId ? `/facility/${facilityId}/patients` : "/patients"}
     >
       <ConfirmDialog
-        title="Confirm send sample to collection centre"
-        description="Are you sure you want to send the sample to Collection Centre?"
+        title={t("send_sample_to_collection_centre_title")}
+        description={t("send_sample_to_collection_centre_description")}
         show={showAlertMessage}
-        action="Approve"
+        action={t("approve")}
         onConfirm={() => handleApproval()}
         onClose={() => setShowAlertMessage(false)}
       />
 
-      <div>
-        <div className="relative mt-2">
-          <div className="mx-auto max-w-screen-xl p-3 sm:px-6 lg:px-8">
-            <div className="md:flex">
-              {patientData?.last_consultation?.assigned_to_object && (
-                <p className="mx-3 flex flex-1 justify-center gap-2 rounded-lg bg-green-200 p-3 text-center font-bold text-green-800 shadow">
-                  <span className="inline">
-                    Assigned Doctor:
-                    {formatName(
-                      patientData.last_consultation.assigned_to_object,
-                    )}
-                  </span>
-                  {patientData?.last_consultation?.assigned_to_object
-                    .alt_phone_number && (
-                    <a
-                      href={`https://wa.me/${patientData?.last_consultation?.assigned_to_object.alt_phone_number?.replace(/\D+/g, "")}`}
-                      target="_blank"
-                      rel="noreferrer"
-                    >
-                      <CareIcon icon="l-whatsapp" /> Video Call
-                    </a>
-                  )}
-                </p>
-              )}
-              {patientData.assigned_to_object && (
-                <p className="mx-2 flex-1 rounded-lg bg-primary-200 p-3 text-center font-bold text-primary-800 shadow">
-                  <span className="inline">
-                    Assigned Volunteer:
-                    {formatName(patientData.assigned_to_object)}
-                  </span>
-                </p>
-              )}
-            </div>
-          </div>
-        </div>
-        {(patientData?.facility != patientData?.last_consultation?.facility ||
-          (patientData.is_active &&
-            patientData?.last_consultation?.discharge_date)) && (
-          <Alert
-            variant="destructive"
-            className="mb-4 flex flex-col items-center justify-between gap-2 md:flex-row"
-          >
-            <div className="flex items-center gap-2">
-              <CareIcon
-                icon="l-exclamation-triangle"
-                className="mr-2 hidden h-10 animate-pulse md:block"
-              />
-              <div>
-                <AlertTitle className="flex items-center">
-                  {t("consultation_not_filed")}
-                </AlertTitle>
-                <AlertDescription>
-                  <span className="text-gray-700">
-                    {t("consultation_not_filed_description")}
-                  </span>
-                </AlertDescription>
+      <div className="mt-3" data-testid="patient-dashboard">
+        <div className="px-3 md:px-0">
+          <div className="rounded-md bg-white p-3 shadow-sm">
+            <div>
+              <div className="flex flex-col justify-between gap-4 gap-y-2 md:flex-row">
+                <div className="flex flex-col gap-4 md:flex-row">
+                  <div className="flex flex-row gap-x-4">
+                    <div className="h-10 w-10 flex-shrink-0 md:h-14 md:w-14">
+                      <Avatar
+                        className="size-10 font-semibold text-secondary-800 md:size-auto"
+                        name={patientData.name || "-"}
+                      />
+                    </div>
+                    <div>
+                      <h1 className="text-xl font-bold capitalize text-gray-950">
+                        {patientData.name}
+                      </h1>
+                      <h3 className="text-sm font-medium text-gray-600">
+                        {formatPatientAge(patientData, true)},{"  "}
+                        {patientGender},{"  "} {patientData.blood_group || "-"}
+                      </h3>
+                    </div>
+                  </div>
+                </div>
+                <div className="h-full space-y-2">
+                  <div className="space-y-3 border-b border-dashed text-left text-lg font-semibold text-secondary-900">
+                    <div>
+                      {patientData?.is_active &&
+                        (!patientData?.last_consultation ||
+                          patientData?.last_consultation?.discharge_date) && (
+                          <div>
+                            <ButtonV2
+                              className="w-full"
+                              size="default"
+                              onClick={() =>
+                                navigate(
+                                  `/facility/${patientData?.facility}/patient/${id}/consultation`,
+                                )
+                              }
+                            >
+                              <span className="flex w-full items-center justify-start gap-2">
+                                <CareIcon
+                                  icon="l-chat-bubble-user"
+                                  className="text-xl"
+                                />
+                                {t("add_consultation")}
+                              </span>
+                            </ButtonV2>
+                          </div>
+                        )}
+                    </div>
+                  </div>
+                </div>
               </div>
-            </div>
-            <Button
-              variant="outline_primary"
-              disabled={!patientData.is_active}
-              onClick={() =>
-                navigate(
-                  `/facility/${patientData?.facility}/patient/${id}/consultation`,
-                )
-              }
-            >
-              <CareIcon icon="l-plus" className="mr-2" />
-              <span>{t("create_consultation")}</span>
-            </Button>
-          </Alert>
-        )}
 
-        <section className="lg:flex" data-testid="patient-dashboard">
-          <div className="lg:w-2/3">
-            <div className="flex h-full flex-col justify-between rounded-lg bg-white pb-5 pl-9 pt-11 shadow">
               <div>
-                <div className="flex flex-row gap-4">
-                  <h1 className="flex flex-row pb-3 text-2xl font-bold capitalize">
-                    {patientData.name} - {formatPatientAge(patientData, true)}
-                  </h1>
-                  <div className="ml-auto mr-9 flex flex-wrap gap-3">
-                    {patientData.is_vaccinated && (
-                      <Chip
-                        variant="custom"
-                        className="bg-blue-100 text-blue-800"
-                        startIcon="l-syringe"
-                        text="Vaccinated"
-                      />
-                    )}
-                    {patientData.allow_transfer ? (
-                      <Chip
-                        variant="warning"
-                        startIcon="l-unlock"
-                        text="Transfer Allowed"
-                      />
-                    ) : (
-                      <Chip startIcon="l-lock" text="Transfer Blocked" />
+                <div className="ml-auto mt-4 flex flex-wrap gap-3">
+                  {isPatientMandatoryDataFilled(patientData) &&
+                    (!patientData.last_consultation ||
+                      patientData.last_consultation?.facility !==
+                        patientData.facility ||
+                      (patientData.last_consultation?.discharge_date &&
+                        patientData.is_active)) && (
+                      <span className="relative inline-flex">
+                        <Chip
+                          size="small"
+                          variant="danger"
+                          startIcon="l-notes"
+                          text={t("no_consultation_filed")}
+                        />
+                        <span className="absolute -right-1 -top-1 flex h-3 w-3 items-center justify-center">
+                          <span className="center absolute inline-flex h-4 w-4 animate-ping rounded-full bg-red-400"></span>
+                          <span className="relative inline-flex h-3 w-3 rounded-full bg-red-600"></span>
+                        </span>
+                      </span>
                     )}
-                    {patientData.gender === 2 && (
-                      <>
-                        {patientData.is_antenatal &&
-                          isAntenatal(
-                            patientData.last_menstruation_start_date,
-                          ) && (
-                            <Chip
-                              variant="custom"
-                              className="border-pink-300 bg-pink-100 text-pink-600"
-                              startIcon="l-baby-carriage"
-                              text="Antenatal"
-                            />
-                          )}
-                        {isPostPartum(patientData.date_of_delivery) && (
+                  {patientData.is_vaccinated && (
+                    <Chip
+                      variant="custom"
+                      size="small"
+                      className="bg-blue-100 text-blue-800"
+                      startIcon="l-syringe"
+                      text={t("vaccinated")}
+                    />
+                  )}
+                  {patientData.allow_transfer ? (
+                    <Chip
+                      variant="warning"
+                      size="small"
+                      startIcon="l-unlock"
+                      text={t("transfer_allowed")}
+                    />
+                  ) : (
+                    <Chip
+                      startIcon="l-lock"
+                      size="small"
+                      text={t("transfer_blocked")}
+                    />
+                  )}
+
+                  {patientData.gender === 2 && (
+                    <>
+                      {patientData.is_antenatal &&
+                        isAntenatal(
+                          patientData.last_menstruation_start_date,
+                        ) && (
                           <Chip
                             variant="custom"
+                            size="small"
                             className="border-pink-300 bg-pink-100 text-pink-600"
                             startIcon="l-baby-carriage"
-                            text="Post-partum"
+                            text={t("antenatal")}
                           />
                         )}
-                      </>
-                    )}
-                    {patientData.last_consultation?.is_telemedicine && (
-                      <Chip
-                        variant="alert"
-                        startIcon="l-phone"
-                        text="Telemedicine"
-                      />
-                    )}
-                  </div>
+                      {isPostPartum(patientData.date_of_delivery) && (
+                        <Chip
+                          variant="custom"
+                          size="small"
+                          className="border-pink-300 bg-pink-100 text-pink-600"
+                          startIcon="l-baby-carriage"
+                          text={t("post_partum")}
+                        />
+                      )}
+                    </>
+                  )}
+                  {patientData.last_consultation?.is_telemedicine && (
+                    <Chip
+                      variant="alert"
+                      size="small"
+                      startIcon="l-phone"
+                      text={t("TELEMEDICINE")}
+                    />
+                  )}
+                  {patientData.allergies && (
+                    <Chip
+                      variant="danger"
+                      size="small"
+                      text={`${t("allergies")} ${patientData.allergies.length}`}
+                    />
+                  )}
                 </div>
-                <h3 className="text-base font-medium">
-                  <CareIcon
-                    icon="l-hospital"
-                    className="mr-2 text-emerald-900"
-                  />
-                  {patientData.facility_object?.name || "-"}
-                </h3>
-                <p className="mb-7 mt-4 text-sm font-medium text-zinc-500">
-                  {patientGender} | {patientData.blood_group || "-"} | Born on{" "}
-                  {patientData.date_of_birth
-                    ? formatDate(patientData.date_of_birth)
-                    : patientData.year_of_birth}
-                </p>
               </div>
-              <div className="mb-8 mt-2 grid grid-cols-1 gap-x-4 gap-y-2 md:grid-cols-2 md:gap-y-8 lg:grid-cols-4">
-                <div className="sm:col-span-1">
-                  <div className="text-sm font-semibold leading-5 text-zinc-400">
-                    {t("phone")}
-                  </div>
-                  <div className="mt-1 text-sm leading-5">
-                    <div>
-                      <a
-                        href={`tel:${patientData.phone_number}`}
-                        className="text-sm font-medium text-black hover:text-secondary-500"
-                      >
-                        {patientData.phone_number || "-"}
-                      </a>
-                    </div>
-                    <div>
-                      <a
-                        href={`https://wa.me/${patientData.phone_number?.replace(/\D+/g, "")}`}
-                        target="_blank"
-                        className="text-sm font-normal text-sky-600 hover:text-sky-300"
-                        rel="noreferrer"
-                      >
-                        <CareIcon icon="l-whatsapp" /> Chat on WhatsApp
-                      </a>
-                    </div>
-                  </div>
-                </div>
-                <div className="sm:col-span-1">
-                  <div className="text-sm font-semibold leading-5 text-zinc-400">
-                    {t("patient_registration__contact")}
-                  </div>
-                  <div className="mt-1 text-sm leading-5 text-secondary-900">
-                    <div>
-                      <a
-                        href={`tel:${patientData.emergency_phone_number}`}
-                        className="text-sm font-medium text-black hover:text-secondary-500"
-                      >
-                        {patientData.emergency_phone_number || "-"}
-                      </a>
-                    </div>
-                    <div>
-                      <a
-                        href={`https://wa.me/${patientData.emergency_phone_number?.replace(/\D+/g, "")}`}
-                        target="_blank"
-                        className="text-sm font-normal text-sky-600 hover:text-sky-300"
-                        rel="noreferrer"
-                      >
-                        <CareIcon icon="l-whatsapp" /> Chat on WhatsApp
-                      </a>
-                    </div>
-                  </div>
+
+              <div className="mt-4 flex gap-4">
+                <div>
+                  <p className="text-xs font-normal leading-tight text-gray-600">
+                    {t("facility")}:
+                  </p>
+                  <p className="mt-1 flex text-sm font-semibold leading-tight text-gray-900">
+                    {patientData.facility_object?.name || "-"}
+                  </p>
                 </div>
-                {patientData.date_of_return && (
-                  <div className="sm:col-span-1">
-                    <div className="text-sm font-semibold leading-5 text-zinc-400">
-                      Date of Return
-                    </div>
-                    <div className="mt-1 text-sm font-medium leading-5">
-                      {formatDateTime(patientData.date_of_return)}
-                    </div>
-                  </div>
-                )}
-                {patientData.is_vaccinated && !!patientData.number_of_doses && (
-                  <div className="sm:col-span-1">
-                    <div className="text-sm font-semibold leading-5 text-zinc-400">
-                      Number of vaccine doses
-                    </div>
-                    <div className="mt-1 text-sm font-medium leading-5">
-                      {patientData.number_of_doses}
-                    </div>
-                  </div>
-                )}
-                {patientData.is_vaccinated && patientData.vaccine_name && (
-                  <div className="sm:col-span-1">
-                    <div className="text-sm font-semibold leading-5 text-zinc-400">
-                      Vaccine name
-                    </div>
-                    <div className="mt-1 text-sm font-medium leading-5">
-                      {patientData.vaccine_name}
+
+                {patientData?.last_consultation?.treating_physician_object && (
+                  <div>
+                    <h4 className="text-xs font-normal leading-tight text-gray-600">
+                      {t("treating_doctor")}:
+                    </h4>
+                    <div className="mt-1 flex space-x-2">
+                      <p className="flex text-sm font-semibold leading-tight text-gray-900">
+                        {formatName(
+                          patientData.last_consultation
+                            .treating_physician_object,
+                        )}
+                      </p>
+                      <p className="flex items-end text-xs font-normal leading-tight">
+                        {!!skillsQuery.data?.results?.length &&
+                          formatSkills(skillsQuery.data?.results)}
+                      </p>
                     </div>
                   </div>
                 )}
-                {patientData.is_vaccinated &&
-                  patientData.last_vaccinated_date && (
-                    <div className="sm:col-span-1">
-                      <div className="text-sm font-semibold leading-5 text-zinc-400">
-                        Last Vaccinated on
-                      </div>
-                      <div className="mt-1 text-sm font-medium leading-5">
-                        {formatDateTime(patientData.last_vaccinated_date)}
-                      </div>
-                    </div>
-                  )}
-                {patientData.countries_travelled &&
-                  !!patientData.countries_travelled.length && (
-                    <div className="sm:col-span-1">
-                      <div className="text-sm font-semibold leading-5 text-zinc-400">
-                        Countries travelled
-                      </div>
-                      <div className="mt-1 text-sm font-medium leading-5">
-                        {patientData.countries_travelled.join(", ")}
-                      </div>
-                    </div>
-                  )}
-                {patientData.meta_info?.occupation && (
-                  <div className="sm:col-span-1">
-                    <div className="text-sm font-semibold leading-5 text-zinc-400">
-                      {t("occupation")}
-                    </div>
-                    <div className="mt-1 text-sm font-medium leading-5">
-                      {parseOccupation(patientData.meta_info.occupation)}
+                {patientData?.last_consultation?.assigned_to_object && (
+                  <div>
+                    <p className="text-xs font-normal leading-tight text-gray-600">
+                      {t("assigned_doctor")}:
+                    </p>
+                    <div className="mt-1 flex space-x-2 text-sm font-semibold leading-tight text-gray-900">
+                      <p>
+                        {formatName(
+                          patientData.last_consultation.assigned_to_object,
+                        )}
+                      </p>
+                      {patientData?.last_consultation?.assigned_to_object
+                        .alt_phone_number && (
+                        <a
+                          href={`https://wa.me/${patientData.last_consultation.assigned_to_object.alt_phone_number.replace(/\D+/g, "")}`}
+                          target="_blank"
+                          rel="noreferrer"
+                          className="flex items-center space-x-1 text-xs text-green-500"
+                        >
+                          <CareIcon icon="l-whatsapp" />{" "}
+                          <span>{t("video_call")}</span>
+                        </a>
+                      )}
                     </div>
                   </div>
                 )}
-                {patientData.ration_card_category && (
-                  <div className="sm:col-span-1">
-                    <div className="text-sm font-semibold leading-5 text-zinc-400">
-                      {t("ration_card_category")}
-                    </div>
-                    <div className="mt-1 text-sm font-medium leading-5">
-                      {t(`ration_card__${patientData.ration_card_category}`)}
-                    </div>
+
+                {patientData.assigned_to_object && (
+                  <div>
+                    <p className="text-xs font-normal leading-tight text-gray-600">
+                      {t("assigned_volunteer")}:
+                    </p>
+                    <p className="mt-1 text-sm font-semibold leading-tight text-gray-900">
+                      {formatName(patientData.assigned_to_object)}
+                    </p>
                   </div>
                 )}
-                {patientData.meta_info?.socioeconomic_status && (
-                  <div className="sm:col-span-1">
-                    <div className="text-sm font-semibold leading-5 text-zinc-400">
-                      {t("socioeconomic_status")}
-                    </div>
-                    <div className="mt-1 text-sm font-medium leading-5">
-                      {t(
-                        `SOCIOECONOMIC_STATUS__${patientData.meta_info.socioeconomic_status}`,
-                      )}
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div
+          className="sticky top-0 z-10 mt-4 w-full overflow-x-auto border-b bg-gray-50"
+          role="navigation"
+        >
+          <div className="flex flex-row" role="tablist">
+            {patientTabs.map((tab) => (
+              <Link
+                key={tab.route}
+                href={`/facility/${facilityId}/patient/${id}/${tab.route}`}
+                className={`whitespace-nowrap px-4 py-2 text-sm font-medium ${
+                  page === tab.route
+                    ? "border-b-4 border-green-800 text-green-800 md:border-b-2"
+                    : "rounded-t-lg text-gray-600 hover:bg-gray-100"
+                }`}
+                role="tab"
+                aria-selected={page === tab.route}
+                aria-controls={`${tab.route}-panel`}
+              >
+                {t(tab.route)}
+              </Link>
+            ))}
+          </div>
+        </div>
+
+        <div className="h-full lg:flex">
+          <div className="h-full lg:mr-7 lg:basis-5/6">
+            {Tab && (
+              <Tab
+                facilityId={facilityId || ""}
+                id={id}
+                patientData={patientData}
+              />
+            )}
+          </div>
+          <div className="sticky top-20 mt-8 h-full lg:basis-1/6">
+            <section className="mb-4 space-y-2 md:flex">
+              <div className="mx-3 w-full lg:mx-0">
+                <div className="font-semibold text-secondary-900">
+                  {t("actions")}
+                </div>
+                <div className="mt-2 h-full space-y-2">
+                  <div className="space-y-3 border-b border-dashed text-left text-lg font-semibold text-secondary-900">
+                    <div>
+                      <ButtonV2
+                        className="w-full bg-white font-semibold text-green-800 hover:bg-secondary-200"
+                        size="large"
+                        onClick={() =>
+                          navigate(`/patient/${id}/investigation_reports`)
+                        }
+                      >
+                        <span className="flex w-full items-center justify-start gap-2">
+                          <CareIcon
+                            icon="l-file-search-alt"
+                            className="text-xl"
+                          />
+                          {t("investigations_summary")}
+                        </span>
+                      </ButtonV2>
                     </div>
-                  </div>
-                )}
-                {patientData.meta_info?.domestic_healthcare_support && (
-                  <div className="sm:col-span-1">
-                    <div className="text-sm font-semibold leading-5 text-zinc-400">
-                      {t("domestic_healthcare_support")}
+                    <div>
+                      <ButtonV2
+                        className="w-full bg-white font-semibold text-green-800 hover:bg-secondary-200"
+                        id="upload-patient-files"
+                        size="large"
+                        onClick={() =>
+                          navigate(
+                            `/facility/${patientData?.facility}/patient/${id}/files`,
+                          )
+                        }
+                      >
+                        <span className="flex w-full items-center justify-start gap-2">
+                          <CareIcon icon="l-file-upload" className="text-xl" />
+                          {t("view_update_patient_files")}
+                        </span>
+                      </ButtonV2>
                     </div>
-                    <div className="mt-1 text-sm font-medium leading-5">
-                      {t(
-                        `DOMESTIC_HEALTHCARE_SUPPORT__${patientData.meta_info.domestic_healthcare_support}`,
-                      )}
+
+                    {NonReadOnlyUsers && (
+                      <div>
+                        <ButtonV2
+                          id="assign-volunteer"
+                          onClick={() => setOpenAssignVolunteerDialog(true)}
+                          disabled={false}
+                          authorizeFor={NonReadOnlyUsers}
+                          className="w-full bg-white font-semibold text-green-800 hover:bg-secondary-200"
+                          size="large"
+                        >
+                          <span className="flex w-full items-center justify-start gap-2">
+                            <CareIcon icon="l-users-alt" className="text-lg" />{" "}
+                            {t("assign_to_volunteer")}
+                          </span>
+                        </ButtonV2>
+                      </div>
+                    )}
+
+                    <div>
+                      <ButtonV2
+                        id="patient-allow-transfer"
+                        className="flex w-full flex-row bg-white font-semibold text-green-800 hover:bg-secondary-200"
+                        size="large"
+                        disabled={
+                          !patientData.last_consultation?.id ||
+                          !patientData.is_active
+                        }
+                        onClick={() =>
+                          handlePatientTransfer(!patientData.allow_transfer)
+                        }
+                        authorizeFor={NonReadOnlyUsers}
+                      >
+                        <span className="flex w-full items-center justify-start gap-2">
+                          <CareIcon
+                            icon={
+                              patientData.allow_transfer ? "l-lock" : "l-unlock"
+                            }
+                            className="text-lg"
+                          />
+                          {patientData.allow_transfer
+                            ? t("disable_transfer")
+                            : t("allow_transfer")}
+                        </span>
+                      </ButtonV2>
                     </div>
                   </div>
-                )}
+                </div>
               </div>
-            </div>
-          </div>
-          <div className="h-full px-2 lg:w-1/3">
+            </section>
+            <hr />
             <div
               id="actions"
-              className="flex h-full flex-col justify-between space-y-2 px-2"
+              className="my-2 flex h-full flex-col justify-between space-y-2"
             >
               <div>
                 {patientData.review_time &&
@@ -567,7 +563,7 @@ export const PatientHome = (props: any) => {
                     0 && (
                     <div
                       className={
-                        "mb-6 inline-flex w-full items-center justify-center rounded-md border p-3 text-xs font-semibold leading-4 shadow-sm lg:mt-0 " +
+                        "my-2 inline-flex w-full items-center justify-center rounded-md border p-3 text-xs font-semibold leading-4 shadow-sm lg:mt-0" +
                         (dayjs().isBefore(patientData.review_time)
                           ? " bg-secondary-100"
                           : " bg-red-600/5 p-1 text-sm font-normal text-red-600")
@@ -576,41 +572,37 @@ export const PatientHome = (props: any) => {
                       <CareIcon icon="l-clock" className="text-md mr-2" />
                       <p className="p-1">
                         {(dayjs().isBefore(patientData.review_time)
-                          ? "Review before: "
-                          : "Review Missed: ") +
+                          ? t("review_before")
+                          : t("review_missed")) +
+                          ": " +
                           formatDateTime(patientData.review_time)}
                       </p>
                     </div>
                   )}
-                <div className="my-3 rounded-sm bg-white p-2 text-center shadow md:my-0 md:mb-6">
-                  <div className="flex justify-between">
-                    <div className="w-1/2 border-r-2">
-                      <div className="text-sm font-normal leading-5 text-secondary-500">
-                        Status
-                      </div>
-                      <div className="mt-1 text-xl font-semibold leading-5 text-secondary-900">
-                        {patientData.is_active ? "LIVE" : "DISCHARGED"}
-                      </div>
-                    </div>
-                    <div className="w-1/2">
-                      <div className="text-sm font-normal leading-5 text-secondary-500">
-                        Last Discharged Reason
+
+                <div className="rounded-sm px-2">
+                  <div className="my-1 flex justify-between">
+                    <div>
+                      <div className="text-xs font-normal leading-5 text-gray-600">
+                        {t("last_discharge_reason")}
                       </div>
-                      <div className="mt-1 text-xl font-semibold leading-5 text-secondary-900">
+                      <div className="text-sm font-semibold text-gray-900">
                         {patientData.is_active ? (
                           "-"
                         ) : !patientData.last_consultation
                             ?.new_discharge_reason ? (
                           <span className="text-secondary-800">
                             {patientData?.last_consultation?.suggestion === "OP"
-                              ? "OP file closed"
-                              : "UNKNOWN"}
+                              ? t("op_file_closed")
+                              : t("unknown")}
                           </span>
                         ) : patientData.last_consultation
                             ?.new_discharge_reason ===
                           DISCHARGE_REASONS.find((i) => i.text == "Expired")
                             ?.id ? (
-                          <span className="text-red-600">EXPIRED</span>
+                          <span className="text-red-600 uppercase">
+                            {t("expired")}
+                          </span>
                         ) : (
                           DISCHARGE_REASONS.find(
                             (reason) =>
@@ -623,31 +615,46 @@ export const PatientHome = (props: any) => {
                     </div>
                   </div>
                 </div>
-                <div className="mt-2 flex justify-between rounded-sm bg-white p-2 px-4 text-center shadow">
-                  <div className="w-1/2 border-r-2 pb-1 pr-2">
-                    <div className="text-sm font-normal leading-5 text-secondary-500">
-                      Created
-                    </div>
-                    <div className="mt-1 whitespace-normal text-sm font-semibold leading-5 text-secondary-900">
-                      <div className="flex justify-center text-sm font-semibold">
-                        <RelativeDateUserMention
-                          actionDate={patientData.created_date}
-                          user={patientData.created_by}
-                        />
+                <div className="my-1 rounded-sm p-2">
+                  <div>
+                    <div className="text-xs font-normal text-gray-600">
+                      {t("last_updated_by")}{" "}
+                      <span className="font-semibold text-gray-900">
+                        {patientData.last_edited?.first_name}{" "}
+                        {patientData.last_edited?.last_name}
+                      </span>
+                    </div>
+                    <div className="whitespace-normal text-sm font-semibold text-gray-900">
+                      <div className="tooltip">
+                        <span className={`tooltip-text tooltip`}>
+                          {patientData.modified_date
+                            ? formatDateTime(patientData.modified_date)
+                            : "--:--"}
+                        </span>
+                        {patientData.modified_date
+                          ? relativeDate(patientData.modified_date)
+                          : "--:--"}
                       </div>
                     </div>
                   </div>
-                  <div className="w-1/2 pb-1 pl-2">
-                    <div className="text-sm font-normal leading-5 text-secondary-500">
-                      Last Edited
-                    </div>
-                    <div className="mt-1 whitespace-normal text-sm leading-5 text-secondary-900">
-                      <div className="flex justify-center whitespace-normal text-sm font-semibold">
-                        <RelativeDateUserMention
-                          actionDate={patientData.modified_date}
-                          user={patientData.last_edited}
-                          tooltipPosition="left"
-                        />
+                  <div className="mt-4">
+                    <div className="text-xs font-normal leading-5 text-gray-600">
+                      {t("patient_profile_created_by")}{" "}
+                      <span className="font-semibold text-gray-900">
+                        {patientData.created_by?.first_name}{" "}
+                        {patientData.created_by?.last_name}
+                      </span>
+                    </div>
+                    <div className="whitespace-normal text-sm font-semibold text-gray-900">
+                      <div className="tooltip">
+                        <span className={`tooltip-text tooltip`}>
+                          {patientData.created_date
+                            ? formatDateTime(patientData.created_date)
+                            : "--:--"}
+                        </span>
+                        {patientData.modified_date
+                          ? relativeDate(patientData.modified_date)
+                          : "--:--"}
                       </div>
                     </div>
                   </div>
@@ -659,784 +666,40 @@ export const PatientHome = (props: any) => {
                   <div>
                     <ButtonV2
                       id="death-report"
-                      className="mt-6 w-full"
+                      className="my-2 w-full"
                       name="death_report"
                       onClick={() => navigate(`/death_report/${id}`)}
                     >
                       <CareIcon icon="l-file-download" className="text-lg" />
-                      Death Report
+                      {t("death_report")}
                     </ButtonV2>
                   </div>
                 )}
-                <div>
-                  <ButtonV2
-                    id="update-patient-details"
-                    className="mt-4 w-full"
-                    disabled={!patientData.is_active}
-                    authorizeFor={NonReadOnlyUsers}
-                    onClick={() => {
-                      const showAllFacilityUsers = [
-                        "DistrictAdmin",
-                        "StateAdmin",
-                      ];
-                      if (
-                        !showAllFacilityUsers.includes(authUser.user_type) &&
-                        authUser.home_facility_object?.id !==
-                          patientData.facility
-                      ) {
-                        Notification.Error({
-                          msg: "Oops! Non-Home facility users don't have permission to perform this action.",
-                        });
-                      } else {
-                        navigate(
-                          `/facility/${patientData?.facility}/patient/${id}/update`,
-                        );
-                      }
-                    }}
-                  >
-                    <CareIcon icon="l-edit-alt" className="text-lg" />
-                    Update Details
-                  </ButtonV2>
-                </div>
-                <div>
-                  <ButtonV2
-                    id="patient-allow-transfer"
-                    className="mt-4 w-full"
-                    disabled={
-                      !patientData.last_consultation?.id ||
-                      !patientData.is_active
-                    }
-                    onClick={() =>
-                      handlePatientTransfer(!patientData.allow_transfer)
-                    }
-                    authorizeFor={NonReadOnlyUsers}
-                  >
-                    <CareIcon
-                      icon={patientData.allow_transfer ? "l-lock" : "l-unlock"}
-                      className="text-lg"
-                    />
-                    {patientData.allow_transfer
-                      ? "Disable Transfer"
-                      : "Allow Transfer"}
-                  </ButtonV2>
-                </div>
-              </div>
-            </div>
-          </div>
-        </section>
-        <section className="mt-7 h-full space-y-2 rounded-lg bg-white p-4 text-secondary-100 shadow">
-          <div
-            className="flex cursor-pointer justify-between border-b border-dashed pb-2 text-left text-lg font-semibold text-secondary-900"
-            onClick={() => {
-              setShowShifts(!showShifts);
-              setIsShiftClicked(true);
-            }}
-          >
-            <div>{t("shifting")}</div>
-            {showShifts ? (
-              <CareIcon icon="l-angle-up" className="text-2xl" />
-            ) : (
-              <CareIcon icon="l-angle-down" className="text-2xl" />
-            )}
-          </div>
-          <div
-            className={
-              showShifts
-                ? activeShiftingData?.count || 0
-                  ? "grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-3"
-                  : ""
-                : "hidden"
-            }
-          >
-            {activeShiftingData?.count ? (
-              activeShiftingData.results.map((shift: ShiftingModel) => (
-                <div key={`shift_${shift.id}`} className="mx-2">
-                  <div className="h-full overflow-hidden rounded-lg bg-white shadow">
-                    <div className="flex h-full flex-col justify-between p-4">
-                      <div>
-                        <div className="mt-1 flex justify-between">
-                          <div>
-                            {shift.emergency && (
-                              <span className="inline-block shrink-0 rounded-full bg-red-100 px-2 py-0.5 text-xs font-medium leading-4 text-red-800">
-                                Emergency
-                              </span>
-                            )}
-                          </div>
-                        </div>
-                        <dl className="grid grid-cols-1 gap-x-1 gap-y-2 sm:grid-cols-1">
-                          <div className="sm:col-span-1">
-                            <dt
-                              title="Shifting status"
-                              className="flex items-center text-sm font-semibold leading-5 text-zinc-400"
-                            >
-                              <CareIcon
-                                icon="l-truck"
-                                className="mr-2 text-lg"
-                              />
-                              <dd className="text-sm font-bold leading-5 text-secondary-900">
-                                {shift.status}
-                              </dd>
-                            </dt>
-                          </div>
-                          <div className="sm:col-span-1">
-                            <dt
-                              title=" Origin facility"
-                              className="flex items-center text-sm font-semibold leading-5 text-zinc-400"
-                            >
-                              <CareIcon
-                                icon="l-plane-fly"
-                                className="mr-2 text-lg"
-                              />
-                              <dd className="text-sm font-bold leading-5 text-secondary-900">
-                                {(shift.origin_facility_object || {})?.name}
-                              </dd>
-                            </dt>
-                          </div>
-                          <div className="sm:col-span-1">
-                            <dt
-                              title="Shifting approving facility"
-                              className="flex items-center text-sm font-semibold leading-5 text-zinc-400"
-                            >
-                              <CareIcon
-                                icon="l-user-check"
-                                className="mr-2 text-lg"
-                              />
-                              <dd className="text-sm font-bold leading-5 text-secondary-900">
-                                {
-                                  (
-                                    shift.shifting_approving_facility_object ||
-                                    {}
-                                  )?.name
-                                }
-                              </dd>
-                            </dt>
-                          </div>
-                          <div className="sm:col-span-1">
-                            <dt
-                              title=" Assigned facility"
-                              className="flex items-center text-sm font-semibold leading-5 text-zinc-400"
-                            >
-                              <CareIcon
-                                icon="l-plane-arrival"
-                                className="mr-2 text-lg"
-                              />
-                              <dd className="text-sm font-bold leading-5 text-secondary-900">
-                                {(shift.assigned_facility_object || {})?.name ||
-                                  "Yet to be decided"}
-                              </dd>
-                            </dt>
-                          </div>
-
-                          <div className="sm:col-span-1">
-                            <dt
-                              title="  Last Modified"
-                              className={
-                                "flex items-center text-sm font-medium leading-5 " +
-                                (dayjs()
-                                  .subtract(2, "hours")
-                                  .isBefore(shift.modified_date)
-                                  ? "text-secondary-900"
-                                  : "rounded p-1 font-normal text-red-600")
-                              }
-                            >
-                              <CareIcon
-                                icon="l-stopwatch"
-                                className="mr-2 text-lg"
-                              />
-                              <dd className="text-sm font-bold leading-5">
-                                {formatDateTime(shift.modified_date) || "--"}
-                              </dd>
-                            </dt>
-                          </div>
-                        </dl>
-                      </div>
-
-                      <div className="mt-2 flex">
-                        <ButtonV2
-                          className="mr-2 w-full bg-white hover:bg-secondary-100"
-                          variant="secondary"
-                          onClick={() =>
-                            navigate(`/shifting/${shift.external_id}`)
-                          }
-                        >
-                          <CareIcon icon="l-eye" className="mr-2 text-lg" />
-                          All Details
-                        </ButtonV2>
-                      </div>
-                      {shift.status === "COMPLETED" &&
-                        shift.assigned_facility && (
-                          <div className="mt-2">
-                            <ButtonV2
-                              size="small"
-                              className="w-full"
-                              disabled={
-                                !shift.patient_object.allow_transfer ||
-                                !(
-                                  ["DistrictAdmin", "StateAdmin"].includes(
-                                    authUser.user_type,
-                                  ) ||
-                                  authUser.home_facility_object?.id ===
-                                    shift.assigned_facility
-                                )
-                              }
-                              onClick={() => setModalFor(shift)}
-                            >
-                              {t("transfer_to_receiving_facility")}
-                            </ButtonV2>
-                            <ConfirmDialog
-                              title="Confirm Transfer Complete"
-                              description="Are you sure you want to mark this transfer as complete? The Origin facility will no longer have access to this patient"
-                              show={!!modalFor}
-                              action="Confirm"
-                              onClose={() => setModalFor(undefined)}
-                              onConfirm={() => handleTransferComplete(shift)}
-                            />
-                          </div>
-                        )}
-                    </div>
-                  </div>
-                </div>
-              ))
-            ) : (
-              <div className="text-center text-secondary-500">
-                {isShiftDataLoading ? "Loading..." : "No Shifting Records!"}
-              </div>
-            )}
-          </div>
-        </section>
-
-        <section
-          className="mt-5 grid grid-cols-1 gap-6 lg:grid-cols-3"
-          data-testid="patient-details"
-        >
-          <div className="w-full">
-            <div className="h-full space-y-2 rounded-lg bg-white p-7 shadow">
-              <div className="border-b border-dashed pb-2 text-xl font-bold text-secondary-900">
-                {t("location")}
-              </div>
-              <div className="grid grid-cols-1 gap-2 md:grid-cols-2">
-                <div className="sm:col-span-1">
-                  <div className="text-sm font-semibold leading-5 text-zinc-400">
-                    {t("address")}
-                  </div>
-                  <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
-                    {patientData.address || "-"}
-                  </div>
-                </div>
-                <div className="sm:col-span-1">
-                  <div className="text-sm font-semibold leading-5 text-zinc-400">
-                    {t("district")}
-                  </div>
-                  <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
-                    {patientData.district_object?.name || "-"}
-                  </div>
-                </div>
-                <div className="sm:col-span-1">
-                  <div className="text-sm font-semibold leading-5 text-zinc-400">
-                    Village
-                  </div>
-                  <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
-                    {patientData.village || "-"}
-                  </div>
-                </div>
-                <div className="sm:col-span-1">
-                  <div className="text-sm font-semibold leading-5 text-zinc-400">
-                    {t("ward")}
-                  </div>
-                  <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
-                    {(patientData.ward_object &&
-                      patientData.ward_object.number +
-                        ", " +
-                        patientData.ward_object.name) ||
-                      "-"}
-                  </div>
-                </div>
-                <div className="sm:col-span-1">
-                  <div className="text-sm font-semibold leading-5 text-zinc-400">
-                    State, Country - Pincode
-                  </div>
-                  <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
-                    {patientData?.state_object?.name},
-                    {patientData.nationality || "-"} - {patientData.pincode}
-                  </div>
-                </div>
-                <div className="sm:col-span-1">
-                  <div className="text-sm font-semibold leading-5 text-zinc-400">
-                    {t("local_body")}
-                  </div>
-                  <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
-                    {patientData.local_body_object?.name || "-"}
-                  </div>
-                </div>
               </div>
             </div>
           </div>
-          <div className="w-full">
-            <div className="h-full space-y-2 rounded-lg bg-white p-7 shadow">
-              <div className="border-b border-dashed pb-2 text-xl font-bold text-secondary-900">
-                Medical
-              </div>
-              {!patientData.present_health &&
-                !patientData.allergies &&
-                !patientData.ongoing_medication &&
-                !(patientData.gender === 2 && patientData.is_antenatal) &&
-                !patientData.medical_history?.some(
-                  (history) => history.disease !== "NO",
-                ) && (
-                  <div className="flex w-full items-center justify-center text-xl font-bold text-secondary-500">
-                    No Medical History Available
-                  </div>
-                )}
-              <div className="mt-2 grid grid-cols-1 gap-x-4 gap-y-2 sm:grid-cols-3 md:gap-y-8">
-                {patientData.present_health && (
-                  <div className="sm:col-span-1">
-                    <div className="text-sm font-semibold leading-5 text-zinc-400">
-                      Present Health
-                    </div>
-                    <div
-                      data-testid="patient-present-health"
-                      className="mt-1 overflow-x-scroll whitespace-normal break-words text-sm font-medium leading-5"
-                    >
-                      {patientData.present_health}
-                    </div>
-                  </div>
-                )}
-                {patientData.ongoing_medication && (
-                  <div className="sm:col-span-1">
-                    <div className="text-sm font-semibold leading-5 text-zinc-400">
-                      Ongoing Medications
-                    </div>
-                    <div
-                      data-testid="patient-ongoing-medication"
-                      className="mt-1 overflow-x-scroll whitespace-normal break-words text-sm font-medium leading-5"
-                    >
-                      {patientData.ongoing_medication}
-                    </div>
-                  </div>
-                )}
-                {patientData.allergies && (
-                  <div className="sm:col-span-1">
-                    <div className="text-sm font-semibold leading-5 text-zinc-400">
-                      Allergies
-                    </div>
-                    <div
-                      data-testid="patient-allergies"
-                      className="mt-1 overflow-x-scroll whitespace-normal break-words text-sm font-medium leading-5"
-                    >
-                      {patientData.allergies}
-                    </div>
-                  </div>
-                )}
-                {patientData.gender === 2 && patientData.is_antenatal && (
-                  <div className="sm:col-span-1">
-                    <div className="text-sm font-semibold leading-5 text-zinc-400">
-                      Is pregnant
-                    </div>
-                    <div className="mt-1 whitespace-normal break-words text-sm font-medium leading-5">
-                      Yes
-                    </div>
-                  </div>
-                )}
-                {patientMedHis}
-              </div>
-            </div>
-          </div>
-
-          <InsuranceDetialsCard
-            data={insuranceDetials?.results[0]}
-            showViewAllDetails={
-              insuranceDetials?.count !== undefined &&
-              insuranceDetials?.count > 1
-            }
-          />
-        </section>
-        <section className="mt-4 space-y-2 md:flex">
-          <div className="hidden lg:block">
-            <div className="mt-4 grid grid-cols-6 gap-5 xl:grid-cols-7">
-              <div
-                className="w-full"
-                onClick={() => navigate(`/patient/${id}/investigation_reports`)}
-              >
-                <div className="h-full space-y-2 rounded-lg border border-green-700 bg-white p-4 shadow hover:cursor-pointer hover:bg-secondary-200">
-                  <div className="text-center text-green-700">
-                    <span>
-                      <CareIcon icon="l-file-search-alt" className="text-5xl" />
-                    </span>
-                  </div>
-                  <div>
-                    <p className="text-center text-sm font-medium">
-                      Investigations Summary
-                    </p>
-                  </div>
-                </div>
-              </div>
-              <div
-                className="w-full"
-                onClick={() =>
-                  navigate(
-                    `/facility/${patientData?.facility}/patient/${id}/files/`,
-                  )
-                }
-              >
-                <div className="h-full space-y-2 rounded-lg border border-green-700 bg-white p-4 shadow hover:cursor-pointer hover:bg-secondary-200">
-                  <div className="text-center text-green-700">
-                    <span>
-                      <CareIcon icon="l-file-upload" className="text-5xl" />
-                    </span>
-                  </div>
-                  <div>
-                    <p className="text-center text-sm font-medium">
-                      View/Upload Patient Files
-                    </p>
-                  </div>
-                </div>
-              </div>
-              <div
-                className="w-full"
-                onClick={() => {
-                  if (!isPatientInactive(patientData, facilityId)) {
-                    navigate(`/facility/${facilityId}/patient/${id}/shift/new`);
-                  }
-                }}
-              >
-                <div
-                  className={`h-full space-y-2 rounded-lg border bg-white p-4 shadow ${
-                    isPatientInactive(patientData, facilityId)
-                      ? "border-secondary-700 hover:cursor-not-allowed"
-                      : "border-green-700 hover:cursor-pointer hover:bg-secondary-200"
-                  } `}
-                >
-                  <div
-                    className={`${
-                      isPatientInactive(patientData, facilityId)
-                        ? "text-secondary-700"
-                        : "text-green-700"
-                    } text-center`}
-                  >
-                    <span>
-                      <CareIcon icon="l-ambulance" className="text-5xl" />
-                    </span>
-                  </div>
-
-                  <div>
-                    <p
-                      className={`${
-                        isPatientInactive(patientData, facilityId) &&
-                        "text-secondary-700"
-                      } text-center text-sm font-medium`}
-                    >
-                      Shift Patient
-                    </p>
-                  </div>
-                </div>
-              </div>
-              <div
-                className="w-full"
-                onClick={() => {
-                  if (!isPatientInactive(patientData, facilityId)) {
-                    navigate(
-                      `/facility/${patientData?.facility}/patient/${id}/sample-test`,
-                    );
-                  }
-                }}
-              >
-                <div
-                  className={classNames(
-                    "h-full space-y-2 rounded-lg border bg-white p-4 shadow",
-                    isPatientInactive(patientData, facilityId)
-                      ? "border-secondary-700 hover:cursor-not-allowed"
-                      : "border-green-700 hover:cursor-pointer hover:bg-secondary-200",
-                  )}
-                >
-                  <div
-                    className={`${
-                      isPatientInactive(patientData, facilityId)
-                        ? "text-secondary-700"
-                        : "text-green-700"
-                    } text-center`}
-                  >
-                    <span>
-                      <CareIcon icon="l-medkit" className="text-5xl" />
-                    </span>
-                  </div>
-                  <div>
-                    <p
-                      className={`${
-                        isPatientInactive(patientData, facilityId) &&
-                        "text-secondary-700"
-                      } text-center text-sm font-medium`}
-                    >
-                      Request Sample Test
-                    </p>
-                  </div>
-                </div>
-              </div>
-              <div
-                className="w-full"
-                onClick={() =>
-                  navigate(
-                    `/facility/${patientData?.facility}/patient/${id}/notes`,
-                  )
-                }
-              >
-                <div className="h-full space-y-2 rounded-lg border border-green-700 bg-white p-4 shadow hover:cursor-pointer hover:bg-secondary-200">
-                  <div className="text-center text-green-700">
-                    <span>
-                      <CareIcon icon="l-clipboard-notes" className="text-5xl" />
-                    </span>
-                  </div>
-                  <div>
-                    <p className="text-center text-sm font-medium">
-                      View Patient Notes
-                    </p>
-                  </div>
-                </div>
-              </div>
-              <div
-                className="w-full"
-                onClick={() => {
-                  if (!isPatientInactive(patientData, facilityId)) {
-                    setOpenAssignVolunteerDialog(true);
-                  }
-                }}
-              >
-                <div
-                  className={classNames(
-                    "h-full space-y-2 rounded-lg border bg-white p-4 shadow",
-                    isPatientInactive(patientData, facilityId)
-                      ? "border-secondary-700 hover:cursor-not-allowed"
-                      : "border-green-700 hover:cursor-pointer hover:bg-secondary-200",
-                  )}
-                >
-                  <div
-                    className={classNames(
-                      "text-center",
-                      isPatientInactive(patientData, facilityId)
-                        ? "text-secondary-700"
-                        : "text-green-700",
-                    )}
-                  >
-                    <span>
-                      <CareIcon icon="l-users-alt" className="text-5xl" />
-                    </span>
-                  </div>
-                  <div>
-                    <p
-                      className={classNames(
-                        "text-center text-sm font-medium",
-                        isPatientInactive(patientData, facilityId)
-                          ? "text-secondary-700"
-                          : "text-black",
-                      )}
-                    >
-                      Assign to a volunteer
-                    </p>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-          <div className="mx-2 w-full lg:hidden">
-            <div className="h-full space-y-2 rounded-lg bg-white p-4 shadow">
-              <div className="space-y-2 border-b border-dashed text-left text-lg font-semibold text-secondary-900">
-                <div>
-                  <ButtonV2
-                    className="w-full"
-                    onClick={() =>
-                      navigate(`/patient/${id}/investigation_reports`)
-                    }
-                  >
-                    <span className="flex w-full items-center justify-start gap-2">
-                      <CareIcon icon="l-file-search-alt" className="text-xl" />
-                      Investigations Summary
-                    </span>
-                  </ButtonV2>
-                </div>
-                <div>
-                  <ButtonV2
-                    className="w-full"
-                    id="upload-patient-files"
-                    onClick={() =>
-                      navigate(
-                        `/facility/${patientData?.facility}/patient/${id}/files`,
-                      )
-                    }
-                  >
-                    <span className="flex w-full items-center justify-start gap-2">
-                      <CareIcon icon="l-file-upload" className="text-xl" />
-                      View/Upload Patient Files
-                    </span>
-                  </ButtonV2>
-                </div>
-                <div>
-                  <ButtonV2
-                    className="w-full"
-                    disabled={isPatientInactive(patientData, facilityId)}
-                    onClick={() =>
-                      navigate(
-                        `/facility/${facilityId}/patient/${id}/shift/new`,
-                      )
-                    }
-                    authorizeFor={NonReadOnlyUsers}
-                  >
-                    <span className="flex w-full items-center justify-start gap-2">
-                      <CareIcon icon="l-ambulance" className="text-xl" />
-                      Shift Patient
-                    </span>
-                  </ButtonV2>
-                </div>
-                <div>
-                  <ButtonV2
-                    className="w-full"
-                    disabled={isPatientInactive(patientData, facilityId)}
-                    onClick={() =>
-                      navigate(
-                        `/facility/${patientData?.facility}/patient/${id}/sample-test`,
-                      )
-                    }
-                    authorizeFor={NonReadOnlyUsers}
-                    id="sample-request-btn"
-                  >
-                    <span className="flex w-full items-center justify-start gap-2">
-                      <CareIcon icon="l-medkit" className="text-xl" />
-                      Request Sample Test
-                    </span>
-                  </ButtonV2>
-                </div>
-                <div>
-                  <ButtonV2
-                    className="w-full"
-                    onClick={() =>
-                      navigate(
-                        `/facility/${patientData?.facility}/patient/${id}/notes`,
-                      )
-                    }
-                  >
-                    <span className="flex w-full items-center justify-start gap-2">
-                      <CareIcon icon="l-clipboard-notes" className="text-xl" />
-                      View Patient Notes
-                    </span>
-                  </ButtonV2>
-                </div>
-                <div>
-                  <ButtonV2
-                    className="w-full"
-                    onClick={() => setOpenAssignVolunteerDialog(true)}
-                    disabled={false}
-                    authorizeFor={NonReadOnlyUsers}
-                  >
-                    <span className="flex w-full items-center justify-start gap-2">
-                      <CareIcon icon="l-users-alt" className="text-xl" />
-                      Assign to a volunteer
-                    </span>
-                  </ButtonV2>
-                </div>
-              </div>
-            </div>
-          </div>
-        </section>
+        </div>
       </div>
 
       <ConfirmDialog
         className="w-full justify-between"
-        title={`Assign a volunteer to ${patientData.name}`}
+        title={t("assign_a_volunteer_to", { name: patientData.name })}
         show={openAssignVolunteerDialog}
         onClose={() => setOpenAssignVolunteerDialog(false)}
         description={
           <div className="mt-6">
             <UserAutocomplete
-              value={assignedVolunteerObject}
-              onChange={handleVolunteerSelect}
+              value={assignedVolunteer as UserBareMinimum}
+              onChange={(user) => setAssignedVolunteer(user.value)}
               userType={"Volunteer"}
               name={"assign_volunteer"}
               error={errors.assignedVolunteer}
             />
           </div>
         }
-        action="Assign"
+        action={t("assign")}
         onConfirm={handleAssignedVolunteer}
       />
-
-      <div>
-        <h2 className="ml-0 mt-9 text-2xl font-semibold leading-tight">
-          Consultation History
-        </h2>
-
-        <PaginatedList
-          route={routes.getConsultationList}
-          query={{ patient: id }}
-          perPage={5}
-        >
-          {(_) => (
-            <div>
-              <PaginatedList.WhenLoading>
-                <CircularProgress />
-              </PaginatedList.WhenLoading>
-              <PaginatedList.WhenEmpty className="py-2">
-                <div className="h-full space-y-2 rounded-lg bg-white p-7 shadow">
-                  <div className="flex w-full items-center justify-center text-xl font-bold text-secondary-500">
-                    No Consultation History Available
-                  </div>
-                </div>
-              </PaginatedList.WhenEmpty>
-              <PaginatedList.Items<ConsultationModel>>
-                {(item) => (
-                  <ConsultationCard
-                    itemData={item}
-                    isLastConsultation={
-                      item.id == patientData.last_consultation?.id
-                    }
-                    refetch={refetch}
-                  />
-                )}
-              </PaginatedList.Items>
-              <div className="flex w-full items-center justify-center">
-                <PaginatedList.Paginator hideIfSinglePage />
-              </div>
-            </div>
-          )}
-        </PaginatedList>
-      </div>
-
-      <div>
-        <h2 className="my-4 ml-0 text-2xl font-semibold leading-tight">
-          Sample Test History
-        </h2>
-        <PaginatedList
-          route={routes.sampleTestList}
-          pathParams={{ patientId: id }}
-          perPage={5}
-        >
-          {(_, query) => (
-            <div>
-              <PaginatedList.WhenLoading>
-                <CircularProgress />
-              </PaginatedList.WhenLoading>
-              <PaginatedList.WhenEmpty className="py-2">
-                <div className="h-full space-y-2 rounded-lg bg-white p-7 shadow">
-                  <div className="flex w-full items-center justify-center text-xl font-bold text-secondary-500">
-                    No Sample Test History Available
-                  </div>
-                </div>
-              </PaginatedList.WhenEmpty>
-              <PaginatedList.Items<SampleTestModel>>
-                {(item) => (
-                  <SampleTestCard
-                    refetch={query.refetch}
-                    itemData={item}
-                    handleApproval={confirmApproval}
-                    facilityId={facilityId}
-                    patientId={id}
-                  />
-                )}
-              </PaginatedList.Items>
-              <div className="flex w-full items-center justify-center">
-                <PaginatedList.Paginator hideIfSinglePage />
-              </div>
-            </div>
-          )}
-        </PaginatedList>
-      </div>
     </Page>
   );
 };
diff --git a/src/components/Patient/PatientInfoCard.tsx b/src/components/Patient/PatientInfoCard.tsx
index e415d928a0d..486e8b103fd 100644
--- a/src/components/Patient/PatientInfoCard.tsx
+++ b/src/components/Patient/PatientInfoCard.tsx
@@ -538,7 +538,7 @@ export default function PatientInfoCard(props: PatientInfoCardProps) {
           )}
           {!!consultation?.discharge_date && (
             <div className="flex min-w-max flex-col items-center justify-center">
-              <div className="text-sm font-normal leading-5 text-secondary-500">
+              <div className="text-sm font-normal leading-5 text-gray-600">
                 Discharge Reason
               </div>
               <div className="mt-[6px] text-xl font-semibold leading-5 text-secondary-900">
diff --git a/src/components/Patient/PatientRegister.tsx b/src/components/Patient/PatientRegister.tsx
index 35d93214385..5828517adf9 100644
--- a/src/components/Patient/PatientRegister.tsx
+++ b/src/components/Patient/PatientRegister.tsx
@@ -2,7 +2,7 @@ import careConfig from "@careConfig";
 import { startCase, toLower } from "lodash-es";
 import { debounce } from "lodash-es";
 import { navigate } from "raviger";
-import { useCallback, useReducer, useRef, useState } from "react";
+import { useCallback, useEffect, useReducer, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
 
 import CareIcon from "@/CAREUI/icons/CareIcon";
@@ -232,6 +232,25 @@ export const PatientRegister = (props: PatientRegisterProps) => {
   const headerText = !id ? "Add Details of Patient" : "Update Patient Details";
   const buttonText = !id ? "Add Patient" : "Save Details";
 
+  useEffect(() => {
+    const getQueryParams = () => {
+      const params = new URLSearchParams(window.location.search);
+      return {
+        section: params.get("section"),
+      };
+    };
+
+    const { section } = getQueryParams();
+    if (section) {
+      setTimeout(() => {
+        const element = document.getElementById(section);
+        if (element) {
+          element.scrollIntoView({ behavior: "smooth" });
+        }
+      }, 2000);
+    }
+  }, []);
+
   const fetchDistricts = useCallback(async (id: number) => {
     if (id > 0) {
       setIsDistrictLoading(true);
@@ -1402,7 +1421,7 @@ export const PatientRegister = (props: PatientRegisterProps) => {
                 </div>
               </div>
               {field("nationality").value === "India" && (
-                <div className="mb-8 rounded border p-4">
+                <div id="social-profile" className="mb-8 rounded border p-4">
                   <AccordionV2
                     className="mt-2 shadow-none md:mt-0 lg:mt-0"
                     expandIcon={
@@ -1480,7 +1499,7 @@ export const PatientRegister = (props: PatientRegisterProps) => {
                   </AccordionV2>
                 </div>
               )}
-              <div className="mb-8 rounded border p-4">
+              <div id="covid-details" className="mb-8 rounded border p-4">
                 <AccordionV2
                   className="mt-2 shadow-none md:mt-0 lg:mt-0"
                   expandIcon={
@@ -1601,7 +1620,10 @@ export const PatientRegister = (props: PatientRegisterProps) => {
                   </div>
                 </AccordionV2>
               </div>
-              <div className="mb-8 overflow-visible rounded border p-4">
+              <div
+                id="medical-history"
+                className="mb-8 overflow-visible rounded border p-4"
+              >
                 <h1 className="mb-4 text-left text-xl font-bold text-purple-500">
                   Medical History
                 </h1>
@@ -1661,7 +1683,10 @@ export const PatientRegister = (props: PatientRegisterProps) => {
                   </div>
                 </div>
               </div>
-              <div className="flex w-full flex-col gap-4 rounded border bg-white p-4">
+              <div
+                id="insurance-details"
+                className="flex w-full flex-col gap-4 rounded border bg-white p-4"
+              >
                 <div className="flex w-full flex-col items-center justify-between gap-4 sm:flex-row">
                   <h1 className="text-left text-xl font-bold text-purple-500">
                     Insurance Details
diff --git a/src/components/Patient/SampleTestCard.tsx b/src/components/Patient/SampleTestCard.tsx
index a0303705eb7..c22155c494e 100644
--- a/src/components/Patient/SampleTestCard.tsx
+++ b/src/components/Patient/SampleTestCard.tsx
@@ -16,8 +16,8 @@ import request from "@/Utils/request/request";
 import { formatDateTime } from "@/Utils/utils";
 
 interface SampleDetailsProps {
-  facilityId: number;
-  patientId: number;
+  facilityId: string;
+  patientId: string;
   itemData: SampleTestModel;
   refetch: () => void;
   handleApproval: (status: number, sample: SampleTestModel) => void;
diff --git a/src/components/Patient/models.tsx b/src/components/Patient/models.tsx
index 15063be4e9c..85614e707d5 100644
--- a/src/components/Patient/models.tsx
+++ b/src/components/Patient/models.tsx
@@ -136,7 +136,7 @@ export interface PatientModel {
   is_declared_positive?: boolean;
   last_edited?: UserBareMinimum;
   created_by?: UserBareMinimum;
-  assigned_to?: { first_name?: string; username?: string; last_name?: string };
+  assigned_to?: number | null;
   assigned_to_object?: AssignedToObjectModel;
   occupation?: Occupation;
   meta_info?: PatientMeta;
diff --git a/src/components/Shifting/ShiftingBlock.tsx b/src/components/Shifting/ShiftingBlock.tsx
index 09bbcfb3b9f..db173b2c6d8 100644
--- a/src/components/Shifting/ShiftingBlock.tsx
+++ b/src/components/Shifting/ShiftingBlock.tsx
@@ -13,7 +13,7 @@ import { classNames, formatDateTime, formatName } from "@/Utils/utils";
 
 export default function ShiftingBlock(props: {
   shift: ShiftingModel;
-  onTransfer: () => unknown;
+  onTransfer?: () => unknown;
 }) {
   const { shift, onTransfer } = props;
   const { t } = useTranslation();
@@ -123,25 +123,28 @@ export default function ShiftingBlock(props: {
           <CareIcon icon="l-eye" className="text-lg" /> {t("all_details")}
         </Link>
 
-        {shift.status === "COMPLETED" && shift.assigned_facility && (
-          <>
-            <button
-              className="flex w-full items-center justify-center gap-2 rounded-lg border border-secondary-300 bg-secondary-200 p-2 text-sm font-semibold text-inherit transition-all hover:bg-secondary-300"
-              disabled={
-                !shift.patient_object.allow_transfer ||
-                !(
-                  ["DistrictAdmin", "StateAdmin"].includes(
-                    authUser.user_type,
-                  ) ||
-                  authUser.home_facility_object?.id === shift.assigned_facility
-                )
-              }
-              onClick={onTransfer}
-            >
-              {t("transfer_to_receiving_facility")}
-            </button>
-          </>
-        )}
+        {shift.status === "COMPLETED" &&
+          shift.assigned_facility &&
+          onTransfer && (
+            <>
+              <button
+                className="flex w-full items-center justify-center gap-2 rounded-lg border border-secondary-300 bg-secondary-200 p-2 text-sm font-semibold text-inherit transition-all hover:bg-secondary-300"
+                disabled={
+                  !shift.patient_object.allow_transfer ||
+                  !(
+                    ["DistrictAdmin", "StateAdmin"].includes(
+                      authUser.user_type,
+                    ) ||
+                    authUser.home_facility_object?.id ===
+                      shift.assigned_facility
+                  )
+                }
+                onClick={onTransfer}
+              >
+                {t("transfer_to_receiving_facility")}
+              </button>
+            </>
+          )}
       </div>
     </div>
   );
diff --git a/src/components/Shifting/ShiftingList.tsx b/src/components/Shifting/ShiftingList.tsx
index db7ec691f79..7161ea29441 100644
--- a/src/components/Shifting/ShiftingList.tsx
+++ b/src/components/Shifting/ShiftingList.tsx
@@ -1,29 +1,25 @@
-import careConfig from "@careConfig";
 import { navigate } from "raviger";
-import { useState } from "react";
 import { useTranslation } from "react-i18next";
 
 import CareIcon from "@/CAREUI/icons/CareIcon";
 import { AdvancedFilterButton } from "@/CAREUI/interactive/FiltersSlideover";
 
 import ButtonV2 from "@/components/Common/ButtonV2";
-import ConfirmDialog from "@/components/Common/ConfirmDialog";
 import { ExportButton } from "@/components/Common/Export";
 import Loading from "@/components/Common/Loading";
 import Page from "@/components/Common/Page";
-import { ShiftingModel } from "@/components/Facility/models";
 import SearchInput from "@/components/Form/SearchInput";
 import BadgesList from "@/components/Shifting/ShiftingBadges";
 import { formatFilter } from "@/components/Shifting/ShiftingCommons";
 import ListFilter from "@/components/Shifting/ShiftingFilters";
 
-import useAuthUser from "@/hooks/useAuthUser";
 import useFilters from "@/hooks/useFilters";
 
 import routes from "@/Utils/request/api";
 import request from "@/Utils/request/request";
 import useQuery from "@/Utils/request/useQuery";
-import { formatDateTime } from "@/Utils/utils";
+
+import ShiftingTable from "./ShiftingTable";
 
 export default function ListView() {
   const {
@@ -35,31 +31,7 @@ export default function ListView() {
     resultsPerPage,
   } = useFilters({ cacheBlacklist: ["patient_name"] });
 
-  const [modalFor, setModalFor] = useState<{
-    externalId: string | undefined;
-    loading: boolean;
-  }>({
-    externalId: undefined,
-    loading: false,
-  });
-
-  const authUser = useAuthUser();
   const { t } = useTranslation();
-
-  const handleTransferComplete = async (shift: ShiftingModel) => {
-    setModalFor({ ...modalFor, loading: true });
-    try {
-      await request(routes.completeTransfer, {
-        pathParams: { externalId: shift.external_id },
-      });
-      navigate(
-        `/facility/${shift.assigned_facility}/patient/${shift.patient}/consultation`,
-      );
-    } catch (error) {
-      setModalFor({ externalId: undefined, loading: false });
-    }
-  };
-
   const {
     data: shiftData,
     loading,
@@ -71,179 +43,6 @@ export default function ListView() {
     }),
   });
 
-  const showShiftingCardList = (data: ShiftingModel[]) => {
-    if (loading) {
-      return <Loading />;
-    }
-    if (data && !data.length) {
-      return (
-        <div className="mt-64 flex flex-1 justify-center text-secondary-600">
-          {t("no_patients_to_show")}
-        </div>
-      );
-    }
-
-    return data.map((shift: ShiftingModel) => (
-      <div
-        key={`shift_${shift.id}`}
-        className="w-full border-b-2 border-gray-100"
-      >
-        <div className="border-3 mx-3 flex grid w-full gap-1 overflow-hidden bg-white p-4 shadow sm:grid-cols-1 md:grid-cols-1 lg:grid-cols-5">
-          <div className="col-span-1 px-2 text-left">
-            <div className="text-sm font-bold capitalize">
-              {shift.patient_object.name}
-            </div>
-            <div className="text-xs font-semibold capitalize">
-              {shift.patient_object.age}
-            </div>
-          </div>
-
-          <div className="col-span-1 flex flex-col px-2 text-left">
-            <div className="phone number">
-              <dt
-                title={t("phone_number")}
-                className="flex items-center text-sm font-medium leading-5 text-secondary-500"
-              >
-                <CareIcon icon="l-mobile-android" className="mr-2" />
-                <dd className="text-sm font-bold leading-5 text-secondary-900">
-                  {shift.patient_object.phone_number || ""}
-                </dd>
-              </dt>
-            </div>
-            <div className="address mt-1">
-              <dt
-                title={t("patient_address")}
-                className="flex items-center text-sm font-medium leading-5 text-secondary-500"
-              >
-                <CareIcon icon="l-home" className="mr-2" />
-                <dd className="font-xs leading-5 text-secondary-900">
-                  {shift.patient_object.address || "--"}
-                </dd>
-              </dt>
-            </div>
-          </div>
-
-          <div className="col-span-1 flex flex-col px-3 text-left">
-            <div className="3xl:flex-row mb-2 flex gap-2 sm:flex-row md:flex-row lg:flex-col xl:flex-row 2xl:flex-row">
-              <dt
-                title={t("shifting_status")}
-                className={`mt-1 flex h-5 shrink-0 items-center rounded-full px-2 py-0.5 text-xs font-medium leading-4 ${
-                  shift.status === "COMPLETED"
-                    ? "bg-sky-200"
-                    : "bg-yellow-200 text-yellow-500"
-                }`}
-              >
-                <CareIcon icon="l-truck" className="mr-2" />
-                <dd className="text-sky-600">{shift.status}</dd>
-              </dt>
-
-              <div>
-                {shift.emergency && (
-                  <span className="inline-block shrink-0 rounded-full bg-red-100 px-2 py-0.5 text-xs font-medium leading-4 text-red-800">
-                    {t("emergency")}
-                  </span>
-                )}
-              </div>
-            </div>
-
-            <div className="text-center">
-              <dt
-                title={t("last_modified")}
-                className={"flex items-center text-sm font-medium leading-5"}
-              >
-                <CareIcon icon="l-stopwatch" className="mr-1" />
-                <dd className="text-xs font-medium leading-5">
-                  {formatDateTime(shift.modified_date) || "--"}
-                </dd>
-              </dt>
-            </div>
-          </div>
-
-          <div className="col-span-1 text-left">
-            <dt
-              title={t("origin_facility")}
-              className="flex items-center text-left text-sm font-medium leading-5 text-secondary-500"
-            >
-              <CareIcon icon="l-plane-departure" className="mr-2" />
-              <dd className="text-sm font-bold leading-5 text-secondary-900">
-                {shift.origin_facility_object?.name}
-              </dd>
-            </dt>
-
-            {careConfig.wartimeShifting && (
-              <dt
-                title={t("shifting_approving_facility")}
-                className="flex items-center text-left text-sm font-medium leading-5 text-secondary-500"
-              >
-                <CareIcon icon="l-user-check" className="mr-2" />
-                <dd className="text-sm font-bold leading-5 text-secondary-900">
-                  {shift.shifting_approving_facility_object?.name}
-                </dd>
-              </dt>
-            )}
-
-            <dt
-              title={t("assigned_facility")}
-              className="flex items-center text-left text-sm font-medium leading-5 text-secondary-500"
-            >
-              <CareIcon icon="l-plane-arrival" className="mr-2" />
-              <dd className="text-sm font-bold leading-5 text-secondary-900">
-                {shift.assigned_facility_external ||
-                  shift.assigned_facility_object?.name ||
-                  t("yet_to_be_decided")}
-              </dd>
-            </dt>
-          </div>
-          <div className="col-span-1 mt-2 flex flex-col text-left">
-            <ButtonV2
-              onClick={(_) => navigate(`/shifting/${shift.external_id}`)}
-              variant="secondary"
-              border
-              className="w-full"
-            >
-              <CareIcon icon="l-eye" className="mr-2" /> {t("all_details")}
-            </ButtonV2>
-            {shift.status === "COMPLETED" && shift.assigned_facility && (
-              <div className="mt-2">
-                <ButtonV2
-                  className="w-full"
-                  disabled={
-                    !shift.patient_object.allow_transfer ||
-                    !(
-                      ["DistrictAdmin", "StateAdmin"].includes(
-                        authUser.user_type,
-                      ) ||
-                      authUser.home_facility_object?.id ===
-                        shift.assigned_facility
-                    )
-                  }
-                  onClick={() =>
-                    setModalFor({
-                      externalId: shift.external_id,
-                      loading: false,
-                    })
-                  }
-                >
-                  {t("transfer_to_receiving_facility")}
-                </ButtonV2>
-                <ConfirmDialog
-                  title={t("confirm_transfer_complete")}
-                  description={t("mark_transfer_complete_confirmation")}
-                  action="Confirm"
-                  show={modalFor.externalId === shift.external_id} // Check the externalId here
-                  onClose={() =>
-                    setModalFor({ externalId: undefined, loading: false })
-                  }
-                  onConfirm={() => handleTransferComplete(shift)}
-                />
-              </div>
-            )}
-          </div>
-        </div>
-      </div>
-    ));
-  };
-
   return (
     <Page
       title={t("shifting")}
@@ -289,6 +88,7 @@ export default function ListView() {
       }
     >
       <BadgesList {...{ qParams, FilterBadges }} />
+
       <div>
         {loading ? (
           <Loading />
@@ -307,27 +107,7 @@ export default function ListView() {
                 {t("refresh_list")}
               </button>
             </div>
-            <div>
-              <div className="mx-5 mt-5 grid w-full gap-2 border-b-2 border-gray-100 p-4 text-sm font-medium sm:grid-cols-1 md:grid-cols-1 lg:grid-cols-5">
-                <div className="col-span-1 uppercase sm:text-center md:text-center lg:block lg:text-left">
-                  {t("patients")}
-                </div>
-                <div className="col-span-1 hidden text-left uppercase sm:hidden md:hidden lg:block">
-                  {t("contact_info")}
-                </div>
-                <div className="col-span-1 hidden text-left uppercase sm:hidden md:hidden lg:block">
-                  {t("consent__status")}
-                </div>
-                <div className="col-span-1 hidden text-left uppercase sm:hidden md:hidden lg:block">
-                  {t("facilities")}
-                </div>
-                <div className="col-span-1 hidden text-left uppercase sm:hidden md:hidden lg:block">
-                  {t("LOG_UPDATE_FIELD_LABEL__action")}
-                </div>
-              </div>
-              <div>{showShiftingCardList(shiftData?.results || [])}</div>
-            </div>
-
+            <ShiftingTable data={shiftData?.results} loading={loading} />
             <div>
               <Pagination totalCount={shiftData?.count || 0} />
             </div>
diff --git a/src/components/Shifting/ShiftingTable.tsx b/src/components/Shifting/ShiftingTable.tsx
new file mode 100644
index 00000000000..de186a13d56
--- /dev/null
+++ b/src/components/Shifting/ShiftingTable.tsx
@@ -0,0 +1,261 @@
+import careConfig from "@careConfig";
+import { navigate } from "raviger";
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+
+import { cn } from "@/lib/utils";
+
+import CareIcon from "@/CAREUI/icons/CareIcon";
+
+import useAuthUser from "@/hooks/useAuthUser";
+
+import routes from "@/Utils/request/api";
+import request from "@/Utils/request/request";
+import { formatDateTime } from "@/Utils/utils";
+
+import ButtonV2 from "../Common/ButtonV2";
+import ConfirmDialog from "../Common/ConfirmDialog";
+import Loading from "../Common/Loading";
+import { ShiftingModel } from "../Facility/models";
+
+export default function ShiftingTable(props: {
+  data?: ShiftingModel[];
+  loading?: boolean;
+  hidePatient?: boolean;
+}) {
+  const { data, loading, hidePatient } = props;
+
+  const { t } = useTranslation();
+  const authUser = useAuthUser();
+  const [modalFor, setModalFor] = useState<{
+    externalId: string | undefined;
+    loading: boolean;
+  }>({
+    externalId: undefined,
+    loading: false,
+  });
+
+  const handleTransferComplete = async (shift: ShiftingModel) => {
+    setModalFor({ ...modalFor, loading: true });
+    try {
+      await request(routes.completeTransfer, {
+        pathParams: { externalId: shift.external_id },
+      });
+      navigate(
+        `/facility/${shift.assigned_facility}/patient/${shift.patient}/consultation`,
+      );
+    } catch (error) {
+      setModalFor({ externalId: undefined, loading: false });
+    }
+  };
+
+  if (loading) {
+    return <Loading />;
+  }
+  if (data && !data.length) {
+    return (
+      <div className="mt-64 flex flex-1 justify-center text-secondary-600">
+        {t("no_results_found")}
+      </div>
+    );
+  }
+
+  return (
+    <div>
+      <div
+        className={cn(
+          " mt-5 grid w-full gap-2 border-b-2 border-gray-100 p-4 text-sm font-medium sm:grid-cols-1 md:grid-cols-1",
+          hidePatient ? "lg:grid-cols-4" : "lg:grid-cols-5",
+        )}
+      >
+        {!hidePatient && (
+          <div className="col-span-1 uppercase sm:text-center md:text-center lg:block lg:text-left">
+            {t("patients")}
+          </div>
+        )}
+        <div className="col-span-1 hidden text-left uppercase sm:hidden md:hidden lg:block">
+          {t("contact_info")}
+        </div>
+        <div className="col-span-1 hidden text-left uppercase sm:hidden md:hidden lg:block">
+          {t("consent__status")}
+        </div>
+        <div className="col-span-1 hidden text-left uppercase sm:hidden md:hidden lg:block">
+          {t("facilities")}
+        </div>
+        <div className="col-span-1 hidden text-left uppercase sm:hidden md:hidden lg:block">
+          {t("LOG_UPDATE_FIELD_LABEL__action")}
+        </div>
+      </div>
+      <div>
+        {data?.map((shift: ShiftingModel) => (
+          <div
+            key={`shift_${shift.id}`}
+            className="w-full border-b-2 border-gray-100"
+          >
+            <div
+              className={cn(
+                "border-3 grid w-full gap-1 overflow-hidden bg-white p-4 shadow sm:grid-cols-1 md:grid-cols-1",
+                hidePatient ? "lg:grid-cols-4" : "lg:grid-cols-5",
+              )}
+            >
+              {!hidePatient && (
+                <div className="col-span-1 px-2 text-left">
+                  <div className="text-sm font-bold capitalize">
+                    {shift.patient_object.name}
+                  </div>
+                  <div className="text-xs font-semibold capitalize">
+                    {shift.patient_object.age}
+                  </div>
+                </div>
+              )}
+
+              <div className="col-span-1 flex flex-col px-2 text-left">
+                <div className="phone number">
+                  <dt
+                    title={t("phone_number")}
+                    className="flex items-center text-sm font-medium leading-5 text-secondary-500"
+                  >
+                    <CareIcon icon="l-mobile-android" className="mr-2" />
+                    <dd className="text-sm font-bold leading-5 text-secondary-900">
+                      {shift.patient_object.phone_number || ""}
+                    </dd>
+                  </dt>
+                </div>
+                <div className="address mt-1">
+                  <dt
+                    title={t("patient_address")}
+                    className="flex items-center text-sm font-medium leading-5 text-secondary-500"
+                  >
+                    <CareIcon icon="l-home" className="mr-2" />
+                    <dd className="font-xs leading-5 text-secondary-900">
+                      {shift.patient_object.address || "--"}
+                    </dd>
+                  </dt>
+                </div>
+              </div>
+
+              <div className="col-span-1 flex flex-col px-3 text-left">
+                <div className="3xl:flex-row mb-2 flex gap-2 sm:flex-row md:flex-row lg:flex-col xl:flex-row 2xl:flex-row">
+                  <dt
+                    title={t("shifting_status")}
+                    className={`mt-1 flex h-5 shrink-0 items-center rounded-full px-2 py-0.5 text-xs font-medium leading-4 ${
+                      shift.status === "COMPLETED"
+                        ? "bg-sky-200"
+                        : "bg-yellow-200 text-yellow-500"
+                    }`}
+                  >
+                    <CareIcon icon="l-truck" className="mr-2" />
+                    <dd className="text-sky-600">{shift.status}</dd>
+                  </dt>
+
+                  <div>
+                    {shift.emergency && (
+                      <span className="inline-block shrink-0 rounded-full bg-red-100 px-2 py-0.5 text-xs font-medium leading-4 text-red-800">
+                        {t("emergency")}
+                      </span>
+                    )}
+                  </div>
+                </div>
+
+                <div className="text-center">
+                  <dt
+                    title={t("last_modified")}
+                    className={
+                      "flex items-center text-sm font-medium leading-5"
+                    }
+                  >
+                    <CareIcon icon="l-stopwatch" className="mr-1" />
+                    <dd className="text-xs font-medium leading-5">
+                      {formatDateTime(shift.modified_date) || "--"}
+                    </dd>
+                  </dt>
+                </div>
+              </div>
+
+              <div className="col-span-1 text-left">
+                <dt
+                  title={t("origin_facility")}
+                  className="flex items-center text-left text-sm font-medium leading-5 text-secondary-500"
+                >
+                  <CareIcon icon="l-plane-departure" className="mr-2" />
+                  <dd className="text-sm font-bold leading-5 text-secondary-900">
+                    {shift.origin_facility_object?.name}
+                  </dd>
+                </dt>
+
+                {careConfig.wartimeShifting && (
+                  <dt
+                    title={t("shifting_approving_facility")}
+                    className="flex items-center text-left text-sm font-medium leading-5 text-secondary-500"
+                  >
+                    <CareIcon icon="l-user-check" className="mr-2" />
+                    <dd className="text-sm font-bold leading-5 text-secondary-900">
+                      {shift.shifting_approving_facility_object?.name}
+                    </dd>
+                  </dt>
+                )}
+
+                <dt
+                  title={t("assigned_facility")}
+                  className="flex items-center text-left text-sm font-medium leading-5 text-secondary-500"
+                >
+                  <CareIcon icon="l-plane-arrival" className="mr-2" />
+                  <dd className="text-sm font-bold leading-5 text-secondary-900">
+                    {shift.assigned_facility_external ||
+                      shift.assigned_facility_object?.name ||
+                      t("yet_to_be_decided")}
+                  </dd>
+                </dt>
+              </div>
+              <div className="col-span-1 mt-2 flex flex-col text-left">
+                <ButtonV2
+                  onClick={(_) => navigate(`/shifting/${shift.external_id}`)}
+                  variant="secondary"
+                  border
+                  className="w-full"
+                >
+                  <CareIcon icon="l-eye" className="mr-2" /> {t("all_details")}
+                </ButtonV2>
+                {shift.status === "COMPLETED" && shift.assigned_facility && (
+                  <div className="mt-2">
+                    <ButtonV2
+                      className="w-full"
+                      disabled={
+                        !shift.patient_object.allow_transfer ||
+                        !(
+                          ["DistrictAdmin", "StateAdmin"].includes(
+                            authUser.user_type,
+                          ) ||
+                          authUser.home_facility_object?.id ===
+                            shift.assigned_facility
+                        )
+                      }
+                      onClick={() =>
+                        setModalFor({
+                          externalId: shift.external_id,
+                          loading: false,
+                        })
+                      }
+                    >
+                      {t("transfer_to_receiving_facility")}
+                    </ButtonV2>
+                    <ConfirmDialog
+                      title={t("confirm_transfer_complete")}
+                      description={t("mark_transfer_complete_confirmation")}
+                      action="Confirm"
+                      show={modalFor.externalId === shift.external_id} // Check the externalId here
+                      onClose={() =>
+                        setModalFor({ externalId: undefined, loading: false })
+                      }
+                      onConfirm={() => handleTransferComplete(shift)}
+                    />
+                  </div>
+                )}
+              </div>
+            </div>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}
diff --git a/src/components/Users/ManageUsers.tsx b/src/components/Users/ManageUsers.tsx
index 0b6a9149dbb..a1c00e5eaef 100644
--- a/src/components/Users/ManageUsers.tsx
+++ b/src/components/Users/ManageUsers.tsx
@@ -250,7 +250,7 @@ export default function ManageUsers() {
                 </div>
                 <div
                   id="name"
-                  className="mt-2 flex items-center gap-3 text-2xl font-bold capitalize"
+                  className="mt-2 flex gap-3 text-2xl font-bold capitalize"
                 >
                   <div className="max-w-full break-words">
                     {formatName(user)}

From e309fcd9f9da1de5c2c1e542c362c6d17ce4a044 Mon Sep 17 00:00:00 2001
From: JavidSumra <112365664+JavidSumra@users.noreply.github.com>
Date: Wed, 27 Nov 2024 14:41:19 +0530
Subject: [PATCH 08/37] Fix unable to use camera switch button (#9159)

---
 src/components/Files/CameraCaptureDialog.tsx | 66 ++++++++++++--------
 1 file changed, 40 insertions(+), 26 deletions(-)

diff --git a/src/components/Files/CameraCaptureDialog.tsx b/src/components/Files/CameraCaptureDialog.tsx
index 91b158bcb44..acfbaf96ec4 100644
--- a/src/components/Files/CameraCaptureDialog.tsx
+++ b/src/components/Files/CameraCaptureDialog.tsx
@@ -7,7 +7,7 @@ import CareIcon from "@/CAREUI/icons/CareIcon";
 import ButtonV2, { Submit } from "@/components/Common/ButtonV2";
 import DialogModal from "@/components/Common/Dialog";
 
-import useWindowDimensions from "@/hooks/useWindowDimensions";
+import useBreakpoints from "@/hooks/useBreakpoints";
 
 import * as Notify from "@/Utils/Notifications";
 
@@ -19,34 +19,56 @@ export interface CameraCaptureDialogProps {
 
 export default function CameraCaptureDialog(props: CameraCaptureDialogProps) {
   const { show, onHide, onCapture } = props;
+  const isLaptopScreen = useBreakpoints({ lg: true, default: false });
 
-  const [cameraFacingFront, setCameraFacingFront] = useState(true);
+  const [cameraFacingMode, setCameraFacingMode] = useState(
+    isLaptopScreen ? "user" : "environment",
+  );
   const [previewImage, setPreviewImage] = useState(null);
   const webRef = useRef<any>(null);
 
   const videoConstraints = {
     width: { ideal: 4096 },
     height: { ideal: 2160 },
-    facingMode: "user",
+    facingMode: cameraFacingMode,
   };
   useEffect(() => {
     if (!show) return;
-    navigator.mediaDevices.getUserMedia({ video: true }).catch(() => {
-      Notify.Warn({
-        msg: t("camera_permission_denied"),
+    let stream: MediaStream | null = null;
+
+    navigator.mediaDevices
+      .getUserMedia({ video: { facingMode: cameraFacingMode } })
+      .then((mediaStream) => {
+        stream = mediaStream;
+      })
+      .catch(() => {
+        Notify.Warn({
+          msg: t("camera_permission_denied"),
+        });
+        onHide();
       });
-      onHide();
-    });
-  }, [show]);
-  const handleSwitchCamera = useCallback(() => {
-    const supportedConstraints =
-      navigator.mediaDevices.getSupportedConstraints();
-    if (
-      !isLaptopScreen &&
-      typeof supportedConstraints.facingMode === "string" &&
-      (supportedConstraints.facingMode as string).includes("environment")
-    ) {
-      setCameraFacingFront((prevState) => !prevState);
+
+    return () => {
+      if (stream) {
+        stream.getTracks().forEach((track) => {
+          track.stop();
+        });
+      }
+    };
+  }, [show, cameraFacingMode, onHide]);
+
+  const handleSwitchCamera = useCallback(async () => {
+    const devices = await navigator.mediaDevices.enumerateDevices();
+    const videoInputs = devices.filter(
+      (device) => device.kind === "videoinput",
+    );
+    const backCamera = videoInputs.some((device) =>
+      device.label.toLowerCase().includes("back"),
+    );
+    if (!isLaptopScreen && backCamera) {
+      setCameraFacingMode((prevMode) =>
+        prevMode === "environment" ? "user" : "environment",
+      );
     } else {
       Notify.Warn({
         msg: t("switch_camera_is_not_available"),
@@ -54,10 +76,6 @@ export default function CameraCaptureDialog(props: CameraCaptureDialogProps) {
     }
   }, []);
 
-  const { width } = useWindowDimensions();
-  const LaptopScreenBreakpoint = 640;
-  const isLaptopScreen = width >= LaptopScreenBreakpoint ? true : false;
-
   const captureImage = () => {
     setPreviewImage(webRef.current.getScreenshot());
     const canvas = webRef.current.getCanvas();
@@ -70,10 +88,6 @@ export default function CameraCaptureDialog(props: CameraCaptureDialogProps) {
     });
   };
 
-  const cameraFacingMode = cameraFacingFront
-    ? "user"
-    : { exact: "environment" };
-
   return (
     <DialogModal
       show={show}

From f8c78fd24b426cf501acdead06a0bfb54764544c Mon Sep 17 00:00:00 2001
From: JavidSumra <112365664+JavidSumra@users.noreply.github.com>
Date: Wed, 27 Nov 2024 15:04:43 +0530
Subject: [PATCH 09/37] Fix Camera Capture on Retake and Close (#9180)

---
 src/components/Files/AudioCaptureDialog.tsx  | 13 +++++++++++--
 src/components/Files/CameraCaptureDialog.tsx |  7 ++++++-
 src/hooks/useFileUpload.tsx                  | 11 +++++++----
 3 files changed, 24 insertions(+), 7 deletions(-)

diff --git a/src/components/Files/AudioCaptureDialog.tsx b/src/components/Files/AudioCaptureDialog.tsx
index 5512fad9dc6..d198ac7db16 100644
--- a/src/components/Files/AudioCaptureDialog.tsx
+++ b/src/components/Files/AudioCaptureDialog.tsx
@@ -1,5 +1,5 @@
 import { Link } from "raviger";
-import { useEffect, useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
 
 import CareIcon from "@/CAREUI/icons/CareIcon";
@@ -26,6 +26,7 @@ export default function AudioCaptureDialog(props: AudioCaptureDialogProps) {
 
   const { show, onHide, onCapture, autoRecord = false } = props;
   const [status, setStatus] = useState<Status | null>(null);
+  const mediaStreamRef = useRef<MediaStream | null>(null);
   const { t } = useTranslation();
 
   const { audioURL, resetRecording, startRecording, stopRecording } =
@@ -42,7 +43,8 @@ export default function AudioCaptureDialog(props: AudioCaptureDialogProps) {
   const handleStartRecording = () => {
     navigator.mediaDevices
       .getUserMedia({ audio: true })
-      .then(() => {
+      .then((stream) => {
+        mediaStreamRef.current = stream;
         setStatus("RECORDING");
         startRecording();
         timer.start();
@@ -105,6 +107,13 @@ export default function AudioCaptureDialog(props: AudioCaptureDialogProps) {
     if (autoRecord && show && status === "RECORDING") {
       handleStartRecording();
     }
+
+    return () => {
+      if (mediaStreamRef.current) {
+        mediaStreamRef.current.getTracks().forEach((track) => track.stop());
+        mediaStreamRef.current = null;
+      }
+    };
   }, [autoRecord, status, show]);
 
   return (
diff --git a/src/components/Files/CameraCaptureDialog.tsx b/src/components/Files/CameraCaptureDialog.tsx
index acfbaf96ec4..f81d854c559 100644
--- a/src/components/Files/CameraCaptureDialog.tsx
+++ b/src/components/Files/CameraCaptureDialog.tsx
@@ -15,10 +15,11 @@ export interface CameraCaptureDialogProps {
   show: boolean;
   onHide: () => void;
   onCapture: (file: File, fileName: string) => void;
+  onResetCapture: () => void;
 }
 
 export default function CameraCaptureDialog(props: CameraCaptureDialogProps) {
-  const { show, onHide, onCapture } = props;
+  const { show, onHide, onCapture, onResetCapture } = props;
   const isLaptopScreen = useBreakpoints({ lg: true, default: false });
 
   const [cameraFacingMode, setCameraFacingMode] = useState(
@@ -160,6 +161,7 @@ export default function CameraCaptureDialog(props: CameraCaptureDialogProps) {
                 <ButtonV2
                   onClick={() => {
                     setPreviewImage(null);
+                    onResetCapture();
                   }}
                   className="m-2"
                 >
@@ -183,6 +185,7 @@ export default function CameraCaptureDialog(props: CameraCaptureDialogProps) {
             variant="secondary"
             onClick={() => {
               setPreviewImage(null);
+              onResetCapture();
               onHide();
             }}
             className="m-2"
@@ -221,6 +224,7 @@ export default function CameraCaptureDialog(props: CameraCaptureDialogProps) {
                   <ButtonV2
                     onClick={() => {
                       setPreviewImage(null);
+                      onResetCapture();
                     }}
                   >
                     {t("retake")}
@@ -242,6 +246,7 @@ export default function CameraCaptureDialog(props: CameraCaptureDialogProps) {
             variant="secondary"
             onClick={() => {
               setPreviewImage(null);
+              onResetCapture();
               onHide();
             }}
           >
diff --git a/src/hooks/useFileUpload.tsx b/src/hooks/useFileUpload.tsx
index 56f0d337a5e..d580ad7d557 100644
--- a/src/hooks/useFileUpload.tsx
+++ b/src/hooks/useFileUpload.tsx
@@ -249,6 +249,11 @@ export default function useFileUpload(
     setUploadFileNames([]);
   };
 
+  const clearFiles = () => {
+    setFiles([]);
+    setUploadFileNames([]);
+  };
+
   const Dialogues = (
     <>
       <CameraCaptureDialog
@@ -257,6 +262,7 @@ export default function useFileUpload(
         onCapture={(file) => {
           setFiles((prev) => [...prev, file]);
         }}
+        onResetCapture={clearFiles}
       />
       <AudioCaptureDialog
         show={audioModalOpen}
@@ -309,10 +315,7 @@ export default function useFileUpload(
       setFiles((prev) => prev.filter((_, i) => i !== index));
       setUploadFileNames((prev) => prev.filter((_, i) => i !== index));
     },
-    clearFiles: () => {
-      setFiles([]);
-      setUploadFileNames([]);
-    },
+    clearFiles,
     uploading,
   };
 }

From 8b02709b3cadb01a5f7d82f00ae2cd7cbb5601b0 Mon Sep 17 00:00:00 2001
From: Shivank Kacker <kacker.shivank@gmail.com>
Date: Wed, 27 Nov 2024 18:36:02 +0530
Subject: [PATCH 10/37] Fix duplicated content in patient consultation (#9221)

---
 src/components/Facility/ConsultationDetails/index.tsx | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/src/components/Facility/ConsultationDetails/index.tsx b/src/components/Facility/ConsultationDetails/index.tsx
index 08427a5e6ec..4834ba40198 100644
--- a/src/components/Facility/ConsultationDetails/index.tsx
+++ b/src/components/Facility/ConsultationDetails/index.tsx
@@ -397,9 +397,6 @@ export const ConsultationDetails = (props: any) => {
           </div>
           <SelectedTab {...consultationTabProps} />
         </div>
-        <div className="px-3 pb-3 md:px-6 md:pb-6">
-          <SelectedTab {...consultationTabProps} />
-        </div>
       </div>
 
       <DoctorVideoSlideover

From 0d13f6c9c9e66e068e3af7db956620b595700bfe Mon Sep 17 00:00:00 2001
From: Anirban Biswas <139000437+ANIR1604@users.noreply.github.com>
Date: Wed, 27 Nov 2024 18:39:44 +0530
Subject: [PATCH 11/37] Solved the problem of overlapping notifications during
 updates (#9207)

---
 package-lock.json                    |  2 +-
 src/components/Users/UserProfile.tsx | 46 +++++++++++++++-------------
 2 files changed, 25 insertions(+), 23 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 63af1164ef0..5c703af8fe1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -20862,4 +20862,4 @@
       }
     }
   }
-}
\ No newline at end of file
+}
diff --git a/src/components/Users/UserProfile.tsx b/src/components/Users/UserProfile.tsx
index 15cedafab2e..7b0df12cac0 100644
--- a/src/components/Users/UserProfile.tsx
+++ b/src/components/Users/UserProfile.tsx
@@ -36,7 +36,6 @@ import request from "@/Utils/request/request";
 import uploadFile from "@/Utils/request/uploadFile";
 import useQuery from "@/Utils/request/useQuery";
 import {
-  classNames,
   dateQueryString,
   formatDate,
   formatDisplayName,
@@ -1006,31 +1005,34 @@ export default function UserProfile() {
             </p>
           </div>
         </div>
-        {updateStatus.isUpdateAvailable && (
-          <UpdatableApp silentlyAutoUpdate={false}>
-            <ButtonV2 disabled={true}>
+        <div className="mt-5 md:col-span-2 md:mt-0">
+          {updateStatus.isChecking ? (
+            // While checking for updates
+            <ButtonV2 disabled>
               <div className="flex items-center gap-4">
-                <CareIcon icon="l-exclamation" className="text-2xl" />
-                {t("update_available")}
+                <CareIcon icon="l-sync" className="text-2xl animate-spin" />
+                {t("checking_for_update")}
               </div>
             </ButtonV2>
-          </UpdatableApp>
-        )}
-        <div className="mt-5 md:col-span-2 md:mt-0">
-          {!updateStatus.isUpdateAvailable && (
-            <ButtonV2 disabled={updateStatus.isChecking} onClick={checkUpdates}>
-              {" "}
+          ) : updateStatus.isUpdateAvailable ? (
+            // When an update is available
+            <UpdatableApp silentlyAutoUpdate={false}>
+              <ButtonV2 disabled>
+                <div className="flex items-center gap-4">
+                  <CareIcon
+                    icon="l-exclamation"
+                    className="text-2xl text-warning"
+                  />
+                  {t("update_available")}
+                </div>
+              </ButtonV2>
+            </UpdatableApp>
+          ) : (
+            // Default state to check for updates
+            <ButtonV2 onClick={checkUpdates}>
               <div className="flex items-center gap-4">
-                <CareIcon
-                  icon="l-sync"
-                  className={classNames(
-                    "text-2xl",
-                    updateStatus.isChecking && "animate-spin",
-                  )}
-                />
-                {updateStatus.isChecking
-                  ? t("checking_for_update")
-                  : t("check_for_update")}
+                <CareIcon icon="l-sync" className="text-2xl" />
+                {t("check_for_update")}
               </div>
             </ButtonV2>
           )}

From 3e1960722016e652ca57603a3202dc99b18451b1 Mon Sep 17 00:00:00 2001
From: Rithvik Nishad <mail@rithviknishad.dev>
Date: Wed, 27 Nov 2024 20:38:51 +0530
Subject: [PATCH 12/37] Add gitattributes to enforce proper line endings
 (#9223)

---
 .gitattributes | 1 +
 1 file changed, 1 insertion(+)
 create mode 100644 .gitattributes

diff --git a/.gitattributes b/.gitattributes
new file mode 100644
index 00000000000..2125666142e
--- /dev/null
+++ b/.gitattributes
@@ -0,0 +1 @@
+* text=auto
\ No newline at end of file

From 532945766d2b76bd64dc4ce7ced9aceedece313d Mon Sep 17 00:00:00 2001
From: Rithvik Nishad <mail@rithviknishad.dev>
Date: Wed, 27 Nov 2024 21:12:10 +0530
Subject: [PATCH 13/37] Fix loading state management in useQuery when requests
 are aborted (#9222)

---
 src/Utils/request/request.ts     |  3 +++
 src/Utils/request/useMutation.ts | 10 ++++++----
 src/Utils/request/useQuery.ts    |  6 ++++--
 3 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/src/Utils/request/request.ts b/src/Utils/request/request.ts
index d036ad49750..847b7c9ba60 100644
--- a/src/Utils/request/request.ts
+++ b/src/Utils/request/request.ts
@@ -70,6 +70,9 @@ export default async function request<TData, TBody>(
       return result;
     } catch (error: any) {
       result = { error, res: undefined, data: undefined };
+      if (error.name === "AbortError") {
+        return result;
+      }
     }
   }
 
diff --git a/src/Utils/request/useMutation.ts b/src/Utils/request/useMutation.ts
index fbc6edc3940..7c368f5e45d 100644
--- a/src/Utils/request/useMutation.ts
+++ b/src/Utils/request/useMutation.ts
@@ -10,7 +10,7 @@ import { mergeRequestOptions } from "@/Utils/request/utils";
 
 export default function useMutation<TData, TBody>(
   route: MutationRoute<TData, TBody>,
-  options: RequestOptions<TData>,
+  options: RequestOptions<TData, TBody>,
 ) {
   const [response, setResponse] = React.useState<RequestResult<TData>>();
   const [isProcessing, setIsProcessing] = React.useState(false);
@@ -18,7 +18,7 @@ export default function useMutation<TData, TBody>(
   const controllerRef = React.useRef<AbortController>();
 
   const runQuery = React.useCallback(
-    async (overrides?: RequestOptions<TData>) => {
+    async (overrides?: RequestOptions<TData, TBody>) => {
       controllerRef.current?.abort();
 
       const controller = new AbortController();
@@ -31,8 +31,10 @@ export default function useMutation<TData, TBody>(
 
       setIsProcessing(true);
       const response = await request(route, { ...resolvedOptions, controller });
-      setResponse(response);
-      setIsProcessing(false);
+      if (response.error?.name !== "AbortError") {
+        setResponse(response);
+        setIsProcessing(false);
+      }
       return response;
     },
     [route, JSON.stringify(options)],
diff --git a/src/Utils/request/useQuery.ts b/src/Utils/request/useQuery.ts
index 109ff0bb2f1..5f4c10a289e 100644
--- a/src/Utils/request/useQuery.ts
+++ b/src/Utils/request/useQuery.ts
@@ -37,8 +37,10 @@ export default function useQuery<TData>(
 
       setLoading(true);
       const response = await request(route, { ...resolvedOptions, controller });
-      setResponse(response);
-      setLoading(false);
+      if (response.error?.name !== "AbortError") {
+        setResponse(response);
+        setLoading(false);
+      }
       return response;
     },
     [route, JSON.stringify(options)],

From 6bea49af43e0cc75f23d4bd1a14bb5a9119a9c9c Mon Sep 17 00:00:00 2001
From: Tanuj Nainwal <125687187+Tanuj1718@users.noreply.github.com>
Date: Thu, 28 Nov 2024 10:44:57 +0530
Subject: [PATCH 14/37] updated crowdin.yml file (#9211)

Co-authored-by: Tanuj Nainwal <tanujnainwal@Tanujs-MacBook-Air.local>
---
 crowdin.yml | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/crowdin.yml b/crowdin.yml
index 0ab1a042711..fdcb6bcd32d 100644
--- a/crowdin.yml
+++ b/crowdin.yml
@@ -1,5 +1,6 @@
 files:
-  - source: /src/Locale/en/*.json
-    translation: /src/Locale/%two_letters_code%/%original_file_name%
+  - source: /public/locale/{{lang}}.json
+    translation: /public/locale/%two_letters_code%/%original_file_name%
 bundles:
   - 2
+

From fa5fa25bad596c4863d38864d0e1ecb105995cf0 Mon Sep 17 00:00:00 2001
From: Shaurya Gupta <shauryag1000@gmail.com>
Date: Thu, 28 Nov 2024 15:13:54 +0530
Subject: [PATCH 15/37] Fix: Breadcrumbs redirection to patient edit
 consultation form (#8985)

---
 src/components/Facility/ConsultationDetails/index.tsx | 4 ++++
 src/components/Patient/PatientConsentRecords.tsx      | 6 +++++-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/components/Facility/ConsultationDetails/index.tsx b/src/components/Facility/ConsultationDetails/index.tsx
index 4834ba40198..191d0156d03 100644
--- a/src/components/Facility/ConsultationDetails/index.tsx
+++ b/src/components/Facility/ConsultationDetails/index.tsx
@@ -213,6 +213,10 @@ export const ConsultationDetails = (props: any) => {
             crumbsReplacements={{
               [facilityId]: { name: patientData?.facility_object?.name },
               [patientId]: { name: patientData?.name },
+              consultation: {
+                name: "Consultation",
+                uri: `/facility/${facilityId}/patient/${patientId}/consultation/${consultationId}/update`,
+              },
               [consultationId]: {
                 name:
                   consultationData.suggestion === "A"
diff --git a/src/components/Patient/PatientConsentRecords.tsx b/src/components/Patient/PatientConsentRecords.tsx
index 162dcb2ff77..cbeb56b894f 100644
--- a/src/components/Patient/PatientConsentRecords.tsx
+++ b/src/components/Patient/PatientConsentRecords.tsx
@@ -112,6 +112,10 @@ export default function PatientConsentRecords(props: {
       crumbsReplacements={{
         [facilityId]: { name: patient?.facility_object?.name },
         [patientId]: { name: patient?.name },
+        consultation: {
+          name: "Consultation",
+          uri: `/facility/${facilityId}/patient/${patientId}/consultation/${consultationId}/update`,
+        },
         [consultationId]: {
           name:
             patient?.last_consultation?.suggestion === "A"
@@ -121,7 +125,7 @@ export default function PatientConsentRecords(props: {
               : patient?.last_consultation?.suggestion_text,
         },
       }}
-      backUrl={`/facility/${facilityId}/patient/${patientId}/consultation/${consultationId}/`}
+      backUrl={`/facility/${facilityId}/patient/${patientId}/consultation/${consultationId}/update`}
     >
       {fileUpload.Dialogues}
       {fileManager.Dialogues}

From fc2ac3b0f66775c05e36a012823125228271fdfd Mon Sep 17 00:00:00 2001
From: JavidSumra <112365664+JavidSumra@users.noreply.github.com>
Date: Thu, 28 Nov 2024 16:11:16 +0530
Subject: [PATCH 16/37] Fixes PR thank you msg. from potentially tagging the PR
 author twice (#9228)

---
 .github/workflows/thank-you.yml | 26 ++++++++++----------------
 1 file changed, 10 insertions(+), 16 deletions(-)

diff --git a/.github/workflows/thank-you.yml b/.github/workflows/thank-you.yml
index 192f71d1a64..b91642dd24f 100644
--- a/.github/workflows/thank-you.yml
+++ b/.github/workflows/thank-you.yml
@@ -18,26 +18,20 @@ jobs:
         uses: actions/github-script@v6.3.3
         with:
           script: |
-            const thankyouNote = 'Your efforts have helped advance digital healthcare and TeleICU systems. :rocket: Thank you for taking the time out to make CARE better. We hope you continue to innovate and contribute; your impact is immense! :raised_hands:'
+            const thankyouNote = 'Your efforts have helped advance digital healthcare and TeleICU systems. :rocket: Thank you for taking the time out to make CARE better. We hope you continue to innovate and contribute; your impact is immense! :raised_hands:';
             const options = {
               issue_number: context.issue.number,
               owner: context.repo.owner,
               repo: context.repo.repo,
-            }
+            };
 
-            const result = await github.rest.issues.get({
-              issue_number: context.issue.number,
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-            })
-
-            const { assignees, user } = result.data
+            const { data : { assignees, user } } = await github.rest.issues.get(options);
 
-            const assignees_tagged = assignees.map((user) => '@' + user.login).join(' ')
-            const owner_tagged = '@' + user.login
+            const taggedUsers = [...new Set(
+              assignees.map(u => "@"+u.login).concat("@"+user.login)  
+            )].join(" ")
 
-            if (assignees.length == 0) {
-              await github.rest.issues.createComment({ ...options, body: `${owner_tagged} ${thankyouNote}` })
-            } else {
-              await github.rest.issues.createComment({ ...options, body: `${assignees_tagged} ${owner_tagged} ${thankyouNote}` })
-            }
+            await github.rest.issues.createComment({ 
+              ...options, 
+              body: `${taggedUsers} ${thankyouNote}` 
+            });

From c4071204a02f029542ffe19e9de9986e02e6dfb8 Mon Sep 17 00:00:00 2001
From: Sarvesh <142646866+sarvesh-official@users.noreply.github.com>
Date: Fri, 29 Nov 2024 10:35:14 +0530
Subject: [PATCH 17/37] Implemented Next and Previous button for files preview
 (#9196)

---
 src/components/Common/FilePreviewDialog.tsx | 113 ++++++++++++++++++--
 src/components/Files/FileUpload.tsx         |  12 ++-
 src/components/Patient/FileUploadPage.tsx   |   2 -
 src/hooks/useFileManager.tsx                |   9 +-
 4 files changed, 123 insertions(+), 13 deletions(-)

diff --git a/src/components/Common/FilePreviewDialog.tsx b/src/components/Common/FilePreviewDialog.tsx
index 4b7a07bd0cd..fa8a333515d 100644
--- a/src/components/Common/FilePreviewDialog.tsx
+++ b/src/components/Common/FilePreviewDialog.tsx
@@ -4,6 +4,7 @@ import {
   SetStateAction,
   Suspense,
   lazy,
+  useEffect,
   useState,
 } from "react";
 import { useTranslation } from "react-i18next";
@@ -15,6 +16,8 @@ import CircularProgress from "@/components/Common/CircularProgress";
 import DialogModal from "@/components/Common/Dialog";
 import { StateInterface } from "@/components/Files/FileUpload";
 
+import { FileUploadModel } from "../Patient/models";
+
 const PDFViewer = lazy(() => import("@/components/Common/PDFViewer"));
 
 export const zoom_values = [
@@ -40,6 +43,9 @@ type FilePreviewProps = {
   className?: string;
   titleAction?: ReactNode;
   fixedWidth?: boolean;
+  uploadedFiles?: FileUploadModel[];
+  loadFile?: (file: FileUploadModel, associating_id: string) => void;
+  currentIndex: number;
 };
 
 const previewExtensions = [
@@ -56,12 +62,28 @@ const previewExtensions = [
 ];
 
 const FilePreviewDialog = (props: FilePreviewProps) => {
-  const { show, onClose, file_state, setFileState, downloadURL, fileUrl } =
-    props;
+  const {
+    show,
+    onClose,
+    file_state,
+    setFileState,
+    downloadURL,
+    fileUrl,
+    uploadedFiles,
+    loadFile,
+    currentIndex,
+  } = props;
   const { t } = useTranslation();
 
   const [page, setPage] = useState(1);
   const [numPages, setNumPages] = useState(1);
+  const [index, setIndex] = useState<number>(currentIndex);
+
+  useEffect(() => {
+    if (uploadedFiles && show) {
+      setIndex(currentIndex);
+    }
+  }, [uploadedFiles, show, currentIndex]);
 
   const handleZoomIn = () => {
     const checkFull = file_state.zoom === zoom_values.length;
@@ -79,9 +101,27 @@ const FilePreviewDialog = (props: FilePreviewProps) => {
     });
   };
 
+  const handleNext = (newIndex: number) => {
+    if (
+      !uploadedFiles?.length ||
+      !loadFile ||
+      newIndex < 0 ||
+      newIndex >= uploadedFiles.length
+    )
+      return;
+
+    const nextFile = uploadedFiles[newIndex];
+    if (!nextFile?.id) return;
+
+    const associating_id = nextFile.associating_id || "";
+    loadFile(nextFile, associating_id);
+    setIndex(newIndex);
+  };
+
   const handleClose = () => {
     setPage(1);
     setNumPages(1);
+    setIndex(-1);
     onClose?.();
   };
 
@@ -102,6 +142,21 @@ const FilePreviewDialog = (props: FilePreviewProps) => {
       : `rotate-${normalizedRotation}`;
   }
 
+  useEffect(() => {
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (!show) return;
+      if (e.key === "ArrowLeft" && index > 0) {
+        handleNext(index - 1);
+      }
+      if (e.key === "ArrowRight" && index < (uploadedFiles?.length || 0) - 1) {
+        handleNext(index + 1);
+      }
+    };
+
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
+  }, [show, index, uploadedFiles]);
+
   return (
     <DialogModal
       fixedWidth={false}
@@ -109,16 +164,31 @@ const FilePreviewDialog = (props: FilePreviewProps) => {
       onClose={() => {
         handleClose();
       }}
-      title={t("file_preview")}
+      title={<span className="text-sm text-gray-600">{t("file_preview")}</span>}
       show={show}
     >
       {fileUrl ? (
         <>
-          <div className="mb-2 flex flex-col items-center justify-between md:flex-row">
-            <p className="text-md font-semibold text-secondary-700">
-              {file_state.name}.{file_state.extension}
-            </p>
-            <div className="flex gap-4">
+          <div className="mb-2 flex flex-col items-start justify-between md:flex-row">
+            <div>
+              <p className="text-2xl font-bold text-gray-800">
+                {file_state.name}.{file_state.extension}
+              </p>
+              {uploadedFiles &&
+                uploadedFiles[index] &&
+                uploadedFiles[index].created_date && (
+                  <p className="mt-1 text-sm text-gray-600">
+                    Created on{" "}
+                    {new Date(
+                      uploadedFiles[index].created_date!,
+                    ).toLocaleString("en-US", {
+                      dateStyle: "long",
+                      timeStyle: "short",
+                    })}
+                  </p>
+                )}
+            </div>
+            <div className="flex gap-4 mt-2 md:mt-0">
               {downloadURL && downloadURL.length > 0 && (
                 <ButtonV2>
                   <a
@@ -135,6 +205,19 @@ const FilePreviewDialog = (props: FilePreviewProps) => {
             </div>
           </div>
           <div className="flex flex-1 items-center justify-center">
+            {uploadedFiles && uploadedFiles.length > 1 && (
+              <ButtonV2
+                className="cursor-pointer bg-primary-500 rounded-md mr-4"
+                onClick={() => handleNext(index - 1)}
+                disabled={index <= 0}
+                aria-label="Previous file"
+                onKeyDown={(e) =>
+                  e.key === "ArrowLeft" && handleNext(index - 1)
+                }
+              >
+                <CareIcon icon="l-arrow-left" className="h-4 w-4" />
+              </ButtonV2>
+            )}
             <div className="flex h-[75vh] w-full items-center justify-center overflow-scroll rounded-lg border border-secondary-200">
               {file_state.isImage ? (
                 <img
@@ -173,6 +256,20 @@ const FilePreviewDialog = (props: FilePreviewProps) => {
                 </div>
               )}
             </div>
+
+            {uploadedFiles && uploadedFiles.length > 1 && (
+              <ButtonV2
+                className="cursor-pointer bg-primary-500 rounded-md ml-4"
+                onClick={() => handleNext(index + 1)}
+                disabled={index >= uploadedFiles.length - 1}
+                aria-label="Next file"
+                onKeyDown={(e) =>
+                  e.key === "ArrowRight" && handleNext(index + 1)
+                }
+              >
+                <CareIcon icon="l-arrow-right" className="h-4 w-4" />
+              </ButtonV2>
+            )}
           </div>
           <div className="flex items-center justify-between">
             <div className="mt-2 flex w-full flex-col justify-center gap-3 md:flex-row">
diff --git a/src/components/Files/FileUpload.tsx b/src/components/Files/FileUpload.tsx
index d98df131863..50ab3ffdb01 100644
--- a/src/components/Files/FileUpload.tsx
+++ b/src/components/Files/FileUpload.tsx
@@ -69,6 +69,8 @@ export interface StateInterface {
   isZoomInDisabled: boolean;
   isZoomOutDisabled: boolean;
   rotation: number;
+  id?: string;
+  associating_id?: string;
 }
 
 export const FileUpload = (props: FileUploadProps) => {
@@ -208,8 +210,15 @@ export const FileUpload = (props: FileUploadProps) => {
     type,
     onArchive: refetchAll,
     onEdit: refetchAll,
+    uploadedFiles:
+      fileQuery?.data?.results
+        .slice()
+        .reverse()
+        .map((file) => ({
+          ...file,
+          associating_id: associatedId,
+        })) || [],
   });
-
   const dischargeSummaryFileManager = useFileManager({
     type: "DISCHARGE_SUMMARY",
     onArchive: refetchAll,
@@ -244,7 +253,6 @@ export const FileUpload = (props: FileUploadProps) => {
       id: "record-audio",
     },
   ];
-
   return (
     <div className={`md:p-4 ${props.className}`}>
       {fileUpload.Dialogues}
diff --git a/src/components/Patient/FileUploadPage.tsx b/src/components/Patient/FileUploadPage.tsx
index 518644f54d7..d38b149ebeb 100644
--- a/src/components/Patient/FileUploadPage.tsx
+++ b/src/components/Patient/FileUploadPage.tsx
@@ -11,12 +11,10 @@ export default function FileUploadPage(props: {
   type: "CONSULTATION" | "PATIENT";
 }) {
   const { facilityId, patientId, consultationId, type } = props;
-
   const { data: patient } = useQuery(routes.getPatient, {
     pathParams: { id: patientId },
     prefetch: !!patientId,
   });
-
   return (
     <Page
       hideBack={false}
diff --git a/src/hooks/useFileManager.tsx b/src/hooks/useFileManager.tsx
index 727c92a6261..8e6a347d2ea 100644
--- a/src/hooks/useFileManager.tsx
+++ b/src/hooks/useFileManager.tsx
@@ -24,6 +24,7 @@ export interface FileManagerOptions {
   type: string;
   onArchive?: () => void;
   onEdit?: () => void;
+  uploadedFiles?: FileUploadModel[];
 }
 export interface FileManagerResult {
   viewFile: (file: FileUploadModel, associating_id: string) => void;
@@ -48,7 +49,7 @@ export interface FileManagerResult {
 export default function useFileManager(
   options: FileManagerOptions,
 ): FileManagerResult {
-  const { type: fileType, onArchive, onEdit } = options;
+  const { type: fileType, onArchive, onEdit, uploadedFiles } = options;
 
   const [file_state, setFileState] = useState<StateInterface>({
     open: false,
@@ -72,6 +73,7 @@ export default function useFileManager(
   const [editDialogueOpen, setEditDialogueOpen] =
     useState<FileUploadModel | null>(null);
   const [editError, setEditError] = useState("");
+  const [currentIndex, setCurrentIndex] = useState<number>(-1);
 
   const getExtension = (url: string) => {
     const div1 = url.split("?")[0].split(".");
@@ -80,6 +82,8 @@ export default function useFileManager(
   };
 
   const viewFile = async (file: FileUploadModel, associating_id: string) => {
+    const index = uploadedFiles?.findIndex((f) => f.id === file.id) ?? -1;
+    setCurrentIndex(index);
     setFileUrl("");
     setFileState({ ...file_state, open: true });
     const { data } = await request(routes.retrieveUpload, {
@@ -225,9 +229,12 @@ export default function useFileManager(
         file_state={file_state}
         setFileState={setFileState}
         downloadURL={downloadURL}
+        uploadedFiles={uploadedFiles}
         onClose={handleFilePreviewClose}
         fixedWidth={false}
         className="h-[80vh] w-full md:h-screen"
+        loadFile={viewFile}
+        currentIndex={currentIndex}
       />
       <DialogModal
         show={

From 7c9751d13ec9d2d402903769b41d5b58e4d1be2f Mon Sep 17 00:00:00 2001
From: Aditya Jindal <adityajindal2305@gmail.com>
Date: Fri, 29 Nov 2024 11:58:38 +0530
Subject: [PATCH 18/37] Fix: Date of Birth to Year of Birth on Patient Details
 Page when DOB is Missing (#9242)

---
 public/locale/en.json                                 |  3 ++-
 .../Patient/PatientDetailsTab/Demography.tsx          | 11 +++++++++--
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/public/locale/en.json b/public/locale/en.json
index 56f84a1883a..cd921bef06a 100644
--- a/public/locale/en.json
+++ b/public/locale/en.json
@@ -562,7 +562,7 @@
   "date_and_time": "Date and Time",
   "date_declared_positive": "Date of declaring positive",
   "date_of_admission": "Date of Admission",
-  "date_of_birth": "Date of birth",
+  "date_of_birth": "Date of Birth",
   "date_of_positive_covid_19_swab": "Date of Positive Covid 19 Swab",
   "date_of_result": "Covid confirmation date",
   "date_of_return": "Date of Return",
@@ -1433,6 +1433,7 @@
   "why_the_asset_is_not_working": "Why the asset is not working?",
   "width": "Width ({{unit}})",
   "working_status": "Working Status",
+  "year_of_birth": "Year of Birth",
   "years": "years",
   "years_of_experience": "Years of Experience",
   "years_of_experience_of_the_doctor": "Years of Experience of the Doctor",
diff --git a/src/components/Patient/PatientDetailsTab/Demography.tsx b/src/components/Patient/PatientDetailsTab/Demography.tsx
index 7ac854b8ee6..2a412f03f9a 100644
--- a/src/components/Patient/PatientDetailsTab/Demography.tsx
+++ b/src/components/Patient/PatientDetailsTab/Demography.tsx
@@ -188,12 +188,19 @@ export const Demography = (props: PatientProps) => {
           ),
         },
         {
-          label: t("date_of_birth"),
-          value: (
+          label: t(
+            patientData.date_of_birth ? "date_of_birth" : "year_of_birth",
+          ),
+          value: patientData.date_of_birth ? (
             <>
               {dayjs(patientData.date_of_birth).format("DD MMM YYYY")} (
               {formatPatientAge(patientData, true)})
             </>
+          ) : (
+            <>
+              {patientData.year_of_birth} ({formatPatientAge(patientData, true)}
+              )
+            </>
           ),
         },
         {

From 2a89332514050c5f519ec650d6d5baf84c786f69 Mon Sep 17 00:00:00 2001
From: Bodhish Thomas <bodhish@gmail.com>
Date: Fri, 29 Nov 2024 15:31:18 +0530
Subject: [PATCH 19/37] Update cursorrules

---
 .cursorrules | 42 +++++++++++++++++++++++++++---------------
 1 file changed, 27 insertions(+), 15 deletions(-)

diff --git a/.cursorrules b/.cursorrules
index 2eed3afe459..94ebea1bd57 100644
--- a/.cursorrules
+++ b/.cursorrules
@@ -1,23 +1,35 @@
-Care is a React Typescript Project, built with Vite and styled with TailwindCSS.
+You are an expert in TypeScript, React, Shadcn UI, Tailwind.
 
-Care uses a Plugin Architecture. Apps are installed in /apps. 
+Key Principles
 
-Care uses a custom useQuery hook to fetch data from the API. APIs are defined in the api.tsx file
+- Write concise, technical TypeScript code with accurate examples.
+- Use functional and declarative programming patterns; avoid classes.
+- Prefer iteration and modularization over code duplication.
+- Use descriptive variable names with auxiliary verbs (e.g., isLoading, hasError).
 
-Here's an example of how to use the useQuery hook to fetch data from the API:
+Naming Conventions
 
-```
-useQuery from "@/common/hooks/useQuery";
-const { data, loading, error } = useQuery(routes.getFacilityUsers, {
-  facility_id: "1",
-});
+- Use lowercase with dashes for directories (e.g., components/auth-wizard).
+- Favor named exports for components.
 
-request from "@/common/utils/request";
-const { res } = await request(routes.partialUpdateAsset, {
-  pathParams: { external_id: assetId },
-  body: data,
-});
-```
+TypeScript Usage
 
+- Use TypeScript for all code; prefer interfaces over types.
+- Avoid enums; use maps instead.
+- Use functional components with TypeScript interfaces.
 
+Syntax and Formatting
 
+- Use the "function" keyword for pure functions.
+- Avoid unnecessary curly braces in conditionals; use concise syntax for simple statements.
+- Use declarative JSX.
+
+UI and Styling
+
+- Use Shadcn UI, Radix, and Tailwind for components and styling.
+- Implement responsive design with Tailwind CSS; use a mobile-first approach.
+
+General Guidelines
+
+- Care uses a custom useQuery hook to fetch data from the API. (Docs @ /Utils/request/useQuery)
+- APIs are defined in the api.tsx file.

From c58de1777e8945a41b26690be3f73e055d19d143 Mon Sep 17 00:00:00 2001
From: Swanand Shekhar Bhuskute
 <103440604+SwanandBhuskute@users.noreply.github.com>
Date: Fri, 29 Nov 2024 18:27:32 +0530
Subject: [PATCH 20/37] fixing back button for camera asset (#9246)

---
 src/components/CameraFeed/ConfigureCamera.tsx | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/src/components/CameraFeed/ConfigureCamera.tsx b/src/components/CameraFeed/ConfigureCamera.tsx
index f969ed2b0ca..eec453053d6 100644
--- a/src/components/CameraFeed/ConfigureCamera.tsx
+++ b/src/components/CameraFeed/ConfigureCamera.tsx
@@ -89,16 +89,15 @@ export default function ConfigureCamera(props: Props) {
 
   const firstBedId =
     linkedAssetBeds?.[0]?.bed_object.id ?? unlinkedBeds?.[0]?.id;
-  useEffect(() => {
-    if (!query.bed && firstBedId) {
-      setQuery({ bed: firstBedId });
-    }
-  }, [query.bed, firstBedId]);
+
+  const selectedBedId = query.bed || firstBedId;
 
   const selectedAssetBed = linkedAssetBeds?.find(
-    (a) => a.bed_object.id === query.bed,
+    (a) => a.bed_object.id === selectedBedId,
+  );
+  const selectedUnlinkedBed = unlinkedBeds?.find(
+    (bed) => bed.id === selectedBedId,
   );
-  const selectedUnlinkedBed = unlinkedBeds?.find((bed) => bed.id === query.bed);
 
   const cameraPresetsQuery = useQuery(FeedRoutes.listAssetBedPresets, {
     pathParams: { assetbed_id: selectedAssetBed?.id ?? "" },

From 59cc025ee2026213392a9337a2bcc89baec7e783 Mon Sep 17 00:00:00 2001
From: Anvesh Nalimela <151531961+AnveshNalimela@users.noreply.github.com>
Date: Sat, 30 Nov 2024 05:57:40 +0530
Subject: [PATCH 21/37] Rewriting UsersCreation.cy.ts according to POM approach
 (#8930)

Co-authored-by: Mohammed Nihal <57055998+nihal467@users.noreply.github.com>
---
 .../e2e/facility_spec/FacilityLocation.cy.ts  |   5 +-
 cypress/e2e/users_spec/UsersCreation.cy.ts    | 215 +++++++++---------
 cypress/e2e/users_spec/UsersManage.cy.ts      |   7 +-
 cypress/e2e/users_spec/UsersProfile.cy.ts     |  15 +-
 cypress/pageobject/Users/UserCreation.ts      |  79 +++----
 cypress/pageobject/Users/UserProfilePage.ts   |  42 ++--
 cypress/pageobject/utils/constants.ts         |  11 +-
 7 files changed, 179 insertions(+), 195 deletions(-)

diff --git a/cypress/e2e/facility_spec/FacilityLocation.cy.ts b/cypress/e2e/facility_spec/FacilityLocation.cy.ts
index 9ac85e9ba4c..19c43d4dcf4 100644
--- a/cypress/e2e/facility_spec/FacilityLocation.cy.ts
+++ b/cypress/e2e/facility_spec/FacilityLocation.cy.ts
@@ -36,6 +36,7 @@ describe("Location Management Section", () => {
   const bedType = "ICU";
   const bedStatus = "Vacant";
   const bedModifiedName = "test modified bed";
+  const duplicateBedName = "ICCU";
   const bedModifiedDescrption = "test modified description";
   const bedModifiedType = "Isolation";
   const numberOfBeds = 10;
@@ -96,12 +97,12 @@ describe("Location Management Section", () => {
     facilityHome.verifyAndCloseNotifyModal();
     // edit the created bed
     facilityLocation.clickEditBedButton();
-    facilityLocation.enterBedName(bedModifiedName);
+    facilityLocation.enterBedName(duplicateBedName);
     facilityLocation.enterBedDescription(bedModifiedDescrption);
     facilityLocation.selectBedType(bedModifiedType);
     assetPage.clickassetupdatebutton();
     // verify the modification
-    facilityLocation.verifyBedNameBadge(bedModifiedName);
+    facilityLocation.verifyBedNameBadge(duplicateBedName);
     facilityLocation.verifyBedBadge(bedModifiedType);
     facilityLocation.verifyBedBadge(bedStatus);
     facilityLocation.closeNotification();
diff --git a/cypress/e2e/users_spec/UsersCreation.cy.ts b/cypress/e2e/users_spec/UsersCreation.cy.ts
index f495a136d97..96b953a3e17 100644
--- a/cypress/e2e/users_spec/UsersCreation.cy.ts
+++ b/cypress/e2e/users_spec/UsersCreation.cy.ts
@@ -1,3 +1,6 @@
+import ManageUserPage from "pageobject/Users/ManageUserPage";
+import UserProfilePage from "pageobject/Users/UserProfilePage";
+
 import { AssetSearchPage } from "../../pageobject/Asset/AssetSearch";
 import FacilityPage from "../../pageobject/Facility/FacilityCreation";
 import LoginPage from "../../pageobject/Login/LoginPage";
@@ -11,13 +14,15 @@ import {
 describe("User Creation", () => {
   const userPage = new UserPage();
   const loginPage = new LoginPage();
+  const userProfilePage = new UserProfilePage();
+  const manageUserPage = new ManageUserPage();
   const userCreationPage = new UserCreationPage();
   const facilityPage = new FacilityPage();
   const assetSearchPage = new AssetSearchPage();
-  const phone_number = generatePhoneNumber();
-  const emergency_phone_number = generateEmergencyPhoneNumber();
+  const phoneNumber = generatePhoneNumber();
+  const emergencyPhoneNumber = generateEmergencyPhoneNumber();
   const fillFacilityName = "Dummy Facility 40";
-  const makeid = (length: number) => {
+  const makeId = (length: number) => {
     let result = "";
     const characters = "abcdefghijklmnopqrstuvwxyz0123456789";
     const charactersLength = characters.length;
@@ -26,8 +31,8 @@ describe("User Creation", () => {
     }
     return result;
   };
-  const username = makeid(8);
-  const alreadylinkedusersviews = [
+  const username = makeId(8);
+  const alreadyLinkedUsersViews = [
     "devdoctor",
     "devstaff2",
     "devdistrictadmin",
@@ -53,6 +58,25 @@ describe("User Creation", () => {
     "This field is required",
     "Please enter valid phone number",
   ];
+  const userName = "devdistrictadmin";
+  const firstName = "District Editted";
+  const lastName = "Cypress";
+  const gender = "Male";
+  const email = "test@test.com";
+  const password = "Test@123";
+  const qualification = "MBBS";
+  const experience = "2";
+  const regNo = "123456789";
+  const newUserFirstName = "cypress test";
+  const newUserLastName = "staff user";
+  const state = "Kerala";
+  const district = "Ernakulam";
+  const role = "Doctor";
+  const homeFacility = "Dummy Shifting Center";
+  const weeklyWorkingHrs = "14";
+  const dob = "01011998";
+  const formattedDob = "01/01/1998";
+  const newUserDob = "25081999";
 
   before(() => {
     loginPage.loginAsDistrictAdmin();
@@ -66,123 +90,92 @@ describe("User Creation", () => {
   });
 
   it("Update the existing user profile and verify its reflection", () => {
-    userCreationPage.clickElementById("user-profile-name");
-    userCreationPage.clickElementById("profile-button");
-    userCreationPage.verifyElementContainsText(
-      "username-profile-details",
-      "devdistrictadmin",
-    );
-    userCreationPage.clickElementById("edit-cancel-profile-button");
-    userCreationPage.typeIntoElementByIdPostClear(
-      "firstName",
-      "District Editted",
-    );
-    userCreationPage.typeIntoElementByIdPostClear("lastName", "Cypress");
-    userCreationPage.selectDropdownOption("gender", "Male");
-    userCreationPage.typeIntoElementByIdPostClear("phoneNumber", phone_number);
-    userCreationPage.typeIntoElementByIdPostClear(
-      "altPhoneNumber",
-      emergency_phone_number,
-    );
-    userCreationPage.typeIntoElementByIdPostClear("email", "test@test.com");
-    userCreationPage.typeIntoElementByIdPostClear("weekly_working_hours", "14");
-    userCreationPage.typeIntoElementByIdPostClearDob(
-      "date_of_birth",
-      "01011998",
-    );
-    userCreationPage.clickElementById("submit");
-    userCreationPage.verifyElementContainsText(
-      "contactno-profile-details",
-      "+91" + phone_number,
-    );
-    userCreationPage.verifyElementContainsText(
-      "whatsapp-profile-details",
-      "+91" + emergency_phone_number,
-    );
-    userCreationPage.verifyElementContainsText(
-      "firstname-profile-details",
-      "District Editted",
-    );
-    userCreationPage.verifyElementContainsText(
-      "lastname-profile-details",
-      "Cypress",
-    );
-    userCreationPage.verifyElementContainsText(
-      "date_of_birth-profile-details",
-      "01/01/1998",
-    );
-    userCreationPage.verifyElementContainsText(
-      "emailid-profile-details",
-      "test@test.com",
-    );
-    userCreationPage.verifyElementContainsText(
-      "gender-profile-details",
-      "Male",
-    );
-    userCreationPage.verifyElementContainsText(
-      "averageworkinghour-profile-details",
-      "14",
-    );
+    manageUserPage.navigateToProfile();
+    cy.verifyContentPresence("#username-profile-details", [userName]);
+    userProfilePage.clickEditProfileButton();
+    userCreationPage.clearFirstName();
+    userCreationPage.typeFirstName(firstName);
+    userCreationPage.clearLastName();
+    userCreationPage.typeLastName(lastName);
+    userProfilePage.selectGender(gender);
+    userProfilePage.clearPhoneNumber();
+    userProfilePage.typePhoneNumber(phoneNumber);
+    userProfilePage.clearAltPhoneNumber();
+    userProfilePage.typeWhatsappNumber(emergencyPhoneNumber);
+    userProfilePage.clearEmail();
+    userProfilePage.typeEmail(email);
+    userProfilePage.clearWorkingHours();
+    userProfilePage.typeWorkingHours(weeklyWorkingHrs);
+    userProfilePage.typeDateOfBirth(dob);
+    cy.intercept("PATCH", "/api/v1/users/*").as("updateUser");
+    userProfilePage.clickUpdateButton();
+    cy.wait("@updateUser").its("response.statusCode").should("eq", 200);
+    cy.verifyContentPresence("#contactno-profile-details", [
+      "+91" + phoneNumber,
+    ]);
+    cy.verifyContentPresence("#whatsapp-profile-details", [
+      "+91" + emergencyPhoneNumber,
+    ]);
+    cy.verifyContentPresence("#firstname-profile-details", [firstName]);
+    cy.verifyContentPresence("#lastname-profile-details", [lastName]);
+    cy.verifyContentPresence("#date_of_birth-profile-details", [formattedDob]);
+    cy.verifyContentPresence("#emailid-profile-details", [email]);
+    cy.verifyContentPresence("#gender-profile-details", [gender]);
+    cy.verifyContentPresence("#averageworkinghour-profile-details", [
+      weeklyWorkingHrs,
+    ]);
   });
 
   it("Update the existing user profile Form Mandatory File Error", () => {
-    userCreationPage.clickElementById("user-profile-name");
-    userCreationPage.clickElementById("profile-button");
-    userCreationPage.clickElementById("edit-cancel-profile-button");
-    userCreationPage.clearIntoElementById("firstName");
-    userCreationPage.clearIntoElementById("lastName");
-    userCreationPage.clearIntoElementById("phoneNumber");
-    userCreationPage.clearIntoElementById("altPhoneNumber");
-    userCreationPage.clearIntoElementById("weekly_working_hours");
-    userCreationPage.clickElementById("submit");
+    manageUserPage.navigateToProfile();
+    userProfilePage.clickEditProfileButton();
+    userCreationPage.clearFirstName();
+    userCreationPage.clearLastName();
+    userProfilePage.clearPhoneNumber();
+    userProfilePage.clearAltPhoneNumber();
+    userProfilePage.clearWorkingHours();
+    userProfilePage.clickUpdateButton();
     userCreationPage.verifyErrorMessages(EXPECTED_PROFILE_ERROR_MESSAGES);
   });
 
   it("create new user and verify reflection", () => {
-    userCreationPage.clickElementById("addUserButton");
-    userCreationPage.selectFacility("Dummy Shifting Center");
-    userCreationPage.typeIntoElementById("username", username);
-    userCreationPage.typeIntoElementById("password", "Test@123");
-    userCreationPage.selectHomeFacility("Dummy Shifting Center");
-    userCreationPage.typeIntoElementById("phone_number", phone_number);
-    userCreationPage.setInputDate("date_of_birth", "25081999");
-    userCreationPage.selectDropdownOption("user_type", "Doctor");
-    userCreationPage.typeIntoElementById("c_password", "Test@123");
-    userCreationPage.typeIntoElementById("qualification", "MBBS");
-    userCreationPage.typeIntoElementById("doctor_experience_commenced_on", "2");
-    userCreationPage.typeIntoElementById(
-      "doctor_medical_council_registration",
-      "123456789",
-    );
-    userCreationPage.typeIntoElementById("first_name", "cypress test");
-    userCreationPage.typeIntoElementById("last_name", "staff user");
-    userCreationPage.typeIntoElementById("email", "test@test.com");
-    userCreationPage.selectDropdownOption("gender", "Male");
-    userCreationPage.selectDropdownOption("state", "Kerala");
-    userCreationPage.selectDropdownOption("district", "Ernakulam");
-    userCreationPage.clickElementById("submit");
-    userCreationPage.verifyNotification("User added successfully");
+    userCreationPage.clickAddUserButton();
+    userCreationPage.selectFacility(homeFacility);
+    userCreationPage.typeUserName(username);
+    userCreationPage.typePassword(password);
+    userCreationPage.typeConfirmPassword(password);
+    userCreationPage.selectHomeFacility(homeFacility);
+    userPage.typeInPhoneNumber(phoneNumber);
+    userProfilePage.typeDateOfBirth(newUserDob);
+    userCreationPage.selectUserType(role);
+    userProfilePage.typeQualification(qualification);
+    userProfilePage.typeDoctorYoE(experience);
+    userProfilePage.typeMedicalCouncilRegistration(regNo);
+    userPage.typeInFirstName(newUserFirstName);
+    userPage.typeInLastName(newUserLastName);
+    userProfilePage.typeEmail(email);
+    userCreationPage.selectGender(gender);
+    userCreationPage.selectState(state);
+    userCreationPage.selectDistrict(district);
+    cy.intercept("POST", "/api/v1/users/add_user/").as("createUser");
+    userCreationPage.clickSaveUserButton();
+    cy.wait("@createUser").its("response.statusCode").should("eq", 201);
+    cy.verifyNotification("User added successfully");
     userPage.typeInSearchInput(username);
     userPage.checkUsernameText(username);
-    userCreationPage.verifyElementContainsText("name", "cypress test");
-    userCreationPage.verifyElementContainsText("role", "Doctor");
-    userCreationPage.verifyElementContainsText("district", "Ernakulam");
-    userCreationPage.verifyElementContainsText(
-      "home_facility",
-      "Dummy Shifting Center",
-    );
-    userCreationPage.verifyElementContainsText("qualification", "MBBS");
-    userCreationPage.verifyElementContainsText("doctor-experience", "2");
-    userCreationPage.verifyElementContainsText(
-      "medical-council-registration",
-      "123456789",
-    );
+    cy.verifyContentPresence("#name", [newUserFirstName]);
+    cy.verifyContentPresence("#role", [role]);
+    cy.verifyContentPresence("#district", [district]);
+    cy.verifyContentPresence("#home_facility", [homeFacility]);
+    cy.verifyContentPresence("#qualification", [qualification]);
+    cy.verifyContentPresence("#doctor-experience", [experience]);
+    cy.verifyContentPresence("#medical-council-registration", [regNo]);
   });
 
   it("create new user form throwing mandatory field error", () => {
-    userCreationPage.clickElementById("addUserButton");
-    userCreationPage.clickElementById("submit");
-    cy.wait(2000);
+    userCreationPage.clickAddUserButton();
+    userCreationPage.clickSaveUserButton();
+    cy.get(".error-text", { timeout: 10000 }).should("be.visible");
     userCreationPage.verifyErrorMessages(EXPECTED_ERROR_MESSAGES);
   });
 
@@ -194,7 +187,7 @@ describe("User Creation", () => {
     facilityPage.visitAlreadyCreatedFacility();
     facilityPage.clickManageFacilityDropdown();
     facilityPage.clickViewUsersOption();
-    userPage.verifyMultipleBadgesWithSameId(alreadylinkedusersviews);
+    userPage.verifyMultipleBadgesWithSameId(alreadyLinkedUsersViews);
   });
 
   afterEach(() => {
diff --git a/cypress/e2e/users_spec/UsersManage.cy.ts b/cypress/e2e/users_spec/UsersManage.cy.ts
index 40d436be0a6..74baee3deac 100644
--- a/cypress/e2e/users_spec/UsersManage.cy.ts
+++ b/cypress/e2e/users_spec/UsersManage.cy.ts
@@ -2,7 +2,6 @@ import { advanceFilters } from "pageobject/utils/advanceFilterHelpers";
 
 import LoginPage from "../../pageobject/Login/LoginPage";
 import ManageUserPage from "../../pageobject/Users/ManageUserPage";
-import { UserCreationPage } from "../../pageobject/Users/UserCreation";
 import { UserPage } from "../../pageobject/Users/UserSearch";
 
 describe("Manage User", () => {
@@ -15,7 +14,6 @@ describe("Manage User", () => {
   const usernameToLinkSkill = "devdoctor";
   const firstNameUserSkill = "Dev";
   const lastNameUserSkill = "Doctor";
-  const userCreationPage = new UserCreationPage();
   const usernameforworkinghour = "devdistrictadmin";
   const usernamerealname = "Dummy Doctor";
   const facilitytolinkusername = "Dummy Shifting Center";
@@ -48,10 +46,9 @@ describe("Manage User", () => {
     manageUserPage.clickCloseSlideOver();
     cy.wait(5000);
     manageUserPage.navigateToProfile();
-    userCreationPage.verifyElementContainsText(
-      "username-profile-details",
+    cy.verifyContentPresence("#username-profile-details", [
       usernameforworkinghour,
-    );
+    ]);
     manageUserPage.assertSkillInAlreadyLinkedSkills(linkedskill);
   });
 
diff --git a/cypress/e2e/users_spec/UsersProfile.cy.ts b/cypress/e2e/users_spec/UsersProfile.cy.ts
index 35771024180..32b812a188f 100644
--- a/cypress/e2e/users_spec/UsersProfile.cy.ts
+++ b/cypress/e2e/users_spec/UsersProfile.cy.ts
@@ -32,25 +32,22 @@ describe("Manage User Profile", () => {
   it("Set Dob, Gender, Email, Phone and Working Hours for a user and verify its reflection in user profile", () => {
     userProfilePage.clickEditProfileButton();
 
-    userProfilePage.typedate_of_birth(date_of_birth);
+    userProfilePage.typeDateOfBirth(date_of_birth);
     userProfilePage.selectGender(gender);
     userProfilePage.typeEmail(email);
-    userProfilePage.typePhone(phone);
-    userProfilePage.typeWhatsApp(phone);
+    userProfilePage.typePhoneNumber(phone);
+    userProfilePage.typeWhatsappNumber(phone);
     userProfilePage.typeWorkingHours(workinghours);
     userProfilePage.typeQualification(qualification);
     userProfilePage.typeDoctorYoE(doctorYoE);
     userProfilePage.typeMedicalCouncilRegistration(medicalCouncilRegistration);
-
     userProfilePage.clickUpdateButton();
-
     cy.verifyNotification("Details updated successfully");
-
-    userProfilePage.assertdate_of_birth("01/01/1999");
+    userProfilePage.assertDateOfBirth("01/01/1999");
     userProfilePage.assertGender(gender);
     userProfilePage.assertEmail(email);
-    userProfilePage.assertPhone(phone);
-    userProfilePage.assertWhatsApp(phone);
+    userProfilePage.assertPhoneNumber(phone);
+    userProfilePage.assertAltPhoneNumber(phone);
     userProfilePage.assertWorkingHours(workinghours);
   });
 
diff --git a/cypress/pageobject/Users/UserCreation.ts b/cypress/pageobject/Users/UserCreation.ts
index 906c07e797a..72157861f2c 100644
--- a/cypress/pageobject/Users/UserCreation.ts
+++ b/cypress/pageobject/Users/UserCreation.ts
@@ -1,69 +1,52 @@
 // UserCreation.ts
 export class UserCreationPage {
-  clickElementById(elementId: string) {
-    cy.get("#" + elementId).click();
+  clickAddUserButton() {
+    cy.verifyAndClickElement("#addUserButton", "Add New User");
   }
-
-  typeIntoElementById(elementId: string, value: string) {
-    cy.get("#" + elementId)
-      .click()
-      .type(value);
+  typeUserName(username: string) {
+    cy.get("#username").click().type(username);
   }
-
-  typeIntoElementByIdPostClear(elementId: string, value: string) {
-    cy.get("#" + elementId)
-      .click()
-      .clear()
-      .click()
-      .type(value);
+  typeFirstName(firstName: string) {
+    cy.get("#firstName").click().type(firstName);
   }
-  typeIntoElementByIdPostClearDob(elementId: string, value: string) {
-    cy.clickAndTypeDate("#" + elementId, value);
+  typeLastName(lastName: string) {
+    cy.get("#lastName").click().type(lastName);
   }
-  clearIntoElementById(elementId: string) {
-    cy.get("#" + elementId)
-      .click()
-      .clear();
+  typePassword(password: string) {
+    cy.get("#password").click().type(password);
   }
-
-  typeIntoInputByName(inputName: string, value: string) {
-    cy.get("input[name='" + inputName + "']")
-      .click()
-      .type(value);
+  typeConfirmPassword(password: string) {
+    cy.get("#c_password").click().type(password);
   }
-
-  selectOptionContainingText(text: string) {
-    cy.get("[role='option']").contains(text).click();
+  clearFirstName() {
+    cy.get("#firstName").click().clear();
   }
-
-  verifyNotification(message: string) {
-    cy.verifyNotification(message);
+  clearLastName() {
+    cy.get("#lastName").click().clear();
   }
-
-  selectFacility(name: string) {
-    this.typeIntoInputByName("facilities", name);
-    this.selectOptionContainingText(name);
-    cy.get("input[name='facilities'] + button")
-      .find("#dropdown-toggle")
-      .click();
+  selectUserType(role: string) {
+    cy.clickAndSelectOption("#user_type", role);
   }
-
   selectHomeFacility(name: string) {
-    this.clickElementById("home_facility");
-    this.selectOptionContainingText(name);
+    cy.clickAndSelectOption("#home_facility", name);
   }
 
-  setInputDate(dateElementId: string, dateValue: string) {
-    cy.clickAndTypeDate("#" + dateElementId, dateValue);
+  selectGender(gender: string) {
+    cy.clickAndSelectOption("#gender", gender);
+  }
+  selectState(state: string) {
+    cy.clickAndSelectOption("#state", state);
+  }
+  selectDistrict(district: string) {
+    cy.clickAndSelectOption("#district", district);
   }
 
-  selectDropdownOption(dropdownId: string, optionText: string) {
-    this.clickElementById(dropdownId);
-    this.selectOptionContainingText(optionText);
+  selectFacility(name: string) {
+    cy.typeAndSelectOption("input[name='facilities']", name);
   }
 
-  verifyElementContainsText(elementId: string, expectedText: string) {
-    cy.get("#" + elementId).should("contain.text", expectedText);
+  clickSaveUserButton() {
+    cy.clickSubmitButton("Save User");
   }
 
   verifyErrorMessages(errorMessages: string[]) {
diff --git a/cypress/pageobject/Users/UserProfilePage.ts b/cypress/pageobject/Users/UserProfilePage.ts
index 3744c5a5d82..882be0b7b9b 100644
--- a/cypress/pageobject/Users/UserProfilePage.ts
+++ b/cypress/pageobject/Users/UserProfilePage.ts
@@ -12,11 +12,24 @@ export default class UserProfilePage {
   }
 
   clickUpdateButton() {
-    cy.get("#submit").click();
+    cy.clickSubmitButton("Update");
   }
 
-  typedate_of_birth(date_of_birth: string) {
-    cy.clickAndTypeDate("#date_of_birth", date_of_birth);
+  typeDateOfBirth(dob: string) {
+    cy.clickAndTypeDate("#date_of_birth", dob);
+  }
+
+  clearPhoneNumber() {
+    cy.get("#phoneNumber").click().clear();
+  }
+  clearAltPhoneNumber() {
+    cy.get("#altPhoneNumber").click().clear();
+  }
+  clearWorkingHours() {
+    cy.get("#weekly_working_hours").click().clear();
+  }
+  clearEmail() {
+    cy.get("#email").click().clear();
   }
 
   selectGender(gender: string) {
@@ -28,16 +41,16 @@ export default class UserProfilePage {
     cy.get("#email").click().clear().type(email);
   }
 
-  typePhone(phone: string) {
+  typePhoneNumber(phone: string) {
     cy.get("#phoneNumber").click().clear().type(phone);
   }
 
-  typeWhatsApp(phone: string) {
+  typeWhatsappNumber(phone: string) {
     cy.get("#altPhoneNumber").click().clear().type(phone);
   }
 
-  typeWorkingHours(workinghours: string) {
-    cy.get("#weekly_working_hours").click().clear().type(workinghours);
+  typeWorkingHours(workingHours: string) {
+    cy.get("#weekly_working_hours").click().clear().type(workingHours);
   }
 
   typeQualification = (qualification: string) => {
@@ -55,11 +68,8 @@ export default class UserProfilePage {
       .type(medicalCouncilRegistration);
   };
 
-  assertdate_of_birth(date_of_birth: string) {
-    cy.get("#date_of_birth-profile-details").should(
-      "contain.text",
-      date_of_birth,
-    );
+  assertDateOfBirth(dob: string) {
+    cy.get("#date_of_birth-profile-details").should("contain.text", dob);
   }
 
   assertGender(gender: string) {
@@ -70,18 +80,18 @@ export default class UserProfilePage {
     cy.get("#emailid-profile-details").should("contain.text", email);
   }
 
-  assertPhone(phone: string) {
+  assertPhoneNumber(phone: string) {
     cy.get("#contactno-profile-details").should("contain.text", phone);
   }
 
-  assertWhatsApp(phone: string) {
+  assertAltPhoneNumber(phone: string) {
     cy.get("#whatsapp-profile-details").should("contain.text", phone);
   }
 
-  assertWorkingHours(workinghours: string) {
+  assertWorkingHours(workingHours: string) {
     cy.get("#averageworkinghour-profile-details").should(
       "contain.text",
-      workinghours,
+      workingHours,
     );
   }
 }
diff --git a/cypress/pageobject/utils/constants.ts b/cypress/pageobject/utils/constants.ts
index 08411e84b6a..053d0561ce8 100644
--- a/cypress/pageobject/utils/constants.ts
+++ b/cypress/pageobject/utils/constants.ts
@@ -1,7 +1,10 @@
-export function generatePhoneNumber() {
-  return "9" + Math.floor(100000000 + Math.random() * 900000000).toString();
+export function generatePhoneNumber(): string {
+  const array = new Uint32Array(1);
+  window.crypto.getRandomValues(array);
+  const randomNum = (array[0] % 900000000) + 100000000;
+  return "9" + randomNum.toString();
 }
 
-export function generateEmergencyPhoneNumber() {
-  return "9" + Math.floor(100000000 + Math.random() * 900000000).toString();
+export function generateEmergencyPhoneNumber(): string {
+  return generatePhoneNumber();
 }

From 7d56fdc69265b21c8ebc60f7fffc97e4ad5612df Mon Sep 17 00:00:00 2001
From: Rajab Shoukath Kunnath <142793649+rayyjeb@users.noreply.github.com>
Date: Sat, 30 Nov 2024 09:47:35 +0530
Subject: [PATCH 22/37] Fixed Breadcrumb to Display Detailed Name Instead of ID
 (#9200)

---
 src/components/Patient/SampleDetails.tsx | 1 +
 src/components/Patient/models.tsx        | 2 +-
 src/components/Shifting/ShiftDetails.tsx | 3 +++
 3 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/components/Patient/SampleDetails.tsx b/src/components/Patient/SampleDetails.tsx
index edc0b4d53a6..abf099a6e7d 100644
--- a/src/components/Patient/SampleDetails.tsx
+++ b/src/components/Patient/SampleDetails.tsx
@@ -300,6 +300,7 @@ export const SampleDetails = ({ id }: DetailRoute) => {
   return (
     <Page
       title={t("sample_test_details")}
+      crumbsReplacements={{ [id]: { name: sampleDetails.patient_name } }}
       backUrl="/sample"
       options={
         sampleDetails?.patient && (
diff --git a/src/components/Patient/models.tsx b/src/components/Patient/models.tsx
index 85614e707d5..2b1c3c84d0c 100644
--- a/src/components/Patient/models.tsx
+++ b/src/components/Patient/models.tsx
@@ -165,7 +165,7 @@ export interface SampleTestModel {
   date_of_sample?: string;
   date_of_result?: string;
   consultation?: number;
-  patient_name?: number;
+  patient_name?: string;
   patient_has_sari?: boolean;
   patient_has_confirmed_contact?: boolean;
   patient_has_suspected_contact?: boolean;
diff --git a/src/components/Shifting/ShiftDetails.tsx b/src/components/Shifting/ShiftDetails.tsx
index cac6b5c41ca..3eeb440a1b1 100644
--- a/src/components/Shifting/ShiftDetails.tsx
+++ b/src/components/Shifting/ShiftDetails.tsx
@@ -478,6 +478,9 @@ export default function ShiftDetails(props: { id: string }) {
       ) : (
         <Page
           title={t("shifting_details")}
+          crumbsReplacements={{
+            [props.id]: { name: data?.patient_object?.name },
+          }}
           backUrl="/shifting/board"
           options={
             <div className="flex gap-2">

From f2a96983f225789bd6758ef4b4ef8682091f71e1 Mon Sep 17 00:00:00 2001
From: Mahendar Chikolla <119734520+Mahendar0701@users.noreply.github.com>
Date: Sat, 30 Nov 2024 10:06:09 +0530
Subject: [PATCH 23/37] Fix : Advanced Filters Autofilling on Revisit to
 Patient Tab (#9251)

---
 src/components/Patient/ManagePatients.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/components/Patient/ManagePatients.tsx b/src/components/Patient/ManagePatients.tsx
index 0664532b0a1..9507ce3d8d7 100644
--- a/src/components/Patient/ManagePatients.tsx
+++ b/src/components/Patient/ManagePatients.tsx
@@ -1143,7 +1143,10 @@ export const PatientManager = () => {
         />
       </div>
       <div>
-        <PatientFilter {...advancedFilter} key={window.location.search} />
+        <PatientFilter
+          {...advancedFilter}
+          key={JSON.stringify(advancedFilter.filter)}
+        />
         <TabPanel value={tabValue} index={0}>
           <div className="mb-4">{managePatients}</div>
         </TabPanel>

From 66326dd053cffbb7020f4381ad397217b4de2698 Mon Sep 17 00:00:00 2001
From: Don Xavier <98073418+DonXavierdev@users.noreply.github.com>
Date: Sat, 30 Nov 2024 10:09:06 +0530
Subject: [PATCH 24/37] Add edit button to immunisation section; replaced
 buttons with shadcn buttons across PatientsDetail section (#9245)

---
 .../Patient/PatientDetailsTab/Demography.tsx  | 54 +++++++++----------
 .../HealthProfileSummary.tsx                  | 12 +++--
 .../PatientDetailsTab/ImmunisationRecords.tsx | 12 +++--
 3 files changed, 41 insertions(+), 37 deletions(-)

diff --git a/src/components/Patient/PatientDetailsTab/Demography.tsx b/src/components/Patient/PatientDetailsTab/Demography.tsx
index 2a412f03f9a..b9d2b8fece4 100644
--- a/src/components/Patient/PatientDetailsTab/Demography.tsx
+++ b/src/components/Patient/PatientDetailsTab/Demography.tsx
@@ -5,8 +5,9 @@ import { useTranslation } from "react-i18next";
 
 import Chip from "@/CAREUI/display/Chip";
 import CareIcon from "@/CAREUI/icons/CareIcon";
+import AuthorizedChild from "@/CAREUI/misc/AuthorizedChild";
 
-import ButtonV2 from "@/components/Common/ButtonV2";
+import { Button } from "@/components/ui/button";
 
 import useAuthUser from "@/hooks/useAuthUser";
 
@@ -312,10 +313,9 @@ export const Demography = (props: PatientProps) => {
                 {t("no_data_found")}
               </div>
             )}
-          <ButtonV2
-            border
+          <Button
+            variant="outline_primary"
             className="mt-4"
-            ghost
             disabled={!patientData.is_active}
             onClick={withPermissionCheck(() =>
               handleEditClick("insurance-details"),
@@ -323,7 +323,7 @@ export const Demography = (props: PatientProps) => {
           >
             <CareIcon icon="l-plus" className="" />
             {t("add_insurance_details")}
-          </ButtonV2>
+          </Button>
         </div>,
       ],
     },
@@ -373,21 +373,24 @@ export const Demography = (props: PatientProps) => {
               </div>
             </div>
             <div>
-              <ButtonV2
-                id="update-patient-details"
-                variant="secondary"
-                className="mt-4  text-green-800 "
-                disabled={!patientData.is_active}
-                authorizeFor={NonReadOnlyUsers}
-                onClick={withPermissionCheck(() =>
-                  navigate(
-                    `/facility/${patientData?.facility}/patient/${id}/update`,
-                  ),
+              <AuthorizedChild authorizeFor={NonReadOnlyUsers}>
+                {({ isAuthorized }) => (
+                  <Button
+                    id="update-patient-details"
+                    variant="outline"
+                    className="mt-4"
+                    disabled={!patientData.is_active || !isAuthorized}
+                    onClick={withPermissionCheck(() =>
+                      navigate(
+                        `/facility/${patientData?.facility}/patient/${id}/update`,
+                      ),
+                    )}
+                  >
+                    <CareIcon icon="l-edit-alt" className="text-lg pr-1" />
+                    {t("edit_profile")}
+                  </Button>
                 )}
-              >
-                <CareIcon icon="l-edit-alt" className="text-lg" />
-                {t("edit_profile")}
-              </ButtonV2>
+              </AuthorizedChild>
             </div>
           </div>
           {/* <div className="mt-4 rounded-md border border-blue-400 bg-blue-50 p-5 grid grid-cols-1 gap-x-4 gap-y-2 md:grid-cols-2 md:gap-y-8 lg:grid-cols-2">
@@ -415,22 +418,19 @@ export const Demography = (props: PatientProps) => {
                   className="group mt-4 rounded-md bg-white pb-2 pl-5 pt-5 shadow"
                 >
                   <hr className="mb-1 mr-5 h-1 w-5 border-0 bg-blue-500" />
-                  <div className="flex flex-row gap-x-4 mb-4">
+                  <div className="flex flex-row items-center justify-between gap-x-4 mb-4 mr-4">
                     <h1 className="text-xl">{t(`patient__${subtab.id}`)}</h1>
                     {subtab.allowEdit && (
-                      <button
-                        className="flex rounded border border-secondary-400 bg-white px-2 py-1 text-sm font-semibold text-green-800 hover:bg-secondary-200"
+                      <Button
+                        variant="outline"
                         disabled={!patientData.is_active}
                         onClick={withPermissionCheck(() =>
                           handleEditClick(subtab.id),
                         )}
                       >
-                        <CareIcon
-                          icon="l-edit-alt"
-                          className="text-md mr-1 mt-1"
-                        />
+                        <CareIcon icon="l-edit-alt" className="text-md pr-1" />
                         {t("edit")}
-                      </button>
+                      </Button>
                     )}
                   </div>
                   <div className="mb-8 mt-2 grid grid-cols-1 gap-x-4 gap-y-2 md:grid-cols-2 md:gap-y-8 lg:grid-cols-2">
diff --git a/src/components/Patient/PatientDetailsTab/HealthProfileSummary.tsx b/src/components/Patient/PatientDetailsTab/HealthProfileSummary.tsx
index 3fb6b60d330..374d5ede08b 100644
--- a/src/components/Patient/PatientDetailsTab/HealthProfileSummary.tsx
+++ b/src/components/Patient/PatientDetailsTab/HealthProfileSummary.tsx
@@ -3,6 +3,8 @@ import { useTranslation } from "react-i18next";
 
 import CareIcon from "@/CAREUI/icons/CareIcon";
 
+import { Button } from "@/components/ui/button";
+
 import { UserModel } from "@/components/Users/models";
 
 import useAuthUser from "@/hooks/useAuthUser";
@@ -56,12 +58,12 @@ export const HealthProfileSummary = (props: PatientProps) => {
       <div className="group my-2 w-full rounded bg-white p-4 shadow">
         <hr className="mb-1 mr-5 h-1 w-5 border-0 bg-blue-500" />
         <div className="h-full space-y-2">
-          <div className="flex flex-row">
+          <div className="flex flex-row items-center justify-between">
             <div className="mr-4 text-xl font-bold text-secondary-900">
               {t("medical")}
             </div>
-            <button
-              className="flex rounded border border-secondary-400 bg-white px-1 py-1 text-sm font-semibold text-green-800 hover:bg-secondary-200"
+            <Button
+              variant="outline"
               disabled={!patientData.is_active}
               aria-label="Edit medical history"
               onClick={() => {
@@ -74,9 +76,9 @@ export const HealthProfileSummary = (props: PatientProps) => {
                 }
               }}
             >
-              <CareIcon icon="l-edit-alt" className="text-md mr-1 mt-1" />
+              <CareIcon icon="l-edit-alt" className="text-md pr-1" />
               {t("edit")}
-            </button>
+            </Button>
           </div>
 
           <div className="mt-2 grid grid-cols-1 gap-x-4 gap-y-2 sm:grid-cols-2 md:gap-y-8">
diff --git a/src/components/Patient/PatientDetailsTab/ImmunisationRecords.tsx b/src/components/Patient/PatientDetailsTab/ImmunisationRecords.tsx
index eb298737f3c..7ee828868fc 100644
--- a/src/components/Patient/PatientDetailsTab/ImmunisationRecords.tsx
+++ b/src/components/Patient/PatientDetailsTab/ImmunisationRecords.tsx
@@ -3,6 +3,8 @@ import { useTranslation } from "react-i18next";
 
 import CareIcon from "@/CAREUI/icons/CareIcon";
 
+import { Button } from "@/components/ui/button";
+
 import { UserModel } from "@/components/Users/models";
 
 import useAuthUser from "@/hooks/useAuthUser";
@@ -40,10 +42,10 @@ export const ImmunisationRecords = (props: PatientProps) => {
       <div className="w-full rounded-md bg-white p-4 shadow-md">
         <hr className="mb-1 mr-5 h-1 w-5 border-0 bg-blue-500" />
         <div>
-          <div className="flex flex-row gap-x-4">
+          <div className="flex flex-row justify-between items-center gap-x-4">
             <h1 className="text-xl">{t("covid_details")}</h1>
-            <button
-              className="hidden rounded border border-secondary-400 bg-white px-1 py-1 text-sm font-semibold text-green-800 hover:bg-secondary-200 group-hover:flex"
+            <Button
+              variant="outline"
               disabled={!patientData.is_active}
               onClick={() => {
                 if (!canEditPatient(authUser, patientData)) {
@@ -55,9 +57,9 @@ export const ImmunisationRecords = (props: PatientProps) => {
                 }
               }}
             >
-              <CareIcon icon="l-edit-alt" className="text-md mr-1 mt-1" />
+              <CareIcon icon="l-edit-alt" className="text-md pr-1" />
               {t("edit")}
-            </button>
+            </Button>
           </div>
 
           <div className="mb-8 mt-2 grid grid-cols-1 gap-x-4 gap-y-2 md:grid-cols-2 md:gap-y-8 lg:grid-cols-2">

From 8118ccfa3c07d883336050b3fb694bffc735c14e Mon Sep 17 00:00:00 2001
From: HITMAN <112652819+ayushpatil2122@users.noreply.github.com>
Date: Sat, 30 Nov 2024 16:39:33 +0530
Subject: [PATCH 25/37] phone size responsive issue shifting details page
 (#9256)

---
 package-lock.json                        |  8 ++++----
 package.json                             |  2 +-
 src/components/Shifting/ShiftDetails.tsx | 13 +++++--------
 3 files changed, 10 insertions(+), 13 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 5c703af8fe1..97073c88ecb 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -92,7 +92,7 @@
         "eslint-plugin-react": "^7.37.2",
         "eslint-plugin-react-hooks": "^5.0.0",
         "glob": "^11.0.0",
-        "husky": "^9.1.6",
+        "husky": "^9.1.7",
         "jsdom": "^25.0.1",
         "lint-staged": "^15.2.10",
         "local-cypress": "^1.2.6",
@@ -10449,9 +10449,9 @@
       "license": "Unlicense"
     },
     "node_modules/husky": {
-      "version": "9.1.6",
-      "resolved": "https://registry.npmjs.org/husky/-/husky-9.1.6.tgz",
-      "integrity": "sha512-sqbjZKK7kf44hfdE94EoX8MZNk0n7HeW37O4YrVGCF4wzgQjp+akPAkfUK5LZ6KuR/6sqeAVuXHji+RzQgOn5A==",
+      "version": "9.1.7",
+      "resolved": "https://registry.npmjs.org/husky/-/husky-9.1.7.tgz",
+      "integrity": "sha512-5gs5ytaNjBrh5Ow3zrvdUUY+0VxIuWVL4i9irt6friV+BqdCfmV11CQTWMiBYWHbXhco+J1kHfTOUkePhCDvMA==",
       "dev": true,
       "license": "MIT",
       "bin": {
diff --git a/package.json b/package.json
index 020d73f5e65..798c910ea91 100644
--- a/package.json
+++ b/package.json
@@ -131,7 +131,7 @@
     "eslint-plugin-react": "^7.37.2",
     "eslint-plugin-react-hooks": "^5.0.0",
     "glob": "^11.0.0",
-    "husky": "^9.1.6",
+    "husky": "^9.1.7",
     "jsdom": "^25.0.1",
     "lint-staged": "^15.2.10",
     "local-cypress": "^1.2.6",
diff --git a/src/components/Shifting/ShiftDetails.tsx b/src/components/Shifting/ShiftDetails.tsx
index 3eeb440a1b1..bc97b0b0f24 100644
--- a/src/components/Shifting/ShiftDetails.tsx
+++ b/src/components/Shifting/ShiftDetails.tsx
@@ -483,25 +483,22 @@ export default function ShiftDetails(props: { id: string }) {
           }}
           backUrl="/shifting/board"
           options={
-            <div className="flex gap-2">
+            <div className="flex flex-wrap gap-2 mt-4">
               <ButtonV2
+                className="w-full sm:w-auto"
                 tooltip={
                   ["COMPLETED", "CANCELLED"].includes(data?.status || "")
                     ? `A shifting request, once ${data?.status.toLowerCase()} cannot be updated`
                     : ""
                 }
                 tooltipClassName="tooltip-top -translate-x-28 -translate-y-1 text-xs"
-                disabled={
-                  data?.status === "COMPLETED" || data?.status === "CANCELLED"
-                }
-                onClick={() =>
-                  navigate(`/shifting/${data?.external_id}/update`)
-                }
+                disabled={data?.status === "COMPLETED" || data?.status === "CANCELLED"}
+                onClick={() => navigate(`/shifting/${data?.external_id}/update`)}
               >
                 {t("update_status_details")}
               </ButtonV2>
 
-              <ButtonV2 onClick={() => setIsPrintMode(true)}>
+              <ButtonV2 className="w-full sm:w-auto" onClick={() => setIsPrintMode(true)}>
                 <CareIcon icon="l-file-alt" className="mr-2 text-base" />{" "}
                 {t("referral_letter")}
               </ButtonV2>

From f76c6250ec25c6d9216f58088ca4f9833e872743 Mon Sep 17 00:00:00 2001
From: Kamishetty Rishith <119791436+Rishith25@users.noreply.github.com>
Date: Sun, 1 Dec 2024 12:21:46 +0530
Subject: [PATCH 26/37] =?UTF-8?q?Fix:=20Reflect=20Updated=20Service=20Note?=
 =?UTF-8?q?s=20Immediately=20in=20Asset=20Details=20without=C2=A0page?=
 =?UTF-8?q?=C2=A0reload=20(#9226)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Assets/AssetManage.tsx    | 11 +++++++++--
 src/components/Shifting/ShiftDetails.tsx | 13 ++++++++++---
 2 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/src/components/Assets/AssetManage.tsx b/src/components/Assets/AssetManage.tsx
index c78be71d627..b4377d2e1aa 100644
--- a/src/components/Assets/AssetManage.tsx
+++ b/src/components/Assets/AssetManage.tsx
@@ -69,7 +69,11 @@ const AssetManage = (props: AssetManageProps) => {
   >();
   const [transactionFilter, setTransactionFilter] = useState<any>({});
 
-  const { data: asset, loading } = useQuery(routes.getAsset, {
+  const {
+    data: asset,
+    loading,
+    refetch,
+  } = useQuery(routes.getAsset, {
     pathParams: {
       external_id: assetId,
     },
@@ -594,7 +598,10 @@ const AssetManage = (props: AssetManageProps) => {
           handleClose={() =>
             setServiceEditData({ ...serviceEditData, open: false })
           }
-          handleUpdate={() => serviceRefetch()}
+          handleUpdate={() => {
+            serviceRefetch();
+            refetch();
+          }}
           show={serviceEditData.open}
           viewOnly={serviceEditData.viewOnly}
         />
diff --git a/src/components/Shifting/ShiftDetails.tsx b/src/components/Shifting/ShiftDetails.tsx
index bc97b0b0f24..cb5140d6ed0 100644
--- a/src/components/Shifting/ShiftDetails.tsx
+++ b/src/components/Shifting/ShiftDetails.tsx
@@ -492,13 +492,20 @@ export default function ShiftDetails(props: { id: string }) {
                     : ""
                 }
                 tooltipClassName="tooltip-top -translate-x-28 -translate-y-1 text-xs"
-                disabled={data?.status === "COMPLETED" || data?.status === "CANCELLED"}
-                onClick={() => navigate(`/shifting/${data?.external_id}/update`)}
+                disabled={
+                  data?.status === "COMPLETED" || data?.status === "CANCELLED"
+                }
+                onClick={() =>
+                  navigate(`/shifting/${data?.external_id}/update`)
+                }
               >
                 {t("update_status_details")}
               </ButtonV2>
 
-              <ButtonV2 className="w-full sm:w-auto" onClick={() => setIsPrintMode(true)}>
+              <ButtonV2
+                className="w-full sm:w-auto"
+                onClick={() => setIsPrintMode(true)}
+              >
                 <CareIcon icon="l-file-alt" className="mr-2 text-base" />{" "}
                 {t("referral_letter")}
               </ButtonV2>

From 2d9669e75f4f5a04b803d64bfaae2e1d1fb2a0d9 Mon Sep 17 00:00:00 2001
From: Jacob John Jeevan <40040905+Jacobjeevan@users.noreply.github.com>
Date: Mon, 2 Dec 2024 14:22:44 +0530
Subject: [PATCH 27/37] Camera Preset Not Resetting on Re-selection Bug (#9186)

---
 public/locale/en.json                         |  2 +
 .../ConsultationFeedTab.tsx                   | 39 ++++++-------------
 2 files changed, 14 insertions(+), 27 deletions(-)

diff --git a/public/locale/en.json b/public/locale/en.json
index cd921bef06a..7e92d927a64 100644
--- a/public/locale/en.json
+++ b/public/locale/en.json
@@ -945,6 +945,7 @@
   "next_sessions": "Next Sessions",
   "no": "No",
   "no_attachments_found": "This communication has no attachments.",
+  "no_bed_asset_linked_allocated": "No bed/asset linked allocated",
   "no_bed_types_found": "No Bed Types found",
   "no_beds_available": "No beds available",
   "no_changes": "No changes",
@@ -1364,6 +1365,7 @@
   "update_facility_middleware_success": "Facility middleware updated successfully",
   "update_log": "Update Log",
   "update_patient_details": "Update Patient Details",
+  "update_preset": "Update Preset",
   "update_preset_position_to_current": "Update preset's position to camera's current position",
   "update_record": "Update Record",
   "update_record_for_asset": "Update record for asset",
diff --git a/src/components/Facility/ConsultationDetails/ConsultationFeedTab.tsx b/src/components/Facility/ConsultationDetails/ConsultationFeedTab.tsx
index 21c6f304cb5..bc518feb02f 100644
--- a/src/components/Facility/ConsultationDetails/ConsultationFeedTab.tsx
+++ b/src/components/Facility/ConsultationDetails/ConsultationFeedTab.tsx
@@ -34,6 +34,7 @@ export const ConsultationFeedTab = (props: ConsultationTabProps) => {
   const bed = props.consultationData.current_bed?.bed_object;
   const feedStateSessionKey = `encounterFeedState[${props.consultationId}]`;
   const [preset, setPreset] = useState<CameraPreset>();
+  const [selectedPreset, setSelectedPreset] = useState<CameraPreset>();
   const [showPresetSaveConfirmation, setShowPresetSaveConfirmation] =
     useState(false);
   const [isUpdatingPreset, setIsUpdatingPreset] = useState(false);
@@ -78,28 +79,14 @@ export const ConsultationFeedTab = (props: ConsultationTabProps) => {
               return presets.find((obj) => obj.id === lastState.value);
             }
             if (lastState.type === "position") {
-              const assetBedObj = presets.find(
-                (p) => p.asset_bed.id === lastState.assetBed,
-              )?.asset_bed;
-
-              if (!assetBedObj) {
-                return;
-              }
-
-              return {
-                ...presets[0],
-                id: "",
-                asset_bed: assetBedObj,
-                position: lastState.value,
-              } satisfies CameraPreset;
+              return;
             }
           }
         })() ?? presets[0];
 
-      console.log({ preset, presets });
-
       if (preset) {
         setPreset(preset);
+        setSelectedPreset(preset);
       }
     },
   });
@@ -126,6 +113,7 @@ export const ConsultationFeedTab = (props: ConsultationTabProps) => {
     await presetsQuery.refetch();
 
     setPreset(updated);
+    setSelectedPreset(updated);
     setHasMoved(false);
     setIsUpdatingPreset(false);
     setShowPresetSaveConfirmation(false);
@@ -154,7 +142,7 @@ export const ConsultationFeedTab = (props: ConsultationTabProps) => {
   }
 
   if (!bed || !asset) {
-    return <span>No bed/asset linked allocated</span>;
+    return <span>{t("no_bed_asset_linked_allocated")}</span>;
   }
 
   const cannotSaveToPreset = !hasMoved || !preset?.id;
@@ -162,8 +150,8 @@ export const ConsultationFeedTab = (props: ConsultationTabProps) => {
   return (
     <StillWatching>
       <ConfirmDialog
-        title="Update Preset"
-        description="Are you sure you want to update this preset to the current location?"
+        title={t("update_preset")}
+        description={`Are you sure you want to update ${preset?.name} to the current location?`}
         action="Confirm"
         show={showPresetSaveConfirmation}
         onClose={() => setShowPresetSaveConfirmation(false)}
@@ -180,11 +168,9 @@ export const ConsultationFeedTab = (props: ConsultationTabProps) => {
         <CameraFeed
           key={key}
           asset={asset}
-          preset={preset?.position}
+          preset={selectedPreset?.position}
           onMove={() => {
-            if (!preset) {
-              return;
-            }
+            setSelectedPreset(undefined);
             setHasMoved(true);
             setTimeout(async () => {
               const { data } = await operate({ type: "get_status" });
@@ -193,7 +179,6 @@ export const ConsultationFeedTab = (props: ConsultationTabProps) => {
                   feedStateSessionKey,
                   JSON.stringify({
                     type: "position",
-                    assetBed: preset.asset_bed.id,
                     value: (data as GetStatusResponse).result.position,
                   } satisfies LastAccessedPosition),
                 );
@@ -222,16 +207,17 @@ export const ConsultationFeedTab = (props: ConsultationTabProps) => {
                 <CameraPresetSelect
                   options={presets}
                   label={(obj) => obj.name}
-                  value={preset}
+                  value={selectedPreset}
                   onChange={(value) => {
                     triggerGoal("Camera Preset Clicked", {
-                      presetName: preset?.name,
+                      presetName: selectedPreset?.name,
                       consultationId: props.consultationId,
                       userId: authUser.id,
                       result: "success",
                     });
                     setHasMoved(false);
                     setPreset(value);
+                    setSelectedPreset(value);
                   }}
                 />
                 {isUpdatingPreset ? (
@@ -277,7 +263,6 @@ type LastAccessedPreset = {
 
 type LastAccessedPosition = {
   type: "position";
-  assetBed: string;
   value: PTZPayload;
 };
 

From 1868edd32cfcd0abfebe8e9c93cf687758e74278 Mon Sep 17 00:00:00 2001
From: Nithish Kumar Siliveru <nithishsiliveru18@gmail.com>
Date: Tue, 3 Dec 2024 20:54:36 +0530
Subject: [PATCH 28/37] Update Sample File Upload and upgrade buttons to Shadcn
 button (#9157)

---
 public/locale/en.json                         |   1 +
 src/components/Patient/UpdateStatusDialog.tsx | 190 ++++++++----------
 src/components/ui/button.tsx                  |   2 +
 3 files changed, 82 insertions(+), 111 deletions(-)

diff --git a/public/locale/en.json b/public/locale/en.json
index 7e92d927a64..b5f46dd7308 100644
--- a/public/locale/en.json
+++ b/public/locale/en.json
@@ -1380,6 +1380,7 @@
   "upload_headings__patient": "Upload New Patient File",
   "upload_headings__sample_report": "Upload Sample Report",
   "upload_headings__supporting_info": "Upload Supporting Info",
+  "upload_report": "Upload Report",
   "uploading": "Uploading",
   "use_existing_abha_address": "Use Existing ABHA Address",
   "user_deleted_successfuly": "User Deleted Successfuly",
diff --git a/src/components/Patient/UpdateStatusDialog.tsx b/src/components/Patient/UpdateStatusDialog.tsx
index 9414ba9bb95..e9a767847aa 100644
--- a/src/components/Patient/UpdateStatusDialog.tsx
+++ b/src/components/Patient/UpdateStatusDialog.tsx
@@ -1,31 +1,28 @@
-import { useEffect, useReducer, useState } from "react";
+import { useEffect, useReducer } from "react";
 import { useTranslation } from "react-i18next";
 
 import CareIcon from "@/CAREUI/icons/CareIcon";
 
-import { Submit } from "@/components/Common/ButtonV2";
+import { Button } from "@/components/ui/button";
+
 import ConfirmDialog from "@/components/Common/ConfirmDialog";
 import { LinearProgressWithLabel } from "@/components/Files/FileUpload";
 import CheckBoxFormField from "@/components/Form/FormFields/CheckBoxFormField";
 import { SelectFormField } from "@/components/Form/FormFields/SelectFormField";
 import TextFormField from "@/components/Form/FormFields/TextFormField";
 import { FieldChangeEvent } from "@/components/Form/FormFields/Utils";
-import {
-  CreateFileResponse,
-  SampleTestModel,
-} from "@/components/Patient/models";
+
+import useFileUpload from "@/hooks/useFileUpload";
 
 import {
-  HEADER_CONTENT_TYPES,
   SAMPLE_FLOW_RULES,
   SAMPLE_TEST_RESULT,
   SAMPLE_TEST_STATUS,
 } from "@/common/constants";
 
 import * as Notification from "@/Utils/Notifications";
-import routes from "@/Utils/request/api";
-import request from "@/Utils/request/request";
-import uploadFile from "@/Utils/request/uploadFile";
+
+import { SampleTestModel } from "./models";
 
 interface Props {
   sample: SampleTestModel;
@@ -34,7 +31,6 @@ interface Props {
 }
 
 const statusChoices = [...SAMPLE_TEST_STATUS];
-
 const statusFlow = { ...SAMPLE_FLOW_RULES };
 
 const initForm: any = {
@@ -60,17 +56,16 @@ const updateStatusReducer = (state = initialState, action: any) => {
       return state;
   }
 };
-
 const UpdateStatusDialog = (props: Props) => {
   const { t } = useTranslation();
   const { sample, handleOk, handleCancel } = props;
   const [state, dispatch] = useReducer(updateStatusReducer, initialState);
-  const [file, setfile] = useState<File>();
-  const [contentType, setcontentType] = useState<string>("");
-  const [uploadPercent, setUploadPercent] = useState(0);
-  const [uploadStarted, setUploadStarted] = useState<boolean>(false);
-  const [uploadDone, setUploadDone] = useState<boolean>(false);
 
+  const fileUpload = useFileUpload({
+    type: "SAMPLE_MANAGEMENT",
+    allowedExtensions: ["pdf", "jpg", "jpeg", "png"],
+    allowNameFallback: true,
+  });
   const currentStatus = SAMPLE_TEST_STATUS.find(
     (i) => i.text === sample.status,
   );
@@ -104,79 +99,26 @@ const UpdateStatusDialog = (props: Props) => {
     dispatch({ type: "set_form", form });
   };
 
-  const uploadfile = (data: CreateFileResponse) => {
-    const url = data.signed_url;
-    const internal_name = data.internal_name;
-
-    const f = file;
-    if (f === undefined) return;
-    const newFile = new File([f], `${internal_name}`);
-
-    uploadFile(
-      url,
-      newFile,
-      "PUT",
-      {
-        "Content-Type": contentType,
-        "Content-disposition": "inline",
-      },
-      (xhr: XMLHttpRequest) => {
-        if (xhr.status >= 200 && xhr.status < 300) {
-          setUploadStarted(false);
-          setUploadDone(true);
-          request(routes.editUpload, {
-            pathParams: {
-              id: data.id,
-              fileType: "SAMPLE_MANAGEMENT",
-              associatingId: sample.id?.toString() ?? "",
-            },
-            body: { upload_completed: true },
-          });
-          Notification.Success({ msg: "File Uploaded Successfully" });
+  const handleUpload = async () => {
+    if (fileUpload.files.length > 0) {
+      if (!fileUpload.fileNames[0]) {
+        Notification.Error({
+          msg: "Please enter a file name before uploading",
+        });
+        return;
+      }
+      if (sample.id) {
+        await fileUpload.handleFileUpload(sample.id);
+        if (!fileUpload.error) {
+          return;
         } else {
-          setUploadStarted(false);
+          Notification.Error({ msg: `Upload failed: ${fileUpload.error}` });
         }
-      },
-      setUploadPercent,
-      () => {
-        setUploadStarted(false);
-      },
-    );
-  };
-
-  const onFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    if (e.target.files == null) {
-      throw new Error("Error finding e.target.files");
-    }
-    setfile(e.target.files[0]);
-    const fileName = e.target.files[0].name;
-    const ext: string = fileName.split(".")[1];
-    setcontentType(
-      HEADER_CONTENT_TYPES[ext as keyof typeof HEADER_CONTENT_TYPES],
-    );
-    return e.target.files[0];
-  };
-  const handleUpload = async () => {
-    const f = file;
-    if (f === undefined) return;
-    const category = "UNSPECIFIED";
-    const name = f.name;
-    setUploadStarted(true);
-    setUploadDone(false);
-
-    const { data } = await request(routes.createUpload, {
-      body: {
-        original_name: name,
-        file_type: "SAMPLE_MANAGEMENT",
-        name: `${sample.patient_name} Sample Report`,
-        associating_id: sample.id ?? "",
-        file_category: category,
-        mime_type: contentType,
-      },
-    });
-
-    if (data) {
-      uploadfile(data);
+      } else {
+        Notification.Error({ msg: "Sample ID is missing" });
+      }
+    } else {
+      Notification.Error({ msg: "No file selected for upload" });
     }
   };
 
@@ -218,32 +160,58 @@ const UpdateStatusDialog = (props: Props) => {
               onChange={handleChange}
             />
             <span className="font-semibold leading-relaxed">
-              Upload Report :
+              {t("upload_report")}:
             </span>
-            {uploadStarted ? (
-              <LinearProgressWithLabel value={uploadPercent} />
-            ) : (
-              <div className="mb-4 mt-3 flex flex-wrap justify-between gap-2">
-                <label className="button-size-default button-shape-square button-primary-default inline-flex h-min max-w-full cursor-pointer items-center justify-center gap-2 whitespace-pre font-medium outline-offset-1 transition-all duration-200 ease-in-out disabled:cursor-not-allowed disabled:bg-secondary-200 disabled:text-secondary-500">
-                  <CareIcon icon="l-file-upload-alt" className="text-lg" />
-                  <span className="max-w-full truncate">
-                    {file ? file.name : t("choose_file")}
+            {fileUpload.files[0] ? (
+              <div className="mb-8 rounded-lg border border-secondary-300 bg-white p-4">
+                <div className="mb-4 flex items-center justify-between gap-2 rounded-md bg-secondary-300 px-4 py-2">
+                  <span>
+                    <CareIcon icon="l-paperclip" className="mr-2" />
+                    {fileUpload.files[0].name}
                   </span>
-                  <input
-                    title="changeFile"
-                    onChange={onFileChange}
-                    type="file"
-                    hidden
-                  />
+                </div>
+                <TextFormField
+                  name="sample_file_name"
+                  type="text"
+                  label={t("enter_file_name")}
+                  id="upload-file-name"
+                  value={fileUpload.fileNames[0] || ""}
+                  disabled={fileUpload.uploading}
+                  onChange={(e) => fileUpload.setFileName(e.value)}
+                  error={fileUpload.error || undefined}
+                  required
+                />
+                <div className="flex items-center gap-2">
+                  <Button
+                    onClick={handleUpload}
+                    disabled={fileUpload.uploading}
+                    className="w-full"
+                    id="upload_file_button"
+                    variant={"primary"}
+                  >
+                    <CareIcon icon="l-check" className="mr-2" />
+                    {t("upload")}
+                  </Button>
+                  <Button
+                    variant={"destructive"}
+                    onClick={fileUpload.clearFiles}
+                    disabled={fileUpload.uploading}
+                  >
+                    <CareIcon icon="l-trash-alt" className="mr-2" />
+                    {t("discard")}
+                  </Button>
+                </div>
+                {!!fileUpload.progress && (
+                  <LinearProgressWithLabel value={fileUpload.progress} />
+                )}
+              </div>
+            ) : (
+              <div className="mt-5 mb-8 flex w-full flex-col items-center gap-4 md:flex-row">
+                <label className="flex w-full cursor-pointer items-center justify-center gap-2 rounded-lg border border-dashed border-primary-500/20 bg-primary-500/10 p-3 text-primary-700 transition-all hover:bg-primary-500/20 md:p-6">
+                  <CareIcon icon={"l-file-upload-alt"} className="text-2xl" />
+                  <div className="text-lg">{t("choose_file")}</div>
+                  <fileUpload.Input />
                 </label>
-                <Submit
-                  type="submit"
-                  onClick={handleUpload}
-                  disabled={uploadDone}
-                >
-                  <CareIcon icon="l-cloud-upload" className="text-lg" />
-                  <span>Upload</span>
-                </Submit>
               </div>
             )}
           </>
diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx
index f49a7052a78..4555a7a97af 100644
--- a/src/components/ui/button.tsx
+++ b/src/components/ui/button.tsx
@@ -15,6 +15,8 @@ const buttonVariants = cva(
           "bg-red-500 text-gray-50 shadow-sm hover:bg-red-500/90 dark:bg-red-900 dark:text-gray-50 dark:hover:bg-red-900/90",
         outline:
           "border border-gray-200 bg-white shadow-sm hover:bg-gray-100 hover:text-gray-900 dark:border-gray-800 dark:bg-gray-950 dark:hover:bg-gray-800 dark:hover:text-gray-50",
+        primary:
+          "bg-primary-700 text-white shadow hover:bg-primary-700/90 dark:bg-primary-100 dark:text-primary-900 dark:hover:bg-primary-100/90",
         secondary:
           "bg-gray-100 text-gray-900 shadow-sm hover:bg-gray-100/80 dark:bg-gray-800 dark:text-gray-50 dark:hover:bg-gray-800/80",
         ghost:

From 59a584d4628aad1a87ddaad1e8560a0c998cad11 Mon Sep 17 00:00:00 2001
From: Mohamed amaan <121436543+modamaan@users.noreply.github.com>
Date: Tue, 3 Dec 2024 20:59:59 +0530
Subject: [PATCH 29/37] Referral letter preview desktop (#8954)

---
 src/CAREUI/misc/PrintPreview.tsx         |   7 +-
 src/components/Shifting/ShiftDetails.tsx | 324 ++++++++++-------------
 src/components/ui/card.tsx               |  83 ++++++
 3 files changed, 233 insertions(+), 181 deletions(-)
 create mode 100644 src/components/ui/card.tsx

diff --git a/src/CAREUI/misc/PrintPreview.tsx b/src/CAREUI/misc/PrintPreview.tsx
index 53eda1339ac..daf79ecbb34 100644
--- a/src/CAREUI/misc/PrintPreview.tsx
+++ b/src/CAREUI/misc/PrintPreview.tsx
@@ -8,7 +8,8 @@ import {
   ZoomTransform,
 } from "@/CAREUI/interactive/Zoom";
 
-import ButtonV2 from "@/components/Common/ButtonV2";
+import { Button } from "@/components/ui/button";
+
 import Page from "@/components/Common/Page";
 
 import useBreakpoints from "@/hooks/useBreakpoints";
@@ -30,10 +31,10 @@ export default function PrintPreview(props: Props) {
     <Page title={props.title}>
       <div className="mx-auto my-8 w-[50rem]">
         <div className="top-0 z-20 flex gap-2 bg-secondary-100 px-2 py-4 xl:absolute xl:right-6 xl:top-8 xl:justify-end">
-          <ButtonV2 disabled={props.disabled} onClick={print}>
+          <Button variant="primary" disabled={props.disabled} onClick={print}>
             <CareIcon icon="l-print" className="text-lg" />
             {t("print")}
-          </ButtonV2>
+          </Button>
         </div>
 
         <ZoomProvider initialScale={normalScale}>
diff --git a/src/components/Shifting/ShiftDetails.tsx b/src/components/Shifting/ShiftDetails.tsx
index cb5140d6ed0..4a6f6c855bb 100644
--- a/src/components/Shifting/ShiftDetails.tsx
+++ b/src/components/Shifting/ShiftDetails.tsx
@@ -7,6 +7,9 @@ import { useTranslation } from "react-i18next";
 
 import RecordMeta from "@/CAREUI/display/RecordMeta";
 import CareIcon from "@/CAREUI/icons/CareIcon";
+import PrintPreview from "@/CAREUI/misc/PrintPreview";
+
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 
 import ButtonV2 from "@/components/Common/ButtonV2";
 import Loading from "@/components/Common/Loading";
@@ -273,182 +276,162 @@ export default function ShiftDetails(props: { id: string }) {
     )?.text;
 
     return (
-      <div id="section-to-print" className="print bg-white">
-        <div>
-          {data.is_kasp && <img alt="logo" src={careConfig.headerLogo?.dark} />}
-        </div>
-        <div className="mx-2">
-          <div className="mt-6">
-            <span className="mt-4 font-semibold leading-relaxed">
-              {t("name_of_hospital")}:{" "}
-            </span>
-            {data.is_kasp
-              ? t("district_program_management_supporting_unit")
-              : data.origin_facility_object?.name || "--"}
-            {/*  Made static based on #757 */}
-          </div>
-          <div className="mt-6 text-center text-xl font-bold">
-            {t("referral_letter")}
-          </div>
-          <div className="mt-4 text-left">
-            <span className="font-semibold leading-relaxed">
-              {" "}
-              {t("date_and_time")}{" "}
-            </span>
-            {formatDateTime(data.created_date) || "--"}
-          </div>
-          <div className="mt-2 text-left">
-            <span className="font-semibold leading-relaxed">
-              {" "}
-              {t("unique_id")} :
-            </span>
-            {data.id}
-          </div>
+      <PrintPreview title={t("Patient Referral Letter")}>
+        <Card className="shadow-none border-none">
+          <CardHeader className="flex flex-col items-center space-y-4 sm:flex-row sm:justify-between sm:space-y-0">
+            <CardTitle className="mx-auto my-auto text-lg font-bold sm:text-2xl">
+              {t("referral_letter")}
+            </CardTitle>
+          </CardHeader>
 
-          <div className="mt-4">
-            <div>
-              <span className="font-semibold leading-relaxed">
-                {t("name")}:{" "}
-              </span>
-              {patientData?.name}
-            </div>
-          </div>
-          <div className="mt-2 flex justify-between">
-            <div>
-              <span className="font-semibold leading-relaxed">
-                {t("age")}:{" "}
-              </span>
-              {patientData ? formatPatientAge(patientData, true) : ""}
-            </div>
-            <div>
-              <span className="font-semibold leading-relaxed">
-                {t("gender")}:{" "}
-              </span>
-              {patientGender}
-            </div>
-            <div>
-              <span className="font-semibold leading-relaxed">
-                {t("phone")}:{" "}
-              </span>
-              <span>{patientData?.phone_number || ""}</span>
-            </div>
-          </div>
-          <div className="mt-2 flex text-left">
-            <span className="font-semibold leading-relaxed">
-              {t("address")}:{" "}
-            </span>
-            <div className="ml-2">
-              <div className="whitespace-pre-wrap">
-                {patientData?.address || "-"}
-              </div>
-              {patientData?.nationality === "India" && (
-                <>
-                  <div>
-                    {patientData?.ward_object?.name},
-                    {patientData?.local_body_object?.name}
-                  </div>
-                  <div>{patientData?.district_object?.name || "-"}</div>
-                  <div>{patientData?.state_object?.name}</div>
-                </>
+          <CardContent className="space-y-6">
+            <div className="flex flex-col-reverse items-start justify-end sm:flex-row sm:items-center">
+              {data.is_kasp && (
+                <img
+                  alt="logo"
+                  src={careConfig.headerLogo?.dark}
+                  className="max-h-12"
+                />
               )}
+              <QRCodeSVG
+                value={`${window.location.origin}/shifting/${data.id}`}
+                size={120}
+                className="mt-4 sm:mt-0"
+              />
             </div>
-          </div>
-          <div className="mt-2 flex justify-between">
-            <div>
-              <span className="font-semibold leading-relaxed">
-                {t("date_of_admission")}:{" "}
-              </span>
-              {formatDateTime(
-                consultation.encounter_date || consultation.created_date,
-              ) || "-"}
-            </div>
-            <div>
-              <span className="font-semibold leading-relaxed">
-                {t("patient_no")}:{" "}
-              </span>
-              {consultation.patient_no || "-"}
-            </div>
-          </div>
-          <div className="mt-2 flex justify-between">
-            <div>
-              <span className="font-semibold leading-relaxed">
-                {t("date_of_positive_covid_19_swab")}:{" "}
-              </span>
-              {(patientData?.date_of_test &&
-                formatDateTime(patientData?.date_of_test)) ||
-                "-"}
-            </div>
-          </div>
 
-          {/* <div className="mt-2 flex justify-between">
-            <div>
-              <span className="font-semibold leading-relaxed">
-                {t("diagnosis")}:{" "}
-              </span>
-              {consultation.diagnosis || "-"}
+            <div className="mt-6 text-lg">
+              <span className="font-semibold">{t("name_of_hospital")}: </span>
+              {data.is_kasp
+                ? t("district_program_management_supporting_unit")
+                : data.origin_facility_object?.name || "--"}
             </div>
-          </div> */}
 
-          <div className="mt-6 flex justify-between">
-            <div>
-              <span className="font-semibold leading-relaxed">
-                {t("covid_19_cat_gov")}{" "}
-              </span>
-              {consultation.category || "-"}
-            </div>
-          </div>
+            <div className="my-6 border-b-2"></div>
 
-          <div className="mt-2 flex justify-between">
-            <div>
-              <span className="font-semibold leading-relaxed">
-                {t("referred_to")}:{" "}
-              </span>
-              {data.assigned_facility_external ||
-                data.assigned_facility_object?.name ||
-                "--"}
-            </div>
-          </div>
+            <div className="grid grid-cols-1 gap-6 sm:grid-cols-2 text-lg">
+              <div>
+                <h3 className="mb-2 font-semibold">
+                  {t("Patient Information")}
+                </h3>
+                <p>
+                  <span className="font-semibold leading-relaxed">
+                    {t("name")}:{" "}
+                  </span>
+                  {patientData?.name}
+                </p>
+                <p>
+                  <span className="font-semibold leading-relaxed">
+                    {t("age")}:{" "}
+                  </span>
+                  {formatPatientAge(patientData, true)}
+                </p>
+                <p>
+                  <span className="font-semibold leading-relaxed">
+                    {t("gender")}:{" "}
+                  </span>
+                  {patientGender || "-"}
+                </p>
+                <p>
+                  <span className="font-semibold leading-relaxed">
+                    {t("phone")}:{" "}
+                  </span>{" "}
+                  {patientData?.phone_number || "-"}
+                </p>
+              </div>
 
-          <div className="mt-2 flex justify-between">
-            <div>
-              <span className="font-semibold leading-relaxed">
-                {t("reason_for_referral")}:{" "}
-              </span>
-              {data.reason || "--"}
-            </div>
-          </div>
-          <div className="mt-2 flex justify-between">
-            <div>
-              <span className="font-semibold leading-relaxed">
-                {t("treatment_summary")}:{" "}
-              </span>
-              {consultation.treatment_plan || "-"}
+              <div className="text-lg">
+                <h3 className="mb-2  font-semibold">{t("address")}</h3>
+                <p className=" whitespace-pre-line">
+                  {patientData?.address || "-"}
+                </p>
+                {patientData?.nationality === "India" && (
+                  <>
+                    <p>
+                      {patientData?.ward_object?.name},{" "}
+                      {patientData?.local_body_object?.name}
+                    </p>
+                    <p>{patientData?.district_object?.name || "-"}</p>
+                    <p>{patientData?.state_object?.name}</p>
+                  </>
+                )}
+              </div>
             </div>
-          </div>
-          <div className="mt-6 flex justify-between">
-            <div className="flex">
+
+            <div className="my-6 border-b-2"></div>
+
+            <div className="grid grid-cols-1 gap-6 sm:grid-cols-2 text-lg">
               <div>
-                <div className="">
-                  <QRCodeSVG
-                    value={`${window.location.origin}/shifting/${data.id}`}
-                  />
-                </div>
+                <p>
+                  <span className="font-semibold leading-relaxed">
+                    {t("date_of_admission")}:{" "}
+                  </span>
+                  {formatDateTime(
+                    consultation.encounter_date || consultation.created_date,
+                  ) || "-"}
+                </p>
+                <p>
+                  <span className="font-semibold leading-relaxed">
+                    {t("unique_id")}:{" "}
+                  </span>{" "}
+                  {data.id}
+                </p>
+                <p>
+                  <span className="font-semibold leading-relaxed">
+                    {t("patient_no")}:{" "}
+                  </span>{" "}
+                  {consultation.patient_no || "-"}
+                </p>
+              </div>
+              <div className="flex flex-col gap-3">
+                <p>
+                  <span className="font-semibold leading-relaxed">
+                    {t("date_of_positive_covid_19_swab")}:{" "}
+                  </span>
+                  {(patientData?.date_of_test &&
+                    formatDateTime(patientData.date_of_test)) ||
+                    "-"}
+                </p>
+                <p>
+                  <span className="font-semibold leading-relaxed">
+                    {t("covid_19_cat_gov")}:{" "}
+                  </span>{" "}
+                  {consultation.category || "-"}
+                </p>
+                <p>
+                  <span className="font-semibold leading-relaxed">
+                    {t("referred_to")}:{" "}
+                  </span>
+                  {data.assigned_facility_external ||
+                    data.assigned_facility_object?.name ||
+                    "--"}
+                </p>
+                <p>
+                  <span className="font-semibold leading-relaxed">
+                    {t("reason_for_referral")}:{" "}
+                  </span>{" "}
+                  {data.reason || "--"}
+                </p>
+                <p>
+                  <span className="font-semibold leading-relaxed">
+                    {t("treatment_summary")}:{" "}
+                  </span>{" "}
+                  {consultation.treatment_plan || "-"}
+                </p>
               </div>
             </div>
-            <div className="mt-10">
-              <span className="font-semibold leading-relaxed">
+
+            <div className="my-6 border-b-2"></div>
+
+            <div className="text-center">
+              <p className="text-sm text-muted-foreground">
                 {t("approved_by_district_covid_control_room")}
-              </span>
+              </p>
+              <p className="text-sm">{t("auto_generated_for_care")}</p>
             </div>
-          </div>
-          <div className="mt-20 flex justify-center text-center">
-            {t("auto_generated_for_care")}
-          </div>
-          <div className="font-xs font-secondary-600 text-center font-mono">
-            {window.location.origin}/shifting/{data.id}
-          </div>
-        </div>
-      </div>
+          </CardContent>
+        </Card>
+      </PrintPreview>
     );
   };
 
@@ -459,22 +442,7 @@ export default function ShiftDetails(props: { id: string }) {
   return (
     <div>
       {isPrintMode ? (
-        <div className="my-4">
-          <div className="my-4 flex justify-end gap-3">
-            <ButtonV2 onClick={(_) => window.print()}>
-              <CareIcon icon="l-print" className="mr-2 text-base" />{" "}
-              {t("print_referral_letter")}
-            </ButtonV2>
-            <ButtonV2
-              onClick={(_) => setIsPrintMode(false)}
-              variant="secondary"
-            >
-              <CareIcon icon="l-times" className="mr-2 text-base" />{" "}
-              {t("close")}
-            </ButtonV2>
-          </div>
-          {printData(data)}
-        </div>
+        <div className="my-4">{printData(data)}</div>
       ) : (
         <Page
           title={t("shifting_details")}
diff --git a/src/components/ui/card.tsx b/src/components/ui/card.tsx
new file mode 100644
index 00000000000..893b9be60b7
--- /dev/null
+++ b/src/components/ui/card.tsx
@@ -0,0 +1,83 @@
+import * as React from "react";
+
+import { cn } from "@/lib/utils";
+
+const Card = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn(
+      "rounded-xl border border-gray-200 bg-white text-gray-950 shadow dark:border-gray-800 dark:bg-gray-950 dark:text-gray-50",
+      className,
+    )}
+    {...props}
+  />
+));
+Card.displayName = "Card";
+
+const CardHeader = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn("flex flex-col space-y-1.5 p-6", className)}
+    {...props}
+  />
+));
+CardHeader.displayName = "CardHeader";
+
+const CardTitle = React.forwardRef<
+  HTMLHeadingElement,
+  React.HTMLAttributes<HTMLHeadingElement>
+>(({ className, ...props }, ref) => (
+  <h3
+    ref={ref}
+    className={cn("font-semibold leading-none tracking-tight", className)}
+    {...props}
+  />
+));
+CardTitle.displayName = "CardTitle";
+
+const CardDescription = React.forwardRef<
+  HTMLParagraphElement,
+  React.HTMLAttributes<HTMLParagraphElement>
+>(({ className, ...props }, ref) => (
+  <p
+    ref={ref}
+    className={cn("text-sm text-gray-500 dark:text-gray-400", className)}
+    {...props}
+  />
+));
+CardDescription.displayName = "CardDescription";
+
+const CardContent = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div ref={ref} className={cn("p-6 pt-0", className)} {...props} />
+));
+CardContent.displayName = "CardContent";
+
+const CardFooter = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn("flex items-center p-6 pt-0", className)}
+    {...props}
+  />
+));
+CardFooter.displayName = "CardFooter";
+
+export {
+  Card,
+  CardHeader,
+  CardFooter,
+  CardTitle,
+  CardDescription,
+  CardContent,
+};

From 724813b7fa970eee0712f20a7601b0b003ee1405 Mon Sep 17 00:00:00 2001
From: Mahendar Chikolla <119734520+Mahendar0701@users.noreply.github.com>
Date: Tue, 3 Dec 2024 21:00:33 +0530
Subject: [PATCH 30/37] Tooltip added for treating docter skills in Patient
 details page (#9254)

---
 src/components/Patient/PatientHome.tsx | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/src/components/Patient/PatientHome.tsx b/src/components/Patient/PatientHome.tsx
index d6b9844b699..518ac33bdf2 100644
--- a/src/components/Patient/PatientHome.tsx
+++ b/src/components/Patient/PatientHome.tsx
@@ -376,10 +376,22 @@ export const PatientHome = (props: {
                             .treating_physician_object,
                         )}
                       </p>
-                      <p className="flex items-end text-xs font-normal leading-tight">
+                      <span className="tooltip text-xs text-secondary-800 flex items-end  font-normal leading-tight">
                         {!!skillsQuery.data?.results?.length &&
                           formatSkills(skillsQuery.data?.results)}
-                      </p>
+                        {(skillsQuery.data?.results?.length || 0) > 3 && (
+                          <ul
+                            className="tooltip-text tooltip-bottom flex flex-col text-xs font-medium"
+                            role="tooltip"
+                          >
+                            {skillsQuery.data?.results.map((skill) => (
+                              <li key={skill.skill_object.id}>
+                                {skill.skill_object.name}
+                              </li>
+                            ))}
+                          </ul>
+                        )}
+                      </span>
                     </div>
                   </div>
                 )}

From 4442eb0ecd8e5da12f3ef39002ac9597e7aa6548 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Tue, 3 Dec 2024 21:40:02 +0530
Subject: [PATCH 31/37] Bump @radix-ui/react-icons from 1.3.1 to 1.3.2 (#9127)

Bumps @radix-ui/react-icons from 1.3.1 to 1.3.2.

---
updated-dependencies:
- dependency-name: "@radix-ui/react-icons"
  dependency-type: direct:production
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Rithvik Nishad <mail@rithviknishad.dev>
---
 package-lock.json | 10 +++++-----
 package.json      |  2 +-
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 97073c88ecb..7a4ddd5800c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -20,7 +20,7 @@
         "@pnotify/core": "^5.2.0",
         "@pnotify/mobile": "^5.2.0",
         "@radix-ui/react-dropdown-menu": "^2.1.2",
-        "@radix-ui/react-icons": "^1.3.1",
+        "@radix-ui/react-icons": "^1.3.2",
         "@radix-ui/react-slot": "^1.1.0",
         "@radix-ui/react-toast": "^1.2.2",
         "@radix-ui/react-tooltip": "^1.1.3",
@@ -3838,12 +3838,12 @@
       }
     },
     "node_modules/@radix-ui/react-icons": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/@radix-ui/react-icons/-/react-icons-1.3.1.tgz",
-      "integrity": "sha512-QvYompk0X+8Yjlo/Fv4McrzxohDdM5GgLHyQcPpcsPvlOSXCGFjdbuyGL5dzRbg0GpknAjQJJZzdiRK7iWVuFQ==",
+      "version": "1.3.2",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-icons/-/react-icons-1.3.2.tgz",
+      "integrity": "sha512-fyQIhGDhzfc9pK2kH6Pl9c4BDJGfMkPqkyIgYDthyNYoNg3wVhoJMMh19WS4Up/1KMPFVpNsT2q3WmXn2N1m6g==",
       "license": "MIT",
       "peerDependencies": {
-        "react": "^16.x || ^17.x || ^18.x || ^19.x"
+        "react": "^16.x || ^17.x || ^18.x || ^19.0.0 || ^19.0.0-rc"
       }
     },
     "node_modules/@radix-ui/react-id": {
diff --git a/package.json b/package.json
index 798c910ea91..54b9eef1d8c 100644
--- a/package.json
+++ b/package.json
@@ -59,7 +59,7 @@
     "@pnotify/core": "^5.2.0",
     "@pnotify/mobile": "^5.2.0",
     "@radix-ui/react-dropdown-menu": "^2.1.2",
-    "@radix-ui/react-icons": "^1.3.1",
+    "@radix-ui/react-icons": "^1.3.2",
     "@radix-ui/react-slot": "^1.1.0",
     "@radix-ui/react-toast": "^1.2.2",
     "@radix-ui/react-tooltip": "^1.1.3",

From 931b42a6741eccaa438632742eac641e146a710c Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Tue, 3 Dec 2024 21:46:58 +0530
Subject: [PATCH 32/37] Bump @radix-ui/react-tooltip from 1.1.3 to 1.1.4
 (#9098)

Bumps [@radix-ui/react-tooltip](https://github.com/radix-ui/primitives) from 1.1.3 to 1.1.4.
- [Changelog](https://github.com/radix-ui/primitives/blob/main/release-process.md)
- [Commits](https://github.com/radix-ui/primitives/commits)

---
updated-dependencies:
- dependency-name: "@radix-ui/react-tooltip"
  dependency-type: direct:production
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Rithvik Nishad <mail@rithviknishad.dev>
---
 package-lock.json | 8 ++++----
 package.json      | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 7a4ddd5800c..6c593641d4b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -23,7 +23,7 @@
         "@radix-ui/react-icons": "^1.3.2",
         "@radix-ui/react-slot": "^1.1.0",
         "@radix-ui/react-toast": "^1.2.2",
-        "@radix-ui/react-tooltip": "^1.1.3",
+        "@radix-ui/react-tooltip": "^1.1.4",
         "@sentry/browser": "^8.37.1",
         "@yudiel/react-qr-scanner": "^2.0.8",
         "bowser": "^2.11.0",
@@ -4121,9 +4121,9 @@
       }
     },
     "node_modules/@radix-ui/react-tooltip": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/@radix-ui/react-tooltip/-/react-tooltip-1.1.3.tgz",
-      "integrity": "sha512-Z4w1FIS0BqVFI2c1jZvb/uDVJijJjJ2ZMuPV81oVgTZ7g3BZxobplnMVvXtFWgtozdvYJ+MFWtwkM5S2HnAong==",
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-tooltip/-/react-tooltip-1.1.4.tgz",
+      "integrity": "sha512-QpObUH/ZlpaO4YgHSaYzrLO2VuO+ZBFFgGzjMUPwtiYnAzzNNDPJeEGRrT7qNOrWm/Jr08M1vlp+vTHtnSQ0Uw==",
       "license": "MIT",
       "dependencies": {
         "@radix-ui/primitive": "1.1.0",
diff --git a/package.json b/package.json
index 54b9eef1d8c..de76e37bc51 100644
--- a/package.json
+++ b/package.json
@@ -62,7 +62,7 @@
     "@radix-ui/react-icons": "^1.3.2",
     "@radix-ui/react-slot": "^1.1.0",
     "@radix-ui/react-toast": "^1.2.2",
-    "@radix-ui/react-tooltip": "^1.1.3",
+    "@radix-ui/react-tooltip": "^1.1.4",
     "@sentry/browser": "^8.37.1",
     "@yudiel/react-qr-scanner": "^2.0.8",
     "bowser": "^2.11.0",

From 663b400202e9bc341112926dea2d94dffdd692b5 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Tue, 3 Dec 2024 21:51:38 +0530
Subject: [PATCH 33/37] Bump @sentry/browser from 8.37.1 to 8.42.0 (#9280)

Bumps [@sentry/browser](https://github.com/getsentry/sentry-javascript) from 8.37.1 to 8.42.0.
- [Release notes](https://github.com/getsentry/sentry-javascript/releases)
- [Changelog](https://github.com/getsentry/sentry-javascript/blob/develop/CHANGELOG.md)
- [Commits](https://github.com/getsentry/sentry-javascript/compare/8.37.1...8.42.0)

---
updated-dependencies:
- dependency-name: "@sentry/browser"
  dependency-type: direct:production
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
---
 package-lock.json | 95 +++++++++++++++--------------------------------
 package.json      |  2 +-
 2 files changed, 31 insertions(+), 66 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 6c593641d4b..032991013a6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -24,7 +24,7 @@
         "@radix-ui/react-slot": "^1.1.0",
         "@radix-ui/react-toast": "^1.2.2",
         "@radix-ui/react-tooltip": "^1.1.4",
-        "@sentry/browser": "^8.37.1",
+        "@sentry/browser": "^8.42.0",
         "@yudiel/react-qr-scanner": "^2.0.8",
         "bowser": "^2.11.0",
         "browser-image-compression": "^2.0.2",
@@ -4682,58 +4682,50 @@
       ]
     },
     "node_modules/@sentry-internal/browser-utils": {
-      "version": "8.37.1",
-      "resolved": "https://registry.npmjs.org/@sentry-internal/browser-utils/-/browser-utils-8.37.1.tgz",
-      "integrity": "sha512-OSR/V5GCsSCG7iapWtXCT/y22uo3HlawdEgfM1NIKk1mkP15UyGQtGEzZDdih2H+SNuX1mp9jQLTjr5FFp1A5w==",
+      "version": "8.42.0",
+      "resolved": "https://registry.npmjs.org/@sentry-internal/browser-utils/-/browser-utils-8.42.0.tgz",
+      "integrity": "sha512-xzgRI0wglKYsPrna574w1t38aftuvo44gjOKFvPNGPnYfiW9y4m+64kUz3JFbtanvOrKPcaITpdYiB4DeJXEbA==",
       "license": "MIT",
       "dependencies": {
-        "@sentry/core": "8.37.1",
-        "@sentry/types": "8.37.1",
-        "@sentry/utils": "8.37.1"
+        "@sentry/core": "8.42.0"
       },
       "engines": {
         "node": ">=14.18"
       }
     },
     "node_modules/@sentry-internal/feedback": {
-      "version": "8.37.1",
-      "resolved": "https://registry.npmjs.org/@sentry-internal/feedback/-/feedback-8.37.1.tgz",
-      "integrity": "sha512-Se25NXbSapgS2S+JssR5YZ48b3OY4UGmAuBOafgnMW91LXMxRNWRbehZuNUmjjHwuywABMxjgu+Yp5uJDATX+g==",
+      "version": "8.42.0",
+      "resolved": "https://registry.npmjs.org/@sentry-internal/feedback/-/feedback-8.42.0.tgz",
+      "integrity": "sha512-dkIw5Wdukwzngg5gNJ0QcK48LyJaMAnBspqTqZ3ItR01STi6Z+6+/Bt5XgmrvDgRD+FNBinflc5zMmfdFXXhvw==",
       "license": "MIT",
       "dependencies": {
-        "@sentry/core": "8.37.1",
-        "@sentry/types": "8.37.1",
-        "@sentry/utils": "8.37.1"
+        "@sentry/core": "8.42.0"
       },
       "engines": {
         "node": ">=14.18"
       }
     },
     "node_modules/@sentry-internal/replay": {
-      "version": "8.37.1",
-      "resolved": "https://registry.npmjs.org/@sentry-internal/replay/-/replay-8.37.1.tgz",
-      "integrity": "sha512-E/Plhisk/pXJjOdOU12sg8m/APTXTA21iEniidP6jW3/+O0tD/H/UovEqa4odNTqxPMa798xHQSQNt5loYiaLA==",
+      "version": "8.42.0",
+      "resolved": "https://registry.npmjs.org/@sentry-internal/replay/-/replay-8.42.0.tgz",
+      "integrity": "sha512-oNcJEBlDfXnRFYC5Mxj5fairyZHNqlnU4g8kPuztB9G5zlsyLgWfPxzcn1ixVQunth2/WZRklDi4o1ZfyHww7w==",
       "license": "MIT",
       "dependencies": {
-        "@sentry-internal/browser-utils": "8.37.1",
-        "@sentry/core": "8.37.1",
-        "@sentry/types": "8.37.1",
-        "@sentry/utils": "8.37.1"
+        "@sentry-internal/browser-utils": "8.42.0",
+        "@sentry/core": "8.42.0"
       },
       "engines": {
         "node": ">=14.18"
       }
     },
     "node_modules/@sentry-internal/replay-canvas": {
-      "version": "8.37.1",
-      "resolved": "https://registry.npmjs.org/@sentry-internal/replay-canvas/-/replay-canvas-8.37.1.tgz",
-      "integrity": "sha512-1JLAaPtn1VL5vblB0BMELFV0D+KUm/iMGsrl4/JpRm0Ws5ESzQl33DhXVv1IX/ZAbx9i14EjR7MG9+Hj70tieQ==",
+      "version": "8.42.0",
+      "resolved": "https://registry.npmjs.org/@sentry-internal/replay-canvas/-/replay-canvas-8.42.0.tgz",
+      "integrity": "sha512-XrPErqVhPsPh/oFLVKvz7Wb+Fi2J1zCPLeZCxWqFuPWI2agRyLVu0KvqJyzSpSrRAEJC/XFzuSVILlYlXXSfgA==",
       "license": "MIT",
       "dependencies": {
-        "@sentry-internal/replay": "8.37.1",
-        "@sentry/core": "8.37.1",
-        "@sentry/types": "8.37.1",
-        "@sentry/utils": "8.37.1"
+        "@sentry-internal/replay": "8.42.0",
+        "@sentry/core": "8.42.0"
       },
       "engines": {
         "node": ">=14.18"
@@ -4792,32 +4784,26 @@
       }
     },
     "node_modules/@sentry/browser": {
-      "version": "8.37.1",
-      "resolved": "https://registry.npmjs.org/@sentry/browser/-/browser-8.37.1.tgz",
-      "integrity": "sha512-5ym+iGiIpjIKKpMWi9S3/tXh9xneS+jqxwRTJqed3cb8i4ydfMAAP8sM3U8xMCWWABpWyIUW+fpewC0tkhE1aQ==",
+      "version": "8.42.0",
+      "resolved": "https://registry.npmjs.org/@sentry/browser/-/browser-8.42.0.tgz",
+      "integrity": "sha512-lStrEk609KJHwXfDrOgoYVVoFFExixHywxSExk7ZDtwj2YPv6r6Y1gogvgr7dAZj7jWzadHkxZ33l9EOSJBfug==",
       "license": "MIT",
       "dependencies": {
-        "@sentry-internal/browser-utils": "8.37.1",
-        "@sentry-internal/feedback": "8.37.1",
-        "@sentry-internal/replay": "8.37.1",
-        "@sentry-internal/replay-canvas": "8.37.1",
-        "@sentry/core": "8.37.1",
-        "@sentry/types": "8.37.1",
-        "@sentry/utils": "8.37.1"
+        "@sentry-internal/browser-utils": "8.42.0",
+        "@sentry-internal/feedback": "8.42.0",
+        "@sentry-internal/replay": "8.42.0",
+        "@sentry-internal/replay-canvas": "8.42.0",
+        "@sentry/core": "8.42.0"
       },
       "engines": {
         "node": ">=14.18"
       }
     },
     "node_modules/@sentry/core": {
-      "version": "8.37.1",
-      "resolved": "https://registry.npmjs.org/@sentry/core/-/core-8.37.1.tgz",
-      "integrity": "sha512-82csXby589iDupM3VgCHJeWZagUyEEaDnbFcoZ/Z91QX2Sjq8FcF5OsforoXjw09i0XTFqlkFAnQVpDBmMXcpQ==",
+      "version": "8.42.0",
+      "resolved": "https://registry.npmjs.org/@sentry/core/-/core-8.42.0.tgz",
+      "integrity": "sha512-ac6O3pgoIbU6rpwz6LlwW0wp3/GAHuSI0C5IsTgIY6baN8rOBnlAtG6KrHDDkGmUQ2srxkDJu9n1O6Td3cBCqw==",
       "license": "MIT",
-      "dependencies": {
-        "@sentry/types": "8.37.1",
-        "@sentry/utils": "8.37.1"
-      },
       "engines": {
         "node": ">=14.18"
       }
@@ -4929,27 +4915,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/@sentry/types": {
-      "version": "8.37.1",
-      "resolved": "https://registry.npmjs.org/@sentry/types/-/types-8.37.1.tgz",
-      "integrity": "sha512-ryMOTROLSLINKFEbHWvi7GigNrsQhsaScw2NddybJGztJQ5UhxIGESnxGxWCufBmWFDwd7+5u0jDPCVUJybp7w==",
-      "license": "MIT",
-      "engines": {
-        "node": ">=14.18"
-      }
-    },
-    "node_modules/@sentry/utils": {
-      "version": "8.37.1",
-      "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-8.37.1.tgz",
-      "integrity": "sha512-Qtn2IfpII12K17txG/ZtTci35XYjYi4CxbQ3j7nXY7toGv/+MqPXwV5q2i9g94XaSXlE5Wy9/hoCZoZpZs/djA==",
-      "license": "MIT",
-      "dependencies": {
-        "@sentry/types": "8.37.1"
-      },
-      "engines": {
-        "node": ">=14.18"
-      }
-    },
     "node_modules/@surma/rollup-plugin-off-main-thread": {
       "version": "2.2.3",
       "resolved": "https://registry.npmjs.org/@surma/rollup-plugin-off-main-thread/-/rollup-plugin-off-main-thread-2.2.3.tgz",
diff --git a/package.json b/package.json
index de76e37bc51..ff59ea7f9f8 100644
--- a/package.json
+++ b/package.json
@@ -63,7 +63,7 @@
     "@radix-ui/react-slot": "^1.1.0",
     "@radix-ui/react-toast": "^1.2.2",
     "@radix-ui/react-tooltip": "^1.1.4",
-    "@sentry/browser": "^8.37.1",
+    "@sentry/browser": "^8.42.0",
     "@yudiel/react-qr-scanner": "^2.0.8",
     "bowser": "^2.11.0",
     "browser-image-compression": "^2.0.2",

From 076ecd4ef727453b625a01df43d4362642563413 Mon Sep 17 00:00:00 2001
From: Vysakh Premkumar <84713473+tellmeY18@users.noreply.github.com>
Date: Wed, 4 Dec 2024 10:30:05 +0530
Subject: [PATCH 34/37] Updated Non-Core Question Workflow (#9220)

---
 .github/workflows/notify-non-core-qn.yml | 95 ++++++++++++------------
 1 file changed, 48 insertions(+), 47 deletions(-)

diff --git a/.github/workflows/notify-non-core-qn.yml b/.github/workflows/notify-non-core-qn.yml
index 7aa59e6e868..07533c320c5 100644
--- a/.github/workflows/notify-non-core-qn.yml
+++ b/.github/workflows/notify-non-core-qn.yml
@@ -1,37 +1,39 @@
 name: Notify Core Team on Non-Core Questions
+
 on:
   issue_comment:
     types: [created]
+
 permissions:
   issues: write
   pull-requests: write
+
 jobs:
   notify_core_team:
     runs-on: ubuntu-latest
     env:
-      ALLOWED_USERNAMES: ${{ vars.ALLOWED_USERNAMES }}
-      QUESTION_KEYWORDS: ${{ vars.QUESTION_KEYWORDS }}
-      QUESTION_LABELS: ${{ vars.QUESTION_LABELS }}
-      SLACK_WEBHOOK: ${{ secrets.SLACK_WEBHOOK }}
+      ALLOWED_USERNAMES: ${{ vars.ALLOWED_USERNAMES || '' }}
+      QUESTION_KEYWORDS: ${{ vars.QUESTION_KEYWORDS || '' }}
+      QUESTION_LABELS: ${{ vars.QUESTION_LABELS || '' }}
+      SLACK_WEBHOOK: ${{ secrets.SLACK_WEBHOOK || '' }}
+
     steps:
       - name: Check and Notify
-        uses: actions/github-script@v6
+        uses: actions/github-script@v7
         with:
           github-token: ${{ secrets.GITHUB_TOKEN }}
           script: |
-            console.log('Script started');
-            const isOrgMember = (commenter, allowedUsers) => {
-              return allowedUsers.split(',').map(u => u.trim()).includes(commenter);
-            };
-            const containsQuestionKeywords = (text, keywords) => {
-              return keywords.split(',').map(k => k.trim()).some(keyword =>
+            const isOrgMember = (commenter, allowedUsers) =>
+              allowedUsers.split(',').map(u => u.trim()).includes(commenter);
+
+            const containsQuestionKeywords = (text, keywords) =>
+              keywords.split(',').map(k => k.trim()).some(keyword =>
                 text.toLowerCase().includes(keyword.toLowerCase())
               );
-            };
+
             const addLabelsToIssue = async (github, context, labelsString) => {
-              const labels = labelsString.split(',').map(label => label.trim()).filter(label => label);
+              const labels = labelsString.split(',').map(label => label.trim()).filter(Boolean);
               if (labels.length > 0) {
-                console.log('Adding labels:', labels);
                 await github.rest.issues.addLabels({
                   owner: context.repo.owner,
                   repo: context.repo.repo,
@@ -40,48 +42,47 @@ jobs:
                 });
               }
             };
-            const sendSlackNotification = async (webhook, payload) => {
+
+            const sendSlackNotification = async (webhook, commentUrl) => {
+              const payload = { commentUrl };
               const response = await fetch(webhook, {
                 method: 'POST',
                 headers: { 'Content-Type': 'application/json' },
                 body: JSON.stringify(payload)
               });
               if (!response.ok) {
-                throw new Error(`HTTP error! status: ${response.status}`);
+                throw new Error(`Slack notification failed with status: ${response.status}`);
               }
             };
+
+            const isBot = async (github, commenter) => {
+              try {
+                const { data: user } = await github.rest.users.getByUsername({ username: commenter });
+                return user.type === 'Bot';
+              } catch {
+                return false;
+              }
+            };
+
             const commenter = context.payload.comment.user.login;
-            console.log('Commenter:', commenter);
-            if (!isOrgMember(commenter, process.env.ALLOWED_USERNAMES)) {
-              const commentBody = context.payload.comment.body;
-              const sanitizedComment = commentBody
-                ?.replace(/[^\w\s?]/gi, '')
-                .toLowerCase();
-              console.log('Comment body:', sanitizedComment);
-              if (containsQuestionKeywords(sanitizedComment, process.env.QUESTION_KEYWORDS)) {
-                try {
-                  console.log('Adding labels to the issue');
-                  await addLabelsToIssue(github, context, process.env.QUESTION_LABELS);
-                  console.log('Labels added successfully');
-                  const issueUrl = `https://github.com/${context.repo.owner}/${context.repo.repo}/issues/${context.payload.issue.number}`;
-                  const issueTitle = context.payload.issue.title;
-                  const issueNumber = context.payload.issue.number;
-                  console.log('Issue URL:', issueUrl);
-                  console.log('Issue Title:', issueTitle);
-                  console.log('Issue Number:', issueNumber);
-                  const payload = {
-                    link: issueUrl,
-                    Question: commentBody,
-                    "issue-number": issueNumber,
-                    title: issueTitle,
-                    user: commenter
-                  };
-                  await sendSlackNotification(process.env.SLACK_WEBHOOK, payload);
-                  console.log('Slack notification sent successfully');
-                } catch (error) {
-                  console.error('Workflow failed:', error.message);
-                  core.setFailed(`Workflow failed: ${error.message}`);
+            const allowedUsers = process.env.ALLOWED_USERNAMES;
+            const keywords = process.env.QUESTION_KEYWORDS;
+            const labels = process.env.QUESTION_LABELS;
+            const webhook = process.env.SLACK_WEBHOOK;
+
+            if (await isBot(github, commenter)) return;
+
+            if (allowedUsers && !isOrgMember(commenter, allowedUsers)) {
+              const commentBody = context.payload.comment.body.trim();
+              const filteredCommentBody = commentBody.split('\n').filter(line => !line.startsWith('>')).join('\n');
+
+              if (keywords && containsQuestionKeywords(filteredCommentBody, keywords)) {
+                if (labels) {
+                  await addLabelsToIssue(github, context, labels);
+                }
+                if (webhook) {
+                  const commentUrl = context.payload.comment.html_url;
+                  await sendSlackNotification(webhook, commentUrl);
                 }
               }
             }
-            console.log('Script ended');

From 8b16710ea64de7cc7a4edd74a6d88525535ee396 Mon Sep 17 00:00:00 2001
From: Mohammed Nihal <57055998+nihal467@users.noreply.github.com>
Date: Wed, 4 Dec 2024 13:23:04 +0530
Subject: [PATCH 35/37] Enable ABDM plug in cypress env (#9288)

---
 .github/workflows/cypress.yaml | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/.github/workflows/cypress.yaml b/.github/workflows/cypress.yaml
index 506c2e56f66..3abf95cd4b0 100644
--- a/.github/workflows/cypress.yaml
+++ b/.github/workflows/cypress.yaml
@@ -18,8 +18,9 @@ jobs:
         containers: [1, 2, 3, 4]
     env:
       REACT_CARE_API_URL: http://localhost:9000
-      REACT_ENABLED_APPS: "ohcnetwork/care_hcx_fe@main"
+      REACT_ENABLED_APPS: "ohcnetwork/care_hcx_fe@main,ohcnetwork/care_abdm_fe@main"
       REACT_ENABLE_HCX: true
+      REACT_ENABLE_ABDM: true
     steps:
       - name: Checkout 📥
         uses: actions/checkout@v3
@@ -135,4 +136,4 @@ jobs:
         if: ${{ failure() && steps.pr_origin.outputs.is_forked == 'true' }}
         with:
           name: cypress-videos
-          path: cypress/videos
\ No newline at end of file
+          path: cypress/videos

From 9561e0d6dd58ead96918f5a0f49cd1c96095ce5e Mon Sep 17 00:00:00 2001
From: Mohammed Nihal <57055998+nihal467@users.noreply.github.com>
Date: Wed, 4 Dec 2024 14:27:18 +0530
Subject: [PATCH 36/37] Refactored User Login Workflow in cypress (#9285)

---
 cypress/e2e/assets_spec/AssetHomepage.cy.ts   | 226 ++++++++++--------
 cypress/e2e/assets_spec/AssetsCreation.cy.ts  |  19 +-
 cypress/e2e/assets_spec/AssetsManage.cy.ts    |  62 +++--
 .../e2e/facility_spec/FacilityCreation.cy.ts  |  36 +--
 .../e2e/facility_spec/FacilityHomepage.cy.ts  |  70 ++++--
 .../e2e/facility_spec/FacilityInventory.cy.ts |   2 +-
 .../e2e/facility_spec/FacilityLocation.cy.ts  |   4 +-
 .../e2e/facility_spec/FacilityManage.cy.ts    |  84 ++++---
 cypress/e2e/hcx_spec/HcxClaims.cy.ts          |   2 +-
 .../patient_spec/PatientBedManagement.cy.ts   |   2 +-
 .../PatientConsultationCreation.cy.ts         |   2 +-
 .../PatientConsultationDischarge.cy.ts        |   2 +-
 .../patient_spec/PatientDoctorConnect.cy.ts   |   2 +-
 .../e2e/patient_spec/PatientDoctorNotes.cy.ts |   2 +-
 .../e2e/patient_spec/PatientFileUpload.cy.ts  |   8 +-
 .../e2e/patient_spec/PatientHomepage.cy.ts    |   2 +-
 .../patient_spec/PatientInvestigation.cy.ts   |   2 +-
 .../e2e/patient_spec/PatientLogUpdate.cy.ts   |   2 +-
 .../patient_spec/PatientPrescription.cy.ts    |   2 +-
 .../patient_spec/PatientRegistration.cy.ts    |   2 +-
 .../ResourcesAdvanceFilters.cy.ts             |   6 +-
 .../e2e/resource_spec/ResourcesHomepage.cy.ts |   9 +-
 .../SampleTestAdvanceFilters.cy.ts            |   6 +-
 .../sample_test_spec/SampleTestHomepage.cy.ts |   6 +-
 .../sample_test_spec/SampleTestRequest.cy.ts  |   2 +-
 .../ShiftingAdvanceFilters.cy.ts              |   4 +-
 .../e2e/shifting_spec/ShiftingHomepage.cy.ts  |   6 +-
 cypress/e2e/users_spec/UsersCreation.cy.ts    |  18 +-
 cypress/e2e/users_spec/UsersHomepage.cy.ts    |  36 ++-
 cypress/e2e/users_spec/UsersManage.cy.ts      |  16 +-
 cypress/e2e/users_spec/UsersProfile.cy.ts     |  11 +-
 cypress/pageobject/Asset/AssetCreation.ts     |  45 ----
 cypress/pageobject/Asset/AssetFilters.ts      |  69 +-----
 cypress/pageobject/Asset/AssetHome.ts         | 112 +++++++++
 cypress/pageobject/Asset/AssetPagination.ts   |   0
 cypress/pageobject/Asset/AssetQRScan.ts       |   7 -
 cypress/pageobject/Asset/AssetSearch.ts       |  60 -----
 .../pageobject/Facility/FacilityCreation.ts   |  28 ---
 cypress/pageobject/Facility/FacilityHome.ts   |  22 +-
 cypress/pageobject/Login/LoginPage.ts         |  22 +-
 cypress/pageobject/Users/ManageUserPage.ts    |  21 --
 cypress/pageobject/Users/UserSearch.ts        |   8 -
 .../pageobject/utils/advanceFilterHelpers.ts  |  21 ++
 cypress/pageobject/utils/userConfig.ts        |   8 +
 package-lock.json                             |  32 +++
 src/components/Assets/AssetsList.tsx          |   1 +
 src/components/Facility/FacilityList.tsx      |   1 +
 47 files changed, 578 insertions(+), 532 deletions(-)
 create mode 100644 cypress/pageobject/Asset/AssetHome.ts
 delete mode 100644 cypress/pageobject/Asset/AssetPagination.ts
 delete mode 100644 cypress/pageobject/Asset/AssetQRScan.ts
 delete mode 100644 cypress/pageobject/Asset/AssetSearch.ts
 create mode 100644 cypress/pageobject/utils/userConfig.ts

diff --git a/cypress/e2e/assets_spec/AssetHomepage.cy.ts b/cypress/e2e/assets_spec/AssetHomepage.cy.ts
index dfb3249c243..e19f885db72 100644
--- a/cypress/e2e/assets_spec/AssetHomepage.cy.ts
+++ b/cypress/e2e/assets_spec/AssetHomepage.cy.ts
@@ -2,112 +2,128 @@ import { advanceFilters } from "pageobject/utils/advanceFilterHelpers";
 import { pageNavigation } from "pageobject/utils/paginationHelpers";
 import { v4 as uuidv4 } from "uuid";
 
-import { AssetPage } from "../../pageobject/Asset/AssetCreation";
 import { AssetFilters } from "../../pageobject/Asset/AssetFilters";
-import { AssetQRScanPage } from "../../pageobject/Asset/AssetQRScan";
-import { AssetSearchPage } from "../../pageobject/Asset/AssetSearch";
+import { AssetHome } from "../../pageobject/Asset/AssetHome";
 import LoginPage from "../../pageobject/Login/LoginPage";
-
-describe("Asset Tab", () => {
-  const assetSearchPage = new AssetSearchPage();
-  const assetQRScanPage = new AssetQRScanPage();
-  const assetFilters = new AssetFilters();
-  const assetPage = new AssetPage();
-  const loginPage = new LoginPage();
-  const assetName = "Dummy Camera 10";
-  const qrCode = uuidv4();
-  const serialNumber = Math.floor(Math.random() * 10 ** 10).toString();
-
-  before(() => {
-    loginPage.loginAsDistrictAdmin();
-    cy.saveLocalStorage();
-  });
-
-  beforeEach(() => {
-    cy.restoreLocalStorage();
-    cy.clearLocalStorage(/filters--.+/);
-    cy.awaitUrl("/assets");
-  });
-
-  // search for a element
-
-  it("Search Asset Name/QR_ID/Serial_number", () => {
-    assetSearchPage.typeSearchKeyword(assetName);
-    assetSearchPage.pressEnter();
-    assetSearchPage.verifyBadgeContent(assetName);
-    assetSearchPage.clickAssetByName(assetName);
-    assetSearchPage.clickUpdateButton();
-    assetSearchPage.clearAndTypeQRCode(qrCode);
-    assetSearchPage.clearAndTypeSerialNumber(serialNumber);
-    assetSearchPage.clickAssetSubmitButton();
-    assetSearchPage.visitAssetsPage();
-    assetSearchPage.typeSearchKeyword(qrCode);
-    assetSearchPage.pressEnter();
-    assetSearchPage.verifyAssetListContains(assetName);
-    assetSearchPage.verifyBadgeContent(qrCode);
-    assetSearchPage.typeSearchKeyword(serialNumber);
-    assetSearchPage.verifyAssetListContains(assetName);
-    assetSearchPage.verifyBadgeContent(serialNumber);
-  });
-
-  // scan a asset qr code
-
-  it("Scan Asset QR", () => {
-    assetQRScanPage.scanAssetQR();
-  });
-
-  // filter the asset and verify the badges are there
-
-  it("Filter Asset", () => {
-    assetFilters.filterAssets(
-      "Dummy Facility 40",
-      "ACTIVE",
-      "ONVIF Camera",
-      "Camera Loc",
-    );
-    advanceFilters.clickAdvancedFiltersButton();
-    assetFilters.clickslideoverbackbutton(); // to verify the back button doesn't clear applied filters
-    assetFilters.assertFacilityText("Dummy Facility 40");
-    assetFilters.assertAssetClassText("ONVIF");
-    assetFilters.assertStatusText("ACTIVE");
-    assetFilters.assertLocationText("Camera Loc");
-    advanceFilters.clickAdvancedFiltersButton();
-    assetFilters.clearFilters();
-  });
-
-  // Verify the pagination in the page
-
-  it("Next/Previous Page", () => {
-    pageNavigation.navigateToNextPage();
-    pageNavigation.verifyCurrentPageNumber(2);
-    pageNavigation.navigateToPreviousPage();
-    pageNavigation.verifyCurrentPageNumber(1);
-  });
-
-  it("Import new asset", () => {
-    assetPage.selectassetimportbutton();
-    assetPage.selectImportOption();
-    assetPage.selectImportFacility("Dummy Facility 40");
-    assetPage.importAssetFile();
-    assetPage.selectImportLocation("Camera Loc");
-    assetPage.clickImportAsset();
-  });
-
-  it("verify imported asset", () => {
-    assetSearchPage.typeSearchKeyword("New Test Asset");
-    assetSearchPage.pressEnter();
-    assetSearchPage.verifyAssetIsPresent("New Test Asset");
-  });
-
-  it("Export asset", () => {
-    assetPage.selectassetimportbutton();
-    cy.wait(2000);
-    assetPage.selectJsonExportButton();
-    assetPage.selectassetimportbutton();
-    assetPage.selectCsvExportButton();
-  });
-
-  afterEach(() => {
-    cy.saveLocalStorage();
+import { nonAdminRoles } from "../../pageobject/utils/userConfig";
+
+const rolesToTest: Array<"districtAdmin" | (typeof nonAdminRoles)[number]> = [
+  "districtAdmin",
+  ...nonAdminRoles,
+];
+
+rolesToTest.forEach((role) => {
+  describe(`Asset Tab Tests for Role: ${role}`, () => {
+    const assetHome = new AssetHome();
+    const assetFilters = new AssetFilters();
+    const loginPage = new LoginPage();
+    const assetName = "Dummy Camera 10";
+    const assetStatus = "ACTIVE";
+    const assetClass = "ONVIF";
+    const assetLocation = "Camera Loc";
+    const facilityName = "Dummy Facility 40";
+    const newImportAssetName = "New Test Asset";
+    const qrCode = uuidv4();
+    const serialNumber = Math.floor(Math.random() * 10 ** 10).toString();
+
+    before(() => {
+      loginPage.loginByRole(role);
+      cy.saveLocalStorage();
+    });
+
+    beforeEach(() => {
+      cy.restoreLocalStorage();
+      cy.clearLocalStorage(/filters--.+/);
+      cy.awaitUrl("/assets");
+    });
+
+    it("Search Asset Name/QR_ID/Serial_number", () => {
+      assetHome.typeAssetSearch(assetName);
+      advanceFilters.verifyFilterBadgePresence(
+        "Name/Serial No./QR ID",
+        assetName,
+        true,
+      );
+      assetHome.clickAssetByName(assetName);
+      assetHome.clickAssetDetailsUpdateButton();
+      assetHome.clearAndTypeQRCode(qrCode);
+      assetHome.clearAndTypeSerialNumber(serialNumber);
+      assetHome.clickAssetUpdateSubmitButton();
+      assetHome.navigateToAssetsPage();
+      assetHome.typeAssetSearch(qrCode);
+      assetHome.verifyAssetListContains(assetName);
+      advanceFilters.verifyFilterBadgePresence(
+        "Name/Serial No./QR ID",
+        qrCode,
+        true,
+      );
+      assetHome.typeAssetSearch(serialNumber);
+      assetHome.verifyAssetListContains(assetName);
+      advanceFilters.verifyFilterBadgePresence(
+        "Name/Serial No./QR ID",
+        serialNumber,
+        true,
+      );
+    });
+
+    it("Scan Asset QR", () => {
+      assetHome.scanAssetQR();
+    });
+
+    it("Advance Filter Asset", () => {
+      advanceFilters.clickAdvancedFiltersButton();
+      advanceFilters.typeFacilityName(facilityName);
+      assetFilters.filterAssets(assetStatus, assetClass, assetLocation);
+      advanceFilters.applySelectedFilter();
+      advanceFilters.clickAdvancedFiltersButton();
+      advanceFilters.clickslideoverbackbutton(); // to verify the back button doesn't clear applied filters
+      advanceFilters.verifyFilterBadgePresence("Facility", facilityName, true);
+      advanceFilters.verifyFilterBadgePresence("Asset Class", assetClass, true);
+      advanceFilters.verifyFilterBadgePresence("Status", assetStatus, true);
+      advanceFilters.verifyFilterBadgePresence("Location", assetLocation, true);
+      advanceFilters.clickAdvancedFiltersButton();
+      advanceFilters.clickClearAdvanceFilters();
+    });
+
+    it("Next/Previous Page", () => {
+      pageNavigation.navigateToNextPage();
+      pageNavigation.verifyCurrentPageNumber(2);
+      pageNavigation.navigateToPreviousPage();
+      pageNavigation.verifyCurrentPageNumber(1);
+    });
+
+    it("Import new asset and verify its presence", () => {
+      if (role === "districtAdmin") {
+        assetHome.selectAssetImportButton("click");
+        assetHome.selectImportOption();
+        assetHome.selectImportFacility(facilityName);
+        assetHome.importAssetFile();
+        assetHome.selectImportLocation(assetLocation);
+        assetHome.clickImportAsset();
+        cy.verifyNotification("Assets imported successfully");
+        cy.closeNotification();
+        assetHome.navigateToAssetsPage();
+        assetHome.typeAssetSearch(newImportAssetName);
+        assetHome.verifyAssetIsPresent(newImportAssetName);
+      } else {
+        assetHome.selectAssetImportButton("verifyNotExist");
+      }
+    });
+
+    it("Export the list of assets in CSV & Json", () => {
+      if (role === "districtAdmin") {
+        assetHome.selectAssetImportButton("click");
+        cy.wait(2000);
+        assetHome.selectJsonExportButton();
+        assetHome.selectAssetImportButton("click");
+        assetHome.selectCsvExportButton();
+      } else {
+        assetHome.selectAssetImportButton("verifyNotExist");
+      }
+    });
+
+    afterEach(() => {
+      cy.saveLocalStorage();
+    });
   });
 });
diff --git a/cypress/e2e/assets_spec/AssetsCreation.cy.ts b/cypress/e2e/assets_spec/AssetsCreation.cy.ts
index 61c6fe9b517..76f225b03d7 100644
--- a/cypress/e2e/assets_spec/AssetsCreation.cy.ts
+++ b/cypress/e2e/assets_spec/AssetsCreation.cy.ts
@@ -1,18 +1,18 @@
 import { v4 as uuidv4 } from "uuid";
 
 import { AssetPage } from "../../pageobject/Asset/AssetCreation";
-import { AssetSearchPage } from "../../pageobject/Asset/AssetSearch";
+import { AssetHome } from "../../pageobject/Asset/AssetHome";
 import LoginPage from "../../pageobject/Login/LoginPage";
 
 describe("Asset", () => {
   const assetPage = new AssetPage();
-  const assetSearchPage = new AssetSearchPage();
+  const assetHome = new AssetHome();
   const loginPage = new LoginPage();
   const phone_number = "9999999999";
   const serialNumber = Math.floor(Math.random() * 10 ** 10).toString();
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
@@ -87,9 +87,8 @@ describe("Asset", () => {
     assetPage.verifyAssetCreation();
     assetPage.verifySuccessNotification("Asset created successfully");
 
-    assetSearchPage.typeSearchKeyword("New Test Asset 2");
-    assetSearchPage.pressEnter();
-    assetSearchPage.verifyAssetIsPresent("New Test Asset 2");
+    assetHome.typeAssetSearch("New Test Asset 2");
+    assetHome.verifyAssetIsPresent("New Test Asset 2");
   });
 
   it("Edit an Asset", () => {
@@ -114,9 +113,8 @@ describe("Asset", () => {
   });
 
   it("Verify Editted Asset", () => {
-    assetSearchPage.typeSearchKeyword("New Test Asset Edited");
-    assetSearchPage.pressEnter();
-    assetSearchPage.verifyAssetIsPresent("New Test Asset Edited");
+    assetHome.typeAssetSearch("New Test Asset Edited");
+    assetHome.verifyAssetIsPresent("New Test Asset Edited");
   });
 
   it("Configure an asset", () => {
@@ -159,8 +157,7 @@ describe("Asset", () => {
     assetPage.interceptAssetCreation();
     assetPage.clickCreateAsset();
     assetPage.verifyAssetCreation();
-    assetSearchPage.typeSearchKeyword("New Test Asset Vital");
-    assetSearchPage.pressEnter();
+    assetHome.typeAssetSearch("New Test Asset Vital");
     assetPage.openCreatedAsset();
     assetPage.configureVitalAsset("Host name", "192.168.1.20");
     assetPage.clickConfigureVital();
diff --git a/cypress/e2e/assets_spec/AssetsManage.cy.ts b/cypress/e2e/assets_spec/AssetsManage.cy.ts
index 17ee99bdb62..32dc5791bd3 100644
--- a/cypress/e2e/assets_spec/AssetsManage.cy.ts
+++ b/cypress/e2e/assets_spec/AssetsManage.cy.ts
@@ -1,6 +1,8 @@
+import FacilityHome from "pageobject/Facility/FacilityHome";
+import { advanceFilters } from "pageobject/utils/advanceFilterHelpers";
+
 import { AssetPage } from "../../pageobject/Asset/AssetCreation";
-import { AssetFilters } from "../../pageobject/Asset/AssetFilters";
-import { AssetSearchPage } from "../../pageobject/Asset/AssetSearch";
+import { AssetHome } from "../../pageobject/Asset/AssetHome";
 import FacilityPage from "../../pageobject/Facility/FacilityCreation";
 import LoginPage from "../../pageobject/Login/LoginPage";
 
@@ -14,15 +16,15 @@ describe("Asset", () => {
   const assetPage = new AssetPage();
   const loginPage = new LoginPage();
   const facilityPage = new FacilityPage();
-  const assetSearchPage = new AssetSearchPage();
-  const assetFilters = new AssetFilters();
+  const assetHome = new AssetHome();
+  const facilityHome = new FacilityHome();
   const fillFacilityName = "Dummy Facility 40";
   const assetname = "Dummy Camera";
   const locationName = "Dummy Location 1";
   const initiallocationName = "Camera Location";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
@@ -33,10 +35,13 @@ describe("Asset", () => {
   });
 
   it("Verify Asset Warranty Expiry Label", () => {
-    assetSearchPage.typeSearchKeyword(assetname);
-    assetSearchPage.pressEnter();
-    assetSearchPage.verifyBadgeContent(assetname);
-    assetSearchPage.clickAssetByName(assetname);
+    assetHome.typeAssetSearch(assetname);
+    advanceFilters.verifyFilterBadgePresence(
+      "Name/Serial No./QR ID",
+      assetname,
+      true,
+    );
+    assetHome.clickAssetByName(assetname);
     assetPage.clickupdatedetailbutton();
     assetPage.scrollintoWarrantyDetails();
     assetPage.enterWarrantyExpiryDate(addDaysToDate(100)); // greater than 3 months
@@ -60,10 +65,13 @@ describe("Asset", () => {
   });
 
   it("Create & Edit a service history and verify reflection", () => {
-    assetSearchPage.typeSearchKeyword(assetname);
-    assetSearchPage.pressEnter();
-    assetSearchPage.verifyBadgeContent(assetname);
-    assetSearchPage.clickAssetByName(assetname);
+    assetHome.typeAssetSearch(assetname);
+    advanceFilters.verifyFilterBadgePresence(
+      "Name/Serial No./QR ID",
+      assetname,
+      true,
+    );
+    assetHome.clickAssetByName(assetname);
     assetPage.clickupdatedetailbutton();
     assetPage.scrollintonotes();
     assetPage.enterAssetNotes("Dummy Notes");
@@ -82,10 +90,13 @@ describe("Asset", () => {
   });
 
   it("Create a asset transaction and verify history", () => {
-    assetSearchPage.typeSearchKeyword(assetname);
-    assetSearchPage.pressEnter();
-    assetSearchPage.verifyBadgeContent(assetname);
-    assetSearchPage.clickAssetByName(assetname);
+    assetHome.typeAssetSearch(assetname);
+    advanceFilters.verifyFilterBadgePresence(
+      "Name/Serial No./QR ID",
+      assetname,
+      true,
+    );
+    assetHome.clickAssetByName(assetname);
     assetPage.clickupdatedetailbutton();
     assetPage.clickassetlocation(locationName);
     assetPage.clickUpdateAsset();
@@ -94,10 +105,13 @@ describe("Asset", () => {
   });
 
   it("Verify Facility Asset Page Redirection", () => {
-    cy.visit("/facility");
-    assetSearchPage.typeSearchKeyword(fillFacilityName);
-    assetSearchPage.pressEnter();
-    facilityPage.verifyFacilityBadgeContent(fillFacilityName);
+    facilityHome.navigateToFacilityHomepage();
+    facilityHome.typeFacilitySearch(fillFacilityName);
+    advanceFilters.verifyFilterBadgePresence(
+      "Facility/District Name",
+      fillFacilityName,
+      true,
+    );
     facilityPage.visitAlreadyCreatedFacility();
     facilityPage.clickManageFacilityDropdown();
     facilityPage.clickCreateAssetFacilityOption();
@@ -106,7 +120,11 @@ describe("Asset", () => {
     facilityPage.clickManageFacilityDropdown();
     facilityPage.clickviewAssetFacilityOption();
     facilityPage.verifyfacilityviewassetredirection();
-    assetFilters.assertFacilityText(fillFacilityName);
+    advanceFilters.verifyFilterBadgePresence(
+      "Facility",
+      fillFacilityName,
+      true,
+    );
     facilityPage.verifyassetfacilitybackredirection();
   });
 
diff --git a/cypress/e2e/facility_spec/FacilityCreation.cy.ts b/cypress/e2e/facility_spec/FacilityCreation.cy.ts
index 5fd988480fc..d8d73417e7e 100644
--- a/cypress/e2e/facility_spec/FacilityCreation.cy.ts
+++ b/cypress/e2e/facility_spec/FacilityCreation.cy.ts
@@ -1,8 +1,11 @@
+import { advanceFilters } from "pageobject/utils/advanceFilterHelpers";
+
 import FacilityPage from "../../pageobject/Facility/FacilityCreation";
 import FacilityHome from "../../pageobject/Facility/FacilityHome";
 import LoginPage from "../../pageobject/Login/LoginPage";
 import ManageUserPage from "../../pageobject/Users/ManageUserPage";
 import { UserCreationPage } from "../../pageobject/Users/UserCreation";
+import { nonAdminRoles } from "../../pageobject/utils/userConfig";
 
 describe("Facility Creation", () => {
   let facilityUrl1: string;
@@ -60,7 +63,7 @@ describe("Facility Creation", () => {
   const facilityType = "Primary Health Centres";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
@@ -72,9 +75,13 @@ describe("Facility Creation", () => {
 
   it("Verify Facility Triage Function", () => {
     // mandatory field error throw
-    manageUserPage.typeFacilitySearch(facilityName2);
-    facilityPage.verifyFacilityBadgeContent(facilityName2);
-    manageUserPage.assertFacilityInCard(facilityName2);
+    facilityHome.typeFacilitySearch(facilityName2);
+    advanceFilters.verifyFilterBadgePresence(
+      "Facility/District Name",
+      facilityName2,
+      true,
+    );
+    facilityHome.assertFacilityInCard(facilityName2);
     facilityHome.verifyURLContains(facilityName2);
     facilityPage.visitAlreadyCreatedFacility();
     facilityPage.scrollToFacilityTriage();
@@ -237,10 +244,14 @@ describe("Facility Creation", () => {
       .contains(facilityNumber)
       .should("be.visible");
     // verify the facility homepage
-    cy.visit("/facility");
-    manageUserPage.typeFacilitySearch(facilityName);
-    facilityPage.verifyFacilityBadgeContent(facilityName);
-    manageUserPage.assertFacilityInCard(facilityName);
+    facilityHome.navigateToFacilityHomepage();
+    facilityHome.typeFacilitySearch(facilityName);
+    advanceFilters.verifyFilterBadgePresence(
+      "Facility/District Name",
+      facilityName,
+      true,
+    );
+    facilityHome.assertFacilityInCard(facilityName);
     facilityHome.verifyURLContains(facilityName);
   });
 
@@ -335,13 +346,8 @@ describe("Facility Creation", () => {
   });
 
   it("Access Restriction for Non-Admin Users to facility creation page", () => {
-    const nonAdminLoginMethods = [
-      loginPage.loginAsDevDoctor.bind(loginPage),
-      loginPage.loginAsStaff.bind(loginPage),
-    ];
-
-    nonAdminLoginMethods.forEach((loginMethod) => {
-      loginMethod();
+    nonAdminRoles.forEach((role) => {
+      loginPage.loginByRole(role);
       cy.visit("/facility/create");
       facilityPage.verifyErrorNotification(
         "You don't have permission to perform this action. Contact the admin",
diff --git a/cypress/e2e/facility_spec/FacilityHomepage.cy.ts b/cypress/e2e/facility_spec/FacilityHomepage.cy.ts
index f4c7aaa90a0..7d03f7a16f0 100644
--- a/cypress/e2e/facility_spec/FacilityHomepage.cy.ts
+++ b/cypress/e2e/facility_spec/FacilityHomepage.cy.ts
@@ -6,7 +6,6 @@ import FacilityHome from "../../pageobject/Facility/FacilityHome";
 import FacilityNotify from "../../pageobject/Facility/FacilityNotify";
 import LoginPage from "../../pageobject/Login/LoginPage";
 import ManageUserPage from "../../pageobject/Users/ManageUserPage";
-import { UserPage } from "../../pageobject/Users/UserSearch";
 import { advanceFilters } from "../../pageobject/utils/advanceFilterHelpers";
 
 describe("Facility Homepage Function", () => {
@@ -15,7 +14,6 @@ describe("Facility Homepage Function", () => {
   const facilityNotify = new FacilityNotify();
   const facilityPage = new FacilityPage();
   const manageUserPage = new ManageUserPage();
-  const userPage = new UserPage();
   const facilitiesAlias = "downloadFacilitiesCSV";
   const doctorsAlias = "downloadDoctorsCSV";
   const triagesAlias = "downloadTriagesCSV";
@@ -29,7 +27,7 @@ describe("Facility Homepage Function", () => {
   const notificationMessage = "Test Notification";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
@@ -41,9 +39,13 @@ describe("Facility Homepage Function", () => {
 
   it("Verify the Facility card button redirection", () => {
     // view cns button
-    manageUserPage.typeFacilitySearch(facilityName);
-    facilityPage.verifyFacilityBadgeContent(facilityName);
-    manageUserPage.assertFacilityInCard(facilityName);
+    facilityHome.typeFacilitySearch(facilityName);
+    advanceFilters.verifyFilterBadgePresence(
+      "Facility/District Name",
+      facilityName,
+      true,
+    );
+    facilityHome.assertFacilityInCard(facilityName);
     facilityHome.clickViewCnsButton();
     facilityHome.verifyCnsUrl();
     facilityHome.navigateBack();
@@ -68,17 +70,21 @@ describe("Facility Homepage Function", () => {
     advanceFilters.selectLocalBody(localBody);
     advanceFilters.selectFacilityType(facilityType);
     advanceFilters.applySelectedFilter();
-    facilityPage.verifyStateBadgeContent(stateName);
-    facilityPage.verifyDistrictBadgeContent(district);
-    facilityPage.verifyLocalBodyBadgeContent(localBody);
-    facilityPage.verifyFacilityTypeBadgeContent(facilityType);
-    manageUserPage.assertFacilityInCard(facilityName);
+    advanceFilters.verifyFilterBadgePresence("State", stateName, true);
+    advanceFilters.verifyFilterBadgePresence("District", district, true);
+    advanceFilters.verifyFilterBadgePresence(
+      "Facility type",
+      facilityType,
+      true,
+    );
+    advanceFilters.verifyFilterBadgePresence("Local Body", localBody, true);
+    facilityHome.assertFacilityInCard(facilityName);
     advanceFilters.clickAdvancedFiltersButton();
     advanceFilters.clickClearAdvanceFilters();
-    userPage.verifyDataTestIdNotVisible("State");
-    userPage.verifyDataTestIdNotVisible("District");
-    userPage.verifyDataTestIdNotVisible("Facility type");
-    userPage.verifyDataTestIdNotVisible("Local Body");
+    advanceFilters.verifyFilterBadgePresence("State", "", false);
+    advanceFilters.verifyFilterBadgePresence("District", "", false);
+    advanceFilters.verifyFilterBadgePresence("Facility type", "", false);
+    advanceFilters.verifyFilterBadgePresence("Local Body", "", false);
   });
 
   it("Search a facility in homepage and pagination", () => {
@@ -88,9 +94,13 @@ describe("Facility Homepage Function", () => {
     pageNavigation.navigateToPreviousPage();
     pageNavigation.verifyCurrentPageNumber(1);
     // search for a facility
-    manageUserPage.typeFacilitySearch(facilityName);
-    facilityPage.verifyFacilityBadgeContent(facilityName);
-    manageUserPage.assertFacilityInCard(facilityName);
+    facilityHome.typeFacilitySearch(facilityName);
+    advanceFilters.verifyFilterBadgePresence(
+      "Facility/District Name",
+      facilityName,
+      true,
+    );
+    facilityHome.assertFacilityInCard(facilityName);
     facilityHome.verifyURLContains(facilityName);
   });
 
@@ -124,9 +134,13 @@ describe("Facility Homepage Function", () => {
     advanceFilters.selectLocalBody(localBody);
     advanceFilters.applySelectedFilter();
     // go to cns page in the facility details page
-    manageUserPage.typeFacilitySearch(facilityName);
-    facilityPage.verifyFacilityBadgeContent(facilityName);
-    manageUserPage.assertFacilityInCard(facilityName);
+    facilityHome.typeFacilitySearch(facilityName);
+    advanceFilters.verifyFilterBadgePresence(
+      "Facility/District Name",
+      facilityName,
+      true,
+    );
+    facilityHome.assertFacilityInCard(facilityName);
     facilityHome.clickViewFacilityDetails();
     facilityHome.clickFacilityCnsButton();
     facilityHome.verifyCnsUrl();
@@ -140,13 +154,17 @@ describe("Facility Homepage Function", () => {
 
   it("Verify Notice Board Functionality", () => {
     // search facility and verify it's loaded or not
-    manageUserPage.interceptFacilitySearchReq();
-    manageUserPage.typeFacilitySearch(facilityName);
-    manageUserPage.verifyFacilitySearchReq();
+    facilityHome.interceptFacilitySearchReq();
+    facilityHome.typeFacilitySearch(facilityName);
+    facilityHome.verifyFacilitySearchReq();
     // verify facility name and card reflection
     facilityNotify.verifyUrlContains("Dummy+Facility+40");
-    facilityPage.verifyFacilityBadgeContent(facilityName);
-    manageUserPage.assertFacilityInCard(facilityName);
+    advanceFilters.verifyFilterBadgePresence(
+      "Facility/District Name",
+      facilityName,
+      true,
+    );
+    facilityHome.assertFacilityInCard(facilityName);
     // send notification to a facility
     facilityHome.clickFacilityNotifyButton();
     facilityNotify.verifyFacilityName(facilityName);
diff --git a/cypress/e2e/facility_spec/FacilityInventory.cy.ts b/cypress/e2e/facility_spec/FacilityInventory.cy.ts
index a9f32984efc..b3f77479763 100644
--- a/cypress/e2e/facility_spec/FacilityInventory.cy.ts
+++ b/cypress/e2e/facility_spec/FacilityInventory.cy.ts
@@ -9,7 +9,7 @@ describe("Inventory Management Section", () => {
   const inventoryName = "PPE";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/facility_spec/FacilityLocation.cy.ts b/cypress/e2e/facility_spec/FacilityLocation.cy.ts
index 19c43d4dcf4..b4d153b16ed 100644
--- a/cypress/e2e/facility_spec/FacilityLocation.cy.ts
+++ b/cypress/e2e/facility_spec/FacilityLocation.cy.ts
@@ -1,3 +1,4 @@
+import LoginPage from "pageobject/Login/LoginPage";
 import { pageNavigation } from "pageobject/utils/paginationHelpers";
 import { v4 as uuidv4 } from "uuid";
 
@@ -13,6 +14,7 @@ describe("Location Management Section", () => {
   const facilityPage = new FacilityPage();
   const facilityLocation = new FacilityLocation();
   const facilityHome = new FacilityHome();
+  const loginPage = new LoginPage();
 
   const EXPECTED_LOCATION_ERROR_MESSAGES = [
     "Name is required",
@@ -46,7 +48,7 @@ describe("Location Management Section", () => {
   const serialNumber = Math.floor(Math.random() * 10 ** 10).toString();
 
   before(() => {
-    cy.loginByApi("devdistrictadmin", "Coronasafe@123");
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/facility_spec/FacilityManage.cy.ts b/cypress/e2e/facility_spec/FacilityManage.cy.ts
index 02c14958ccf..9f1523768c1 100644
--- a/cypress/e2e/facility_spec/FacilityManage.cy.ts
+++ b/cypress/e2e/facility_spec/FacilityManage.cy.ts
@@ -1,3 +1,6 @@
+import FacilityHome from "pageobject/Facility/FacilityHome";
+import { advanceFilters } from "pageobject/utils/advanceFilterHelpers";
+
 import FacilityPage from "../../pageobject/Facility/FacilityCreation";
 import FacilityManage from "../../pageobject/Facility/FacilityManage";
 import LoginPage from "../../pageobject/Login/LoginPage";
@@ -6,16 +9,18 @@ describe("Facility Manage Functions", () => {
   const loginPage = new LoginPage();
   const facilityManage = new FacilityManage();
   const facilityPage = new FacilityPage();
+  const facilityHome = new FacilityHome();
   const facilityName = "Dummy Facility 40";
   const facilityMiddlewareUpdateButton = "Update";
   const facilityMiddleware = "dev-middleware.coronasafe.live";
   const facilityUpdatedMiddleware = "updated.coronasafe.live";
   const facilityMiddlewareSuccessfullNotification =
     "Facility middleware updated successfully";
-  // const facilityHfridUpdateButton = "Link Health Facility";
-  // const facilityHfridToastNotificationText = /Health Facility config updated successfully|Health ID registration failed/;
-  // const facilityHfrId = "IN180000018";
-  // const facilityUpdatedHfrId = uuidv4();
+  const facilityHfridUpdateButton = "Link Health Facility";
+  const facilityHfridToastNotificationText =
+    /Health Facility config updated successfully|Health ID registration failed/;
+  const facilityHfrId = "IN180000018";
+  const facilityUpdatedHfrId = "IN180000020";
   const doctorCapacity = "5";
   const doctorModifiedCapacity = "7";
   const totalCapacity = "100";
@@ -24,7 +29,7 @@ describe("Facility Manage Functions", () => {
   const currentUpdatedOccupied = "100";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
@@ -33,8 +38,12 @@ describe("Facility Manage Functions", () => {
     cy.restoreLocalStorage();
     cy.clearLocalStorage(/filters--.+/);
     cy.awaitUrl("/");
-    facilityPage.typeFacilitySearch(facilityName);
-    facilityPage.verifyFacilityBadgeContent(facilityName);
+    facilityHome.typeFacilitySearch(facilityName);
+    advanceFilters.verifyFilterBadgePresence(
+      "Facility/District Name",
+      facilityName,
+      true,
+    );
     facilityPage.visitAlreadyCreatedFacility();
   });
 
@@ -76,37 +85,36 @@ describe("Facility Manage Functions", () => {
     facilityManage.verifyMiddlewareAddressValue(facilityUpdatedMiddleware);
   });
 
-  // TODO: enable this test after configuring testing specs for plugs
-  // it("Configure Facility Health ID", () => {
-  //   facilityPage.clickManageFacilityDropdown();
-  //   facilityManage.clickFacilityConfigureButton();
-  //   // verify mandatory field error message
-  //   facilityManage.clearHfrId();
-  //   facilityManage.clickButtonWithText(facilityHfridUpdateButton);
-  //   facilityManage.checkErrorMessageVisibility(
-  //     "Health Facility Id is required",
-  //   );
-  //   // add facility health ID and verify notification
-  //   facilityManage.typeHfrId(facilityHfrId);
-  //   facilityManage.clickButtonWithText(facilityHfridUpdateButton);
-  //   facilityManage.verifySuccessMessageVisibilityAndContent(
-  //     facilityHfridToastNotificationText,
-  //     true,
-  //   );
-  //   // update the existing middleware
-  //   facilityPage.clickManageFacilityDropdown();
-  //   facilityManage.clickFacilityConfigureButton();
-  //   facilityManage.typeHfrId(facilityUpdatedHfrId);
-  //   facilityManage.clickButtonWithText(facilityHfridUpdateButton);
-  //   facilityManage.verifySuccessMessageVisibilityAndContent(
-  //     facilityHfridToastNotificationText,
-  //     true,
-  //   );
-  //   // verify its reflection
-  //   facilityPage.clickManageFacilityDropdown();
-  //   facilityManage.clickFacilityConfigureButton();
-  //   facilityManage.verifyHfrIdValue(facilityUpdatedHfrId);
-  // });
+  it("Configure Facility Health ID", () => {
+    facilityPage.clickManageFacilityDropdown();
+    facilityManage.clickFacilityConfigureButton();
+    // verify mandatory field error message
+    facilityManage.clearHfrId();
+    facilityManage.clickButtonWithText(facilityHfridUpdateButton);
+    facilityManage.checkErrorMessageVisibility(
+      "Health Facility Id is required",
+    );
+    // add facility health ID and verify notification
+    facilityManage.typeHfrId(facilityHfrId);
+    facilityManage.clickButtonWithText(facilityHfridUpdateButton);
+    facilityManage.verifySuccessMessageVisibilityAndContent(
+      facilityHfridToastNotificationText,
+      true,
+    );
+    // update the existing middleware
+    facilityPage.clickManageFacilityDropdown();
+    facilityManage.clickFacilityConfigureButton();
+    facilityManage.typeHfrId(facilityUpdatedHfrId);
+    facilityManage.clickButtonWithText(facilityHfridUpdateButton);
+    facilityManage.verifySuccessMessageVisibilityAndContent(
+      facilityHfridToastNotificationText,
+      true,
+    );
+    // verify its reflection
+    facilityPage.clickManageFacilityDropdown();
+    facilityManage.clickFacilityConfigureButton();
+    facilityManage.verifyHfrIdValue(facilityUpdatedHfrId);
+  });
 
   it("Modify doctor capacity in Facility detail page", () => {
     // Add a doctor capacity
diff --git a/cypress/e2e/hcx_spec/HcxClaims.cy.ts b/cypress/e2e/hcx_spec/HcxClaims.cy.ts
index b698bb7ffd8..ccaa628febb 100644
--- a/cypress/e2e/hcx_spec/HcxClaims.cy.ts
+++ b/cypress/e2e/hcx_spec/HcxClaims.cy.ts
@@ -18,7 +18,7 @@ describe("HCX Claims configuration and approval workflow", () => {
   const patientInsurerName = "Demo Payor";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/patient_spec/PatientBedManagement.cy.ts b/cypress/e2e/patient_spec/PatientBedManagement.cy.ts
index 94f0869db9b..fbc31ff9698 100644
--- a/cypress/e2e/patient_spec/PatientBedManagement.cy.ts
+++ b/cypress/e2e/patient_spec/PatientBedManagement.cy.ts
@@ -15,7 +15,7 @@ describe("Patient swtich bed functionality", () => {
   const switchPatientTwo = "Dummy Patient Seven";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/patient_spec/PatientConsultationCreation.cy.ts b/cypress/e2e/patient_spec/PatientConsultationCreation.cy.ts
index 3eacd9b718f..4191d63b3e2 100644
--- a/cypress/e2e/patient_spec/PatientConsultationCreation.cy.ts
+++ b/cypress/e2e/patient_spec/PatientConsultationCreation.cy.ts
@@ -38,7 +38,7 @@ describe("Patient Consultation in multiple combination", () => {
   const patientIpNumber = `${Math.floor(Math.random() * 90 + 10)}/${Math.floor(Math.random() * 9000 + 1000)}`;
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/patient_spec/PatientConsultationDischarge.cy.ts b/cypress/e2e/patient_spec/PatientConsultationDischarge.cy.ts
index 9e234c860da..b7ef6936804 100644
--- a/cypress/e2e/patient_spec/PatientConsultationDischarge.cy.ts
+++ b/cypress/e2e/patient_spec/PatientConsultationDischarge.cy.ts
@@ -20,7 +20,7 @@ describe("Patient Discharge based on multiple reason", () => {
   const doctorName = "Custom Doctor";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/patient_spec/PatientDoctorConnect.cy.ts b/cypress/e2e/patient_spec/PatientDoctorConnect.cy.ts
index 474af286b21..9dd43da4e13 100644
--- a/cypress/e2e/patient_spec/PatientDoctorConnect.cy.ts
+++ b/cypress/e2e/patient_spec/PatientDoctorConnect.cy.ts
@@ -13,7 +13,7 @@ describe("Patient Doctor Connect in consultation page", () => {
   const teleIcuUser = "Tester Doctor";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/patient_spec/PatientDoctorNotes.cy.ts b/cypress/e2e/patient_spec/PatientDoctorNotes.cy.ts
index d227d68ddcb..4fe19329af1 100644
--- a/cypress/e2e/patient_spec/PatientDoctorNotes.cy.ts
+++ b/cypress/e2e/patient_spec/PatientDoctorNotes.cy.ts
@@ -14,7 +14,7 @@ describe("Patient Discussion notes in the consultation page", () => {
   const discussionNotesSuccessMessage = "Note added successfully";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/patient_spec/PatientFileUpload.cy.ts b/cypress/e2e/patient_spec/PatientFileUpload.cy.ts
index dd3098163ec..ebf85d2cfad 100644
--- a/cypress/e2e/patient_spec/PatientFileUpload.cy.ts
+++ b/cypress/e2e/patient_spec/PatientFileUpload.cy.ts
@@ -18,7 +18,7 @@ function runTests(
     const patientNameTwo = "Dummy Patient Four";
     const patientNameThree = "Dummy Patient Five";
     before(() => {
-      loginPage.loginAsDistrictAdmin();
+      loginPage.loginByRole("districtAdmin");
       cy.saveLocalStorage();
     });
 
@@ -63,7 +63,7 @@ function runTests(
 
     it("User-level Based Permission for File Modification", () => {
       // Login as Nurse 1
-      loginPage.login("dummynurse1", "Coronasafe@123");
+      loginPage.loginByRole("nurse");
       cy.reload();
       // Visit the patient details page
       patientPage.visitPatient(patientNameThree);
@@ -85,13 +85,13 @@ function runTests(
       cy.closeNotification();
       patientFileUpload.verifyUploadFilePresence(newFileName);
       // Login as Nurse 2
-      loginPage.login("dummynurse2", "Coronasafe@123");
+      loginPage.loginByRole("nurse2");
       cy.reload();
       // Verify the file edit option is not available
       patientFileUpload.verifyUploadFilePresence(newFileName);
       patientFileUpload.verifyFileRenameOption(false);
       // Login as District Admin
-      loginPage.loginAsDistrictAdmin();
+      loginPage.loginByRole("districtAdmin");
       cy.reload();
       // Verify the file edit option is available
       patientFileUpload.verifyUploadFilePresence(newFileName);
diff --git a/cypress/e2e/patient_spec/PatientHomepage.cy.ts b/cypress/e2e/patient_spec/PatientHomepage.cy.ts
index e2c32098f1c..2d8d20572bc 100644
--- a/cypress/e2e/patient_spec/PatientHomepage.cy.ts
+++ b/cypress/e2e/patient_spec/PatientHomepage.cy.ts
@@ -27,7 +27,7 @@ describe("Patient Homepage present functionalities", () => {
   const patientToDateBadge = "2023-12-07";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/patient_spec/PatientInvestigation.cy.ts b/cypress/e2e/patient_spec/PatientInvestigation.cy.ts
index 350614d0c9a..27d68aa257f 100644
--- a/cypress/e2e/patient_spec/PatientInvestigation.cy.ts
+++ b/cypress/e2e/patient_spec/PatientInvestigation.cy.ts
@@ -10,7 +10,7 @@ describe("Patient Investigation Creation from Patient consultation page", () =>
   const patientName = "Dummy Patient Thirteen";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/patient_spec/PatientLogUpdate.cy.ts b/cypress/e2e/patient_spec/PatientLogUpdate.cy.ts
index cfb739c8343..ec5aef250dc 100644
--- a/cypress/e2e/patient_spec/PatientLogUpdate.cy.ts
+++ b/cypress/e2e/patient_spec/PatientLogUpdate.cy.ts
@@ -41,7 +41,7 @@ describe("Patient Log Update in Normal, Critical and TeleIcu", () => {
   const domicilaryPatient = "Dummy Patient Eleven";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/patient_spec/PatientPrescription.cy.ts b/cypress/e2e/patient_spec/PatientPrescription.cy.ts
index 96e6e23b1aa..61f8067eea0 100644
--- a/cypress/e2e/patient_spec/PatientPrescription.cy.ts
+++ b/cypress/e2e/patient_spec/PatientPrescription.cy.ts
@@ -15,7 +15,7 @@ const medicineIndicator = "Test Indicator";
 
 describe("Patient Medicine Administration", () => {
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/patient_spec/PatientRegistration.cy.ts b/cypress/e2e/patient_spec/PatientRegistration.cy.ts
index 2da35c840e0..a7c869401cd 100644
--- a/cypress/e2e/patient_spec/PatientRegistration.cy.ts
+++ b/cypress/e2e/patient_spec/PatientRegistration.cy.ts
@@ -70,7 +70,7 @@ describe("Patient Creation with consultation", () => {
   const patientOccupation = "Student";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/resource_spec/ResourcesAdvanceFilters.cy.ts b/cypress/e2e/resource_spec/ResourcesAdvanceFilters.cy.ts
index aafc03680ee..33e11b4987a 100644
--- a/cypress/e2e/resource_spec/ResourcesAdvanceFilters.cy.ts
+++ b/cypress/e2e/resource_spec/ResourcesAdvanceFilters.cy.ts
@@ -1,6 +1,10 @@
+import LoginPage from "pageobject/Login/LoginPage";
+
+const loginPage = new LoginPage();
+
 describe("Resource filter", () => {
   before(() => {
-    cy.loginByApi("devdistrictadmin", "Coronasafe@123");
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/resource_spec/ResourcesHomepage.cy.ts b/cypress/e2e/resource_spec/ResourcesHomepage.cy.ts
index 299d753d720..23077a71ed8 100644
--- a/cypress/e2e/resource_spec/ResourcesHomepage.cy.ts
+++ b/cypress/e2e/resource_spec/ResourcesHomepage.cy.ts
@@ -1,3 +1,5 @@
+import FacilityHome from "pageobject/Facility/FacilityHome";
+
 import FacilityPage from "../../pageobject/Facility/FacilityCreation";
 import LoginPage from "../../pageobject/Login/LoginPage";
 import ResourcePage from "../../pageobject/Resource/ResourcePage";
@@ -7,10 +9,11 @@ describe("Resource Page", () => {
   const loginPage = new LoginPage();
   const resourcePage = new ResourcePage();
   const facilityPage = new FacilityPage();
+  const facilityHome = new FacilityHome();
   const phone_number = "9999999999";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
@@ -39,8 +42,8 @@ describe("Resource Page", () => {
   });
 
   it("Create a resource request", () => {
-    cy.visit("/facility");
-    cy.get("#search").click().type("dummy facility 40");
+    facilityHome.navigateToFacilityHomepage();
+    facilityHome.typeFacilitySearch("dummy facility 40");
     cy.intercept("GET", "**/api/v1/facility/**").as("loadFacilities");
     cy.get("#facility-details").click();
     cy.wait("@loadFacilities").its("response.statusCode").should("eq", 200);
diff --git a/cypress/e2e/sample_test_spec/SampleTestAdvanceFilters.cy.ts b/cypress/e2e/sample_test_spec/SampleTestAdvanceFilters.cy.ts
index ad2e57b7433..562eb22a75e 100644
--- a/cypress/e2e/sample_test_spec/SampleTestAdvanceFilters.cy.ts
+++ b/cypress/e2e/sample_test_spec/SampleTestAdvanceFilters.cy.ts
@@ -1,6 +1,10 @@
+import LoginPage from "pageobject/Login/LoginPage";
+
+const loginPage = new LoginPage();
+
 describe("Sample Filter", () => {
   before(() => {
-    cy.loginByApi("devdistrictadmin", "Coronasafe@123");
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/sample_test_spec/SampleTestHomepage.cy.ts b/cypress/e2e/sample_test_spec/SampleTestHomepage.cy.ts
index 98d69ccff41..491da5ee7ad 100644
--- a/cypress/e2e/sample_test_spec/SampleTestHomepage.cy.ts
+++ b/cypress/e2e/sample_test_spec/SampleTestHomepage.cy.ts
@@ -1,6 +1,10 @@
+import LoginPage from "pageobject/Login/LoginPage";
+
+const loginPage = new LoginPage();
+
 describe("Sample List", () => {
   before(() => {
-    cy.loginByApi("devdistrictadmin", "Coronasafe@123");
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/sample_test_spec/SampleTestRequest.cy.ts b/cypress/e2e/sample_test_spec/SampleTestRequest.cy.ts
index da4d8aabd20..a4b26d328e5 100644
--- a/cypress/e2e/sample_test_spec/SampleTestRequest.cy.ts
+++ b/cypress/e2e/sample_test_spec/SampleTestRequest.cy.ts
@@ -24,7 +24,7 @@ describe("Sample Test", () => {
   const sampleTestResult = "Awaiting";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/shifting_spec/ShiftingAdvanceFilters.cy.ts b/cypress/e2e/shifting_spec/ShiftingAdvanceFilters.cy.ts
index 01c1cbebd3a..1a773350b2d 100644
--- a/cypress/e2e/shifting_spec/ShiftingAdvanceFilters.cy.ts
+++ b/cypress/e2e/shifting_spec/ShiftingAdvanceFilters.cy.ts
@@ -1,12 +1,14 @@
+import LoginPage from "pageobject/Login/LoginPage";
 import { advanceFilters } from "pageobject/utils/advanceFilterHelpers";
 
 import ShiftingPage from "../../pageobject/Shift/ShiftFilters";
 
 describe("Shifting section filter", () => {
   const shiftingPage = new ShiftingPage();
+  const loginPage = new LoginPage();
 
   before(() => {
-    cy.loginByApi("devdistrictadmin", "Coronasafe@123");
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/shifting_spec/ShiftingHomepage.cy.ts b/cypress/e2e/shifting_spec/ShiftingHomepage.cy.ts
index a0a637f97f1..a94de68591d 100644
--- a/cypress/e2e/shifting_spec/ShiftingHomepage.cy.ts
+++ b/cypress/e2e/shifting_spec/ShiftingHomepage.cy.ts
@@ -1,6 +1,10 @@
+import LoginPage from "pageobject/Login/LoginPage";
+
+const loginPage = new LoginPage();
+
 describe("Shifting Page", () => {
   before(() => {
-    cy.loginByApi("devdistrictadmin", "Coronasafe@123");
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
diff --git a/cypress/e2e/users_spec/UsersCreation.cy.ts b/cypress/e2e/users_spec/UsersCreation.cy.ts
index 96b953a3e17..1c720e7df12 100644
--- a/cypress/e2e/users_spec/UsersCreation.cy.ts
+++ b/cypress/e2e/users_spec/UsersCreation.cy.ts
@@ -1,7 +1,8 @@
+import FacilityHome from "pageobject/Facility/FacilityHome";
 import ManageUserPage from "pageobject/Users/ManageUserPage";
 import UserProfilePage from "pageobject/Users/UserProfilePage";
+import { advanceFilters } from "pageobject/utils/advanceFilterHelpers";
 
-import { AssetSearchPage } from "../../pageobject/Asset/AssetSearch";
 import FacilityPage from "../../pageobject/Facility/FacilityCreation";
 import LoginPage from "../../pageobject/Login/LoginPage";
 import { UserCreationPage } from "../../pageobject/Users/UserCreation";
@@ -18,7 +19,7 @@ describe("User Creation", () => {
   const manageUserPage = new ManageUserPage();
   const userCreationPage = new UserCreationPage();
   const facilityPage = new FacilityPage();
-  const assetSearchPage = new AssetSearchPage();
+  const facilityHome = new FacilityHome();
   const phoneNumber = generatePhoneNumber();
   const emergencyPhoneNumber = generateEmergencyPhoneNumber();
   const fillFacilityName = "Dummy Facility 40";
@@ -79,7 +80,7 @@ describe("User Creation", () => {
   const newUserDob = "25081999";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
@@ -180,10 +181,13 @@ describe("User Creation", () => {
   });
 
   it("view user redirection from facility page", () => {
-    cy.visit("/facility");
-    assetSearchPage.typeSearchKeyword(fillFacilityName);
-    assetSearchPage.pressEnter();
-    facilityPage.verifyFacilityBadgeContent(fillFacilityName);
+    facilityHome.navigateToFacilityHomepage();
+    facilityHome.typeFacilitySearch(fillFacilityName);
+    advanceFilters.verifyFilterBadgePresence(
+      "Facility/District Name",
+      fillFacilityName,
+      true,
+    );
     facilityPage.visitAlreadyCreatedFacility();
     facilityPage.clickManageFacilityDropdown();
     facilityPage.clickViewUsersOption();
diff --git a/cypress/e2e/users_spec/UsersHomepage.cy.ts b/cypress/e2e/users_spec/UsersHomepage.cy.ts
index b32bb859e4e..8d86482645b 100644
--- a/cypress/e2e/users_spec/UsersHomepage.cy.ts
+++ b/cypress/e2e/users_spec/UsersHomepage.cy.ts
@@ -20,7 +20,7 @@ describe("User Homepage", () => {
   const doctorUserName = "dev-doctor2";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
@@ -43,30 +43,28 @@ describe("User Homepage", () => {
     advanceFilters.applySelectedFilter();
     userPage.checkUsernameText(nurseUserName);
     // Verify the badges related to the data
-    userPage.verifyDataTestIdText("First Name", `First Name: ${firstName}`);
-    userPage.verifyDataTestIdText("Last Name", `Last Name: ${lastName}`);
-    userPage.verifyDataTestIdText(
-      "Phone Number",
-      `Phone Number: +91${phoneNumber}`,
-    );
-    userPage.verifyDataTestIdText(
+    advanceFilters.verifyFilterBadgePresence("First Name", firstName, true);
+    advanceFilters.verifyFilterBadgePresence("Last Name", lastName, true);
+    advanceFilters.verifyFilterBadgePresence("Phone Number", phoneNumber, true);
+    advanceFilters.verifyFilterBadgePresence(
       "WhatsApp no.",
-      `WhatsApp no.: +91${altPhoneNumber}`,
+      altPhoneNumber,
+      true,
     );
-    userPage.verifyDataTestIdText("Role", `Role: ${role}`);
-    userPage.verifyDataTestIdText(
+    advanceFilters.verifyFilterBadgePresence("Role", role, true);
+    advanceFilters.verifyFilterBadgePresence(
       "Home Facility",
-      `Home Facility: ${homeFacility}`,
+      homeFacility,
+      true,
     );
     advanceFilters.clickAdvancedFiltersButton();
     advanceFilters.clickClearAdvanceFilters();
-    userPage.verifyDataTestIdNotVisible("First Name");
-    userPage.verifyDataTestIdNotVisible("Last Name");
-    userPage.verifyDataTestIdNotVisible("Phone Number");
-    userPage.verifyDataTestIdNotVisible("WhatsApp no.");
-    userPage.verifyDataTestIdNotVisible("Role");
-    userPage.verifyDataTestIdNotVisible("Home Facility");
-    userPage.verifyDataTestIdNotVisible("District");
+    advanceFilters.verifyFilterBadgePresence("First Name", "", false);
+    advanceFilters.verifyFilterBadgePresence("Last Name", "", false);
+    advanceFilters.verifyFilterBadgePresence("Phone Number", "", false);
+    advanceFilters.verifyFilterBadgePresence("WhatsApp no.", "", false);
+    advanceFilters.verifyFilterBadgePresence("Role", "", false);
+    advanceFilters.verifyFilterBadgePresence("Home Facility", "", false);
   });
 
   it("Search by username", () => {
diff --git a/cypress/e2e/users_spec/UsersManage.cy.ts b/cypress/e2e/users_spec/UsersManage.cy.ts
index 74baee3deac..41557e87756 100644
--- a/cypress/e2e/users_spec/UsersManage.cy.ts
+++ b/cypress/e2e/users_spec/UsersManage.cy.ts
@@ -1,3 +1,4 @@
+import FacilityHome from "pageobject/Facility/FacilityHome";
 import { advanceFilters } from "pageobject/utils/advanceFilterHelpers";
 
 import LoginPage from "../../pageobject/Login/LoginPage";
@@ -8,6 +9,7 @@ describe("Manage User", () => {
   const loginPage = new LoginPage();
   const userPage = new UserPage();
   const manageUserPage = new ManageUserPage();
+  const facilityHome = new FacilityHome();
   const usernameToLinkFacilitydoc1 = "dummydoctor4";
   const usernameToLinkFacilitydoc2 = "dummydoctor5";
   const usernameToLinkFacilitydoc3 = "dummydoctor6";
@@ -22,7 +24,7 @@ describe("Manage User", () => {
   const linkedskill = "General Medicine";
 
   before(() => {
-    loginPage.loginAsDistrictAdmin();
+    loginPage.loginByRole("districtAdmin");
     cy.saveLocalStorage();
   });
 
@@ -68,9 +70,9 @@ describe("Manage User", () => {
     manageUserPage.assertSkillInAddedUserSkills(linkedskill);
     manageUserPage.clickCloseSlideOver();
     // verifying the doctor connect
-    manageUserPage.navigateToFacility();
-    manageUserPage.typeFacilitySearch(facilitytolinkskill);
-    manageUserPage.assertFacilityInCard(facilitytolinkskill);
+    facilityHome.navigateToFacilityHomepage();
+    facilityHome.typeFacilitySearch(facilitytolinkskill);
+    facilityHome.assertFacilityInCard(facilitytolinkskill);
     manageUserPage.clickFacilityPatients();
     manageUserPage.clickDoctorConnectButton();
     manageUserPage.assertSkillIndoctorconnect(linkedskill);
@@ -134,9 +136,9 @@ describe("Manage User", () => {
     manageUserPage.clickCloseSlideOver();
     //  Go to particular facility doctor connect and all user-id are reflected based on there access
     // Path will be facility page to patient page then doctor connect button
-    manageUserPage.navigateToFacility();
-    manageUserPage.typeFacilitySearch(facilitytolinkusername);
-    manageUserPage.assertFacilityInCard(facilitytolinkusername);
+    facilityHome.navigateToFacilityHomepage();
+    facilityHome.typeFacilitySearch(facilitytolinkusername);
+    facilityHome.assertFacilityInCard(facilitytolinkusername);
     manageUserPage.clickFacilityPatients();
     manageUserPage.clickDoctorConnectButton();
     manageUserPage.assertDoctorConnectVisibility(usernamerealname);
diff --git a/cypress/e2e/users_spec/UsersProfile.cy.ts b/cypress/e2e/users_spec/UsersProfile.cy.ts
index 32b812a188f..551fba4c0f1 100644
--- a/cypress/e2e/users_spec/UsersProfile.cy.ts
+++ b/cypress/e2e/users_spec/UsersProfile.cy.ts
@@ -1,3 +1,5 @@
+import FacilityHome from "pageobject/Facility/FacilityHome";
+
 import LoginPage from "../../pageobject/Login/LoginPage";
 import ManageUserPage from "../../pageobject/Users/ManageUserPage";
 import UserProfilePage from "../../pageobject/Users/UserProfilePage";
@@ -6,6 +8,7 @@ describe("Manage User Profile", () => {
   const loginPage = new LoginPage();
   const userProfilePage = new UserProfilePage();
   const manageUserPage = new ManageUserPage();
+  const facilityHome = new FacilityHome();
 
   const date_of_birth = "01011999";
   const gender = "Male";
@@ -19,7 +22,7 @@ describe("Manage User Profile", () => {
   const facilitySearch = "Dummy Facility 40";
 
   before(() => {
-    loginPage.loginAsDevDoctor();
+    loginPage.loginByRole("devDoctor");
     cy.saveLocalStorage();
   });
 
@@ -65,9 +68,9 @@ describe("Manage User Profile", () => {
     userProfilePage.clickUpdateButton();
     userProfilePage.assertVideoConnectLink("https://www.test.com");
     //  Go to particular facility doctor connect and verify the video connect link is present
-    manageUserPage.navigateToFacility();
-    manageUserPage.typeFacilitySearch(facilitySearch);
-    manageUserPage.assertFacilityInCard(facilitySearch);
+    facilityHome.navigateToFacilityHomepage();
+    facilityHome.typeFacilitySearch(facilitySearch);
+    facilityHome.assertFacilityInCard(facilitySearch);
     manageUserPage.clickFacilityPatients();
     manageUserPage.clickDoctorConnectButton();
     manageUserPage.assertVideoConnectLink("Dev Doctor", "https://www.test.com");
diff --git a/cypress/pageobject/Asset/AssetCreation.ts b/cypress/pageobject/Asset/AssetCreation.ts
index ec631768154..5e590a0f7fd 100644
--- a/cypress/pageobject/Asset/AssetCreation.ts
+++ b/cypress/pageobject/Asset/AssetCreation.ts
@@ -208,51 +208,6 @@ export class AssetPage {
     );
   }
 
-  selectImportFacility(facilityName: string) {
-    cy.get("input[name='facilities']")
-      .type(facilityName)
-      .then(() => {
-        cy.get("[role='option']").contains(facilityName).click();
-      });
-  }
-
-  selectassetimportbutton() {
-    cy.get("[data-testid=import-asset-button]").click();
-  }
-
-  selectJsonExportButton() {
-    cy.intercept("GET", "**/api/v1/asset/?**json=true**").as("getJsonexport");
-    cy.get("#export-json-option").click();
-    cy.wait("@getJsonexport").its("response.statusCode").should("eq", 200);
-  }
-
-  selectCsvExportButton() {
-    cy.intercept("GET", "**/api/v1/asset/?**csv=true**").as("getCsvexport");
-    cy.get("#export-csv-option").click();
-    cy.wait("@getCsvexport").its("response.statusCode").should("eq", 200);
-  }
-
-  selectImportOption() {
-    cy.get(".import-assets-button").click();
-  }
-
-  importAssetFile() {
-    cy.get("[data-testid=import-file]")
-      .selectFile("cypress/fixtures/sample-asset.xlsx", { force: true })
-      .wait(100);
-  }
-
-  selectImportLocation(locationName: string) {
-    cy.get("[data-testid=select-import-location]").click();
-    cy.get("li[role=option]").contains(locationName).click();
-  }
-
-  clickImportAsset() {
-    cy.intercept("POST", "**/api/v1/asset/").as("importAsset");
-    cy.get("#submit").contains("Import").click();
-    cy.wait("@importAsset").its("response.statusCode").should("eq", 201);
-  }
-
   clickupdatedetailbutton() {
     cy.get("[data-testid=asset-update-button]").click();
   }
diff --git a/cypress/pageobject/Asset/AssetFilters.ts b/cypress/pageobject/Asset/AssetFilters.ts
index 7e7b5013d5d..b562841a598 100644
--- a/cypress/pageobject/Asset/AssetFilters.ts
+++ b/cypress/pageobject/Asset/AssetFilters.ts
@@ -1,68 +1,7 @@
 export class AssetFilters {
-  filterAssets(
-    facilityName: string,
-    assetStatus: string,
-    assetClass: string,
-    assetLocation: string,
-  ) {
-    cy.contains("Advanced Filters").click();
-    cy.get("input[name='Facilities']")
-      .click()
-      .type(facilityName)
-      .then(() => {
-        cy.get("[role='option']").contains(facilityName).click();
-      });
-    cy.get("#asset-status")
-      .click()
-      .then(() => {
-        cy.get("[role='option']").contains(assetStatus).click();
-      });
-    cy.get("#asset-class")
-      .click()
-      .then(() => {
-        cy.get("[role='option']").contains(assetClass).click();
-      });
-    cy.get("#Facilities-location")
-      .click()
-      .type(assetLocation)
-      .then(() => {
-        cy.get("[role='option']").contains(assetLocation).click();
-      });
-    cy.contains("Apply").click();
-  }
-  clearFilters() {
-    cy.intercept("GET", "**/api/v1/asset/**").as("clearAssets");
-    cy.get("#clear-filter").click();
-    cy.wait("@clearAssets").its("response.statusCode").should("eq", 200);
-    cy.location("pathname").should("match", /\/assets$/);
-    cy.url().then((url) => {
-      const queryParams = new URL(url).searchParams;
-      let allEmpty = true;
-      const blacklistedKeys = ["page", "limit", "offset"];
-
-      queryParams.forEach((value, key) => {
-        if (value !== "" && !blacklistedKeys.includes(key)) {
-          allEmpty = false;
-        }
-      });
-
-      expect(allEmpty).to.be.true;
-    });
-  }
-  clickslideoverbackbutton() {
-    cy.get("#close-slide-over").click();
-  }
-  // Assertions
-  assertFacilityText(text: string) {
-    cy.get("[data-testid=Facility]").should("contain", text);
-  }
-  assertAssetClassText(text: string) {
-    cy.get("[data-testid='Asset Class']").should("contain", text);
-  }
-  assertStatusText(text: string) {
-    cy.get("[data-testid=Status]").should("contain", text);
-  }
-  assertLocationText(text: string) {
-    cy.get("[data-testid=Location]").should("contain", text);
+  filterAssets(assetStatus: string, assetClass: string, assetLocation: string) {
+    cy.clickAndSelectOption("#asset-status", assetStatus);
+    cy.clickAndSelectOption("#asset-class", assetClass);
+    cy.typeAndSelectOption("#Facilities-location", assetLocation);
   }
 }
diff --git a/cypress/pageobject/Asset/AssetHome.ts b/cypress/pageobject/Asset/AssetHome.ts
new file mode 100644
index 00000000000..e127b785100
--- /dev/null
+++ b/cypress/pageobject/Asset/AssetHome.ts
@@ -0,0 +1,112 @@
+export class AssetHome {
+  clickAssetByName(assetName: string) {
+    cy.intercept("GET", "**/api/v1/asset/**").as("clearAssets");
+    cy.get("[data-testid='created-asset-list']").contains(assetName).click();
+    cy.wait("@clearAssets").its("response.statusCode").should("eq", 200);
+  }
+
+  typeAssetSearch(name: string) {
+    cy.get("#asset-search").click().type(name);
+  }
+
+  verifyAssetIsPresent(assetName: string) {
+    cy.get("[data-testid=created-asset-list]")
+      .first()
+      .should("contain", assetName);
+  }
+
+  clickAssetDetailsUpdateButton() {
+    cy.verifyAndClickElement("[data-testid='asset-update-button']", "Update");
+  }
+
+  clearAndTypeQRCode(qrCode: string) {
+    cy.get("#qr_code_id").clear();
+    cy.get("#qr_code_id").click().type(qrCode);
+  }
+
+  clearAndTypeSerialNumber(serialNumber: string) {
+    cy.get("#serial-number").clear();
+    cy.get("#serial-number").click().type(serialNumber);
+  }
+
+  clickAssetSubmitButton() {
+    cy.intercept("GET", "**/api/v1/asset/**").as("getAssets");
+    cy.get("#submit").click();
+    cy.wait("@getAssets").its("response.statusCode").should("eq", 200);
+  }
+
+  clickAssetUpdateSubmitButton() {
+    cy.intercept("GET", "**/api/v1/asset/**").as("getAssets");
+    cy.clickSubmitButton("Update");
+    cy.wait("@getAssets").its("response.statusCode").should("eq", 200);
+  }
+
+  navigateToAssetsPage() {
+    cy.visit("/assets");
+  }
+
+  verifyAssetListContains(dummyCameraText: string) {
+    cy.get("[data-testid='created-asset-list']").should(
+      "contain",
+      dummyCameraText,
+    );
+  }
+
+  scanAssetQR() {
+    cy.contains("Scan Asset QR").click().wait(1000);
+    cy.get("video").should("exist");
+    cy.get("button").contains("Close Scanner").should("exist").click();
+  }
+
+  selectImportFacility(facilityName: string) {
+    cy.get("input[name='facilities']")
+      .type(facilityName)
+      .then(() => {
+        cy.get("[role='option']").contains(facilityName).click();
+      });
+  }
+
+  selectAssetImportButton(action: "click" | "verifyNotExist"): void {
+    const selector = "[data-testid=import-asset-button]";
+    if (action === "click") {
+      cy.get(selector).click();
+    } else if (action === "verifyNotExist") {
+      cy.get(selector).should("not.exist");
+    }
+  }
+
+  selectJsonExportButton() {
+    cy.intercept("GET", "**/api/v1/asset/?**json=true**").as("getJsonexport");
+    cy.get("#export-json-option").click();
+    cy.wait("@getJsonexport").its("response.statusCode").should("eq", 200);
+  }
+
+  selectCsvExportButton() {
+    cy.intercept("GET", "**/api/v1/asset/?**csv=true**").as("getCsvexport");
+    cy.get("#export-csv-option").click();
+    cy.wait("@getCsvexport").its("response.statusCode").should("eq", 200);
+  }
+
+  selectImportOption() {
+    cy.get(".import-assets-button").click();
+  }
+
+  importAssetFile() {
+    cy.get("[data-testid=import-file]")
+      .selectFile("cypress/fixtures/sample-asset.xlsx", { force: true })
+      .wait(100);
+  }
+
+  selectImportLocation(locationName: string) {
+    cy.clickAndSelectOption(
+      "[data-testid=select-import-location]",
+      locationName,
+    );
+  }
+
+  clickImportAsset() {
+    cy.intercept("POST", "**/api/v1/asset/").as("importAsset");
+    cy.clickSubmitButton("Import");
+    cy.wait("@importAsset").its("response.statusCode").should("eq", 201);
+  }
+}
diff --git a/cypress/pageobject/Asset/AssetPagination.ts b/cypress/pageobject/Asset/AssetPagination.ts
deleted file mode 100644
index e69de29bb2d..00000000000
diff --git a/cypress/pageobject/Asset/AssetQRScan.ts b/cypress/pageobject/Asset/AssetQRScan.ts
deleted file mode 100644
index a88f378f02f..00000000000
--- a/cypress/pageobject/Asset/AssetQRScan.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-export class AssetQRScanPage {
-  scanAssetQR() {
-    cy.contains("Scan Asset QR").click().wait(1000);
-    cy.get("video").should("exist");
-    cy.get("button").contains("Close Scanner").should("exist").click();
-  }
-}
diff --git a/cypress/pageobject/Asset/AssetSearch.ts b/cypress/pageobject/Asset/AssetSearch.ts
deleted file mode 100644
index 653c7bdd89c..00000000000
--- a/cypress/pageobject/Asset/AssetSearch.ts
+++ /dev/null
@@ -1,60 +0,0 @@
-export class AssetSearchPage {
-  typeSearchKeyword(keyword: string) {
-    cy.get("#search").click().clear();
-    cy.get("#search").click().type(keyword);
-  }
-
-  pressEnter() {
-    cy.get("[name='search']").type("{enter}");
-  }
-
-  clickAssetByName(assetName: string) {
-    cy.intercept("GET", "**/api/v1/asset/**").as("clearAssets");
-    cy.get("[data-testid='created-asset-list']").contains(assetName).click();
-    cy.wait("@clearAssets").its("response.statusCode").should("eq", 200);
-  }
-
-  verifyBadgeContent(expectedText: string) {
-    cy.get("[data-testid='Name/Serial No./QR ID']").should(
-      "contain",
-      expectedText,
-    );
-  }
-
-  verifyAssetIsPresent(assetName: string) {
-    cy.get("[data-testid=created-asset-list]")
-      .first()
-      .should("contain", assetName);
-  }
-
-  clickUpdateButton() {
-    cy.get("[data-testid='asset-update-button']").contains("Update").click();
-  }
-
-  clearAndTypeQRCode(qrCode: string) {
-    cy.get("#qr_code_id").clear();
-    cy.get("#qr_code_id").click().type(qrCode);
-  }
-
-  clearAndTypeSerialNumber(serialNumber: string) {
-    cy.get("#serial-number").clear();
-    cy.get("#serial-number").click().type(serialNumber);
-  }
-
-  clickAssetSubmitButton() {
-    cy.intercept("GET", "**/api/v1/asset/**").as("getAssets");
-    cy.get("#submit").click();
-    cy.wait("@getAssets").its("response.statusCode").should("eq", 200);
-  }
-
-  visitAssetsPage() {
-    cy.visit("/assets");
-  }
-
-  verifyAssetListContains(dummyCameraText: string) {
-    cy.get("[data-testid='created-asset-list']").should(
-      "contain",
-      dummyCameraText,
-    );
-  }
-}
diff --git a/cypress/pageobject/Facility/FacilityCreation.ts b/cypress/pageobject/Facility/FacilityCreation.ts
index 0fddc3f9799..4c064956fcc 100644
--- a/cypress/pageobject/Facility/FacilityCreation.ts
+++ b/cypress/pageobject/Facility/FacilityCreation.ts
@@ -9,11 +9,6 @@ class FacilityPage {
       .should("eq", 200);
   }
 
-  typeFacilitySearch(facilityName: string) {
-    cy.get("#search").click().clear();
-    cy.get("#search").click().type(facilityName);
-  }
-
   selectFacilityType(facility: string) {
     advanceFilters.selectFacilityType(facility);
   }
@@ -313,29 +308,6 @@ class FacilityPage {
     cy.get("h1.text-3xl.font-bold", { timeout: 10000 }).should("be.visible");
   }
 
-  verifyFacilityBadgeContent(expectedText: string) {
-    cy.get("[data-testid='Facility/District Name']").should(
-      "contain",
-      expectedText,
-    );
-  }
-
-  verifyStateBadgeContent(expectedText: string) {
-    cy.get("[data-testid='State']").should("contain", expectedText);
-  }
-
-  verifyDistrictBadgeContent(expectedText: string) {
-    cy.get("[data-testid='District']").should("contain", expectedText);
-  }
-
-  verifyLocalBodyBadgeContent(expectedText: string) {
-    cy.get("[data-testid='Local Body']").should("contain", expectedText);
-  }
-
-  verifyFacilityTypeBadgeContent(expectedText: string) {
-    cy.get("[data-testid='Facility type']").should("contain", expectedText);
-  }
-
   verifyfacilitycreateassetredirection() {
     cy.url().should("include", "/assets/new");
   }
diff --git a/cypress/pageobject/Facility/FacilityHome.ts b/cypress/pageobject/Facility/FacilityHome.ts
index 30f51052370..da26cc29fc7 100644
--- a/cypress/pageobject/Facility/FacilityHome.ts
+++ b/cypress/pageobject/Facility/FacilityHome.ts
@@ -1,7 +1,6 @@
 class FacilityHome {
   // Selectors
   exportButton = "#export-button";
-  searchButton = "#search";
   menuItem = "[role='menuitem']";
 
   // Operations
@@ -10,8 +9,25 @@ class FacilityHome {
     cy.get(this.exportButton).click();
   }
 
-  clickSearchButton() {
-    cy.get(this.searchButton).click();
+  navigateToFacilityHomepage() {
+    cy.visit("/facility");
+  }
+
+  assertFacilityInCard(facilityName: string) {
+    cy.get("#facility-name-card").should("contain", facilityName);
+  }
+
+  interceptFacilitySearchReq() {
+    cy.intercept("GET", "**/api/v1/facility/**").as("searchFacility");
+  }
+
+  verifyFacilitySearchReq() {
+    cy.wait("@searchFacility").its("response.statusCode").should("eq", 200);
+  }
+
+  typeFacilitySearch(facilityName: string) {
+    cy.get("#search-by-facility").click().clear();
+    cy.get("#search-by-facility").click().type(facilityName);
   }
 
   clickMenuItem(itemName: string) {
diff --git a/cypress/pageobject/Login/LoginPage.ts b/cypress/pageobject/Login/LoginPage.ts
index 714004023f7..481c6ec3045 100644
--- a/cypress/pageobject/Login/LoginPage.ts
+++ b/cypress/pageobject/Login/LoginPage.ts
@@ -1,16 +1,12 @@
-// LoginPage.ts
+import { users } from "../utils/userConfig";
 
 class LoginPage {
-  loginAsDistrictAdmin(): void {
-    cy.loginByApi("devdistrictadmin", "Coronasafe@123");
-  }
-
-  loginAsDevDoctor(): void {
-    cy.loginByApi("devdoctor", "Coronasafe@123");
-  }
-
-  loginAsStaff(): void {
-    cy.loginByApi("staffdev", "Coronasafe@123");
+  loginByRole(role: keyof typeof users): void {
+    const user = users[role];
+    if (!user) {
+      throw new Error(`Role "${role}" is not defined in userConfig`);
+    }
+    cy.loginByApi(user.username, user.password);
   }
 
   loginManuallyAsDistrictAdmin(isCorrectCredentials: boolean = true): void {
@@ -29,10 +25,6 @@ class LoginPage {
     cy.clickSubmitButton("Login");
   }
 
-  login(username: string, password: string): void {
-    cy.loginByApi(username, password);
-  }
-
   ensureLoggedIn(): void {
     cy.get("#user-profile-name").click();
     cy.get("#sign-out-button").scrollIntoView();
diff --git a/cypress/pageobject/Users/ManageUserPage.ts b/cypress/pageobject/Users/ManageUserPage.ts
index a3a6e72fbc3..01871acd97d 100644
--- a/cypress/pageobject/Users/ManageUserPage.ts
+++ b/cypress/pageobject/Users/ManageUserPage.ts
@@ -90,27 +90,6 @@ export class ManageUserPage {
     );
   }
 
-  navigateToFacility() {
-    cy.visit("/facility");
-  }
-
-  typeFacilitySearch(facilityName: string) {
-    cy.get("#search").click().clear();
-    cy.get("#search").click().type(facilityName);
-  }
-
-  interceptFacilitySearchReq() {
-    cy.intercept("GET", "**/api/v1/facility/**").as("searchFacility");
-  }
-
-  verifyFacilitySearchReq() {
-    cy.wait("@searchFacility").its("response.statusCode").should("eq", 200);
-  }
-
-  assertFacilityInCard(facilityName: string) {
-    cy.get("#facility-name-card").should("contain", facilityName);
-  }
-
   clickFacilityPatients() {
     cy.get("#facility-patients").should("be.visible");
     cy.get("#facility-patients").click();
diff --git a/cypress/pageobject/Users/UserSearch.ts b/cypress/pageobject/Users/UserSearch.ts
index 6b727aa2040..9d996abd83f 100644
--- a/cypress/pageobject/Users/UserSearch.ts
+++ b/cypress/pageobject/Users/UserSearch.ts
@@ -68,14 +68,6 @@ export class UserPage {
     cy.typeAndSelectOption("input[name='home_facility']", facility);
   }
 
-  verifyDataTestIdText(testId: string, text: string) {
-    cy.get(`[data-testid="${testId}"]`).contains(text).should("be.visible");
-  }
-
-  verifyDataTestIdNotVisible(testId: string) {
-    cy.get(`[data-testid="${testId}"]`).should("not.be.visible");
-  }
-
   verifyMultipleBadgesWithSameId(alreadylinkedusersviews: string[]) {
     cy.get("#user-view-name").then(($elements) => {
       const userViews = $elements
diff --git a/cypress/pageobject/utils/advanceFilterHelpers.ts b/cypress/pageobject/utils/advanceFilterHelpers.ts
index a624311c197..22925fc2c23 100644
--- a/cypress/pageobject/utils/advanceFilterHelpers.ts
+++ b/cypress/pageobject/utils/advanceFilterHelpers.ts
@@ -23,7 +23,28 @@ export const advanceFilters = {
     cy.clickAndSelectOption("#facility_type", facilityType);
   },
 
+  typeFacilityName(facilityName: string) {
+    cy.typeAndSelectOption("input[name='Facilities']", facilityName);
+  },
+
+  clickslideoverbackbutton() {
+    cy.get("#close-slide-over").click();
+  },
+
   clickClearAdvanceFilters() {
     cy.verifyAndClickElement("#clear-filter", "Clear");
   },
+
+  verifyFilterBadgePresence(
+    badgeTestId: string,
+    text: string,
+    visible: boolean = true,
+  ) {
+    const badgeElement = cy.get(`[data-testid="${badgeTestId}"]`);
+    if (visible) {
+      badgeElement.contains(text).should("be.visible");
+    } else {
+      badgeElement.should("not.be.visible");
+    }
+  },
 };
diff --git a/cypress/pageobject/utils/userConfig.ts b/cypress/pageobject/utils/userConfig.ts
new file mode 100644
index 00000000000..270fbfba10a
--- /dev/null
+++ b/cypress/pageobject/utils/userConfig.ts
@@ -0,0 +1,8 @@
+export const users = {
+  districtAdmin: { username: "devdistrictadmin", password: "Coronasafe@123" },
+  devDoctor: { username: "devdoctor", password: "Coronasafe@123" },
+  nurse: { username: "dummynurse1", password: "Coronasafe@123" },
+  nurse2: { username: "dummynurse2", password: "Coronasafe@123" },
+};
+
+export const nonAdminRoles = ["devDoctor", "nurse"] as const;
diff --git a/package-lock.json b/package-lock.json
index 032991013a6..6951dd5533a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -114,6 +114,30 @@
         "node": ">=22.11.0"
       }
     },
+    "apps/care_abdm_fe": {
+      "version": "1.0.0",
+      "license": "ISC",
+      "devDependencies": {
+        "react": "^18.0.0",
+        "react-dom": "^18.0.0"
+      },
+      "peerDependencies": {
+        "react": "18.3.1",
+        "react-dom": "18.3.1"
+      }
+    },
+    "apps/care_hcx_fe": {
+      "version": "1.0.0",
+      "license": "ISC",
+      "devDependencies": {
+        "react": "^18.0.0",
+        "react-dom": "^18.0.0"
+      },
+      "peerDependencies": {
+        "react": "18.3.1",
+        "react-dom": "18.3.1"
+      }
+    },
     "apps/care_livekit_fe": {
       "name": "care-livekit",
       "version": "0.0.1",
@@ -7069,6 +7093,14 @@
         "node": ">=6"
       }
     },
+    "node_modules/care_abdm_fe": {
+      "resolved": "apps/care_abdm_fe",
+      "link": true
+    },
+    "node_modules/care_hcx_fe": {
+      "resolved": "apps/care_hcx_fe",
+      "link": true
+    },
     "node_modules/caseless": {
       "version": "0.12.0",
       "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
diff --git a/src/components/Assets/AssetsList.tsx b/src/components/Assets/AssetsList.tsx
index eceee4887e8..f48723f2784 100644
--- a/src/components/Assets/AssetsList.tsx
+++ b/src/components/Assets/AssetsList.tsx
@@ -377,6 +377,7 @@ const AssetsList = () => {
         />
         <div className="flex-1">
           <SearchInput
+            id="asset-search"
             name="search"
             value={qParams.search}
             onChange={(e) => updateQuery({ [e.name]: e.value })}
diff --git a/src/components/Facility/FacilityList.tsx b/src/components/Facility/FacilityList.tsx
index 6570bf7ea58..7f40bfde5f3 100644
--- a/src/components/Facility/FacilityList.tsx
+++ b/src/components/Facility/FacilityList.tsx
@@ -189,6 +189,7 @@ export const FacilityList = () => {
         />
         <div className="my-4 flex grow flex-col justify-between gap-2 sm:flex-row">
           <SearchInput
+            id="search-by-facility"
             name="search"
             value={qParams.search}
             onChange={(e) => updateQuery({ [e.name]: e.value })}

From 577f7ec512da2a0a7d323a32271b24f89a26398c Mon Sep 17 00:00:00 2001
From: Rithvik Nishad <mail@rithviknishad.dev>
Date: Wed, 4 Dec 2024 16:17:25 +0530
Subject: [PATCH 37/37] Partially revert lockfile changes from #9285 (#9295)

---
 package-lock.json | 53 +----------------------------------------------
 1 file changed, 1 insertion(+), 52 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 6951dd5533a..97735b607e9 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -114,49 +114,6 @@
         "node": ">=22.11.0"
       }
     },
-    "apps/care_abdm_fe": {
-      "version": "1.0.0",
-      "license": "ISC",
-      "devDependencies": {
-        "react": "^18.0.0",
-        "react-dom": "^18.0.0"
-      },
-      "peerDependencies": {
-        "react": "18.3.1",
-        "react-dom": "18.3.1"
-      }
-    },
-    "apps/care_hcx_fe": {
-      "version": "1.0.0",
-      "license": "ISC",
-      "devDependencies": {
-        "react": "^18.0.0",
-        "react-dom": "^18.0.0"
-      },
-      "peerDependencies": {
-        "react": "18.3.1",
-        "react-dom": "18.3.1"
-      }
-    },
-    "apps/care_livekit_fe": {
-      "name": "care-livekit",
-      "version": "0.0.1",
-      "extraneous": true,
-      "license": "ISC",
-      "dependencies": {
-        "@livekit/components-react": "^2.6.2",
-        "@livekit/components-styles": "^1.1.3",
-        "livekit-client": "^2.5.5"
-      },
-      "devDependencies": {
-        "react": "^18.0.0",
-        "react-dom": "^18.0.0"
-      },
-      "peerDependencies": {
-        "react": "18.3.1",
-        "react-dom": "18.3.1"
-      }
-    },
     "node_modules/@actions/core": {
       "version": "1.11.1",
       "resolved": "https://registry.npmjs.org/@actions/core/-/core-1.11.1.tgz",
@@ -7093,14 +7050,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/care_abdm_fe": {
-      "resolved": "apps/care_abdm_fe",
-      "link": true
-    },
-    "node_modules/care_hcx_fe": {
-      "resolved": "apps/care_hcx_fe",
-      "link": true
-    },
     "node_modules/caseless": {
       "version": "0.12.0",
       "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
@@ -20859,4 +20808,4 @@
       }
     }
   }
-}
+}
\ No newline at end of file