@pih/esm-pathology-app 1.0.3 → 1.0.4

package/src/Print-to-PDF/Document-Component.tsx

@@ -0,0 +1,256 @@
+import React from "react";
+import { Document, Page, Text,Image, View, StyleSheet,Font } from "@react-pdf/renderer";
+import ButaroLogo from '../images/ButaroHospitalLogo.gif';
+import GeorgiaFontBold from '../Fonts/georgia/georgia-bold.ttf';
+import GeorgiaFont from '../Fonts/georgia/Georgia.ttf';
+
+// import { Font } from '@react-pdf/renderer';
+Font.register({ family: 'GeorgiaBold', src: GeorgiaFontBold});
+Font.register({ family: 'Georgia', src: GeorgiaFont});
+
+// Font.register({ family: 'Georgia', src: '../Fonts/georgia/Georgia.ttf', fontStyle: 'normal', fontWeight: 'normal' });
+
+
+
+
+// Create styles
+const styles = StyleSheet.create({
+  page: {
+    flexDirection: "row",
+  },
+  section: {
+    margin: 10,
+    padding: 20,
+    flexGrow: 1,
+  },
+  textLabels: {
+    padding: 7,
+    fontFamily:"GeorgiaBold",
+    fontSize: 16,
+    fontWeight: 'bold',
+    paddingBottom:30,
+  },
+  sentenceLabels: {
+    paddingTop: 7,
+    fontFamily:"GeorgiaBold",
+    fontSize: 16,
+    fontWeight: 'bold',
+    paddingBottom:3,
+  },
+  textAnswers: {
+    margin: 10,
+    padding: 20,
+    fontFamily:"Georgia",
+    fontSize: 14,
+  },
+  sentenceAnswers: {
+    marginBottom: 10,
+    paddingBottom: 20,
+    fontFamily:"Georgia",
+    fontSize: 14,
+  },
+  logo: {
+    width: 61,
+
+  }
+});
+
+// Create Document Component
+const MyDocument = (props) => (
+  
+  <Document title={`Pathology report 
+  ${props.encounterInfo.family_name} 
+  ${props.encounterInfo.given_name}  
+  ${props.encounterInfo.middle_name} `}
+  >
+    <Page size="A4" style={styles.page}>
+     
+       <View style={styles.section}>
+        <Image style={styles.logo} src={ButaroLogo}/>
+        <Text style={{fontSize: 8}}>Butaro Hospital</Text>
+        <Text style={{ position: "absolute",top: 0,left: 300,width: 300 }}>
+          <Text style={styles.textAnswers}>
+          Lab phone number:
+          </Text>
+          <Text>{" "}{" "}0784433618</Text>
+        </Text>
+        <Text style={{ position: "absolute",top: 15,left: 300,width: 300 }}>
+          <Text style={styles.textAnswers}>
+            Accession number:
+          </Text> 
+          <Text >
+          {" "}{" "}
+          {props.encounterInfo.resultsEncounter.obs.map((obser) => obser.concept.uuid==props.config.AccessionNumberconceptUUID && obser.value)}
+          </Text>
+        </Text>
+        <Text style={{ backgroundColor: "#E4E4E4",borderBottom:'1px', textAlign: 'center',fontWeight: 1500, marginBottom: 30,fontFamily:"GeorgiaBold" }}> 
+          Pathology Report 
+        </Text>
+        <Text style={{ paddingBottom: 10 }} > 
+          <Text style={styles.textAnswers}>
+            Patient Name:
+          </Text> 
+          <Text style={styles.textAnswers}>
+          {" "}{" "}
+            {props.encounterInfo.family_name} {" "} 
+            {props.encounterInfo.given_name} {" "} 
+            {props.encounterInfo.middle_name}  
+          </Text>
+          
+        </Text>
+        <Text style={{ paddingBottom: 10, position: "absolute",top: 140,left: 335  }}>
+          <Text style={styles.textAnswers}>
+            Surgery Date:
+          </Text> 
+          <Text style={styles.textAnswers}>
+          {" "}{" "}
+          {props.encounterInfo.resultsEncounter.obs.map((obser) => obser.concept.uuid==props.config.DateBiopsySpecimenTakenconceptUUID && 
+            new Date(obser.value)
+            .toLocaleString(["en-GB","en-US","en","fr-RW"],{day: 'numeric',month: 'numeric',year: 'numeric'})
+          )}
+          </Text>
+        
+        </Text>
+        <Text style={{ paddingBottom: 10 }} > 
+          <Text style={styles.textAnswers}>
+            Patient Birthday:
+          </Text> 
+          <Text style={styles.textAnswers}>
+          {" "}{" "}
+          {
+          new Date(props.encounterInfo.personBirthdate)
+              .toLocaleString(["en-GB","en-US","en","fr-RW"],{day: 'numeric',month: 'numeric',year: 'numeric'})
+            }
+          </Text>
+          
+        </Text>
+        <Text style={{ paddingBottom: 10, position: "absolute",top: 168,left: 335,width: 200  }}> 
+          <Text style={styles.textAnswers}>
+            Specimen Reception Date:
+          </Text> 
+          <Text style={styles.textAnswers}>
+          {" "}{" "}
+          {props.encounterInfo.resultsEncounter.obs.map((obser) => obser.concept.uuid==props.config.SpecimenSubmissionDateconceptUUID && 
+            new Date(obser.value)
+            .toLocaleString(["en-GB","en-US","en","fr-RW"],{day: 'numeric',month: 'numeric',year: 'numeric'})
+          )}
+          </Text>
+        </Text>
+        <Text style={{ paddingBottom: 10,borderBottom:'1px' }} > 
+          <Text style={styles.textAnswers}>
+            Patient Gender:
+          </Text> 
+          <Text style={styles.textAnswers}>
+          {" "}{" "}
+            {props.encounterInfo.personGender}
+          </Text>
+          
+        </Text>
+        <Text style={{ paddingBottom: 10, position: "absolute",top: 200,left: 335,width: 250 }}>  
+          <Text style={styles.textAnswers}>
+            Signout Date:
+          </Text> 
+          <Text style={styles.textAnswers}>
+          {" "}{" "}
+            {
+              new Date(props.encounterInfo.resultsEncounter.encounterDatetime)
+              .toLocaleString(["en-GB","en-US","en","fr-RW"],{day: 'numeric',month: 'numeric',year: 'numeric'})
+            } 
+          </Text>
+        </Text>
+        
+        <Text style={{ backgroundColor: "#E4E4E4",paddingBottom: 10 }}> 
+          <Text style={styles.textLabels}>
+            Sending Physician:
+          </Text> 
+          <Text style={styles.textAnswers}>
+          {" "}{" "}
+          {props.encounterInfo.resultsEncounter.obs.map((obser) => obser.concept.uuid==props.config.SendingPhysicianconceptUUID && obser.value)}
+          </Text>
+        </Text>
+        <Text style={{ backgroundColor: "#E4E4E4",paddingBottom: 10 }}>
+          <Text style={styles.textLabels}>
+            Sending Facility: 
+          </Text> 
+          <Text style={styles.textAnswers}>
+          {" "}{" "}
+          {props.encounterInfo.resultsEncounter.obs.map((obser) => obser.concept.uuid==props.config.OtherBiopsyLocationconceptUUID && obser.value)}
+          </Text>
+        </Text>
+        <Text style={{backgroundColor: "#E4E4E4",paddingBottom: 10 ,fontFamily:"Georgia"}}>Anatomical location:</Text>
+        <Text style={{backgroundColor: "#E4E4E4", paddingBottom: 10,paddingLeft:10 }}> 
+          <Text style={styles.textLabels}>
+            i.System:
+          </Text> 
+          <Text style={styles.textAnswers}>
+          {" "}{" "}
+          {props.encounterInfo.resultsEncounter.obs.map((obser) => obser.concept.uuid==props.config.OrganSystemconceptUUID && (obser.value.name.display+ ",  "))}
+          </Text>
+        </Text>
+        <Text style={{backgroundColor: "#E4E4E4", paddingBottom: 10,paddingLeft:10 }}>
+          <Text style={styles.textLabels}>
+            ii.Organ:
+          </Text> 
+          <Text style={styles.textAnswers}>
+          {" "}{" "}
+          {props.encounterInfo.resultsEncounter.obs.map((obser) => obser.concept.uuid==props.config.OrganconceptUUID && (obser.value.name.display+ ",  "))} 
+          </Text>
+        </Text>
+        <Text style={{backgroundColor: "#E4E4E4", paddingBottom: 10,paddingLeft:10 }}>
+          <Text style={styles.textLabels}>
+            iii.Detail:
+          </Text> 
+          <Text style={styles.textAnswers}>
+          {" "}{" "}
+          {props.encounterInfo.resultsEncounter.obs.map((obser) => obser.concept.uuid==props.config.SpecimenDetailconceptUUID && obser.value)}
+          </Text>
+        </Text>
+        <Text style={{backgroundColor: "#E4E4E4", paddingBottom: 10 }}>
+          <Text style={styles.textLabels}>
+            Procedure type:
+          </Text> 
+          <Text style={styles.textAnswers}>
+          {" "}{" "}
+          {props.encounterInfo.resultsEncounter.obs.map((obser) => obser.concept.uuid==props.config.OtherTestsOrProceduresconceptUUID && obser.value)}
+          </Text>
+        </Text>
+          <Text style={[styles.sentenceLabels]}>
+            Gross Description: 
+          </Text> 
+          <Text style={[styles.sentenceAnswers]}>
+            {props.encounterInfo.resultsEncounter.obs.map((obser) => obser.concept.uuid==props.config.GrossDescriptionconceptUUID && obser.value)}
+           
+          </Text>
+          <Text style={styles.sentenceLabels}>
+            Microscopic Examination:
+          </Text> 
+          <Text style={styles.sentenceAnswers}>
+          
+            {props.encounterInfo.resultsEncounter.obs.map((obser) => obser.concept.uuid==props.config.MacroscopicExaminationconceptUUID && obser.value)}
+
+          </Text>
+          <Text style={styles.sentenceLabels}>
+            Conclusion:
+          </Text> 
+          <Text style={styles.sentenceAnswers}>
+          
+            {props.encounterInfo.resultsEncounter.obs.map((obser) => obser.concept.uuid==props.config.COMMENTSATCONCLUSIONOFEXAMINATIONconceptUUID && obser.value)}
+          
+          </Text>
+
+         <Text style={{backgroundColor: "#E4E4E4", paddingBottom: 10 }}>  
+          <Text style={styles.textLabels}>
+            Validated by pathologist:
+          </Text> 
+          <Text style= {[styles.textAnswers, { fontWeight: 'bold' }]}>
+          {" "}{" "}
+            {props.encounterInfo.approvedBy}
+          </Text>
+        </Text>
+      </View>  
+    </Page>
+  </Document>
+);
+
+export default MyDocument;
+

