@kenyaemr/esm-service-queues-app 7.0.2-pre.65

package/src/side-menu/nav-group/nav-group.test.tsx

@@ -0,0 +1,32 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import NavGroupExtension from './nav-group.component';
+import { registerNavGroup } from './nav-group';
+
+jest.mock('./nav-group', () => ({
+  registerNavGroup: jest.fn(),
+}));
+
+describe('NavGroupExtension', () => {
+  const props = {
+    title: 'Test Group',
+    slotName: 'testSlot',
+    renderIcon: () => <div>Test Icon</div>,
+  };
+
+  it('registers the navigation group on mount', () => {
+    render(<NavGroupExtension {...props} />);
+
+    expect(registerNavGroup).toHaveBeenCalledWith(props.slotName);
+  });
+
+  it('renders navigation group with provided icon and title', () => {
+    render(<NavGroupExtension {...props} />);
+
+    const icon = screen.getByText('Test Icon');
+    expect(icon).toBeInTheDocument();
+
+    const title = screen.getByText(props.title);
+    expect(title).toBeInTheDocument();
+  });
+});

package/src/side-menu/nav-group/nav-group.ts

@@ -0,0 +1,10 @@
+import { createGlobalStore, createUseStore } from '@openmrs/esm-framework';
+
+const navGroupStore = createGlobalStore('outpatient-nav-groups', { navGroups: [] });
+
+export function registerNavGroup(slotName: string) {
+  const store = navGroupStore.getState();
+  navGroupStore.setState({ navGroups: [slotName, ...store.navGroups] });
+}
+
+export const useNavGroups = createUseStore(navGroupStore);

package/src/side-menu/side-menu.component.tsx

@@ -0,0 +1,6 @@
+import React from 'react';
+import { LeftNavMenu } from '@openmrs/esm-framework';
+
+const SideMenu = () => <LeftNavMenu />;
+
+export default SideMenu;

package/src/side-menu/side-menu.test.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import SideMenu from './side-menu.component';
+
+jest.mock('@openmrs/esm-framework', () => ({
+  LeftNavMenu: () => <div data-testid="left-nav-menu">Mocked LeftNavMenu</div>,
+}));
+jest.mock('@openmrs/esm-framework');
+
+describe('SideMenu', () => {
+  it('renders the LeftNavMenu', () => {
+    render(<SideMenu />);
+
+    const leftNavMenu = screen.getByTestId('left-nav-menu');
+    expect(leftNavMenu).toBeInTheDocument();
+  });
+});

package/src/transition-queue-entry/transition-queue-entry-dialog.component.tsx

