@kenyaemr/esm-morgue-app 5.4.2-pre.2283 → 5.4.2-pre.2288

package/src/home/home.resource.ts

@@ -0,0 +1,261 @@
+import {
+  FetchResponse,
+  openmrsFetch,
+  restBaseUrl,
+  fhirBaseUrl,
+  useConfig,
+  useFhirPagination,
+} from '@openmrs/esm-framework';
+import useSWR from 'swr';
+import {
+  MappedVisitQueueEntry,
+  MortuaryPatient,
+  UseVisitQueueEntries,
+  VisitQueueEntry,
+  MortuaryLocationResponse,
+  Entry,
+} from '../types';
+import React, { useMemo, useEffect, useState } from 'react';
+import { ConfigObject } from '../config-schema';
+
+interface MortuaryApiResponse {
+  results: MortuaryPatient[];
+}
+
+export const useAwaitingQueuePatients = (admissionLocation?: MortuaryLocationResponse) => {
+  const { morgueDischargeEncounterTypeUuid } = useConfig<ConfigObject>();
+  const [currPageSize, setCurrPageSize] = useState(10);
+
+  const customRepresentation =
+    'custom:(uuid,display,identifiers:(identifier,uuid,preferred,location:(uuid,name)),person:(uuid,display,gender,birthdate,dead,age,deathDate,causeOfDeath:(uuid,display),preferredAddress:(uuid,stateProvince,countyDistrict,address4)))';
+  const url = `${restBaseUrl}/morgue/patient?v=${customRepresentation}&dead=true`;
+  const { isLoading, error, data, mutate } = useSWR<FetchResponse<MortuaryApiResponse>>(url, openmrsFetch);
+
+  const locationUuid = admissionLocation?.ward?.uuid;
+  const dischargeUrl =
+    locationUuid && morgueDischargeEncounterTypeUuid
+      ? `${fhirBaseUrl}/Encounter?_summary=data&type=${morgueDischargeEncounterTypeUuid}&location=${locationUuid}`
+      : null;
+
+  const {
+    data: dischargeData,
+    isLoading: dischargeLoading,
+    error: dischargeError,
+    mutate: mutateDischarge,
+  } = useFhirPagination<Entry>(dischargeUrl, currPageSize);
+
+  const dischargedPatientUuids = useMemo(() => {
+    if (!dischargeData || !Array.isArray(dischargeData)) {
+      return [];
+    }
+
+    const uuids = dischargeData
+      .map((entry: Entry) => {
+        const reference = entry?.subject?.reference;
+        if (reference && reference.startsWith('Patient/')) {
+          return reference.split('/')[1];
+        }
+        return undefined;
+      })
+      .filter((uuid: string | undefined) => uuid);
+
+    return [...new Set(uuids)];
+  }, [dischargeData]);
+
+  const admittedPatientUuids = useMemo(() => {
+    if (!admissionLocation?.bedLayouts) {
+      return [];
+    }
+
+    return admissionLocation.bedLayouts
+      .flatMap((bed) => bed.patients?.map((patient) => patient.uuid))
+      .filter(Boolean) as string[];
+  }, [admissionLocation]);
+
+  const filteredAwaitingPatients = useMemo(() => {
+    if (!data?.data?.results) {
+      return [];
+    }
+
+    return data.data.results.filter((patient) => {
+      const patientUuid = patient?.person?.person?.uuid;
+      if (!patientUuid) {
+        return false;
+      }
+
+      if (dischargedPatientUuids.includes(patientUuid)) {
+        return false;
+      }
+
+      if (admittedPatientUuids.includes(patientUuid)) {
+        return false;
+      }
+
+      return true;
+    });
+  }, [data, dischargedPatientUuids, admittedPatientUuids]);
+
+  const admittedPatients = useMemo(() => {
+    if (!admissionLocation?.bedLayouts) {
+      return [];
+    }
+
+    return admissionLocation.bedLayouts.flatMap((bed) => bed.patients || []).filter(Boolean);
+  }, [admissionLocation]);
+
+  const { dischargedPatients, dischargedPatientsCount } = useMemo(() => {
+    if (!dischargeData || !Array.isArray(dischargeData) || dischargeLoading) {
+      return { dischargedPatients: [], dischargedPatientsCount: 0 };
+    }
+
+    const discharged = dischargeData.filter((entry) => entry?.subject?.reference);
+    return {
+      dischargedPatients: discharged,
+      dischargedPatientsCount: discharged.length,
+    };
+  }, [dischargeData, dischargeLoading]);
+
+  const mutateAll = React.useCallback(() => {
+    mutate();
+    if (mutateDischarge) {
+      mutateDischarge();
+    }
+  }, [mutate, mutateDischarge]);
+
+  return {
+    awaitingQueueDeceasedPatients: filteredAwaitingPatients,
+    admittedPatients,
+    dischargedPatients,
+    dischargedPatientsCount,
+    isLoadingAwaitingQueuePatients: isLoading,
+    isLoadingDischarge: dischargeLoading,
+    isLoadingAll: isLoading || dischargeLoading,
+    errorFetchingAwaitingQueuePatients: error || dischargeError,
+    mutateAwaitingQueuePatients: mutateAll,
+    mutateAll,
+  };
+};
+
+/**
+ * Custom hook specifically for awaiting patients (patients without active visits or beds)
+ * This hook is now simplified since the filtering is done upstream
+ * @param patients - Array of mortuary patients (already filtered by useAwaitingQueuePatients)
+ * @returns The same array of patients (already filtered upstream)
+ */
+export const useAwaitingPatients = (patients: MortuaryPatient[]) => {
+  // Since useAwaitingQueuePatients already filters out discharged and admitted patients,
+  // we can return the patients as-is
+  return patients || [];
+};
+
+/**
+ * Fetches visit data for multiple patients
+ * @param patientUuids - Array of patient UUIDs
+ * @returns Promise that resolves to a record of visit statuses
+ */
+const fetchPatientVisits = async (patientUuids: string[]) => {
+  const visitPromises = patientUuids.map(async (uuid) => {
+    try {
+      const response = await openmrsFetch(`${restBaseUrl}/visit?patient=${uuid}&includeInactive=false`);
+      return {
+        uuid,
+        hasActiveVisit: response.data?.results?.length > 0,
+      };
+    } catch (error) {
+      console.error(`Error fetching visit for patient ${uuid}:`, error);
+      return { uuid, hasActiveVisit: false };
+    }
+  });
+
+  const visits = await Promise.all(visitPromises);
+  return visits.reduce((acc, { uuid, hasActiveVisit }) => {
+    acc[uuid] = hasActiveVisit;
+    return acc;
+  }, {} as Record<string, boolean>);
+};
+
+/**
+ * Custom hook to filter mortuary patients based on their visit status
+ * @param patients - Array of mortuary patients
+ * @returns Object containing filtered patients for different statuses
+ */
+export const useFilteredPatients = (patients: MortuaryPatient[]) => {
+  const [visitData, setVisitData] = useState<Record<string, boolean>>({});
+  const patientUuids = useMemo(() => {
+    return patients.map((patient) => patient?.person?.person?.uuid).filter(Boolean) as string[];
+  }, [patients]);
+
+  useEffect(() => {
+    if (patientUuids.length > 0) {
+      fetchPatientVisits(patientUuids).then(setVisitData);
+    }
+  }, [patientUuids]);
+
+  return useMemo(() => {
+    if (!patients || patients.length === 0) {
+      return {
+        awaitingAdmission: [],
+        admitted: [],
+        all: [],
+      };
+    }
+
+    const awaitingAdmission: MortuaryPatient[] = [];
+    const admitted: MortuaryPatient[] = [];
+
+    patients.forEach((patient) => {
+      const patientUuid = patient?.person?.person?.uuid;
+      if (!patientUuid) {
+        return;
+      }
+
+      if (visitData[patientUuid]) {
+        admitted.push(patient);
+      } else {
+        awaitingAdmission.push(patient);
+      }
+    });
+
+    return {
+      awaitingAdmission,
+    };
+  }, [patients, visitData]);
+};
+
+export function useVisitQueueEntry(patientUuid: string, visitUuid: string): UseVisitQueueEntries {
+  const apiUrl = `${restBaseUrl}/visit-queue-entry?v=full&patient=${patientUuid}`;
+  const { data, error, isLoading, isValidating, mutate } = useSWR<{ data: { results: Array<VisitQueueEntry> } }, Error>(
+    apiUrl,
+    openmrsFetch,
+  );
+  const mapVisitQueueEntryProperties = (visitQueueEntry: VisitQueueEntry): MappedVisitQueueEntry => ({
+    id: visitQueueEntry.uuid,
+    name: visitQueueEntry.queueEntry.queue.display,
+    patientUuid: visitQueueEntry.queueEntry.patient.uuid,
+    priority:
+      visitQueueEntry.queueEntry.priority.display === 'Urgent'
+        ? 'Priority'
+        : visitQueueEntry.queueEntry.priority.display,
+    priorityUuid: visitQueueEntry.queueEntry.priority.uuid,
+    service: visitQueueEntry.queueEntry.queue?.display,
+    status: visitQueueEntry.queueEntry.status.display,
+    statusUuid: visitQueueEntry.queueEntry.status.uuid,
+    visitUuid: visitQueueEntry.visit?.uuid,
+    visitType: visitQueueEntry.visit?.visitType?.display,
+    queue: visitQueueEntry.queueEntry.queue,
+    queueEntryUuid: visitQueueEntry.queueEntry.uuid,
+  });
+
+  const mappedVisitQueueEntry =
+    data?.data?.results
+      ?.map(mapVisitQueueEntryProperties)
+      .filter((visitQueueEntry) => visitUuid !== undefined && visitUuid === visitQueueEntry.visitUuid)
+      .shift() ?? null;
+  return {
+    queueEntry: mappedVisitQueueEntry,
+    isLoading,
+    error: error,
+    isValidating,
+    mutate,
+  };
+}

