(fix) O3-4167 Ward App - separate 'Bed Swap' and 'Transfer' into 2 se…

packages/esm-ward-app/src/action-menu-buttons/assign-bed-workspace-siderail.component.tsx

@@ -0,0 +1,22 @@
+import { ActionMenuButton, HospitalBedIcon, launchWorkspace, useFeatureFlag } from '@openmrs/esm-framework';
+import React from 'react';
+import { useTranslation } from 'react-i18next';
+
+export default function AssignBedSiderailIcon() {
+  const { t } = useTranslation();
+  const isBedManagementModuleInstalled = useFeatureFlag('bedmanagement-module');
+  const handler = () => {
+    launchWorkspace('bed-assignment-workspace');
+  };
+  return isBedManagementModuleInstalled ? (
+    <ActionMenuButton
+      getIcon={(props) => <HospitalBedIcon {...props} />}
+      label={t('assignBed', 'Assign bed')}
+      iconDescription={t('assignBed', 'Assign Bed')}
+      handler={handler}
+      type="assign-bed-form"
+    />
+  ) : (
+    <></>
+  );
+}

packages/esm-ward-app/src/action-menu-buttons/transfer-workspace-siderail.component.tsx

@@ -1,27 +1,21 @@
-import {
-  ActionMenuButton,
-  getGlobalStore,
-  launchWorkspace,
-  MovementIcon,
-  type DefaultWorkspaceProps,
-} from '@openmrs/esm-framework';
+import { ActionMenuButton, launchWorkspace, MovementIcon, type DefaultWorkspaceProps } from '@openmrs/esm-framework';
 import React from 'react';
 import { useTranslation } from 'react-i18next';
 
-interface PatientTransferAndSwapSiderailIconProps extends DefaultWorkspaceProps {}
+interface PatientTransferSiderailIconProps extends DefaultWorkspaceProps {}
 
