@kenyaemr/esm-bed-management-app 1.0.1-pre.4 → 8.1.1-pre.116

package/src/bed-admission/active-patients/styles.scss

@@ -1,284 +0,0 @@
-@use '@carbon/type';
-@use '@carbon/colors';
-@use '@carbon/styles/scss/spacing';
-@import '~@openmrs/esm-styleguide/src/vars';
-
-.container {
-  background-color: $ui-01;
-}
-
-.displayFlex {
-  display: flex;
-}
-
-.section {
-  border-right: 1px solid colors.$gray-20;
-}
-
-.activePatientsTable tr:last-of-type {
-  td {
-    border-bottom: none;
-  }
-}
-
-.headerContainer {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  background-color: $ui-background;
-}
-
-.headerButtons {
-  display: flex;
-  flex-flow: column;
-}
-
-.heading {
-  font-size: 20px;
-  font-weight: bold;
-}
-
-.filterContainer {
-  :global(.cds--dropdown__wrapper--inline) {
-    gap: 0;
-  }
-
-  :global(.cds--list-box__menu-icon) {
-    height: 1rem;
-  }
-
-  :global(.cds--dropdown--inline) :global(.cds--list-box__field) {
-    min-width: 12rem;
-  }
-}
-
-.tooltip :global(.cds--tooltip__trigger.cds--tooltip__trigger--definition) {
-  border-bottom: none;
-}
-
-.tag {
-  margin: 0.25rem 0;
-}
-
-.priorityTag {
-  @extend .tag;
-  @include type.type-style('label-01');
-  color: #943d00;
-  background-color: #ffc9a3;
-}
-
-.backgroundDataFetchingIndicator {
-  align-items: center;
-  display: flex;
-  flex: 1 1 0%;
-  justify-content: center;
-}
-
-.search {
-  max-width: 16rem;
-
-  input {
-    background-color: $ui-02 !important;
-  }
-}
-
-.tableContainer {
-  background-color: $ui-01;
-  margin: 0 spacing.$spacing-05;
-  padding: 0;
-
-  a {
-    text-decoration: none;
-  }
-
-  th {
-    color: $text-02;
-  }
-
-  :global(.cds--data-table) {
-    background-color: $ui-03;
-  }
-
-  :global(.cds--data-table-content) {
-    display: contents;
-  }
-
-  .toolbarContent {
-    height: spacing.$spacing-07;
-    margin-bottom: spacing.$spacing-02;
-  }
-}
-
-.emptyRow {
-  padding: 0 1rem;
-  display: flex;
-  align-items: center;
-}
-
-.activeVisitsTable tr:last-of-type {
-  td {
-    border-bottom: none;
-  }
-}
-
-.expandedActiveVisitRow {
-  :global(.cds--tab-content) {
-    padding: 0.5rem 0;
-  }
-
-  td {
-    padding: 0.5rem;
-
-    >div {
-      max-height: max-content !important;
-      background-color: $ui-02;
-    }
-  }
-
-  th[colspan] td[colspan]>div:first-child {
-    padding: 0 1rem;
-  }
-}
-
-.hiddenRow {
-  display: none;
-}
-
-.content {
-  @include type.type-style('heading-compact-02');
-  color: $text-02;
-  margin-bottom: 0.5rem;
-}
-
-.helper {
-  @include type.type-style('body-compact-01');
-  color: $text-02;
-}
-
-.separator {
-  @include type.type-style('body-compact-02');
-  color: $text-02;
-  width: 80%;
-  margin: 1.5rem auto;
-  overflow: hidden;
-  text-align: center;
-
-  &::before,
-  &::after {
-    background-color: $text-03;
-    content: '';
-    display: inline-block;
-    height: 1px;
-    position: relative;
-    vertical-align: middle;
-    width: 50%;
-  }
-
-  &::before {
-    right: 0.5rem;
-    margin-left: -50%;
-  }
-
-  &::after {
-    left: 0.5rem;
-    margin-right: -50%;
-  }
-}
-
-.tileContainer {
-  background-color: $ui-02;
-  border-top: 1px solid $ui-03;
-  padding: 5rem 0;
-}
-
-.tile {
-  margin: auto;
-  width: fit-content;
-}
-
-.tileContent {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
-
-.menuItem {
-  max-width: none;
-}
-
-.desktopHeading {
-  h4 {
-    @include type.type-style('heading-compact-02');
-    color: $text-02;
-  }
-}
-
-.tabletHeading {
-  h4 {
-    @include type.type-style('heading-03');
-    color: $text-02;
-  }
-}
-
-.desktopHeading,
-.tabletHeading {
-  text-align: left;
-  text-transform: capitalize;
-  margin-bottom: spacing.$spacing-05;
-
-  h4:after {
-    content: '';
-    display: block;
-    width: 2rem;
-    padding-top: 3px;
-    border-bottom: 0.375rem solid var(--brand-03);
-  }
-}
-
-.statusContainer {
-  display: flex;
-  align-items: center;
-
-  svg {
-    margin-right: 0.5rem;
-  }
-}
-
-.visitType {
-  @include type.type-style('heading-compact-02');
-}
-
-.headerBtnContainer {
-  background-color: $ui-background;
-  text-align: right;
-}
-
-.addPatientToListBtn {
-  margin-left: spacing.$spacing-05;
-  height: spacing.$spacing-09;
-}
-
-.editIcon {
-  color: $interactive-01;
-  margin-top: 0.5rem;
-  cursor: pointer;
-}
-
-.expandedLabQueueVisitRow {
-  :global(.cds--tab-content) {
-    padding: 0.5rem 0;
-  }
-
-  td {
-    padding: 0.5rem;
-
-    >div {
-      max-height: max-content !important;
-      background-color: $ui-02;
-    }
-  }
-
-  th[colspan] td[colspan]>div:first-child {
-    padding: 0 1rem;
-  }
-}

package/src/bed-admission/active-patients/view-action-menu.component.tsx

@@ -1,33 +0,0 @@
-import { Button, Tooltip } from "@carbon/react";
-import { Dashboard } from "@carbon/react/icons";
-import React, { AnchorHTMLAttributes } from "react";
-import { useTranslation } from "react-i18next";
-import { interpolateUrl, navigate } from "@openmrs/esm-framework";
-
-interface NameLinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
-  to: string;
-  from: string;
-}
-
-const ViewActionsMenu: React.FC<NameLinkProps> = ({ from, to }) => {
-  const { t } = useTranslation();
-
-  const handleNameClick = (event: MouseEvent, to: string) => {
-    event.preventDefault();
-    navigate({ to });
-    localStorage.setItem("fromPage", from);
-  };
-
-  return (
-    <Tooltip align="bottom" label="View Patient">
-      <Button
-        kind="ghost"
-        onClick={(e) => handleNameClick(e, to)}
-        href={interpolateUrl(to)}
-        iconDescription={t("viewPatient", "View Patient")}
-        renderIcon={(props) => <Dashboard size={16} {...props} />}
-      />
-    </Tooltip>
-  );
-};
-export default ViewActionsMenu;

