patient questionnaire minor fix

ohcnetwork · Mar 7, 2025 · 96f04f8 · 96f04f8
1 parent b0b3a82
commit 96f04f8
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 24 deletions.
diff --git a/src/components/Facility/ConsultationDetails/QuestionnaireResponsesList.tsx b/src/components/Facility/ConsultationDetails/QuestionnaireResponsesList.tsx
@@ -1,14 +1,11 @@
 import { useQuery } from "@tanstack/react-query";
 import { t } from "i18next";
-import { Link, useQueryParams } from "raviger";
+import { useQueryParams } from "raviger";
 import { Trans, useTranslation } from "react-i18next";
 
 import { cn } from "@/lib/utils";
 
-import CareIcon from "@/CAREUI/icons/CareIcon";
-
 import { Badge } from "@/components/ui/badge";
-import { Button } from "@/components/ui/button";
 import { Card } from "@/components/ui/card";
 import { Separator } from "@/components/ui/separator";
 
@@ -298,7 +295,6 @@ function ResponseCard({
 
 export default function QuestionnaireResponsesList({
   patientId,
-  facilityId,
   isPrintPreview = false,
   onlyUnstructured,
 }: Props) {
@@ -325,23 +321,6 @@ export default function QuestionnaireResponsesList({
   return (
     <div className="mt-4 gap-4">
       <div className="max-w-full">
-        <div className="flex justify-between items-center mb-4">
-          <div className="mr-4 text-xl font-bold text-secondary-900">
-            {t("updates")}
-          </div>
-          <Button asChild variant="outline_primary">
-            <Link
-              href={
-                facilityId
-                  ? `/facility/${facilityId}/patient/${patientId}/questionnaire`
-                  : `/patient/${patientId}/questionnaire`
-              }
-            >
-              <CareIcon icon="l-plus" className="mr-2" />
-              {t("add_patient_updates")}
-            </Link>
-          </Button>
-        </div>
         {isLoading ? (
           <div className="grid gap-5">
             <CardListSkeleton count={RESULTS_PER_PAGE_LIMIT} />

diff --git a/src/components/Patient/PatientDetailsTab/index.tsx b/src/components/Patient/PatientDetailsTab/index.tsx
@@ -1,4 +1,3 @@
-import QuestionnaireResponsesList from "@/components/Facility/ConsultationDetails/QuestionnaireResponsesList";
 import EncounterHistory from "@/components/Patient/PatientDetailsTab//EncounterHistory";
 import { HealthProfileSummary } from "@/components/Patient/PatientDetailsTab//HealthProfileSummary";
 import { Demography } from "@/components/Patient/PatientDetailsTab/Demography";
@@ -9,6 +8,7 @@ import { Appointments } from "./Appointments";
 import { PatientFilesTab } from "./PatientFiles";
 import { PatientUsers } from "./PatientUsers";
 import { ResourceRequests } from "./ResourceRequests";
+import { Updates } from "./patientUpdates";
 
 export interface PatientProps {
   facilityId?: string;
@@ -35,7 +35,7 @@ export const patientTabs = [
   },
   {
     route: "updates",
-    component: QuestionnaireResponsesList,
+    component: Updates,
   },
   {
     route: "resource_requests",

diff --git a/src/components/Patient/PatientDetailsTab/patientUpdates.tsx b/src/components/Patient/PatientDetailsTab/patientUpdates.tsx
@@ -0,0 +1,36 @@
+import { Link } from "raviger";
+import { useTranslation } from "react-i18next";
+
+import CareIcon from "@/CAREUI/icons/CareIcon";
+
+import { Button } from "@/components/ui/button";
+
+import QuestionnaireResponsesList from "@/components/Facility/ConsultationDetails/QuestionnaireResponsesList";
+
+import { PatientProps } from ".";
+
+export const Updates = (props: PatientProps) => {
+  const { patientId, facilityId } = props;
+  const { t } = useTranslation();
+
+  return (
+    <div className="mt-4 px-3 md:px-0">
+      <div className="flex justify-between items-center mb-4">
+        <h2 className="text-2xl font-semibold leading-tight">{t("updates")}</h2>
+        <Button asChild variant="outline_primary">
+          <Link
+            href={
+              facilityId
+                ? `/facility/${facilityId}/patient/${patientId}/questionnaire`
+                : `/patient/${patientId}/questionnaire`
+            }
+          >
+            <CareIcon icon="l-plus" className="mr-2" />
+            {t("add_patient_updates")}
+          </Link>
+        </Button>
+      </div>
+      <QuestionnaireResponsesList patientId={patientId} />
+    </div>
+  );
+};