-export default function PatientTransferAndSwapSiderailIcon(additionalProps: PatientTransferAndSwapSiderailIconProps) {
+export default function PatientTransferSiderailIcon(additionalProps: PatientTransferSiderailIconProps) {
   const { t } = useTranslation();
   const handler = () => {
-    launchWorkspace('patient-transfer-swap-workspace');
+    launchWorkspace('patient-transfer-workspace');
   };
   return (
     <ActionMenuButton
       getIcon={(props) => <MovementIcon {...props} />}
       label={t('transfers', 'Transfers')}
       iconDescription={t('transfers', 'Transfers')}
       handler={handler}
-      type="transfer-swap-bed-form"
+      type="transfer-form"
     />
   );
 }

packages/esm-ward-app/src/index.ts

@@ -55,8 +55,8 @@ export const wardPatientNotesActionButtonExtension = getAsyncLifecycle(
 );
 
 // t('transfers', 'Transfers')
-export const patientTransferAndSwapWorkspace = getAsyncLifecycle(
-  () => import('./ward-workspace/patient-transfer-bed-swap/patient-transfer-swap.workspace'),
+export const patientTransferWorkspace = getAsyncLifecycle(
+  () => import('./ward-workspace/patient-transfer/patient-transfer.workspace'),
   options,
 );
 
@@ -66,7 +66,7 @@ export const patientDischargeWorkspace = getAsyncLifecycle(
   options,
 );
 
-export const patientTransferAndSwapWorkspaceSiderailIcon = getAsyncLifecycle(
+export const patientTransferWorkspaceSiderailIcon = getAsyncLifecycle(
   () => import('./action-menu-buttons/transfer-workspace-siderail.component'),
   options,
 );
@@ -77,6 +77,12 @@ export const patientTransferRequestWorkspace = getAsyncLifecycle(
   options,
 );
 
+// t('assignBed', 'Assign bed')
+export const assignBedWorkspace = getAsyncLifecycle(
+  () => import('./ward-workspace/assign-bed-workspace/assign-bed.workspace'),
+  options,
+);
+
 export const patientDischargeWorkspaceSideRailIcon = getAsyncLifecycle(
   () => import('./action-menu-buttons/discharge-workspace-siderail.component'),
   options,
@@ -101,6 +107,10 @@ export const maternalWardView = getAsyncLifecycle(
   () => import('./ward-view/materal-ward/maternal-ward-view.component'),
   options,
 );
+export const assignBedWorkspaceSideRailIcon = getAsyncLifecycle(
+  () => import('./action-menu-buttons/assign-bed-workspace-siderail.component'),
+  options,
+);
 
 export function startupApp() {
   registerBreadcrumbs([]);

packages/esm-ward-app/src/routes.json

@@ -48,7 +48,12 @@
     {
       "name": "transfer-swap-patient-siderail-button",
       "slot": "action-menu-ward-patient-items-slot",
-      "component": "patientTransferAndSwapWorkspaceSiderailIcon"
+      "component": "patientTransferWorkspaceSiderailIcon"
+    },
+    {
+      "name": "assign-bed-workspace-siderail-button",
+      "component": "assignBedWorkspaceSideRailIcon",
+      "slot": "action-menu-ward-patient-items-slot"
     },
     {
       "name": "patient-discharge-siderail-button",
@@ -102,10 +107,10 @@
       "sidebarFamily": "ward-patient"
     },
     {
-      "name": "patient-transfer-swap-workspace",
-      "component": "patientTransferAndSwapWorkspace",
+      "name": "patient-transfer-workspace",
+      "component": "patientTransferWorkspace",
       "title": "transfers",
-      "type": "transfer-swap-bed-form",
+      "type": "transfer-form",
       "hasOwnSidebar": true,
       "sidebarFamily": "ward-patient"
     },
@@ -131,6 +136,14 @@
       "hasOwnSidebar": true,
       "sidebarFamily": "ward-patient",
       "width": "wider"
+    },
+    {
+      "name": "bed-assignment-workspace",
+      "component": "assignBedWorkspace",
+      "title": "assignBed",
+      "type": "ward-patient-discharge",
+      "hasOwnSidebar": true,
+      "sidebarFamily": "ward-patient"
     }
   ]
 }

packages/esm-ward-app/src/ward-workspace/patient-transfer-bed-swap/patient-bed-swap-form.component.tsx → packages/esm-ward-app/src/ward-workspace/assign-bed-workspace/assign-bed-form.component.tsx

@@ -8,10 +8,10 @@ import { useTranslation } from 'react-i18next';
 import { z } from 'zod';
 import useEmrConfiguration from '../../hooks/useEmrConfiguration';
 import useWardLocation from '../../hooks/useWardLocation';
-import type { BedLayout, WardPatientWorkspaceProps, WardViewContext } from '../../types';
+import type { WardPatientWorkspaceProps, WardViewContext } from '../../types';
 import { assignPatientToBed, createEncounter, removePatientFromBed } from '../../ward.resource';
 import BedSelector from '../bed-selector.component';
-import styles from './patient-transfer-swap.scss';
+import styles from './assign-bed-form.scss';
 
 export default function PatientBedSwapForm({
   promptBeforeClosing,
@@ -52,15 +52,6 @@ export default function PatientBedSwapForm({
     return () => promptBeforeClosing(null);
   }, [isDirty]);
 
-  const getBedInformation = useCallback(
-    (bed: BedLayout) => {
-      const patients = bed.patients.map((bedPatient) => bedPatient?.person?.preferredName?.display);
-      const bedNumber = bed.bedNumber;
-      return [bedNumber, ...(patients.length ? patients : [t('empty', 'Empty')])].join(' · ');
-    },
-    [t],
-  );
-
   const beds = wardPatientGroupDetails?.bedLayouts ?? [];
 
   const onSubmit = useCallback(

packages/esm-ward-app/src/ward-workspace/patient-transfer-bed-swap/patient-transfer-swap.scss → packages/esm-ward-app/src/ward-workspace/assign-bed-workspace/assign-bed-form.scss

@@ -17,10 +17,6 @@
   color: #393939;
 }
 
-.contentSwitcherWrapper {
-  padding: 0 layout.$spacing-05;
-}
-
 .patientWorkspaceBanner {
   margin-bottom: layout.$spacing-05;
 }

packages/esm-ward-app/src/ward-workspace/assign-bed-workspace/assign-bed.workspace.tsx

@@ -0,0 +1,18 @@
+import React from 'react';
+import type { WardPatientWorkspaceProps } from '../../types';
+import WardPatientWorkspaceBanner from '../patient-banner/patient-banner.component';
+import PatientBedSwapForm from './assign-bed-form.component';
+import styles from './assign-bed-form.scss';
+
+export default function PatientTransferWorkspace(props: WardPatientWorkspaceProps) {
+  const { wardPatient } = props;
+
+  return (
+    <div className={styles.flexWrapper}>
+      <div className={styles.patientWorkspaceBanner}>
+        <WardPatientWorkspaceBanner wardPatient={props?.wardPatient} />
+      </div>
+      <div className={styles.workspaceForm}>{wardPatient && <PatientBedSwapForm {...props} />}</div>
+    </div>
+  );
+}

packages/esm-ward-app/src/ward-workspace/patient-transfer-request-workspace/patient-transfer-request.workspace.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import PatientTransferForm from '../patient-transfer-bed-swap/patient-transfer-request-form.component';
+import PatientTransferForm from '../patient-transfer/patient-transfer-request-form.component';
 import { type WardPatientWorkspaceProps } from '../../types';
 
 interface PatientTransferRequestFormProps extends WardPatientWorkspaceProps {}

packages/esm-ward-app/src/ward-workspace/patient-transfer-bed-swap/patient-transfer-request-form.component.tsx → packages/esm-ward-app/src/ward-workspace/patient-transfer/patient-transfer-request-form.component.tsx

@@ -11,7 +11,7 @@ import useWardLocation from '../../hooks/useWardLocation';
 import LocationSelector from '../../location-selector/location-selector.component';
 import type { ObsPayload, WardPatientWorkspaceProps, WardViewContext } from '../../types';
 import { createEncounter } from '../../ward.resource';
-import styles from './patient-transfer-swap.scss';
+import styles from './patient-transfer.scss';
 
 export default function PatientTransferForm({
   closeWorkspaceWithSavedChanges,

packages/esm-ward-app/src/ward-workspace/patient-transfer/patient-transfer.scss

@@ -0,0 +1,79 @@
+@use '@carbon/type';
+@use '@carbon/layout';
+@use '@openmrs/esm-styleguide/src/vars' as *;
+
+.flexWrapper {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  color: #393939;
+}
+
+.workspaceContent {
+  padding: layout.$spacing-05;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  color: #393939;
+}
+
+.patientWorkspaceBanner {
+  margin-bottom: layout.$spacing-05;
+}
+
+.field {
+  margin-bottom: layout.$spacing-05;
+  & > h2 {
+    margin-bottom: layout.$spacing-03;
+  }
+}
+
+.contentSwitcher {
+  margin-top: layout.$spacing-03;
+}
+
+.workspaceForm {
+  flex: 1;
+}
+
+.productiveHeading02 {
+  @include type.type-style('heading-compact-02');
+}
+
+.formContainer {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  height: 100%;
+}
+
+.buttonSet {
+  display: flex;
+  align-items: center;
+  margin: 0 (-(layout.$spacing-05)) (-(layout.$spacing-05)) (-(layout.$spacing-05));
+
+  button {
+    max-width: unset !important;
+    width: 50% !important;
+
+    > svg {
+      fill: currentColor !important;
+    }
+  }
+}
+
+.radioButtonGroup {
+  margin-top: layout.$spacing-03;
+  fieldset {
+    flex-direction: column;
+    align-items: flex-start;
+
+    :global(.cds--radio-button-wrapper) {
+      margin-bottom: layout.$spacing-04;
+    }
+  }
+}
+
+.notifications {
+  margin-top: layout.$spacing-05;
+}

packages/esm-ward-app/src/ward-workspace/patient-transfer/patient-transfer.workspace.tsx

@@ -0,0 +1,18 @@
+import React from 'react';
+import type { WardPatientWorkspaceProps } from '../../types';
+import WardPatientWorkspaceBanner from '../patient-banner/patient-banner.component';
+import PatientTransferForm from './patient-transfer-request-form.component';
+import styles from './patient-transfer.scss';
+
+export default function PatientTransferWorkspace(props: WardPatientWorkspaceProps) {
+  const { wardPatient } = props;
+
+  return (
+    <div className={styles.flexWrapper}>
+      <div className={styles.patientWorkspaceBanner}>
+        <WardPatientWorkspaceBanner wardPatient={wardPatient} />
+      </div>
+      <div className={styles.workspaceForm}>{wardPatient && <PatientTransferForm {...props} />}</div>
+    </div>
+  );
+}

packages/esm-ward-app/translations/en.json

@@ -5,8 +5,8 @@
   "admit": "Admit",
   "admitPatient": "Admit patient",
   "admitting": "Admitting...",
+  "assignBed": "Assign bed",
   "bedShare": "Bed share",
-  "bedSwap": "Bed swap",
   "cancel": "Cancel",
   "capacity": "Capacity",
   "capacityMetricValue": "{{ metricValue }} %",
@@ -16,7 +16,6 @@
   "countItems_one": "{{count}} {{item}}",
   "countItems_other": "{{count}} {{item}}",
   "discharge": "Discharge",
-  "empty": "Empty",
   "emptyBed": "Empty bed",
   "emptyText": "Empty",
   "encounterDisplay": "{{encounterType}} {{encounterDate}}",
@@ -83,12 +82,10 @@
   "showingLocations_one": "{{start}}-{{end}} of {{count}} locations",
   "showingLocations_other": "{{start}}-{{end}} of {{count}} locations",
   "somePartsOfTheFormDidntLoad": "Some parts of the form didn't load",
-  "transfer": "Transfer",
   "transferElsewhere": "Transfer elsewhere",
   "transferRequest": "Transfer request",
   "transfers": "Transfers",
   "transferType": "Transfer type",
-  "typeOfTransfer": "Type of transfer",
   "unknown": "Unknown",
   "visitNoteSaved": "Patient note saved",
   "wardClinicalNotePlaceholder": "Write any notes here",