Merge branch 'develop' into log-update-v2

.eslintrc.json

@@ -46,10 +46,6 @@
     "i18next"
   ],
   "rules": {
-    "quotes": [
-      "error",
-      "double"
-    ],
     "no-unused-vars": "off",
     "@typescript-eslint/no-unused-vars": [
       "error",

cypress/pageobject/Patient/PatientLogupdate.ts

@@ -16,7 +16,7 @@ class PatientLogupdate {
   }
 
   selectPatientCategory(category: string) {
-    cy.clickAndSelectOption("#patient_category", category);
+    cy.clickAndSelectOption("#patientCategory", category);
   }
 
   typePhysicalExamination(examination: string) {

src/CAREUI/misc/PrintPreview.tsx

@@ -0,0 +1,36 @@
+import { ReactNode } from "react";
+import ButtonV2 from "../../Components/Common/components/ButtonV2";
+import CareIcon from "../icons/CareIcon";
+import { classNames } from "../../Utils/utils";
+import Page from "../../Components/Common/components/Page";
+
+type Props = {
+  children: ReactNode;
+  disabled?: boolean;
+  className?: string;
+  title: string;
+};
+
+export default function PrintPreview(props: Props) {
+  return (
+    <Page title={props.title}>
+      <div className="mx-auto my-8 w-[50rem]">
+        <div className="top-0 z-20 flex justify-end gap-2 bg-secondary-100 px-2 py-4 xl:absolute xl:right-6 xl:top-8">
+          <ButtonV2 disabled={props.disabled} onClick={() => window.print()}>
+            <CareIcon icon="l-print" className="text-lg" />
+            Print
+          </ButtonV2>
+        </div>
+
+        <div className="bg-white p-10 text-sm shadow-2xl transition-all duration-200 ease-in-out">
+          <div
+            id="section-to-print"
+            className={classNames("w-full", props.className)}
+          >
+            {props.children}
+          </div>
+        </div>
+      </div>
+    </Page>
+  );
+}

src/Components/Common/prescription-builder/InvestigationBuilder.tsx

@@ -29,12 +29,28 @@ export interface InvestigationBuilderProps<T> {
   setInvestigations: React.Dispatch<React.SetStateAction<T[]>>;
 }
 
-export default function InvestigationBuilder(
-  props: InvestigationBuilderProps<InvestigationType>,
-) {
-  const { investigations, setInvestigations } = props;
-  const [investigationsList, setInvestigationsList] = useState<string[]>([]);
-  const [activeIdx, setActiveIdx] = useState<number | null>(null);
+export const loadInvestigations = async () => {
+  const fetchInvestigations = async () => {
+    const { data } = await request(routes.listInvestigations);
+    return (
+      data?.results.map(
+        (investigation) =>
+          `${investigation.name} -- ${humanizeStrings(
+            investigation.groups.map((group) => ` ( ${group.name} ) `),
+          )}`,
+      ) ?? []
+    );
+  };
+
+  const fetchInvestigationGroups = async () => {
+    const { data } = await request(routes.listInvestigationGroups);
+    return data?.results.map((group) => `${group.name} (GROUP)`) ?? [];
+  };
+
+  const invs = await fetchInvestigations();
+  const groups = await fetchInvestigationGroups();
+
+  let additionalStrings: string[] = [];
   const additionalInvestigations = [
     ["Vitals", ["Temp", "Blood Pressure", "Respiratory Rate", "Pulse Rate"]],
     [
@@ -51,57 +67,42 @@ export default function InvestigationBuilder(
       ],
     ],
   ];
+  additionalInvestigations.forEach((investigation) => {
+    additionalStrings.push((investigation[0] as string) + " (GROUP)");
+    additionalStrings = [
+      ...additionalStrings,
+      ...(investigation[1] as string[]).map(
+        (i: any) => i + " -- ( " + investigation[0] + " )",
+      ),
+    ];
+  });
+
+  return [...groups, ...invs, ...additionalStrings];
+};
+
+export default function InvestigationBuilder(
+  props: InvestigationBuilderProps<InvestigationType>,
+) {
+  const { investigations, setInvestigations } = props;
+  const [investigationsList, setInvestigationsList] = useState<string[]>([]);
+  const [activeIdx, setActiveIdx] = useState<number | null>(null);
 
   const setItem = (object: InvestigationType, i: number) => {
     setInvestigations(
-      investigations.map((investigation, index) =>
+      investigations?.map((investigation, index) =>
         index === i ? object : investigation,
       ),
     );
   };
 
   useEffect(() => {
-    loadInvestigations();
+    const load = async () => setInvestigationsList(await loadInvestigations());
+    load();
   }, []);
 
-  const loadInvestigations = async () => {
-    const invs = await fetchInvestigations();
-    const groups = await fetchInvestigationGroups();
-
-    let additionalStrings: string[] = [];
-    additionalInvestigations.forEach((investigation) => {
-      additionalStrings.push((investigation[0] as string) + " (GROUP)");
-      additionalStrings = [
-        ...additionalStrings,
-        ...(investigation[1] as string[]).map(
-          (i: any) => i + " -- ( " + investigation[0] + " )",
-        ),
-      ];
-    });
-
-    setInvestigationsList([...groups, ...invs, ...additionalStrings]);
-  };
-
-  const fetchInvestigations = async () => {
-    const { data } = await request(routes.listInvestigations);
-    return (
-      data?.results.map(
-        (investigation) =>
-          `${investigation.name} -- ${humanizeStrings(
-            investigation.groups.map((group) => ` ( ${group.name} ) `),
-          )}`,
-      ) ?? []
-    );
-  };
-
-  const fetchInvestigationGroups = async () => {
-    const { data } = await request(routes.listInvestigationGroups);
-    return data?.results.map((group) => `${group.name} (GROUP)`) ?? [];
-  };
-
   return (
     <div className="mt-2">
-      {investigations.map((investigation, i) => {
+      {investigations?.map((investigation, i) => {
         const setFrequency = (frequency: string) => {
           setItem(
             {

src/Components/Diagnosis/ConsultationDiagnosisBuilder/ConsultationDiagnosisBuilder.tsx

@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import useSlug from "../../../Common/hooks/useSlug";
 import {
   ConsultationDiagnosis,
@@ -83,6 +83,11 @@ interface EditDiagnosesProps {
 export const EditDiagnosesBuilder = (props: EditDiagnosesProps) => {
   const consultation = useSlug("consultation");
   const [diagnoses, setDiagnoses] = useState(props.value);
+
+  useEffect(() => {
+    setDiagnoses(props.value);
+  }, [props.value]);
+
   return (
     <div className={props.className}>
       <div className="flex w-full flex-col items-start rounded-lg border border-secondary-400">

src/Components/Medicine/ManagePrescriptions.tsx

@@ -10,7 +10,15 @@ export default function ManagePrescriptions() {
   const { goBack } = useAppHistory();
 
   return (
-    <Page title={t("manage_prescriptions")}>
+    <Page
+      title={t("manage_prescriptions")}
+      options={
+        <ButtonV2 href="prescriptions/print">
+          <CareIcon icon="l-print" className="text-lg" />
+          Print
+        </ButtonV2>
+      }
+    >
       <div
         className="mx-auto flex w-full max-w-5xl flex-col gap-10 rounded bg-white p-6 transition-all sm:rounded-xl sm:p-12"
         id="medicine-preview"

src/Components/Medicine/MedicineAdministrationSheet/index.tsx

@@ -92,25 +92,37 @@ const MedicineAdministrationSheet = ({ readonly, is_prn }: Props) => {
         options={
           !readonly &&
           !!data?.results && (
-            <AuthorizedForConsultationRelatedActions>
+            <>
+              <AuthorizedForConsultationRelatedActions>
+                <ButtonV2
+                  id="edit-prescription"
+                  variant="secondary"
+                  border
+                  href="prescriptions"
+                  className="w-full"
+                >
+                  <CareIcon icon="l-pen" className="text-lg" />
+                  <span className="hidden lg:block">
+                    {t("edit_prescriptions")}
+                  </span>
+                  <span className="block lg:hidden">{t("edit")}</span>
+                </ButtonV2>
+                <BulkAdminister
+                  prescriptions={data.results}
+                  onDone={() => refetch()}
+                />
+              </AuthorizedForConsultationRelatedActions>
               <ButtonV2
-                id="edit-prescription"
-                variant="secondary"
+                href="prescriptions/print"
+                ghost
                 border
-                href="prescriptions"
+                disabled={!data.results.length}
                 className="w-full"
               >
-                <CareIcon icon="l-pen" className="text-lg" />
-                <span className="hidden lg:block">
-                  {t("edit_prescriptions")}
-                </span>
-                <span className="block lg:hidden">{t("edit")}</span>
+                <CareIcon icon="l-print" className="text-lg" />
+                Print
               </ButtonV2>
-              <BulkAdminister
-                prescriptions={data.results}
-                onDone={() => refetch()}
-              />
-            </AuthorizedForConsultationRelatedActions>
+            </>
           )
         }
       />