@kenyaemr/esm-bed-management-app 1.0.1-pre.7 → 8.0.2

package/src/bed-admission/bed-admission-tabs.component.tsx

@@ -1,69 +0,0 @@
-import { Tab, TabList, TabPanel, TabPanels, Tabs } from "@carbon/react";
-import React, { useState } from "react";
-import styles from "./bed-admission-tabs-styles.scss";
-import { useTranslation } from "react-i18next";
-import ActivePatientsTable from "./active-patients/active-patients-table.component";
-import AdmittedPatientsList from "./admitted-patients/admitted-patients.component";
-import DischargedPatientsList from "./discharged-patients/discharged-patients.componet";
-import WardCard from "../ward-card/ward-card.component";
-
-const BedAdmissionTabs: React.FC = () => {
-  const { t } = useTranslation();
-  const [admittedCount, setAdmittedCount] = useState(0);
-  const [toAdmitCount, setToAdmitCount] = useState(0);
-  const [toDischargeCount, setToDischargeCount] = useState(0);
-
-  return (
-    <>
-      <div className={styles.cardContainer}>
-        <WardCard
-          label="patients"
-          headerLabel="To Admit"
-          value={admittedCount}
-        />
-        <WardCard
-          label="patients"
-          headerLabel="Admitted"
-          value={toAdmitCount}
-        />
-        <WardCard
-          label="patients"
-          headerLabel="To Discharge"
-          value={toDischargeCount}
-        />
-      </div>
-      <div className={styles.container}>
-        <Tabs>
-          <TabList contained fullWidth className={styles.tabsContainer}>
-            <Tab className={styles.tab}>
-              {t("toAdmit", `To Admit (${admittedCount})`)}
-            </Tab>
-            <Tab className={styles.tab}>
-              {t("admitted", `Admitted (${toAdmitCount})`)}
-            </Tab>
-            <Tab className={styles.tab}>
-              {t("discharged", `To Discharge (0)`)}
-            </Tab>
-          </TabList>
-          <TabPanels>
-            <TabPanel>
-              <ActivePatientsTable
-                status="pending"
-                setPatientCount={setAdmittedCount}
-              />
-            </TabPanel>
-            <TabPanel>
-              <AdmittedPatientsList
-                status="completed"
-                setPatientCount={setToAdmitCount}
-              />
-            </TabPanel>
-            <TabPanel></TabPanel>
-          </TabPanels>
-        </Tabs>
-      </div>
-    </>
-  );
-};
-
-export default BedAdmissionTabs;

package/src/bed-admission/bed-admission.component.tsx

@@ -1,15 +0,0 @@
-import React from "react";
-import { BrowserRouter, Route, Routes } from "react-router-dom";
-import ActivePatientsHome from "./active-patients";
-
-const BedAdmission: React.FC = () => {
-  return (
-    <BrowserRouter basename={window.getOpenmrsSpaBase()}>
-      <Routes>
-        <Route path="/home/bed-admission" element={<ActivePatientsHome />} />
-      </Routes>
-    </BrowserRouter>
-  );
-};
-
-export default BedAdmission;

package/src/bed-admission/bed-admission.resource.ts

@@ -1,35 +0,0 @@
-import { FetchResponse, openmrsFetch } from "@openmrs/esm-framework";
-
-export async function assignPatientBed(
-  requestPayload,
-  bedId
-): Promise<FetchResponse> {
-  const abortController = new AbortController();
-  abortController.abort();
-  const response: FetchResponse = await openmrsFetch(
-    `/ws/rest/v1/beds/${bedId}`,
-    {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
-      body: requestPayload,
-    }
-  );
-  return response;
-}
-
-export async function endPatientQueue(
-  queueStatus,
-  queueUuid
-): Promise<FetchResponse> {
-  const abortController = new AbortController();
-  abortController.abort();
-  const response: FetchResponse = await openmrsFetch(
-    `/ws/rest/v1/patientqueue/${queueUuid}`,
-    {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
-      body: queueStatus,
-    }
-  );
-  return response;
-}

package/src/bed-admission/bed-layout/bed-layout-list.component.tsx