package/src/home/home.scss

@@ -0,0 +1,5 @@
+@use '@carbon/colors';
+
+.section {
+  border-right: 1px solid colors.$gray-20;
+}

package/src/index.ts

@@ -7,6 +7,8 @@ import {
 } from '@openmrs/esm-framework';
 import { configSchema } from './config-schema';
 import { createLeftPanelLink } from './left-panel/morgue-left-panel-link.component';
+import FormEntryWorkspace from './forms/form-entry-workspace/form-entry-workspace.workspace';
+import DisposeForm from './forms/dispose-deceased-person-workspace/dispose-deceased-person.workspace';
 const moduleName = '@kenyaemr/esm-morgue-app';
 
 const options = {
@@ -27,11 +29,6 @@ export function startupApp() {
       parent: `${window.spaBase}/home`,
     },
   ]);
-  registerFeatureFlag(
-    'mortuaryFeatureFlag',
-    'Mortuary App Service',
-    'Mortuary feature flag, this enables and disables the mortuary app feature',
-  );
 }
 
 export const root = getAsyncLifecycle(() => import('./root.component'), options);
@@ -44,12 +41,21 @@ export const morgueDashboardLink = getSyncLifecycle(
   options,
 );
 
-export const patientAdditionalInfoForm = getAsyncLifecycle(
-  () => import('./workspaces/patientAdditionalInfoForm.workspace'),
-  options,
-);
-export const dischargeBodyForm = getAsyncLifecycle(() => import('./workspaces/discharge-body.workspace'), options);
-export const admitBodyForm = getAsyncLifecycle(() => import('./workspaces/admit-body.workspace'), options);
-export const swapForm = getAsyncLifecycle(() => import('./workspaces/swap-unit.workspace'), options);
 export const actionBarButtons = getAsyncLifecycle(() => import('./extension/actionButton.component'), options);
 export const bannerInfo = getAsyncLifecycle(() => import('./extension/deceasedInfoBanner.component'), options);
