From 511ea44edb4b43ce08dab40d45e4c2336c6862e2 Mon Sep 17 00:00:00 2001
From: Makombe Kennedy <kennedymakombe@gmail.com>
Date: Thu, 13 Jun 2024 22:11:43 +0300
Subject: [PATCH] (feat)O3-3409:Align service queue serve patient column to
 display necessary information (#1188)

---
 .../active-visits-row-actions.component.tsx   | 16 ++----
 .../actions-menu.component.tsx                | 53 -------------------
 .../actions-menu.scss                         |  3 --
 .../edit-entry.component.tsx                  | 27 ----------
 ...ransition-queue-entry-dialog.component.tsx | 38 ++-----------
 5 files changed, 8 insertions(+), 129 deletions(-)
 delete mode 100644 packages/esm-service-queues-app/src/queue-entry-table-components/actions-menu.component.tsx
 delete mode 100644 packages/esm-service-queues-app/src/queue-entry-table-components/actions-menu.scss
 delete mode 100644 packages/esm-service-queues-app/src/queue-entry-table-components/edit-entry.component.tsx

diff --git a/packages/esm-service-queues-app/src/active-visits/active-visits-row-actions.component.tsx b/packages/esm-service-queues-app/src/active-visits/active-visits-row-actions.component.tsx
index 7f9ef0a96..0e989b99a 100644
--- a/packages/esm-service-queues-app/src/active-visits/active-visits-row-actions.component.tsx
+++ b/packages/esm-service-queues-app/src/active-visits/active-visits-row-actions.component.tsx
@@ -1,8 +1,6 @@
 import React from 'react';
 import TransitionMenu from '../queue-entry-table-components/transition-entry.component';
 import { type QueueTableCellComponentProps, type QueueEntry } from '../types';
-import ActionsMenu from '../queue-entry-table-components/actions-menu.component';
-import EditMenu from '../queue-entry-table-components/edit-entry.component';
 import { useConfig } from '@openmrs/esm-framework';
 import { type ConfigObject } from '../config-schema';
 import { mapVisitQueueEntryProperties } from './active-visits-table.resource';
@@ -11,22 +9,16 @@ import styles from './active-visits-row-actions.scss';
 // This component is meant to be mounted as an extension in the queue-table-extension-column-slot.
 // Defines the following actions the user can perform on a queue entry:
 // - queue / requeue (to the in-service status)
-// - transfer to a different queue
-// - Overflow menu action to edit patient detail
-// - Overflow menu action to end patient visit
+
 const ActiveVisitRowActionsCell = ({ queueEntry }: QueueTableCellComponentProps) => {
   const { visitQueueNumberAttributeUuid } = useConfig<ConfigObject>();
 
   const mappedQueueEntry = mapVisitQueueEntryProperties(queueEntry, visitQueueNumberAttributeUuid);
 
   return (
-    <>
-      <div className={styles.transitionMenuContainer}>
-        <TransitionMenu queueEntry={mappedQueueEntry} />
-      </div>
-      <EditMenu queueEntry={mappedQueueEntry} />
-      <ActionsMenu queueEntry={mappedQueueEntry} />
-    </>
+    <div className={styles.transitionMenuContainer}>
+      <TransitionMenu queueEntry={mappedQueueEntry} />
+    </div>
   );
 };
 
diff --git a/packages/esm-service-queues-app/src/queue-entry-table-components/actions-menu.component.tsx b/packages/esm-service-queues-app/src/queue-entry-table-components/actions-menu.component.tsx
deleted file mode 100644
index 7465b888f..000000000
--- a/packages/esm-service-queues-app/src/queue-entry-table-components/actions-menu.component.tsx
+++ /dev/null
@@ -1,53 +0,0 @@
-import React, { useCallback } from 'react';
-import { navigate, showModal } from '@openmrs/esm-framework';
-import { useTranslation } from 'react-i18next';
-import { type MappedVisitQueueEntry } from '../active-visits/active-visits-table.resource';
-import { Layer, OverflowMenu, OverflowMenuItem } from '@carbon/react';
-import styles from './actions-menu.scss';
-
-interface ActionsMenuProps {
-  queueEntry: MappedVisitQueueEntry;
-}
-
-const ActionsMenu: React.FC<ActionsMenuProps> = ({ queueEntry }) => {
-  const { t } = useTranslation();
-
-  const launchEndVisitModal = useCallback(() => {
-    const dispose = showModal('remove-queue-entry', {
-      closeModal: () => dispose(),
-      queueEntry,
-    });
-  }, [queueEntry]);
-
-  return (
-    <OverflowMenu
-      aria-label="Actions menu"
-      iconDescription={t('actions', 'Actions')}
-      selectorPrimaryFocus={'#editPatientDetails'}
-      size="sm"
-      flipped>
-      <OverflowMenuItem
-        className={styles.menuItem}
-        id="#editPatientDetails"
-        itemText={t('editPatientDetails', 'Edit patient details')}
-        onClick={() =>
-          navigate({
-            to: `\${openmrsSpaBase}/patient/${queueEntry.patientUuid}/edit`,
-          })
-        }>
-        {t('editPatientDetails', 'Edit patient details')}
-      </OverflowMenuItem>
-      <OverflowMenuItem
-        className={styles.menuItem}
-        id="#endVisit"
-        onClick={launchEndVisitModal}
-        hasDivider
-        isDelete
-        itemText={t('endVisit', 'End visit')}>
-        {t('endVisit', 'End visit')}
-      </OverflowMenuItem>
-    </OverflowMenu>
-  );
-};
-
-export default ActionsMenu;
diff --git a/packages/esm-service-queues-app/src/queue-entry-table-components/actions-menu.scss b/packages/esm-service-queues-app/src/queue-entry-table-components/actions-menu.scss
deleted file mode 100644
index 63ac4b32f..000000000
--- a/packages/esm-service-queues-app/src/queue-entry-table-components/actions-menu.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-.menuItem {
-  max-width: none;
-}
diff --git a/packages/esm-service-queues-app/src/queue-entry-table-components/edit-entry.component.tsx b/packages/esm-service-queues-app/src/queue-entry-table-components/edit-entry.component.tsx
deleted file mode 100644
index 03a927f69..000000000
--- a/packages/esm-service-queues-app/src/queue-entry-table-components/edit-entry.component.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import React, { useCallback } from 'react';
-import { type MappedVisitQueueEntry } from '../active-visits/active-visits-table.resource';
-import { useTranslation } from 'react-i18next';
-import { showModal } from '@openmrs/esm-framework';
-import { Button } from '@carbon/react';
-import styles from './edit-entry.scss';
-
-interface EditMenuProps {
-  queueEntry: MappedVisitQueueEntry;
-}
-const EditMenu: React.FC<EditMenuProps> = ({ queueEntry }) => {
-  const { t } = useTranslation();
-  const launchEditPriorityModal = useCallback(() => {
-    const dispose = showModal('edit-queue-entry-status-modal', {
-      closeModal: () => dispose(),
-      queueEntry,
-    });
-  }, [queueEntry]);
-
-  return (
-    <Button onClick={launchEditPriorityModal} className={styles.editIcon} kind="ghost">
-      {t('transfer', 'Transfer')}
-    </Button>
-  );
-};
-
-export default EditMenu;
diff --git a/packages/esm-service-queues-app/src/transition-queue-entry/transition-queue-entry-dialog.component.tsx b/packages/esm-service-queues-app/src/transition-queue-entry/transition-queue-entry-dialog.component.tsx
index 41c0b9ad8..11d67e153 100644
--- a/packages/esm-service-queues-app/src/transition-queue-entry/transition-queue-entry-dialog.component.tsx
+++ b/packages/esm-service-queues-app/src/transition-queue-entry/transition-queue-entry-dialog.component.tsx
@@ -1,17 +1,13 @@
 import React, { useCallback } from 'react';
-import dayjs from 'dayjs';
 import { useTranslation } from 'react-i18next';
-import { Button, ModalBody, ModalFooter, ModalHeader } from '@carbon/react';
-import { ExtensionSlot, formatDatetime, navigate, parseDate, showSnackbar, useConfig } from '@openmrs/esm-framework';
+import { Button, ModalBody, ModalFooter, ModalHeader, Tag } from '@carbon/react';
+import { navigate, showSnackbar, useConfig } from '@openmrs/esm-framework';
 import {
   type MappedVisitQueueEntry,
   serveQueueEntry,
   updateQueueEntry,
 } from '../active-visits/active-visits-table.resource';
-import { findObsByConceptUUID } from '../helpers/functions';
 import { requeueQueueEntry } from './transition-queue-entry.resource';
-import { usePastVisits } from '../past-visit/past-visit.resource';
-import { usePatientAppointments } from '../queue-patient-linelists/queue-linelist.resource';
 import styles from './transition-queue-entry-dialog.scss';
 import { useMutateQueueEntries } from '../hooks/useMutateQueueEntries';
 import { type ConfigObject } from '../config-schema';
@@ -27,7 +23,6 @@ enum priorityComment {
 
 const TransitionQueueEntryModal: React.FC<TransitionQueueEntryModalProps> = ({ queueEntry, closeModal }) => {
   const { t } = useTranslation();
-
   const config = useConfig<ConfigObject>();
   const defaultTransitionStatus = config.concepts.defaultTransitionStatus;
 
@@ -35,11 +30,6 @@ const TransitionQueueEntryModal: React.FC<TransitionQueueEntryModalProps> = ({ q
     config.defaultIdentifierTypes.includes(identifier?.identifierType?.uuid),
   );
 
-  const startDate = dayjs(new Date().toISOString()).subtract(6, 'month').toISOString();
-  const { upcomingAppointment, isLoading } = usePatientAppointments(queueEntry?.patientUuid, startDate);
-  const { visits, isLoading: loading } = usePastVisits(queueEntry?.patientUuid);
-  const obsToDisplay =
-    !loading && visits ? findObsByConceptUUID(visits?.encounters, config.concepts.historicalObsConceptUuid) : [];
   const { mutateQueueEntries } = useMutateQueueEntries();
 
   const launchEditPriorityModal = useCallback(() => {
@@ -125,30 +115,10 @@ const TransitionQueueEntryModal: React.FC<TransitionQueueEntryModalProps> = ({ q
                 ))
               : ''}
             <p className={styles.p}>
-              {t('lastClinicalVisit', 'Last clinical visit')} : &nbsp; {loading && t('loading', 'Loading...')}
-              {!loading && !visits && t('none', 'None')}
-              {visits && formatDatetime(parseDate(visits?.startDatetime))}
-            </p>
-            {obsToDisplay?.length
-              ? obsToDisplay.map((o) => (
-                  <p className={styles.p}>
-                    {o.concept.display} : &nbsp; {o.value.display}
-                  </p>
-                ))
-              : ''}
-            <p className={styles.p}>
-              {t('tcaDate', 'Tca date')} : &nbsp; {isLoading && t('loading', 'Loading...')}
-              {!isLoading && !upcomingAppointment && t('none', 'None')}
-              {upcomingAppointment && formatDatetime(parseDate(upcomingAppointment?.startDateTime))}
+              {t('patientAge', 'Age')} : &nbsp; {queueEntry?.patientAge}
             </p>
+            <p>{queueEntry.identifiers?.map((identifier) => <Tag key={identifier.uuid}>{identifier.display}</Tag>)}</p>
           </section>
-          <ExtensionSlot
-            className={styles.visitSummaryContainer}
-            name="previous-visit-summary-slot"
-            state={{
-              patientUuid: queueEntry?.patientUuid,
-            }}
-          />
         </div>
       </ModalBody>
       <ModalFooter>