From d58b072e40f8f6b4778b970fba358c71e803012d Mon Sep 17 00:00:00 2001
From: mozzy11 <mozzymutesa@gmail.com>
Date: Thu, 11 Jul 2024 18:05:25 +0300
Subject: [PATCH] improve patient History page styling

---
 .../patient/resultsViewer/results-viewer.tsx  | 72 +++++++++++--------
 1 file changed, 42 insertions(+), 30 deletions(-)

diff --git a/frontend/src/components/patient/resultsViewer/results-viewer.tsx b/frontend/src/components/patient/resultsViewer/results-viewer.tsx
index 1689bd41ed..9f65123964 100644
--- a/frontend/src/components/patient/resultsViewer/results-viewer.tsx
+++ b/frontend/src/components/patient/resultsViewer/results-viewer.tsx
@@ -115,43 +115,55 @@ const RoutedResultsViewer: React.FC<ResultsViewerProps> = () => {
           </Breadcrumb>
         </Column>
       </Grid>
-      <PatientHeader
-        id={patient.patientPK}
-        lastName={patient.lastName}
-        firstName={patient.firstName}
-        gender={patient.gender}
-        dob={patient.birthDateForDisplay}
-        subjectNumber={patient.subjectNumber}
-        nationalId={patient.nationalId}
-      >
-        {" "}
-      </PatientHeader>
+      <Grid fullWidth={true}>
+        <Column lg={16}>
+          <Section>
+            <Section>
+              <Heading>
+                <FormattedMessage id="label.page.patientHistory" />
+              </Heading>
+            </Section>
+          </Section>
+        </Column>
+      </Grid>
+      <Grid fullWidth={true}>
+        <Column lg={16}>
+          <PatientHeader
+            id={patient.patientPK}
+            lastName={patient.lastName}
+            firstName={patient.firstName}
+            gender={patient.gender}
+            dob={patient.birthDateForDisplay}
+            subjectNumber={patient.subjectNumber}
+            nationalId={patient.nationalId}
+            className="patient-header2"
+          >
+            {" "}
+          </PatientHeader>
+        </Column>
+      </Grid>
 
       {roots?.length ? (
-        <Grid fullWidth={true}>
+        <Grid fullWidth={true} className="orderLegendBody">
           <Column lg={16}>
-            <div className="orderLegendBody">
-              <FilterProvider roots={loading ? roots : []}>
-                <ResultsViewer
-                  patientId={patientId}
-                  basePath={config.serverBaseUrl}
-                  loading={loading}
-                />
-              </FilterProvider>
-            </div>
+            <FilterProvider roots={loading ? roots : []}>
+              <ResultsViewer
+                patientId={patientId}
+                basePath={config.serverBaseUrl}
+                loading={loading}
+              />
+            </FilterProvider>
           </Column>
         </Grid>
       ) : (
-        <Grid fullWidth={true}>
+        <Grid fullWidth={true} className="orderLegendBody">
           <Column lg={16}>
-            <div className="orderLegendBody">
-              <EmptyState
-                headerTitle={intl.formatMessage({ id: "label.test.results" })}
-                displayText={intl.formatMessage({
-                  id: "label.test.resultsData",
-                })}
-              />
-            </div>
+            <EmptyState
+              headerTitle={intl.formatMessage({ id: "label.test.results" })}
+              displayText={intl.formatMessage({
+                id: "label.test.resultsData",
+              })}
+            />
           </Column>
         </Grid>
       )}