@@ -1,101 +0,0 @@
-import React, { useState } from "react";
-import { Column, InlineLoading, Grid } from "@carbon/react";
-import { ErrorState } from "@openmrs/esm-patient-common-lib";
-import { useTranslation } from "react-i18next";
-import BedLayout from "./bed-layout.component";
-import styles from "./bed-layout.scss";
-import EmptyState from "../../empty-state/empty-state.component";
-import MinBedLayout from "./min-bed-layout.component";
-import { useAdmissionLocationBedLayout } from "../../summary/summary.resource";
-import { patientDetailsProps } from "../types";
-interface BedLayoutListProps {
-  locationUuid: string;
-  handleClick: (e) => void;
-  patientDetails: patientDetailsProps;
-}
-
-const BedLayoutList: React.FC<BedLayoutListProps> = React.memo(
-  ({ locationUuid, handleClick, patientDetails }) => {
-    const { t } = useTranslation();
-    const [selectedBed, setSelectedBed] = useState(null);
-    const {
-      data: bedData,
-      isLoading,
-      error,
-    } = useAdmissionLocationBedLayout(locationUuid);
-
-    const getLayoutClass = (status: string) =>
-      status === "AVAILABLE" ? styles.available : styles.occupied;
-
-    if (isLoading) {
-      return (
-        <div className={styles.loadingContainer}>
-          <InlineLoading
-            status="active"
-            iconDescription={t("loading", "Loading")}
-            description={t("loading", "Loading...")}
-          />
-        </div>
-      );
-    }
-
-    if (error) {
-      return (
-        <div className={styles.errorContainer}>
-          <ErrorState
-            headerTitle={t(
-              "errorFetchingbedInformation",
-              "Error fetching bed information"
-            )}
-            error={error}
-          />
-        </div>
-      );
-    }
-
-    if (locationUuid === undefined) {
-      return (
-        <div className={styles.errorContainer}>
-          <EmptyState
-            msg={t("noWardSelected", "No ward has been selected")}
-            helper=""
-          />
-        </div>
-      );
-    }
-    if (locationUuid !== undefined && !bedData?.length) {
-      return (
-        <div className={styles.errorContainer}>
-          <EmptyState
-            msg={t("noBedItems", "No bed to display in this ward")}
-            helper=""
-          />
-        </div>
-      );
-    }
-    return (
-      <>
-        <MinBedLayout />
-        <Grid>
-          {bedData?.map((bed) => (
-            <Column key={bed.bedNumber} lg={5} md={5} sm={5}>
-              <BedLayout
-                handleBedAssignment={() => {
-                  setSelectedBed(bed.bedId);
-                  handleClick(bed);
-                }}
-                bedPillowStyles={styles.pillow}
-                layOutStyles={`${styles.bed} ${getLayoutClass(bed.status)}`}
-                isBedSelected={selectedBed === bed.bedId}
-                patientDetails={patientDetails}
-                bedDetails={bed}
-              />
-            </Column>
-          ))}
-        </Grid>
-      </>
-    );
-  }
-);
-
-export default BedLayoutList;

package/src/bed-admission/bed-layout/bed-layout.component.tsx

@@ -1,64 +0,0 @@
-import React, { useRef } from "react";
-import classnames from "classnames";
-import styles from "./bed-layout.scss";
-import { patientDetailsProps } from "../types";
-import { BedDetails } from "../../types";
-
-interface BedProps {
-  handleBedAssignment?: () => void;
-  isBedSelected?: boolean;
-  layOutStyles?: string;
-  bedPillowStyles?: string;
-  patientDetails?: patientDetailsProps;
-  bedDetails?: BedDetails;
-}
-
-const BedLayout: React.FC<BedProps> = ({
-  layOutStyles,
-  bedPillowStyles,
-  handleBedAssignment,
-  isBedSelected,
-  bedDetails,
-  patientDetails,
-}) => {
-  const bedRef = useRef(null);
-
-  return (
-    <>
-      <div
-        ref={bedRef}
-        role="button"
-        tabIndex={0}
-        onClick={() => handleBedAssignment()}
-        className={classnames(styles.bedLayout, {
-          [layOutStyles]: layOutStyles,
-          [styles.bedLayoutSelected]:
-            isBedSelected ||
-            (bedDetails &&
-              bedDetails.patient &&
-              bedDetails.patient.uuid === patientDetails.patientUuid),
-        })}
-      >
-        <div
-          className={classnames(styles.bedPillow, {
-            [bedPillowStyles]: bedPillowStyles,
-          })}
-        ></div>
-        <div style={{ display: "grid" }}>
-          <span className={styles.bedNumber}>
-            {bedDetails && bedDetails.bedNumber}
-          </span>
-          <span className={styles.bedNumber}>
-            {bedDetails &&
-            bedDetails.patient &&
-            bedDetails.patient.uuid === patientDetails.patientUuid
-              ? bedDetails.patient.identifiers[0].identifier
-              : ""}
-          </span>
-        </div>
-      </div>
-    </>
-  );
-};
-
-export default BedLayout;

