From 7a50f5635f90b4cf4fe62ef4fb809d3e1595ba64 Mon Sep 17 00:00:00 2001
From: AJAL ODORA JONATHAN <43242517+ODORA0@users.noreply.github.com>
Date: Thu, 23 Nov 2023 20:02:16 +0300
Subject: [PATCH] OHRI-1998 Follow-up visit table under Treatment and Follow-up
 menu

---
 .../tb-treatment-follow-up.component.tsx      | 65 +++++++++++++++++--
 1 file changed, 60 insertions(+), 5 deletions(-)

diff --git a/packages/esm-tb-app/src/views/treatment-and-follow-up/tb-treatment-follow-up.component.tsx b/packages/esm-tb-app/src/views/treatment-and-follow-up/tb-treatment-follow-up.component.tsx
index 873fc97a5..ba8b35b14 100644
--- a/packages/esm-tb-app/src/views/treatment-and-follow-up/tb-treatment-follow-up.component.tsx
+++ b/packages/esm-tb-app/src/views/treatment-and-follow-up/tb-treatment-follow-up.component.tsx
@@ -1,15 +1,70 @@
-import React, { useEffect, useState } from 'react';
+import React, { useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
-import { EmptyStateComingSoon, PatientChartProps } from '@ohri/openmrs-esm-ohri-commons-lib';
+import {
+  EncounterList,
+  EncounterListColumn,
+  PatientChartProps,
+  getObsFromEncounter,
+} from '@ohri/openmrs-esm-ohri-commons-lib';
+import { moduleName } from '../..';
 
 const TbTreatmentFollowUpList: React.FC<PatientChartProps> = ({ patientUuid }) => {
   const { t } = useTranslation();
   const headerTitle = t('TbTreatmentFollowUp', 'TB Follow-up');
+  const columns: EncounterListColumn[] = useMemo(
+    () => [
+      {
+        key: 'visitDate',
+        header: t('visitDate', 'Visit Date'),
+        getValue: (encounter) => {
+          return getObsFromEncounter(encounter, ' ');
+        },
+      },
+      {
+        key: 'caseId',
+        header: t('caseId', 'Case ID'),
+        getValue: (encounter) => {
+          return getObsFromEncounter(encounter, '', true);
+        },
+      },
+      {
+        key: 'monthOfTreatment',
+        header: t('monthOfTreatment', 'Month of Treatment'),
+        getValue: (encounter) => {
+          return getObsFromEncounter(encounter, '');
+        },
+      },
+      {
+        key: 'adherenceAssessment',
+        header: t('adherenceAssessment', 'Adherence Assessment'),
+        getValue: (encounter) => {
+          return getObsFromEncounter(encounter, '', true);
+        },
+      },
+      {
+        key: 'nextAppointment',
+        header: t('nextAppointment', 'Next Appointment'),
+        getValue: (encounter) => {
+          return getObsFromEncounter(encounter, '', true);
+        },
+      },
+    ],
+    [],
+  );
 
   return (
-    <>
-      <EmptyStateComingSoon displayText={headerTitle} headerTitle={headerTitle} />
-    </>
+    <EncounterList
+      patientUuid={patientUuid}
+      encounterType={''}
+      formList={[{ name: '' }]}
+      columns={columns}
+      description={headerTitle}
+      headerTitle={headerTitle}
+      launchOptions={{
+        displayText: t('add', 'Add'),
+        moduleName: moduleName,
+      }}
+    />
   );
 };