+export const admitDeceasedPersonForm = getAsyncLifecycle(
+  () => import('./forms/admit-deceased-person-workspace/admit-deceased-person.workspace'),
+  options,
+);
+export const swapForm = getAsyncLifecycle(
+  () => import('./forms/swap-compartment-workspace/swap-unit.workspace'),
+  options,
+);
+export const dischargeBodyForm = getAsyncLifecycle(
+  () => import('./forms/discharge-deceased-person-workspace/discharge-body.workspace'),
+  options,
+);
+export const mortuaryFormEntry = getSyncLifecycle(FormEntryWorkspace, options);
+export const disposeDeceasedPersonForm = getSyncLifecycle(DisposeForm, options);
+export const mortuaryChartView = getAsyncLifecycle(() => import('./view-details/main/main.component'), options);
+export const mortuarySummary = getAsyncLifecycle(() => import('./summary/summary.component'), options);

package/src/metrics/metrics-card.component.tsx

@@ -0,0 +1,31 @@
+import React from 'react';
+import { Layer, Tile } from '@carbon/react';
+import styles from './metrics-card.scss';
+
+interface MetricsCardProps {
+  label: string;
+  value: number | string | React.ReactNode;
+  headerLabel: string;
+  children?: React.ReactNode;
+}
+
+const MetricsCard: React.FC<MetricsCardProps> = ({ children, headerLabel, label, value }) => {
+  return (
+    <Layer className={`${children && styles.cardWithChildren} ${styles.container}`}>
+      <Tile className={styles.tileContainer}>
+        <div className={styles.tileHeader}>
+          <div className={styles.headerLabelContainer}>
+            <label className={styles.headerLabel}>{headerLabel}</label>
+          </div>
+          {children}
+        </div>
+        <div>
+          <label className={styles.totalsLabel}>{label}</label>
+          <p className={styles.totalsValue}>{value}</p>
+        </div>
+      </Tile>
+    </Layer>
+  );
+};
+
+export default MetricsCard;