package/src/bed-admission/bed-layout/bed-layout.scss

@@ -1,118 +0,0 @@
-@use '@carbon/type';
-@use '@carbon/colors';
-@use '@carbon/styles/scss/spacing';
-@import '~@openmrs/esm-styleguide/src/vars';
-
-.bedLayout {
-  position: relative;
-  margin: 20px;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 0 20px;
-  border-radius: 8px;
-  border: 1px solid #42be65;
-
-  .bedPillow {
-    background-color: #fff;
-    border-radius: 3rem;
-    border: 1px solid #42be65;
-  }
-
-  .bedNumber {
-    font-weight: bold;
-  }
-
-  &:hover {
-    cursor: pointer;
-  }
-}
-
-.bedLayoutSelected {
-  background-color: #42be65 !important;
-  color: #fff !important;
-  border: 5px solid #e4e1c9 !important;
-  opacity:1 !important;
-}
-
-;
-
-.bedInfoMain {
-  display: flex;
-  align-self: center;
-}
-
-.bedInfoContainer {
-  display: flex;
-  justify-content: flex-end;
-  padding-right: 4rem;
-  border-bottom: 1px solid #a8a8a8;
-}
-
-.bedInfoText {
-  align-self: center;
-}
-
-.disabled {
-  opacity: 0.8;
-  pointer-events: none;
-}
-
-.errorContainer {
-  width: 90%;
-  position: absolute;
-}
-
-.loadingContainer {
-  position: absolute;
-  margin: spacing.$spacing-02 spacing.$spacing-05 0;
-}
-
-.bed {
-  height: 60px;
-  width: 8rem;
-}
-
-.pillow {
-  width: 10px;
-  height: 40px;
-}
-
-.available {
-  background-color: #fff;
-  color: #525252;
-  opacity: 1;
-  pointer-events: auto;
-}
-
-.occupied {
-  background-color: #42be65;
-  color: #fff;
-  opacity: 0.5;
-  pointer-events: none;
-}
-
-.minOccupied {
-  height: 1.5rem;
-  width: 2.5rem;
-  color: #fff;
-  background-color: rgb(66, 190, 101);
-  padding: 0 6px;
-  border-radius: 5px;
-  pointer-events: none;
-}
-
-.minAvailable {
-  height: 1.5rem;
-  width: 2.5rem;
-  color: none;
-  background-color: #fff;
-  padding: 0 6px;
-  border-radius: 5px;
-  pointer-events: none;
-}
-
-.minPillow {
-  width: 7px;
-  height: 1rem;
-}

package/src/bed-admission/bed-layout/min-bed-layout.component.tsx

@@ -1,26 +0,0 @@
-import React from "react";
-import styles from "./bed-layout.scss";
-import BedLayout from "./bed-layout.component";
-
-const MinBedLayout: React.FC = () => {
-  return (
-    <div className={styles.bedInfoContainer}>
-      <div className={styles.bedInfoMain}>
-        <BedLayout
-          bedPillowStyles={styles.minPillow}
-          layOutStyles={styles.minOccupied}
-        />{" "}
-        <span className={styles.bedInfoText}>Occupied</span>
-      </div>
-      <div className={styles.bedInfoMain}>
-        <BedLayout
-          bedPillowStyles={styles.minPillow}
-          layOutStyles={styles.minAvailable}
-        />{" "}
-        <span className={styles.bedInfoText}>Available</span>
-      </div>
-    </div>
-  );
-};
-
-export default MinBedLayout;

package/src/bed-admission/createDashboardLink.tsx