package/src/bed-admission/admitted-patients/active-admissions.resource.ts

@@ -1,121 +0,0 @@
-import { useEffect } from "react";
-import useSWRInfinite from "swr/infinite";
-import dayjs from "dayjs";
-import isToday from "dayjs/plugin/isToday";
-import last from "lodash-es/last";
-import {
-  openmrsFetch,
-  useSession,
-  type FetchResponse,
-} from "@openmrs/esm-framework";
-import { AdmissionLocation } from "../../types";
-
-dayjs.extend(isToday);
-
-interface VisitResponse {
-  results: Array<AdmissionLocation>;
-  links: Array<{ rel: "prev" | "next" }>;
-  totalCount: number;
-}
-
-export interface BedPatientAssignment {
-  patientUuid: string;
-  age: number;
-  gender: string;
-  patientName: string;
-  ward: string;
-  bedNumber: string;
-}
-export function useActiveAdmissions() {
-  const session = useSession();
-  const sessionLocation = session?.sessionLocation?.uuid;
-
-  const getUrl = (
-    pageIndex,
-    previousPageData: FetchResponse<VisitResponse>
-  ) => {
-    if (
-      pageIndex &&
-      !previousPageData?.data?.links?.some((link) => link.rel === "next")
-    ) {
-      return null;
-    }
-
-    const url = `/ws/rest/v1/admissionLocation?v=full`;
-    const urlSearchParams = new URLSearchParams();
-
-    if (pageIndex) {
-      urlSearchParams.append("startIndex", `${pageIndex * 50}`);
-    }
-
-    return url + urlSearchParams.toString();
-  };
-
-  const {
-    data,
-    error,
-    isLoading,
-    isValidating,
-    size: pageNumber,
-    setSize,
-    mutate,
-  } = useSWRInfinite<FetchResponse<VisitResponse>, Error>(
-    sessionLocation ? getUrl : null,
-    openmrsFetch
-  );
-
-  useEffect(() => {
-    if (
-      data &&
-      data?.[pageNumber - 1]?.data?.links?.some((link) => link.rel === "next")
-    ) {
-      setSize((currentSize) => currentSize + 1);
-    }
-  }, [data, pageNumber]);
-
-  const formattedActiveVisits: any = (data: FetchResponse<VisitResponse>) => {
-    const result = data
-      ? data[0].data?.results?.map((wardEntry) => {
-          return wardEntry.bedLayouts;
-        })
-      : [];
-
-    const allBeds = [];
-
-    result?.forEach((elemnt) => {
-      elemnt.forEach((b) => {
-        allBeds.push(b);
-      });
-    });
-    const finalFinalList = allBeds
-      ?.filter((b) => b.status === "OCCUPIED")
-      .map((bedEntry) => {
-        const patient: BedPatientAssignment = {
-          patientUuid: bedEntry.patient.uuid,
-          age: bedEntry.patient.person.age,
-          gender: bedEntry.patient.person.gender,
-          patientName: bedEntry.patient.person.preferredName.givenName
-            .concat(" ")
-            .concat(bedEntry.patient.person.preferredName.familyName),
-          ward: bedEntry.location,
-          bedNumber: bedEntry.bedNumber,
-        };
-        return patient;
-      });
-    return finalFinalList;
-  };
-
-  return {
-    patientQueueEntries: formattedActiveVisits(data),
-    isError: error,
-    isLoading,
-    isValidating,
-    patientQueueCount: data?.[0]?.data?.totalCount ?? 0,
-    mutate,
-  };
-}
-
-export const getOriginFromPathName = (pathname = "") => {
-  const from = pathname.split("/");
-  return last(from);
-};

