@ampath/esm-dha-workflow-app 4.0.0-next.15 → 4.0.0-next.16

package/src/triage/triage.component.tsx

@@ -0,0 +1,36 @@
+import React from 'react';
+import { useSession } from '@openmrs/esm-framework';
+
+import { Tile } from '@carbon/react';
+import Room from './room/room.component';
+import styles from './triage.module.scss';
+import useTriagePatients from './triage.resource';
+
+interface TriageProps {}
+const Triage: React.FC<TriageProps> = () => {
+  const session = useSession();
+
+  const locationUuid = session.sessionLocation.uuid;
+  const { patients, isLoading, isError } = useTriagePatients(locationUuid);
+
+  if (isLoading) return <p>Loading...</p>;
+  if (isError) return <p>Error loading patients</p>;
+  return (
+    <>
+      <div className={styles.container}>
+        <Tile className={styles.card}>
+          <h4 className={styles.title}>Patients in waiting</h4>
+          <h3>{patients.length}</h3>
+        </Tile>
+        <Tile className={styles.card}>
+          <h4>Patients attended to</h4>
+        </Tile>
+      </div>
+      <div style={{ display: 'flex' }}>
+        <Room name="Triage 1" patients={patients} />
+        <Room name="Triage 2" patients={patients} />
+      </div>
+    </>
+  );
+};
+export default Triage;

package/src/triage/triage.module.scss

@@ -0,0 +1,19 @@
+
+
+.container {
+    display: inline-flex;
+    align-items: center;
+    margin-bottom: 1rem;
+    border: 1px solid #9e9e9e;
+    padding: 1rem;
+    margin: 1rem;
+}
+
+
+
+.card {
+    width: 18rem;
+    border: 1px solid #b0b0b0;
+    padding: 1rem;
+    margin: 1rem;
+}

package/src/triage/triage.resource.ts

@@ -0,0 +1,19 @@
+import useSWR from 'swr';
+import { openmrsFetch } from '@openmrs/esm-framework';
+
+import { type Patient } from './types';
+export default function useTriagePatients(locationUuid: string) {
+  const { data, error, isLoading } = useSWR(
+    `https://staging.ampath.or.ke/openmrs/ws/rest/v1/queue-entry?v=custom:(uuid,display,queue:(display,uuid,location:(display,uuid)),status:(display),patient:(uuid,person:(gender,age)))&totalCount=true&isEnded=false&location=${locationUuid}`,
+    (url: string) =>
+      openmrsFetch<{
+        results: Array<Patient>;
+      }>(url).then((res) => res.data.results),
+  );
+
+  return {
+    patients: data,
+    isLoading,
+    isError: error,
+  };
+}

package/src/triage/types.ts

@@ -0,0 +1,22 @@
+export interface Patient {
+  uuid: string;
+  display: string;
+  queue: {
+    display: string;
+    uuid: string;
+    location: {
+      display: string;
+      uuid: string;
+    };
+  };
+  status: {
+    display: string;
+  };
+  patient: {
+    uuid: string;
+    person: {
+      gender: string;
+      age: number;
+    };
+  };
+}