package/src/metrics/metrics-card.scss

@@ -0,0 +1,51 @@
+@use '@carbon/colors';
+@use '@carbon/layout';
+@use '@carbon/type';
+
+.container {
+  flex-grow: 1;
+}
+
+.tileContainer {
+  border: 1px solid colors.$gray-20;
+  height: 7.875rem;
+  padding: layout.$spacing-05;
+  margin: layout.$spacing-03 layout.$spacing-03;
+}
+
+.tileHeader {
+  display: flex;
+  justify-content: space-between;
+  align-items: baseline;
+  margin-bottom: layout.$spacing-03;
+}
+
+.headerLabel {
+  @include type.type-style('heading-compact-01');
+  color: colors.$gray-70;
+}
+
+.totalsLabel {
+  @include type.type-style('label-01');
+  color: colors.$gray-70;
+}
+
+.totalsValue {
+  @include type.type-style('heading-04');
+  color: colors.$gray-100;
+}
+
+.headerLabelContainer {
+  margin-bottom: layout.$spacing-05;
+}
+
+.link {
+  text-decoration: none;
+  display: flex;
+  align-items: center;
+  color: colors.$blue-60;
+
+  svg {
+    margin-left: layout.$spacing-03;
+  }
+}

package/src/root.component.tsx

@@ -1,8 +1,8 @@
 import React from 'react';
 import { BrowserRouter, Route, Routes } from 'react-router-dom';
 import { UserHasAccess } from '@openmrs/esm-framework';