package/src/bed-admission/admitted-patients/admitted-patients-table.component.tsx

@@ -1,280 +0,0 @@
-import {
-  DataTable,
-  DataTableSkeleton,
-  DefinitionTooltip,
-  Pagination,
-  Table,
-  TableBody,
-  TableCell,
-  TableContainer,
-  TableHead,
-  TableHeader,
-  TableRow,
-  Tag,
-  Layer,
-  TableToolbar,
-  TableToolbarContent,
-  TableToolbarSearch,
-  TableExpandedRow,
-  TableExpandHeader,
-  TableExpandRow,
-} from "@carbon/react";
-
-import {
-  isDesktop,
-  useConfig,
-  useLayoutType,
-  usePagination,
-  useSession,
-} from "@openmrs/esm-framework";
-import React, { useCallback, useMemo, useState } from "react";
-import { useTranslation } from "react-i18next";
-import { getOriginFromPathName } from "../helpers/functions";
-import styles from "../active-patients/styles.scss";
-import { useActiveAdmissions } from "./active-admissions.resource";
-import EmptyState from "../../empty-state/empty-state.component";
-import { patientDetailsProps } from "../types";
-
-interface ActiveVisitsTableProps {
-  status: string;
-  setPatientCount?: (value: number) => void;
-}
-
-const AdmittedPatientsTable: React.FC<ActiveVisitsTableProps> = ({
-  status,
-  setPatientCount,
-}) => {
-  const { t } = useTranslation();
-  const session = useSession();
-  const currentPathName: string = window.location.pathname;
-  const fromPage: string = getOriginFromPathName(currentPathName);
-  const pageSizes = [10, 20, 30, 40, 50];
-  const [currentPageSize, setPageSize] = useState(10);
-  const [showOverlay, setShowOverlay] = useState(false);
-  const [selectedPatientDetails, setSelectedPatientDetails] =
-    useState<patientDetailsProps>();
-
-  const layout = useLayoutType();
-
-  const { patientQueueEntries, isLoading } = useActiveAdmissions();
-  const { restrictWardAdministrationToLoginLocation } = useConfig();
-
-  const handleBedAssigmentModal = useCallback(
-    (entry) => {
-      setSelectedPatientDetails({
-        name: entry.name,
-        patientUuid: entry.patientUuid,
-        encounter: entry.encounter,
-        locationUuid: session?.sessionLocation?.uuid,
-        locationTo: entry.locationTo,
-        locationFrom: entry.locationFrom,
-        queueUuid: entry.uuid,
-      });
-      setShowOverlay(true);
-    },
-    [session?.sessionLocation?.uuid]
-  );
-
-  const renderActionButton = useCallback(
-    (entry) => {
-      const buttonTexts = {
-        pending: "Assign Bed",
-        completed: "Transfer",
-      };
-      const buttonText = buttonTexts[status] || "Un-assign";
-
-      // return (
-      //   <AdmissionActionButton
-      //     entry={entry}
-      //     handleBedAssigmentModal={handleBedAssigmentModal}
-      //     buttonText={buttonText}
-      //   />
-      // );
-    },
-    [handleBedAssigmentModal, status]
-  );
-
-  const {
-    goTo,
-    results: paginatedQueueEntries,
-    currentPage,
-  } = usePagination(patientQueueEntries, currentPageSize);
-
-  const tableHeaders = useMemo(
-    () => [
-      {
-        id: 0,
-        header: t("name", "Name"),
-        key: "patientName",
-      },
-      {
-        id: 1,
-        header: t("age", "Age"),
-        key: "age",
-      },
-      {
-        id: 2,
-        header: t("gender", "Gender"),
-        key: "gender",
-      },
-      {
-        id: 3,
-        header: t("ward", "Ward"),
-        key: "ward",
-      },
-      {
-        id: 4,
-        header: t("bedNumber", "Bed Number"),
-        key: "bedNumber",
-      },
-      {
-        id: 5,
-        header: t("actions", "Action"),
-        key: "actions",
-      },
-    ],
-    [t]
-  );
-
-  const tableRows = useMemo(() => {
-    return paginatedQueueEntries?.map((entry: any, index) => ({
-      ...(entry as object),
-      id: `${entry?.patientUuid}`,
-      actions: {
-        content: (
-          <div className={styles.displayFlex}>
-            {/* {renderActionButton(entry)} */}
-          </div>
-        ),
-      },
-    }));
-  }, [paginatedQueueEntries, status, t, renderActionButton, fromPage]);
-
-  if (isLoading) {
-    return <DataTableSkeleton role="progressbar" />;
-  }
-
-  if (
-    (!isLoading && patientQueueEntries && status === "pending") ||
-    status === "completed" ||
-    status === ""
-  ) {
-    setPatientCount(patientQueueEntries.length);
-  }
-
-  if (patientQueueEntries?.length) {
-    return (
-      <div className={styles.container}>
-        <div className={styles.headerBtnContainer}></div>
-
-        <DataTable
-          data-floating-menu-container
-          headers={tableHeaders}
-          overflowMenuOnHover={isDesktop(layout) ? true : false}
-          rows={tableRows}
-          isSortable
-          size="xs"
-          useZebraStyles
-        >
-          {({ rows, headers, getTableProps, getRowProps, onInputChange }) => (
-            <TableContainer className={styles.tableContainer}>
-              <TableToolbar
-                style={{
-                  position: "static",
-                  height: "3rem",
-                  overflow: "visible",
-                  backgroundColor: "color",
-                }}
-              >
-                <TableToolbarContent className={styles.toolbarContent}>
-                  <Layer>
-                    <TableToolbarSearch
-                      className={styles.search}
-                      onChange={onInputChange}
-                      placeholder={t("searchThisList", "Search this list")}
-                      size="sm"
-                    />
-                  </Layer>
-                </TableToolbarContent>
-              </TableToolbar>
-              <Table {...getTableProps()} className={styles.activeVisitsTable}>
-                <TableHead>
-                  <TableRow>
-                    <TableExpandHeader />
-                    {headers.map((header) => (
-                      <TableHeader>
-                        {header.header?.content ?? header.header}
-                      </TableHeader>
-                    ))}
-                  </TableRow>
-                </TableHead>
-                <TableBody>
-                  {rows.map((row, index) => {
-                    return (
-                      <>
-                        <TableExpandRow {...getRowProps({ row })} key={row.id}>
-                          {row.cells.map((cell) => (
-                            <TableCell key={cell.id}>
-                              {cell.value?.content ?? cell.value}
-                            </TableCell>
-                          ))}
-                        </TableExpandRow>
-
-                        {row.isExpanded ? (
-                          <TableExpandedRow
-                            className={styles.expandedLabQueueVisitRow}
-                            colSpan={headers.length + 2}
-                          ></TableExpandedRow>
-                        ) : (
-                          <TableExpandedRow
-                            className={styles.hiddenRow}
-                            colSpan={headers.length + 2}
-                          />
-                        )}
-                      </>
-                    );
-                  })}
-                </TableBody>
-              </Table>
-              <Pagination
-                forwardText="Next page"
-                backwardText="Previous page"
-                page={currentPage}
-                pageSize={currentPageSize}
-                pageSizes={pageSizes}
-                totalItems={patientQueueEntries?.length}
-                className={styles.pagination}
-                onChange={({ pageSize, page }) => {
-                  if (pageSize !== currentPageSize) {
-                    setPageSize(pageSize);
-                  }
-                  if (page !== currentPage) {
-                    goTo(page);
-                  }
-                }}
-              />
-            </TableContainer>
-          )}
-        </DataTable>
-        {/* {showOverlay && (
-          <AssignBedWorkSpace
-            patientDetails={selectedPatientDetails}
-            closePanel={() => setShowOverlay(false)}
-            queueStatus={status}
-            headerTitle={t(
-              "assignBedToPatient",
-              restrictWardAdministrationToLoginLocation === true
-                ? `Assign Bed to Patient  ${selectedPatientDetails.name} in the ${session?.sessionLocation?.display} Ward`
-                : `Assign Bed to Patient  ${selectedPatientDetails.name}`
-            )}
-          />
-        )} */}
-      </div>
-    );
-  }
-
-  return (
-    <EmptyState msg={t("noQueueItems", "No admissions to display")} helper="" />
-  );
-};
-export default AdmittedPatientsTable;