@@ -0,0 +1,134 @@
+import React, { useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
+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 { requeueQueueEntry } from './transition-queue-entry.resource';
+import styles from './transition-queue-entry-dialog.scss';
+import { useMutateQueueEntries } from '../hooks/useQueueEntries';
+import { type ConfigObject } from '../config-schema';
+
+interface TransitionQueueEntryModalProps {
+  queueEntry: MappedVisitQueueEntry;
+  closeModal: () => void;
+}
+
+enum priorityComment {
+  REQUEUED = 'Requeued',
+}
+
+const TransitionQueueEntryModal: React.FC<TransitionQueueEntryModalProps> = ({ queueEntry, closeModal }) => {
+  const { t } = useTranslation();
+  const config = useConfig<ConfigObject>();
+  const defaultTransitionStatus = config.concepts.defaultTransitionStatus;
+
+  const preferredIdentifiers = queueEntry?.identifiers.filter((identifier) =>
+    config.defaultIdentifierTypes.includes(identifier?.identifierType?.uuid),
+  );
+
+  const { mutateQueueEntries } = useMutateQueueEntries();
+
+  const launchEditPriorityModal = useCallback(() => {
+    const endedAt = new Date();
+    updateQueueEntry(
+      queueEntry?.visitUuid,
+      queueEntry?.queueUuid,
+      queueEntry?.queueUuid,
+      queueEntry?.queueEntryUuid,
+      queueEntry?.patientUuid,
+      queueEntry?.priority?.uuid,
+      defaultTransitionStatus,
+      endedAt,
+      queueEntry?.sortWeight,
+    ).then(
+      ({ status }) => {
+        if (status === 201) {
+          serveQueueEntry(queueEntry?.queue.name, queueEntry?.visitQueueNumber, 'serving').then(({ status }) => {
+            if (status === 200) {
+              showSnackbar({
+                isLowContrast: true,
+                title: t('success', 'Success'),
+                kind: 'success',
+                subtitle: t('patientAttendingService', 'Patient attending service'),
+              });
+              closeModal();
+              mutateQueueEntries();
+              navigate({ to: `\${openmrsSpaBase}/patient/${queueEntry?.patientUuid}/chart` });
+            }
+          });
+        }
+      },
+      (error) => {
+        showSnackbar({
+          title: t('queueEntryUpdateFailed', 'Error updating queue entry'),
+          kind: 'error',
+          isLowContrast: false,
+          subtitle: error?.message,
+        });
+      },
+    );
+  }, [queueEntry]);
+
+  const handleRequeuePatient = useCallback(() => {
+    requeueQueueEntry(priorityComment.REQUEUED, queueEntry?.queueUuid, queueEntry?.queueEntryUuid).then(
+      ({ status }) => {
+        if (status === 200) {
+          showSnackbar({
+            isLowContrast: true,
+            title: t('success', 'Success'),
+            kind: 'success',
+            subtitle: t('patientRequeued', 'Patient has been requeued'),
+          });
+          closeModal();
+          mutateQueueEntries();
+        }
+      },
+      (error) => {
+        showSnackbar({
+          title: t('queueEntryUpdateFailed', 'Error updating queue entry'),
+          kind: 'error',
+          isLowContrast: false,
+          subtitle: error?.message,
+        });
+      },
+    );
+  }, []);
+
+  return (
+    <div>
+      <ModalHeader closeModal={closeModal} title={t('servePatient', 'Serve patient')} />
+      <ModalBody className={styles.modalBody}>
+        <div>
+          <section className={styles.modalBody}>
+            <p className={styles.p}>
+              {t('patientName', 'Patient name')} : &nbsp; {queueEntry?.name}
+            </p>
+            {preferredIdentifiers?.length
+              ? preferredIdentifiers.map((identifier) => (
+                  <p className={styles.p}>
+                    {identifier?.identifierType?.display} : &nbsp; {identifier?.identifier}
+                  </p>
+                ))
+              : ''}
+            <p className={styles.p}>
+              {t('patientAge', 'Age')} : &nbsp; {queueEntry?.patientAge}
+            </p>
+            <p>{queueEntry.identifiers?.map((identifier) => <Tag key={identifier.uuid}>{identifier.display}</Tag>)}</p>
+          </section>
+        </div>
+      </ModalBody>
+      <ModalFooter>
+        <Button kind="secondary" onClick={() => handleRequeuePatient()}>
+          {t('requeue', 'Requeue')}
+        </Button>
+        <Button onClick={() => launchEditPriorityModal()}>{t('serve', 'Serve')}</Button>
+      </ModalFooter>
+    </div>
+  );
+};
+
+export default TransitionQueueEntryModal;

package/src/transition-queue-entry/transition-queue-entry-dialog.scss

@@ -0,0 +1,12 @@
+@use '@carbon/styles/scss/spacing';
+@use '@carbon/styles/scss/type';
+
+.modalBody {
+  padding-bottom: spacing.$spacing-03;
+  margin-bottom: 0rem;
+}
+
+.p {
+  margin-bottom: spacing.$spacing-02;
+  @include type.type-style('body-01');
+}

package/src/transition-queue-entry/transition-queue-entry-dialog.test.tsx

@@ -0,0 +1,102 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { navigate } from '@openmrs/esm-framework';
+import { serveQueueEntry, updateQueueEntry } from '../active-visits/active-visits-table.resource';
+import { requeueQueueEntry } from './transition-queue-entry.resource';
+import TransitionQueueEntryModal from './transition-queue-entry-dialog.component';
+
+const mockedNavigate = navigate as jest.Mock;
+
+jest.mock('@openmrs/esm-framework', () => ({
+  ...jest.requireActual('@openmrs/esm-framework'),
+  useTranslation: () => ({ t: jest.fn((key) => key) }),
+  navigate: jest.fn(),
+  toOmrsIsoString: jest.fn(),
+  toDateObjectStrict: jest.fn(),
+  useConfig: jest.fn(() => ({
+    concepts: {
+      defaultTransitionStatus: 'some-default-transition-status',
+    },
+    defaultIdentifierTypes: [
+      {
+        fieldName: 'openMrsId',
+        format: null,
+        identifierSources: [
+          {
+            uuid: '8549f706-7e85-4c1d-9424-217d50a2988b',
+            name: 'Generator for OpenMRS ID',
+            description: 'Generator for OpenMRS ID',
+            baseCharacterSet: '0123456789ACDEFGHJKLMNPRTUVWXY',
+            prefix: '',
+          },
+        ],
+        isPrimary: true,
+        name: 'OpenMRS ID',
+        required: true,
+        uniquenessBehavior: 'UNIQUE',
+        uuid: '05a29f94-c0ed-11e2-94be-8c13b969e334',
+      },
+    ],
+  })),
+}));
+
+jest.mock('../active-visits/active-visits-table.resource', () => ({
+  serveQueueEntry: jest.fn(() => Promise.resolve({ status: 200 })),
+  updateQueueEntry: jest.fn(() => Promise.resolve({ status: 201 })),
+}));
+
+jest.mock('../hooks/useQueueEntries', () => ({
+  useMutateQueueEntries: () => ({ mutateQueueEntries: jest.fn() }),
+}));
+
+jest.mock('./transition-queue-entry.resource', () => ({
+  requeueQueueEntry: jest.fn(() => Promise.resolve({ status: 200 })),
+}));
+
+describe('TransitionQueueEntryModal', () => {
+  const queueEntry = {
+    visitUuid: 'c90386ff-ae85-45cc-8a01-25852099c5ae',
+    identifiers: ['100GEJ'],
+    queueUuid: 'fa1e98f1-f002-4174-9e55-34d60951e710',
+    queueEntryUuid: '712289ab-32c0-430f-87b6-d9c1e4e4686e',
+    patientUuid: 'cc75ad73-c24b-499c-8db9-a7ef4fc0b36d',
+    priorityUuid: 'f9684018-a4d3-4d6f-9dd5-b4b1e89af3e7',
+    queue: {
+      name: 'Triage Queue',
+    },
+    name: 'John Doe',
+  };
+
+  it('renders modal content', () => {
+    const closeModal = jest.fn();
+    render(<TransitionQueueEntryModal queueEntry={queueEntry} closeModal={closeModal} />);
+
+    expect(screen.getByText('Serve patient')).toBeInTheDocument();
+    expect(screen.getByText(/Patient name :/i)).toBeInTheDocument();
+  });
+
+  it('handles requeueing patient', async () => {
+    const user = userEvent.setup();
+
+    const closeModal = jest.fn();
+    render(<TransitionQueueEntryModal queueEntry={queueEntry} closeModal={closeModal} />);
+
+    await user.click(screen.getByText('Requeue'));
+
+    expect(requeueQueueEntry).toHaveBeenCalledWith('Requeued', queueEntry.queueUuid, queueEntry.queueEntryUuid);
+  });
+
+  it('handles serving patient', async () => {
+    const user = userEvent.setup();
+
+    const closeModal = jest.fn();
+    render(<TransitionQueueEntryModal queueEntry={queueEntry} closeModal={closeModal} />);
+
+    await user.click(screen.getByText('Serve'));
+
+    expect(updateQueueEntry).toHaveBeenCalled();
+    expect(serveQueueEntry).toHaveBeenCalled();
+    expect(mockedNavigate).toHaveBeenCalled();
+  });
+});

package/src/transition-queue-entry/transition-queue-entry.resource.ts

@@ -0,0 +1,16 @@
+import { openmrsFetch, restBaseUrl } from '@openmrs/esm-framework';
+
+export function requeueQueueEntry(priorityComment: string, queueUuid: string, queueEntryUuid: string) {
+  const abortController = new AbortController();
+
+  return openmrsFetch(`${restBaseUrl}/queue/${queueUuid}/entry/${queueEntryUuid}`, {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json',
+    },
+    signal: abortController.signal,
+    body: {
+      priorityComment: priorityComment,
+    },
+  });
+}