From cbe7ba21aceb8238906a380cc72b16cba420c3da Mon Sep 17 00:00:00 2001
From: mherman22 <hermanmuhereza22@gmail.com>
Date: Sat, 31 Aug 2024 21:24:12 +0300
Subject: [PATCH] add cr result to ui

---
 .../data/PatientResultsTableHeaders.js        |  3 +
 .../components/patient/SearchPatientForm.js   | 74 +++++++++++++------
 frontend/src/languages/en.json                |  1 +
 3 files changed, 55 insertions(+), 23 deletions(-)

diff --git a/frontend/src/components/data/PatientResultsTableHeaders.js b/frontend/src/components/data/PatientResultsTableHeaders.js
index c1df7721e5..60ddc3311b 100644
--- a/frontend/src/components/data/PatientResultsTableHeaders.js
+++ b/frontend/src/components/data/PatientResultsTableHeaders.js
@@ -24,5 +24,8 @@ export const patientSearchHeaderData = [
   {
     key: "nationalId",
     header: <FormattedMessage id="patient.natioanalid" />,
+  },  {
+    key: "dataSourceName",
+    header: <FormattedMessage id="patient.dataSourceName" />,
   },
 ];
diff --git a/frontend/src/components/patient/SearchPatientForm.js b/frontend/src/components/patient/SearchPatientForm.js
index bf0a176197..b2134443e6 100644
--- a/frontend/src/components/patient/SearchPatientForm.js
+++ b/frontend/src/components/patient/SearchPatientForm.js
@@ -20,6 +20,8 @@ import {
   TableCell,
   Pagination,
   Loading,
+  Toggle,
+  Tag,
 } from "@carbon/react";
 import CustomLabNumberInput from "../common/CustomLabNumberInput";
 import { patientSearchHeaderData } from "../data/PatientResultsTableHeaders";
@@ -73,7 +75,9 @@ function SearchPatientForm(props) {
       "&gender=" +
       values.gender +
       "&suppressExternalSearch=" +
-      values.suppressExternalSearch;
+      values.suppressExternalSearch +
+      "&crResult=" +
+      values.crResult;
     getFromOpenElisServer(searchEndPoint, fetchPatientResults);
     setUrl(searchEndPoint);
   };
@@ -90,8 +94,17 @@ function SearchPatientForm(props) {
   const fetchPatientResults = (res) => {
     let patientsResults = res.patientSearchResults;
     if (patientsResults.length > 0) {
-      patientsResults.forEach((item) => (item.id = item.patientID));
-      setPatientSearchResults(patientsResults);
+      const openClientRegistryResults = patientsResults.filter(
+        (item) => item.dataSourceName === "Open Client Registry",
+      );
+
+      if (openClientRegistryResults.length > 0) {
+        openClientRegistryResults.forEach((item) => (item.id = item.patientID));
+        setPatientSearchResults(openClientRegistryResults);
+      } else {
+        patientsResults.forEach((item) => (item.id = item.patientID));
+        setPatientSearchResults(patientsResults);
+      }
     } else {
       setPatientSearchResults([]);
       addNotification({
@@ -288,6 +301,13 @@ function SearchPatientForm(props) {
                     />
                   )}
                 </Field>
+                <Toggle
+                  labelText="crResult"
+                  labelA="false"
+                  labelB="true"
+                  id="toggle-cr"
+                  onClick={() => setFieldValue("crResult", true)}
+                />
               </Column>
               <Column lg={8} md={4} sm={4}>
                 <Field name="gender">
@@ -408,27 +428,35 @@ function SearchPatientForm(props) {
                 </TableRow>
               </TableHead>
               <TableBody>
-                <>
-                  {rows
-                    .slice((page - 1) * pageSize)
-                    .slice(0, pageSize)
-                    .map((row) => (
-                      <TableRow key={row.id}>
-                        <TableCell>
-                          {" "}
-                          <RadioButton
-                            name="radio-group"
-                            onClick={patientSelected}
-                            labelText=""
-                            id={row.id}
-                          />
+                {rows
+                  .slice((page - 1) * pageSize, page * pageSize)
+                  .map((row) => (
+                    <TableRow key={row.id}>
+                      <TableCell>
+                        <RadioButton
+                          name="radio-group"
+                          onClick={patientSelected}
+                          labelText=""
+                          id={row.id}
+                        />
+                      </TableCell>
+                      {row.cells.map((cell) => (
+                        <TableCell key={cell.id}>
+                          {cell.info.header === "dataSourceName" ? (
+                            <Tag
+                              type={
+                                cell.value === "OpenELIS" ? "red" : "magenta"
+                              }
+                            >
+                              {cell.value}
+                            </Tag>
+                          ) : (
+                            cell.value
+                          )}
                         </TableCell>
-                        {row.cells.map((cell) => (
-                          <TableCell key={cell.id}>{cell.value}</TableCell>
-                        ))}
-                      </TableRow>
-                    ))}
-                </>
+                      ))}
+                    </TableRow>
+                  ))}
               </TableBody>
             </Table>
           </TableContainer>
diff --git a/frontend/src/languages/en.json b/frontend/src/languages/en.json
index 2dc47150ee..5cbe2390bb 100644
--- a/frontend/src/languages/en.json
+++ b/frontend/src/languages/en.json
@@ -541,6 +541,7 @@
   "search.label.sample": "Select Sample Status",
   "pathology.label.report": "Pathology Report",
   "patient.natioanalid": "National ID",
+  "patient.dataSourceName":"Data Source Name",
   "patient.label.additionalInfo": "Additional Information",
   "sample.entry.available.tests": "Available Tests",
   "sample.entry.panels": "Panels",