From 3f698aff7d59ae8c849196541c556f9b855dcab7 Mon Sep 17 00:00:00 2001
From: Donald Kibet <chelashawdonald@yahoo.com>
Date: Thu, 6 Jun 2024 01:24:25 +0300
Subject: [PATCH] (feat) O3-3375: Align visit form queue fields to work in
 visit start form on patient chart

---
 .../src/visit/hooks/useServiceQueue.tsx       |  9 ++++++--
 .../visit/visit-form/visit-form.component.tsx | 21 ++++++++++++-------
 .../end-visit-dialog.component.tsx            |  7 ++++++-
 3 files changed, 27 insertions(+), 10 deletions(-)

diff --git a/packages/esm-patient-chart-app/src/visit/hooks/useServiceQueue.tsx b/packages/esm-patient-chart-app/src/visit/hooks/useServiceQueue.tsx
index 7299570cdd..04786dbab7 100644
--- a/packages/esm-patient-chart-app/src/visit/hooks/useServiceQueue.tsx
+++ b/packages/esm-patient-chart-app/src/visit/hooks/useServiceQueue.tsx
@@ -56,14 +56,19 @@ export async function generateVisitQueueNumber(
   );
 }
 
-export function removeQueuedPatient(queueUuid: string, queueEntryUuid: string, abortController: AbortController) {
+export function removeQueuedPatient(
+  queueUuid: string,
+  queueEntryUuid: string,
+  abortController: AbortController,
+  endedAt?: Date,
+) {
   return openmrsFetch(`${restBaseUrl}/queue/${queueUuid}/entry/${queueEntryUuid}`, {
     method: 'POST',
     headers: {
       'Content-Type': 'application/json',
     },
     body: {
-      endedAt: toDateObjectStrict(toOmrsIsoString(new Date())),
+      endedAt: toDateObjectStrict(toOmrsIsoString(endedAt) ?? toOmrsIsoString(new Date())),
     },
     signal: abortController.signal,
   });
diff --git a/packages/esm-patient-chart-app/src/visit/visit-form/visit-form.component.tsx b/packages/esm-patient-chart-app/src/visit/visit-form/visit-form.component.tsx
index 0e9c1fabdb..ca2c242f29 100644
--- a/packages/esm-patient-chart-app/src/visit/visit-form/visit-form.component.tsx
+++ b/packages/esm-patient-chart-app/src/visit/visit-form/visit-form.component.tsx
@@ -111,6 +111,13 @@ const StartVisitForm: React.FC<StartVisitFormProps> = ({
   const { mutate: mutateQueueEntry } = useVisitQueueEntry(patientUuid, visitUuid);
   const { visitAttributeTypes } = useVisitAttributeTypes();
   const [extraVisitInfo, setExtraVisitInfo] = useState(null);
+  const [{ service, priority, status, sortWeight, queueLocation }, setVisitFormFields] = useState({
+    service: null,
+    priority: null,
+    status: null,
+    sortWeight: null,
+    queueLocation: null,
+  });
 
   const displayVisitStopDateTimeFields = useMemo(
     () => visitToEdit?.stopDatetime || showVisitEndDateTimeFields,
@@ -459,15 +466,10 @@ const StartVisitForm: React.FC<StartVisitFormProps> = ({
                 if (config.showServiceQueueFields) {
                   // retrieve values from the queue extension
                   setVisitUuid(response.data.uuid);
-                  const queueLocation = event.target['queueLocation']?.value;
-                  const serviceUuid = event.target['service']?.value;
-                  const priority = event.target['priority']?.value;
-                  const status = event.target['status']?.value;
-                  const sortWeight = event.target['sortWeight']?.value;
 
                   saveQueueEntry(
                     response.data.uuid,
-                    serviceUuid,
+                    service,
                     patientUuid,
                     priority,
                     status,
@@ -622,6 +624,11 @@ const StartVisitForm: React.FC<StartVisitFormProps> = ({
       mutateQueueEntry,
       mutateVisits,
       patientUuid,
+      priority,
+      queueLocation,
+      service,
+      sortWeight,
+      status,
       t,
       upcomingAppointment,
       validateVisitStartStopDatetime,
@@ -804,7 +811,7 @@ const StartVisitForm: React.FC<StartVisitFormProps> = ({
               <section>
                 <div className={styles.sectionTitle}></div>
                 <div className={styles.sectionField}>
-                  <ExtensionSlot name="add-queue-entry-slot" />
+                  <ExtensionSlot name="visit-form-queue-slot" state={{ setFormFields: setVisitFormFields }} />
                 </div>
               </section>
             )}
diff --git a/packages/esm-patient-chart-app/src/visit/visit-prompt/end-visit-dialog.component.tsx b/packages/esm-patient-chart-app/src/visit/visit-prompt/end-visit-dialog.component.tsx
index 6c115653cd..7e0453782f 100644
--- a/packages/esm-patient-chart-app/src/visit/visit-prompt/end-visit-dialog.component.tsx
+++ b/packages/esm-patient-chart-app/src/visit/visit-prompt/end-visit-dialog.component.tsx
@@ -36,7 +36,12 @@ const EndVisitDialog: React.FC<EndVisitDialogProps> = ({ patientUuid, closeModal
           (response) => {
             if (response.status === 200) {
               if (queueEntry) {
-                removeQueuedPatient(queueEntry.queue.uuid, queueEntry.queueEntryUuid, abortController);
+                removeQueuedPatient(
+                  queueEntry.queue.uuid,
+                  queueEntry.queueEntryUuid,
+                  abortController,
+                  response?.data.stopDatetime,
+                );
               }
               mutate();
               closeModal();