package/src/config-schema.ts

@@ -17,7 +17,7 @@ import { Type, validator } from "@openmrs/esm-framework";
 export const configSchema = {
   pathologyEncTypeUUID: {
     _type: Type.String,
-    _default: "4d911f5c-26fe-102b-80cb-0017a47871b2",
+    _default: "70f18a24-92ec-4de5-acdc-7cae77414e32",
     _description:
       "This is to determine the UUID of the Pathology encounterType in the instance",
   },
@@ -29,25 +29,25 @@ export const configSchema = {
   },
   pathologyFullAllowedLocationUUID: {
     _type: Type.String,
-    _default: "38c4b94b-97a6-4f2c-bca6-c28a37cf60ed",
+    _default: "a62fd59a-6577-43e0-b39c-ba42ac8cfbc9",
     _description:
       "This is to determine the location allowed to view all other location data",
   },
   sampleStatusConceptUUID: {
     _type: Type.String,
-    _default: "3ce163d8-26fe-102b-80cb-0017a47871b2",
+    _default: "3adca58e-9334-4be5-9bd3-74f7bbf82776",
     _description:
       "This is to determine the UUID of the sample status concept in the instance",
   },
   referralStatusConceptUUID: {
     _type: Type.String,
-    _default: "3cd93302-26fe-102b-80cb-0017a47871b2",
+    _default: "5a7a931f-97b8-4d59-b0de-3a83603aaad9",
     _description:
       "This is to determine the UUID of the referral status concept in the instance",
   },
   sampleDropOffconceptUUID: {
     _type: Type.String,
-    _default: "13662f27-9be5-4595-8bab-07b0e859d9f4",
+    _default: "dc288e6c-84a4-4fd3-9136-ef9e13961b1e",
     _description:
       "This is to determine the UUID of the sample drop off concept in the instance",
   },
@@ -66,10 +66,94 @@ export const configSchema = {
 
   pathologyResultsFromID: {
     _type: Type.Number,
-    _default: 131,
+    _default: 5613,
     _description:
       "This is to determine the ID of the pathology results form in the instance",
   },
+  pathologyResultsApprovedconceptUUID: {
+    _type: Type.String,
+    _default: "1f7742f0-4571-44d8-a88b-8bc60dc11e29",
+    _description:
+      "This is to determine the pathology results approved concept uuid",
+  },
+  AccessionNumberconceptUUID: {
+    _type: Type.String,
+    _default: "0e466f59-8070-45b5-97d1-575ec5cfd85d",
+    _description:
+      "This is to determine the Accession Number concept uuid",
+  },
+  DateBiopsySpecimenTakenconceptUUID: {
+    _type: Type.String,
+    _default: "e0436a5b-dc19-4cb9-ac1b-acc005272c08",
+    _description:
+      "This is to determine the Date Biopsy Specimen Taken concept uuid",
+  },
+  SpecimenSubmissionDateconceptUUID: {
+    _type: Type.String,
+    _default: "3928b7fc-b3ae-40a5-846f-d480120b04f6",
+    _description:
+      "This is to determine the Specimen Submission Date concept uuid",
+  },
+  SendingPhysicianconceptUUID: {
+    _type: Type.String,
+    _default: "0a4a22db-0e82-4669-9aba-086d841505b5",
+    _description:
+      "This is to determine the Sending Physician concept uuid",
+  },
+  OtherBiopsyLocationconceptUUID: {
+    _type: Type.String,
+    _default: "7c4650ee-45d5-435a-b968-511ef127a016",
+    _description:
+      "This is to determine the Other Biopsy Location concept uuid",
+  },
+  OrganSystemconceptUUID: {
+    _type: Type.String,
+    _default: "b88f9524-6b39-41b3-9b3a-f9a7a4b08fed",
+    _description:
+      "This is to determine the Organ System concept uuid",
+  },
+  OrganconceptUUID: {
+    _type: Type.String,
+    _default: "488fe4a2-7903-41da-b21e-fb236a1ee356",
+    _description:
+      "This is to determine the Organ concept uuid",
+  },
+  SpecimenDetailconceptUUID: {
+    _type: Type.String,
+    _default: "e99170a5-f46b-490b-8fbb-bb9eacba3500",
+    _description:
+      "This is to determine the Specimen Detail concept uuid",
+  },
+  OtherTestsOrProceduresconceptUUID: {
+    _type: Type.String,
+    _default: "66ad3230-59b2-4232-821e-a9ae86819e03",
+    _description:
+      "This is to determine the Other tests or procedures concept uuid",
+  },
+  GrossDescriptionconceptUUID: {
+    _type: Type.String,
+    _default: "1e97a4d3-1691-4fb7-be78-18e526e82b0b",
+    _description:
+      "This is to determine the Gross Description concept uuid",
+  },
+  MacroscopicExaminationconceptUUID: {
+    _type: Type.String,
+    _default: "5d149510-0767-4da7-82cd-be406b34877d",
+    _description:
+      "This is to determine the Macroscopic Examination concept uuid",
+  },
+  COMMENTSATCONCLUSIONOFEXAMINATIONconceptUUID: {
+    _type: Type.String,
+    _default: "3cdc5938-26fe-102b-80cb-0017a47871b2",
+    _description:
+      "This is to determine the COMMENTS AT CONCLUSION OF EXAMINATION concept uuid",
+  },
+  CanregCodeconceptUUID: {
+    _type: Type.String,
+    _default: "16931672-e068-4ea8-a89c-2ee7dbc07ad1",
+    _description:
+      "This is to determine the Canreg Code concept uuid",
+  },
 };
 
 export type Config = {
@@ -82,4 +166,19 @@ export type Config = {
   yesConceptUUID: string;
   yesConceptName: string;
   pathologyResultsFromID: number;
+  pathologyResultsApprovedconceptUUID: string;
+
+  AccessionNumberconceptUUID: string;
+  DateBiopsySpecimenTakenconceptUUID: string;
+  SpecimenSubmissionDateconceptUUID: string;
+  SendingPhysicianconceptUUID: string;
+  OtherBiopsyLocationconceptUUID: string;
+  OrganSystemconceptUUID: string;
+  OrganconceptUUID: string;
+  SpecimenDetailconceptUUID: string;
+  OtherTestsOrProceduresconceptUUID: string;
+  GrossDescriptionconceptUUID: string;
+  MacroscopicExaminationconceptUUID: string;
+  COMMENTSATCONCLUSIONOFEXAMINATIONconceptUUID: string;
+  CanregCodeconceptUUID: string;
 };

package/src/declarations.d.tsx

@@ -1 +1,4 @@
 declare module "*.css";
+declare module '*.png';
+declare module '*.gif';
+declare module '*.ttf';

package/src/pathology-report/ReportComponent.resource.ts

@@ -1,4 +1,6 @@
 import { openmrsFetch } from "@openmrs/esm-framework";
+import cloneDeep from "lodash-es/cloneDeep";
+
 
 export interface EncounterResult {
   family_name: string;
@@ -15,6 +17,11 @@ export interface EncounterResult {
   referralStatusObs: string;
   sampleDropoffObs: string;
   resultsEncounterId: string;
+  resultsEncounterUuid: string;
+  resultsEncounter: [];
+  approvedBy: string;
+  approvalObsUuid: string;
+  pathologicDiagnosisObs: string;
 }
 export interface Patient {
   uuid: string;
@@ -24,6 +31,7 @@ export interface Concept {
   name: string;
   display: string;
 }
+
 export interface Obs {
   patientUuid: string;
   obsDateTime: string;
@@ -34,35 +42,9 @@ export interface Obs {
   encounterUuid: string;
   valueCodedName: string;
   voided: boolean;
+  resultsEncounterUuid: string;
 }
 
-// export async function getPatientEncounters(patientUuid): Promise<Array<EncounterResult>> {
-//   const searchPatientEncounters = await openmrsFetch(
-//     `/ws/rest/v1/encounter?encounterType=${ENCOUNTERTYPEUUID}&patient=${patientUuid}`,
-//   );
-//   const fullPatientEncounterData = searchPatientEncounters.data.results.map(async (searchEnc) => {
-//     const enc = await openmrsFetch(`/ws/rest/v1/encounter/${searchEnc.uuid}?v=full`);
-//     const searchPatient = await openmrsFetch(`/ws/rest/v1/patient/${patientUuid}?v=full`);
-//     const retrievedObject = {
-//       patientName: searchPatient.data.person.names[0],
-//       patientPhoneNumber: searchPatient.data.person.attributes.filter(
-//         (attribute) => attribute.attributeType.uuid == PHONENUMBERATTRUUID,
-//       )[0],
-//       patientHealthCenter: searchPatient.data.person.attributes.filter(
-//         (attribute) => attribute.attributeType.uuid == HEALTHCENTERATTRTYPEUUID,
-//       )[0],
-//       patientUuid: searchPatient.data.uuid,
-//       encUuid: enc.data.uuid,
-//       encounterDatetime: enc.data.encounterDatetime,
-//       sampleStatusObs: enc.data.obs.filter((obs) => obs.concept.uuid === SAMPLESTATUSUUID)[0],
-//       referralStatusObs: enc.data.obs.filter((obs) => obs.concept.uuid === REFERRALSTATUSUUID)[0],
-//       sampleDropoffObs: enc.data.obs.filter((obs) => obs.concept.uuid === SAMPLEDROPOFFUUID)[0],
-//     };
-
-//     return retrievedObject;
-//   });
-//   return Promise.all(fullPatientEncounterData);
-// }
 
 export async function getUserLocation(healthCenterAttrTypeUUID) {
   const session = await openmrsFetch(`/ws/rest/v1/session`);
@@ -73,7 +55,7 @@ export async function getUserLocation(healthCenterAttrTypeUUID) {
   const hcPersonAttribute = person.data.results.filter(
     (attr) => attr.attributeType.uuid === healthCenterAttrTypeUUID
   );
-  return hcPersonAttribute[0]?.value.uuid;
+  return hcPersonAttribute[0] && hcPersonAttribute.value.uuid;
 }
 
 export async function getConceptAnswers(conceptUuid) {
@@ -89,11 +71,6 @@ export async function getLocations() {
   return location.data.results;
 }
 
-// export async function getPatient(patientUuid): Promise<Patient> {
-//   const searchPatient = await openmrsFetch(`/ws/rest/v1/patient/c604dabc-2700-102b-80cb-0017a47871b2?v=full`);
-//   return searchPatient.data;
-// }
-
 export async function getEncounters(
   healthCenterAttrTypeUUID: string,
   pathologyFullAllowedLocationUUID: string
@@ -113,7 +90,20 @@ export async function getEncounters(
       `/ws/rest/v1/reportingrest/reportdata/996cf192-ff54-11eb-a63a-080027ce9ca0`
     );
   }
-  return searchEncounter.data.dataSets[0].rows;
+
+  const EncListClone = searchEncounter.data.dataSets[0].rows.map(async (encObject)=>{
+    if(encObject.resultsEncounterUuid){
+      const encIndex = searchEncounter.data.dataSets[0].rows.findIndex(
+         (enc) => enc.encounterUuid == encObject.encounterUuid
+      );
+      const resultsEnc =await getEncounter(encObject.resultsEncounterUuid);
+      encObject.resultsEncounter = resultsEnc;
+      
+    }
+    return encObject; 
+  });
+  
+  return Promise.all(EncListClone);
 }
 
 export async function postSampleDropoffObs(
@@ -274,3 +264,16 @@ export async function updateReferralStatusChangeObs(
 
   return response;
 }
+
+
+
+export async function getUser(userUuid: string) {
+  const user = await openmrsFetch(`/ws/rest/v1/user/${userUuid}`);
+
+  return user.data;
+}
+export async function getEncounter(encounterUuid) {
+  const encResult = await openmrsFetch(`/ws/rest/v1/encounter/${encounterUuid}?v=full`);
+  
+  return encResult.data;
+}

package/src/pathology-report/ReportComponent.tsx

@@ -9,6 +9,7 @@ import DataTable, {
   TableBody,
   TableCell,
 } from "carbon-components-react/es/components/DataTable";
+import { PDFDownloadLink, PDFViewer } from "@react-pdf/renderer";
 
 import styles from "./ReportComponent.css";
 import {
@@ -23,8 +24,13 @@ import {
   postReferralStatusChangeObs,
   updateReferralStatusChangeObs,
   EncounterResult,
+  // postApproval,
+  // voidApprovalObs,
+  getUser,
   Concept,
+  getEncounter,
 } from "./ReportComponent.resource";
+import MyDocument from "../Print-to-PDF/Document-Component";
 import { Config } from "../config-schema";
 
 const ReportComponent = () => {
@@ -77,10 +83,18 @@ const ReportComponent = () => {
       key: "sampleDropOff",
       header: "Sample drop off?",
     },
+    {
+      key: "pathologicDiagnosisObs",
+      header: "Pathologic diagnosis",
+    },
     {
       key: "resultsEncounter",
       header: "Results",
     },
+    {
+      key: "PDFReport",
+      header: "Report",
+    },
   ];
 
   React.useEffect(() => {
@@ -95,7 +109,9 @@ const ReportComponent = () => {
     getEncounters(
       config.healthCenterAttrTypeUUID,
       config.pathologyFullAllowedLocationUUID
-    ).then(setEncountersList);
+    ).then(
+      setEncountersList
+      );
   }, []);
 
   const filteredEncList = encountersList
@@ -129,12 +145,6 @@ const ReportComponent = () => {
         );
       }
     });
-  //replace(/\s+/g, '');
-  // const rows = filteredEncList.map(
-  //   (encounterInfo) => {
-  //       return {
-  //           // patientLink: <a href={`/openmrs/patientDashboard.form?patientId=${encounterInfo.personId}`} >Link</a>,
-  //           ...
 
   const rows = filteredEncList.map((encounterInfo) => {
     return {
@@ -192,7 +202,8 @@ const ReportComponent = () => {
           ))}
         </select>
       ),
-      dateOfRequest: encounterInfo.encounterDatetime,
+      dateOfRequest: new Date(encounterInfo.encounterDatetime)
+                .toLocaleString(["en-GB","en-US","en","fr-RW"],{day: 'numeric',month: 'numeric',year: 'numeric'}),
       referralStatus: (
         <select
           onChange={(e) =>
@@ -228,6 +239,7 @@ const ReportComponent = () => {
           onChange={(e) => sampleDropOffChange(encounterInfo)}
         />
       ),
+      pathologicDiagnosisObs: encounterInfo.pathologicDiagnosisObs,
       resultsEncounter: encounterInfo.resultsEncounterId ? (
         <a
           data-testid="resultsEncounter"
@@ -247,6 +259,18 @@ const ReportComponent = () => {
           </a>
         )
       ),
+      PDFReport:
+        encounterInfo.resultsEncounterId &&
+        (
+          encounterInfo.approvedBy &&
+            <PDFDownloadLink document={<MyDocument encounterInfo={encounterInfo} config={config} />} fileName="Pathology Report">
+              {({loading}) => (loading ? 'loading...' : <button>Download</button>)}
+            </PDFDownloadLink>
+            
+              
+           
+        )
+        
     };
   });
 
@@ -283,6 +307,7 @@ const ReportComponent = () => {
     }
   };
 
+
   const sampleStatusChange = (
     newStatus: { uuid: string; display: string },
     encounterInfo
@@ -372,6 +397,7 @@ const ReportComponent = () => {
       });
     }
   };
+  
 
   return (
     <div>
@@ -436,6 +462,7 @@ const ReportComponent = () => {
           onChange={(e) => setPatientName(e.target.value)}
         />
       </div>
+      {console.log( encountersList)}
       <div className={styles.tableContainer}>
         <DataTable rows={rows} headers={headers}>
           {({ rows, headers, getTableProps, getHeaderProps, getRowProps }) => (
@@ -462,6 +489,15 @@ const ReportComponent = () => {
           )}
         </DataTable>
       </div>
+      <div>
+        {/* <PDFViewer>
+          <MyDocument />
+        </PDFViewer> */}
+        {/* <PDFDownloadLink document={<MyDocument />} fileName="Pathology Report">
+          {({loading}) => (loading ? 'loading...' : <button>Download</button>)}
+        </PDFDownloadLink> */}
+        
+      </div>
     </div>
   );
 };