-import MainComponent from './component/main.component';
-import { AdmittedQueue } from './tables/admitted-queue.component';
+import MainComponent from './home/home.component';
+import DeceasedDetailsView from './view-details/main/main.component';
 
 const Root: React.FC = () => {
   const baseName = window.getOpenmrsSpaBase() + 'home/morgue';
@@ -12,7 +12,11 @@ const Root: React.FC = () => {
       <UserHasAccess privilege="o3 : View Mortuary Dashboard">
         <Routes>
           <Route path="/" element={<MainComponent />} />
-          <Route path="/allocation" element={<AdmittedQueue />} />
+          <Route
+            path="/patient/:patientUuid/compartment/:bedNumber/:bedId/mortuary-chart"
+            element={<DeceasedDetailsView />}
+          />
+          <Route path="/patient/:patientUuid/mortuary-chart" element={<DeceasedDetailsView />} />
         </Routes>
       </UserHasAccess>
     </BrowserRouter>

package/src/routes.json

@@ -9,7 +9,6 @@
       "component": "morgueDashboardLink",
       "name": "morgue-dashboard-link",
       "slot": "homepage-dashboard-slot",
-      "featureFlag": "mortuaryFeatureFlag",
       "meta": {
         "name": "morgue",
         "title": "morgue",
@@ -47,6 +46,11 @@
         "fullWidth": false
       }
     },
+    {
+      "name": "mortuary-summary-info",
+      "component": "mortuarySummary",
+      "slot": "mortuary-summary-info-slot"
+    },
     {
       "component": "root",
       "name": "morgue-dashboard-root",
@@ -82,6 +86,26 @@
       "component": "swapForm",
       "title": "Swap form",
       "type": "other-form"
+    },{
+      "name": "admit-deceased-person-form",
+      "component": "admitDeceasedPersonForm",
+      "title": "Admit Deceased Person",
+      "type": "other-form"
+    },
+    {
+      "name": "mortuary-form-entry",
+      "component": "mortuaryFormEntry",
+      "title": "Mortuary Form Entry",
+      "type": "form",
+      "width": "extra-wide",
+      "canMaximize": true,
+      "canHide": true
+    },
+    {
+      "name": "dispose-deceased-person-form",
+      "component": "disposeDeceasedPersonForm",
+      "title": "Dispose Deceased Person",
+      "type": "other-form"
     }
   ],
   "pages": [

package/src/schemas/index.ts

@@ -0,0 +1,66 @@
+import { z } from 'zod';
+
+export const deceasedPatientAdmitSchema = z.object({
+  dateOfAdmission: z
+    .date({ coerce: true })
+    .refine((date) => !!date, 'Date of admission is required')
+    .refine((date) => date <= new Date(), 'Date of admission cannot be in the future'),
+  timeOfDeath: z.string().nonempty('Time of death is required'),
+  period: z
+    .string()
+    .nonempty('AM/PM is required')
+    .regex(/^(AM|PM)$/i, 'Invalid period'),
+  tagNumber: z.string().nonempty('Tag number is required'),
+  obNumber: z.string().optional(),
+  policeName: z.string().optional(),
+  policeIDNo: z.string().optional(),
+  dischargeArea: z.string().optional(),
+  visitType: z.string().uuid('invalid visit type'),
+  availableCompartment: z
+    .union([z.number(), z.string()])
+    .refine((val) => {
+      if (typeof val === 'string') {
+        return val.length > 0 && !isNaN(Number(val)) && Number(val) > 0;
+      }
+      return typeof val === 'number' && !isNaN(val) && val > 0;
+    }, 'Please select a valid compartment')
+    .transform((val) => (typeof val === 'string' ? Number(val) : val)),
+  services: z.array(z.string().uuid('invalid service')).nonempty('Must select one service'),
+  paymentMethod: z.string().uuid('invalid payment method'),
+  insuranceScheme: z.string().optional(),
+  policyNumber: z.string().optional(),
+});
+export const dischargeSchema = z.object({
+  dateOfDischarge: z.date({ coerce: true }).refine((date) => !!date, 'Date of discharge is required'),
+  timeOfDischarge: z.string().nonempty('Time of discharge is required'),
+  period: z
+    .string()
+    .nonempty('AM/PM is required')
+    .regex(/^(AM|PM)$/i, 'Invalid period'),
+  burialPermitNumber: z.string().nonempty('Burial Permit Number is required'),
+  nextOfKinNames: z.string().nonempty('Next of kin names is required'),
+  relationshipType: z.string().nonempty('Next of kin relationship is required'),
+  nextOfKinAddress: z.string().nonempty('Next of kin address is required'),
+  nextOfKinContact: z
+    .string()
+    .regex(/^\d{10}$/, 'Phone number must be exactly 10 digits')
+    .nonempty('Next of kin phone number is required'),
+});
+
+export const disposeSchema = z.object({
+  dateOfDischarge: z.date({ coerce: true }).refine((date) => !!date, 'Date of discharge is required'),
+  timeOfDischarge: z.string().nonempty('Time of discharge is required'),
+  period: z
+    .string()
+    .nonempty('AM/PM is required')
+    .regex(/^(AM|PM)$/i, 'Invalid period'),
+  serialNumber: z.string().nonempty('Serial Number is required'),
+  courtOrderCaseNumber: z.string().nonempty('Court Order Case Number is required'),
+  nextOfKinNames: z.string().nonempty('Next of kin names is required'),
+  relationshipType: z.string().nonempty('Next of kin relationship is required'),
+  nextOfKinAddress: z.string().nonempty('Next of kin address is required'),
+  nextOfKinContact: z
+    .string()
+    .regex(/^\d{10}$/, 'Phone number must be exactly 10 digits')
+    .nonempty('Next of kin phone number is required'),
+});

package/src/summary/summary.component.tsx

@@ -0,0 +1,42 @@
+import React from 'react';
+import { DataTableSkeleton, ContentSwitcher, Switch, InlineLoading } from '@carbon/react';
+import { ArrowRight } from '@carbon/react/icons';
+import { useTranslation } from 'react-i18next';
+import { ConfigurableLink, ErrorState } from '@openmrs/esm-framework';
+import styles from './summary.scss';
+import MetricsCard from '../metrics/metrics-card.component';
+
+interface SummaryProps {
+  awaitingQueueCount: number;
+  admittedCount: number;
+  dischargedCount: number;
+  isLoading?: boolean;
+}
+
+const Summary: React.FC<SummaryProps> = ({ awaitingQueueCount, admittedCount, dischargedCount, isLoading = false }) => {
+  const { t } = useTranslation();
+
+  return (
+    <>
+      <div className={styles.cardContainer}>
+        <MetricsCard
+          headerLabel={t('awaitingAdmissionHeader', 'Awaiting Admission')}
+          label={t('totalCount', 'total')}
+          value={isLoading ? <InlineLoading /> : awaitingQueueCount.toString()}
+        />
+        <MetricsCard
+          headerLabel={t('admittedHeader', 'Admitted')}
+          label={t('totalCount', 'total')}
+          value={admittedCount.toString()}
+        />
+        <MetricsCard
+          headerLabel={t('dischargedHeader', 'Discharged')}
+          label={t('totalCount', 'total')}
+          value={dischargedCount.toString()}
+        />
+      </div>
+    </>
+  );
+};
+
+export default Summary;

package/src/summary/summary.scss

@@ -0,0 +1,10 @@
+@use '@carbon/colors';
+@use '@carbon/layout';
+
+.cardContainer {
+  background-color: colors.$white-0;
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  justify-content: space-between;
+  padding: layout.$spacing-05;
+}