@@ -1,47 +0,0 @@
-import React, { useMemo } from "react";
-import last from "lodash-es/last";
-import { BrowserRouter, useLocation } from "react-router-dom";
-import { ConfigurableLink } from "@openmrs/esm-framework";
-
-export interface LinkConfig {
-  name: string;
-  title: string;
-}
-
-function LinkExtension({ config }: { config: LinkConfig }) {
-  const { name, title } = config;
-  const location = useLocation();
-
-  let urlSegment = useMemo(
-    () => decodeURIComponent(last(location.pathname.split("/"))),
-    [location.pathname]
-  );
-
-  const isUUID = (value) => {
-    const regex =
-      /^[0-9a-fA-F]{8}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{4}\b-[0-9a-fA-F]{12}$/;
-    return regex.test(value);
-  };
-
-  if (isUUID(urlSegment)) {
-    urlSegment = "summary";
-  }
-
-  return (
-    <ConfigurableLink
-      to={`${window.getOpenmrsSpaBase()}home${name ? `/${name}` : ""}`}
-      className={`cds--side-nav__link ${
-        name === urlSegment && "active-left-nav-link"
-      }`}
-    >
-      {title}
-    </ConfigurableLink>
-  );
-}
-
-export const createDashboardLink = (config: LinkConfig) => () =>
-  (
-    <BrowserRouter>
-      <LinkExtension config={config} />
-    </BrowserRouter>
-  );

package/src/bed-admission/discharged-patients/discharged-patients.componet.tsx

@@ -1,19 +0,0 @@
-import React from "react";
-import ActivePatientsTable from "../active-patients/active-patients-table.component";
-interface DischargedPatientsListProps {
-  status: string;
-  setPatientCount: (value: number) => void;
-}
-
-const DischargedPatientsList: React.FC<DischargedPatientsListProps> = ({
-  status,
-  setPatientCount,
-}) => {
-  return (
-    <>
-      <ActivePatientsTable status={status} setPatientCount={setPatientCount} />
-    </>
-  );
-};
-
-export default DischargedPatientsList;

package/src/bed-admission/helpers/functions.ts

@@ -1,102 +0,0 @@
-import { OpenmrsResource } from "@openmrs/esm-framework";
-import last from "lodash-es/last";
-
-export type QueuePriority = "Emergency" | "Not Urgent" | "Priority" | "Urgent";
-export type MappedQueuePriority = Omit<QueuePriority, "Urgent">;
-
-export const getTagType = (priority: string) => {
-  switch (priority as MappedQueuePriority) {
-    case "Emergency":
-      return "red";
-    case "Not Urgent":
-      return "green";
-    default:
-      return "gray";
-  }
-};
-
-export const buildStatusString = (status: string) => {
-  if (!status) {
-    return "";
-  }
-  if (status === "pending") {
-    return `${status}`;
-  } else if (status === "picked") {
-    return `Attending`;
-  } else if (status === "completed") {
-    return `Finished`;
-  }
-};
-
-export const trimVisitNumber = (visitNumber: string) => {
-  if (!visitNumber) {
-    return;
-  }
-  return visitNumber.substring(15);
-};
-
-export const formatWaitTime = (waitTime: string, t) => {
-  const num = parseInt(waitTime);
-  const hours = num / 60;
-  const rhours = Math.floor(hours);
-  const minutes = (hours - rhours) * 60;
-  const rminutes = Math.round(minutes);
-  if (rhours > 0) {
-    return (
-      rhours +
-      " " +
-      `${t("hoursAnd", "hours and ")}` +
-      rminutes +
-      " " +
-      `${t("minutes", "minutes")}`
-    );
-  } else {
-    return rminutes + " " + `${t("minutes", "minutes")}`;
-  }
-};
-
-export const getTagColor = (waitTime: string) => {
-  const num = parseInt(waitTime);
-  if (num <= 30) {
-    return "green";
-  } else if (num > 30 && num <= 45) {
-    return "orange";
-  } else {
-    return "red";
-  }
-};
-
-export const getGender = (gender, t) => {
-  switch (gender) {
-    case "M":
-      return t("male", "Male");
-    case "F":
-      return t("female", "Female");
-    case "O":
-      return t("other", "Other");
-    case "U":
-      return t("unknown", "Unknown");
-    default:
-      return gender;
-  }
-};
-
-export function findObsByConceptUUID(
-  arr: Array<OpenmrsResource>,
-  ids: Array<string>
-) {
-  for (const visit of arr) {
-    return visit.obs.filter((o) => {
-      return ids.includes(o.concept.uuid);
-    });
-  }
-}
-
-export function timeDiffInMinutes(date1: Date, date2: Date) {
-  return Math.round((date1.getTime() - date2.getTime()) / (1000 * 3600 * 24));
-}
-
-export const getOriginFromPathName = (pathname = "") => {
-  const from = pathname.split("/");
-  return last(from);
-};