OHRI-2253 Implement pmtct homepage dashboard workflows (#1881)

packages/esm-ohri-pmtct-app/src/api.resource.ts

@@ -1,6 +1,6 @@
 import { openmrsFetch, getConfig } from '@openmrs/esm-framework';
-import { type Patient, type PatientIdentifier, type Relationship } from './types';
 import { fetchPatientRelationships } from '@ohri/openmrs-esm-ohri-commons-lib';
+import { type Patient, type PatientIdentifier, type Relationship } from './types';
 
 const BASE_WS_API_URL = '/ws/rest/v1/';
 const config = await getConfig('@ohri/openmrs-esm-ohri-pmtct-app');

packages/esm-ohri-pmtct-app/src/home.component.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { OHRIWelcomeSection } from '@ohri/openmrs-esm-ohri-commons-lib';
-import MaternalChildSummaryTiles from './pmtct/summary-tabs/maternal-child-summary-tiles.component';
-import MotherChildSummary from './pmtct/summary-tabs/mother-child-summary-tabs.component';
+import MaternalChildSummaryTiles from './pmtct/home-dashboard/maternal-child-summary-tiles.component';
+import MotherChildSummary from './pmtct/home-dashboard/mother-child-summary-tabs.component';
 
 const Home: React.FC = () => {
   return (

packages/esm-ohri-pmtct-app/src/index.ts

@@ -1,6 +1,6 @@
 import { defineConfigSchema, getAsyncLifecycle, getSyncLifecycle } from '@openmrs/esm-framework';
-import MaternalHealthList from './pmtct/maternal-health/maternal-health.component';
-import ChildHealthList from './pmtct/child-health/child-health.component';
+import MaternalHealthList from './pmtct/patient-chart/maternal-health/maternal-health.component';
+import ChildHealthList from './pmtct/patient-chart/child-health/child-health.component';
 import {
   mchSummaryDashboardMeta,
   maternalVisitsDashboardMeta,
@@ -64,7 +64,7 @@ export const mchSummaryDashboardLink = getSyncLifecycle(
   options,
 );
 
-export const mchSummaryDashboard = getAsyncLifecycle(() => import('./pmtct/mch-summary/mch-summary.component'), {
+export const mchSummaryDashboard = getAsyncLifecycle(() => import('./pmtct/patient-chart/mch-summary/mch-summary.component'), {
   featureName: 'mch-summary',
   moduleName,
 });

packages/esm-ohri-pmtct-app/src/pmtct/summary-tabs/mother-child-summary-tabs.component.tsx → packages/esm-ohri-pmtct-app/src/pmtct/home-dashboard/mother-child-summary-tabs.component.tsx

@@ -2,8 +2,7 @@ import React from 'react';
 import { Tabs, Tab, TabPanels, TabPanel, TabList } from '@carbon/react';
 import { useTranslation } from 'react-i18next';
 import { PatientList } from '@ohri/openmrs-esm-ohri-commons-lib';
-
-import styles from '../summary-tabs/ohri-patient-tabs.scss';
+import styles from './ohri-patient-tabs.scss';
 
 const MotherChildSummary: React.FC = () => {
   const { t } = useTranslation();

packages/esm-ohri-pmtct-app/src/pmtct/home-dashboard/ohri-patient-tabs.scss

@@ -0,0 +1,56 @@
+@use '@carbon/styles/scss/spacing';
+@import '../../root.scss';
+
+.widgetContainer {
+  background-color: $ui-background;
+}
+
+.widgetHeaderContainer {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: spacing.$spacing-04 0 spacing.$spacing-04 spacing.$spacing-05;
+}
+
+.widgetHeaderContainer > h4:after {
+  content: '';
+  display: block;
+  width: 2rem;
+  padding-top: 0.188rem;
+  border-bottom: 0.375rem solid var(--brand-01);
+}
+
+.toggleButtons {
+  width: fit-content;
+  margin: 0 spacing.$spacing-03;
+}
+
+.searchField {
+  width: 100%;
+  max-width: 250px;
+  border: 0px !important;
+}
+
+.searchBox {
+  width: 100%;
+  display: flex;
+  justify-content: right;
+}
+
+.container {
+  margin-top: 16px;
+  margin-left: inherit;
+  width: 100%;
+  overflow-y: hidden;
+}
+
+.tabContainer{
+  margin-top: 16px;
+  padding-left: 1rem;
+  background-color: #ffffff;
+
+}
+
+.tabContainer li button{
+  width: 100% !important;
+}

packages/esm-ohri-pmtct-app/src/pmtct/patient-chart/child-health/child-health-config.json

@@ -0,0 +1,77 @@
+{
+  "menuId": "childHealth",
+  "tabDefinitions": [
+    {
+      "tabName": "Infant Postnatal Visit",
+      "headerTitle": "Infant Postnatal Visit",
+      "displayText": "Infant Postnatal Visit",
+      "encounterType": "infantPostnatalEncounterType",
+      "columns": [
+        {
+          "id": "pTrackerId",
+          "title": "PTracker Id",
+          "concept": "pTrackerIdConcept"
+        },
+        {
+          "id": "mothersName",
+          "title": "Mothers Name",
+          "type": "mothersName"
+        },
+        {
+          "id": "artProphylaxisStatus",
+          "title": "ART Prophylaxis Status",
+          "concept": "artProphylaxisStatus"
+        },
+        {
+          "id": "linkedToArt",
+          "title": "Linked to ART",
+          "concept": "linkedToArt"
+        },
+        {
+          "id": "breastfeedingStatus",
+          "title": "Breastfeeding status",
+          "concept": "breastfeedingStatus"
+        },
+        {
+          "id": "outcomeStatus",
+          "title": "Outcome Status",
+          "concept": "outcomeStatus"
+        },
+        {
+          "id": "nextVisitDate",
+          "isDate": true,
+          "title": "Next visit date",
+          "concept": "nextVisitDateConcept"
+        },
+        {
+          "id": "actions",
+          "title": "Actions",
+          "actionOptions": [
+            {
+              "formName": "infantPostnatalFormName",
+              "package": "pmtct",
+              "label": "View Details",
+              "mode": "view"
+            },
+            {
+              "formName": "infantPostnatalFormName",
+              "package": "pmtct",
+              "label": "Edit Form",
+              "mode": "edit"
+            }
+          ]
+        }
+      ],
+      "launchOptions": {
+        "displayText": "Add",
+        "moduleName": "@ohri/openmrs-esm-ohri-pmtct-app"
+      },
+      "formList": [
+        {
+          "name": "infantPostnatalFormName",
+          "uuid": "infantPostnatalFormUuid"
+        }
+      ]
+    }
+  ]
+} 

packages/esm-ohri-pmtct-app/src/pmtct/patient-chart/common.scss

@@ -0,0 +1,39 @@
+@use '@carbon/styles/scss/spacing';
+@import '../../root.scss';
+
+.widgetContainer {
+  background-color: $ui-background;
+}
+
+.widgetHeaderContainer {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: spacing.$spacing-04 0 spacing.$spacing-04 spacing.$spacing-05;
+}
+
+.widgetHeaderContainer > h4:after {
+  content: '';
+  display: block;
+  width: 2rem;
+  padding-top: 0.188rem;
+  border-bottom: 0.375rem solid var(--brand-01);
+}
+
+.toggleButtons {
+  width: fit-content;
+  margin: 0 spacing.$spacing-03;
+}
+
+.tabContainer div[role='tabpanel'] {
+  padding: 0 !important;
+}
+
+.tabContainer li button {
+  width: 100% !important;
+  }
+
+
+  .hivStatusTag {
+  min-width: 80px;
+  }