@openmrs/esm-patient-orders-app 11.3.1-pre.9452 → 11.3.1-pre.9455

package/src/order-basket/general-order-type/{general-order-type.component.tsx → general-order-panel.component.tsx}

@@ -1,15 +1,7 @@
 import React, { type ComponentProps, useCallback, useEffect, useMemo, useState } from 'react';
 import { Button, Tile } from '@carbon/react';
 import classNames from 'classnames';
-import {
-  AddIcon,
-  ChevronDownIcon,
-  ChevronUpIcon,
-  type DefaultWorkspaceProps,
-  MaybeIcon,
-  useLayoutType,
-  launchWorkspace,
-} from '@openmrs/esm-framework';
+import { AddIcon, ChevronDownIcon, ChevronUpIcon, MaybeIcon, useLayoutType } from '@openmrs/esm-framework';
 import { useTranslation } from 'react-i18next';
 import { type OrderBasketItem, useOrderBasket, useOrderType } from '@openmrs/esm-patient-common-lib';
 import { type OrderTypeDefinition } from '../../config-schema';
@@ -18,11 +10,24 @@ import OrderBasketItemTile from './order-basket-item-tile.component';
 import styles from './general-order-panel.scss';
 
 interface GeneralOrderTypeProps extends OrderTypeDefinition {
-  closeWorkspace: DefaultWorkspaceProps['closeWorkspace'];
   patient: fhir.Patient;
+  orderTypeUuid: string;
+  launchGeneralOrderForm(orderTypeUuid: string, order?: OrderBasketItem): void;
 }
 
-const GeneralOrderType: React.FC<GeneralOrderTypeProps> = ({ patient, orderTypeUuid, closeWorkspace, label, icon }) => {
+/**
+ * The extension is slotted into order-basket-slot in the main Order Basket workspace by default.
+ * It renders the "Add +" button for general orders, and lists pending general orders in the order basket.
+ *
+ * Designs: https://app.zeplin.io/project/60d59321e8100b0324762e05/screen/62c6bb9500e7671a618efa56
+ */
+const GeneralOrderPanel: React.FC<GeneralOrderTypeProps> = ({
+  patient,
+  orderTypeUuid,
+  label,
+  icon,
+  launchGeneralOrderForm,
+}) => {
   const { t } = useTranslation();
   const isTablet = useLayoutType() === 'tablet';
   const { orderType, isLoadingOrderType } = useOrderType(orderTypeUuid);
@@ -65,29 +70,6 @@ const GeneralOrderType: React.FC<GeneralOrderTypeProps> = ({ patient, orderTypeU
     };
   }, [orders]);
 
-  const openConceptSearch = () => {
-    closeWorkspace({
-      ignoreChanges: true,
-      onWorkspaceClose: () =>
-        launchWorkspace('orderable-concept-workspace', {
-          orderTypeUuid,
-        }),
-      closeWorkspaceGroup: false,
-    });
-  };
-
-  const openOrderForm = (order: OrderBasketItem) => {
-    closeWorkspace({
-      ignoreChanges: true,
-      onWorkspaceClose: () =>
-        launchWorkspace('orderable-concept-workspace', {
-          order,
-          orderTypeUuid,
-        }),
-      closeWorkspaceGroup: false,
-    });
-  };
-
   const removeOrder = useCallback(
     (order: OrderBasketItem) => {
       const newOrders = [...orders];
@@ -120,7 +102,7 @@ const GeneralOrderType: React.FC<GeneralOrderTypeProps> = ({ patient, orderTypeU
             kind="ghost"
             renderIcon={(props: ComponentProps<typeof AddIcon>) => <AddIcon size={16} {...props} />}
             iconDescription={t('addMedication', 'Add medication')}
-            onClick={openConceptSearch}
+            onClick={() => launchGeneralOrderForm(orderTypeUuid)}
             size={isTablet ? 'md' : 'sm'}
           >
             {t('add', 'Add')}
@@ -148,7 +130,7 @@ const GeneralOrderType: React.FC<GeneralOrderTypeProps> = ({ patient, orderTypeU
                 <OrderBasketItemTile
                   key={`incomplete-${order.action}-${order.concept?.uuid}-${index}`}
                   orderBasketItem={order}
-                  onItemClick={() => openOrderForm(order)}
+                  onItemClick={() => launchGeneralOrderForm(orderTypeUuid, order)}
                   onRemoveClick={() => removeOrder(order)}
                 />
               ))}
@@ -160,7 +142,7 @@ const GeneralOrderType: React.FC<GeneralOrderTypeProps> = ({ patient, orderTypeU
                 <OrderBasketItemTile
                   key={`new-${order.action}-${order.concept?.uuid}-${index}`}
                   orderBasketItem={order}
-                  onItemClick={() => openOrderForm(order)}
+                  onItemClick={() => launchGeneralOrderForm(orderTypeUuid, order)}
                   onRemoveClick={() => removeOrder(order)}
                 />
               ))}
@@ -173,7 +155,7 @@ const GeneralOrderType: React.FC<GeneralOrderTypeProps> = ({ patient, orderTypeU
                 <OrderBasketItemTile
                   key={`renewed-${item.action}-${item.concept?.uuid}-${index}`}
                   orderBasketItem={item}
-                  onItemClick={() => openOrderForm(item)}
+                  onItemClick={() => launchGeneralOrderForm(orderTypeUuid, item)}
                   onRemoveClick={() => removeOrder(item)}
                 />
               ))}
@@ -186,7 +168,7 @@ const GeneralOrderType: React.FC<GeneralOrderTypeProps> = ({ patient, orderTypeU
                 <OrderBasketItemTile
                   key={`revised-${item.action}-${item.concept?.uuid}-${index}`}
                   orderBasketItem={item}
-                  onItemClick={() => openOrderForm(item)}
+                  onItemClick={() => launchGeneralOrderForm(orderTypeUuid, item)}
                   onRemoveClick={() => removeOrder(item)}
                 />
               ))}
@@ -199,7 +181,7 @@ const GeneralOrderType: React.FC<GeneralOrderTypeProps> = ({ patient, orderTypeU
                 <OrderBasketItemTile
                   key={`discontinued-${item.action}-${item.concept?.uuid}-${index}`}
                   orderBasketItem={item}
-                  onItemClick={() => openOrderForm(item)}
+                  onItemClick={() => launchGeneralOrderForm(orderTypeUuid, item)}
                   onRemoveClick={() => removeOrder(item)}
                 />
               ))}
@@ -211,4 +193,4 @@ const GeneralOrderType: React.FC<GeneralOrderTypeProps> = ({ patient, orderTypeU
   );
 };
 
-export default GeneralOrderType;
+export default GeneralOrderPanel;

package/src/order-basket/general-order-type/resources.ts

@@ -1,4 +1,4 @@
-import { toOmrsIsoString } from '@openmrs/esm-framework';
+import { toOmrsIsoString, type Visit } from '@openmrs/esm-framework';
 import {
   type OrderBasketItem,
   priorityOptions,
@@ -7,13 +7,14 @@ import {
   type OrderableConcept,
 } from '@openmrs/esm-patient-common-lib';
 
-export function createEmptyOrder(concept: OrderableConcept, orderer: string): OrderBasketItem {
+export function createEmptyOrder(concept: OrderableConcept, orderer: string, visit: Visit): OrderBasketItem {
   return {
     action: 'NEW',
     urgency: priorityOptions[0].value as OrderUrgency,
     display: concept.display,
     concept,
     orderer,
+    visit,
   };
 }
 

package/src/order-basket/order-basket.component.tsx

@@ -0,0 +1,213 @@
+import React, { useCallback, useMemo, useState } from 'react';
+import classNames from 'classnames';
+import { useTranslation } from 'react-i18next';
+import { Button, ButtonSet, InlineLoading, InlineNotification } from '@carbon/react';
+import {
+  ExtensionSlot,
+  useConfig,
+  useLayoutType,
+  useSession,
+  type Visit,
+  Workspace2,
+  type Workspace2DefinitionProps,
+} from '@openmrs/esm-framework';
+import {
+  invalidateVisitAndEncounterData,
+  type OrderBasketExtensionProps,
+  type OrderBasketItem,
+  postOrders,
+  postOrdersOnNewEncounter,
+  showOrderSuccessToast,
+  useMutatePatientOrders,
+  useOrderBasket,
+} from '@openmrs/esm-patient-common-lib';
+import { useSWRConfig } from 'swr';
+import { type ConfigObject } from '../config-schema';
+import { useOrderEncounter } from '../api/api';
+import GeneralOrderPanel from './general-order-type/general-order-panel.component';
+import styles from './order-basket.scss';
+
+interface OrderBasketProps {
+  patientUuid: string;
+  patient: fhir.Patient;
+  visitContext: Visit;
+  mutateVisitContext: () => void;
+  closeWorkspace: Workspace2DefinitionProps['closeWorkspace'];
+  orderBasketExtensionProps: OrderBasketExtensionProps;
+}
+
+const OrderBasket: React.FC<OrderBasketProps> = ({
+  patientUuid,
+  patient,
+  visitContext,
+  mutateVisitContext,
+  closeWorkspace,
+  orderBasketExtensionProps,
+}) => {
+  const { t } = useTranslation();
+  const isTablet = useLayoutType() === 'tablet';
+  const config = useConfig<ConfigObject>();
+  const session = useSession();
+  const { orders, clearOrders } = useOrderBasket(patient);
+  const [ordersWithErrors, setOrdersWithErrors] = useState<OrderBasketItem[]>([]);
+  const {
+    visitRequired,
+    isLoading: isLoadingEncounterUuid,
+    encounterUuid,
+    error: errorFetchingEncounterUuid,
+    mutate: mutateEncounterUuid,
+  } = useOrderEncounter(patientUuid, visitContext, mutateVisitContext, config.orderEncounterType);
+  const [isSavingOrders, setIsSavingOrders] = useState(false);
+  const [creatingEncounterError, setCreatingEncounterError] = useState('');
+  const { mutate: mutateOrders } = useMutatePatientOrders(patientUuid);
+  const { mutate } = useSWRConfig();
+
+  const handleSave = useCallback(async () => {
+    const abortController = new AbortController();
+    setCreatingEncounterError('');
+    let orderEncounterUuid = encounterUuid;
+    setIsSavingOrders(true);
+    // If there's no encounter present, create an encounter along with the orders.
+    if (!orderEncounterUuid) {
+      try {
+        await postOrdersOnNewEncounter(
+          patientUuid,
+          config?.orderEncounterType,
+          visitRequired ? visitContext : null,
+          session?.sessionLocation?.uuid,
+          abortController,
+        );
+        await closeWorkspace({ discardUnsavedChanges: true });
+        mutateEncounterUuid();
+        // Only revalidate current visit since orders create new encounters
+        mutateVisitContext?.();
+        invalidateVisitAndEncounterData(mutate, patientUuid);
+        clearOrders();
+        await mutateOrders();
+        showOrderSuccessToast(t, orders);
+      } catch (e) {
+        console.error(e);
+        setCreatingEncounterError(
+          e.responseBody?.error?.message ||
+            t('tryReopeningTheWorkspaceAgain', 'Please try launching the workspace again'),
+        );
+      }
+    } else {
+      const erroredItems = await postOrders(patientUuid, orderEncounterUuid, abortController);
+      clearOrders({ exceptThoseMatching: (item) => erroredItems.map((e) => e.display).includes(item.display) });
+      // Only revalidate current visit since orders create new encounters
+      mutateVisitContext?.();
+      await mutateOrders();
+      invalidateVisitAndEncounterData(mutate, patientUuid);
+
+      if (erroredItems.length == 0) {
+        await closeWorkspace({ discardUnsavedChanges: true });
+        showOrderSuccessToast(t, orders);
+      } else {
+        setOrdersWithErrors(erroredItems);
+      }
+      clearOrders({ exceptThoseMatching: (item) => erroredItems.map((e) => e.display).includes(item.display) });
+      // Only revalidate current visit since orders create new encounters
+      mutateVisitContext?.();
+      await mutateOrders();
+      invalidateVisitAndEncounterData(mutate, patientUuid);
+    }
+    setIsSavingOrders(false);
+    return () => abortController.abort();
+  }, [
+    visitContext,
+    visitRequired,
+    clearOrders,
+    closeWorkspace,
+    config,
+    encounterUuid,
+    mutateEncounterUuid,
+    mutateOrders,
+    mutateVisitContext,
+    orders,
+    patientUuid,
+    session,
+    t,
+    mutate,
+  ]);
+
+  const handleCancel = useCallback(() => {
+    closeWorkspace().then((didClose) => {
+      if (didClose) {
+        clearOrders();
+      }
+    });
+  }, [clearOrders, closeWorkspace]);
+
+  return (
+    <Workspace2 title={t('orderBasketWorkspaceTitle', 'Order Basket')} hasUnsavedChanges={!!orders.length}>
+      <div id="order-basket" className={styles.container}>
+        <ExtensionSlot name="visit-context-header-slot" state={{ patientUuid }} />
+        <div className={styles.orderBasketContainer}>
+          <ExtensionSlot
+            className={classNames(styles.orderBasketSlot, {
+              [styles.orderBasketSlotTablet]: isTablet,
+            })}
+            name="order-basket-slot"
+            state={orderBasketExtensionProps as any}
+          />
+          {config?.orderTypes?.length > 0 &&
+            config.orderTypes.map((orderType) => (
+              <div className={styles.orderPanel} key={orderType.orderTypeUuid}>
+                <GeneralOrderPanel
+                  {...orderType}
+                  launchGeneralOrderForm={orderBasketExtensionProps.launchGeneralOrderForm}
+                  patient={patient}
+                />
+              </div>
+            ))}
+        </div>
+        <div>
+          {(creatingEncounterError || errorFetchingEncounterUuid) && (
+            <InlineNotification
+              kind="error"
+              title={t('tryReopeningTheWorkspaceAgain', 'Please try launching the workspace again')}
+              subtitle={creatingEncounterError}
+              lowContrast={true}
+              className={styles.inlineNotification}
+            />
+          )}
+          {ordersWithErrors.map((order) => (
+            <InlineNotification
+              lowContrast
+              kind="error"
+              title={t('saveDrugOrderFailed', 'Error ordering {{orderName}}', { orderName: order.display })}
+              subtitle={order.extractedOrderError?.fieldErrors?.join(', ')}
+              className={styles.inlineNotification}
+            />
+          ))}
+          <ButtonSet className={styles.buttonSet}>
+            <Button className={styles.actionButton} kind="secondary" onClick={handleCancel}>
+              {t('cancel', 'Cancel')}
+            </Button>
+            <Button
+              className={styles.actionButton}
+              kind="primary"
+              onClick={handleSave}
+              disabled={
+                isSavingOrders ||
+                !orders?.length ||
+                isLoadingEncounterUuid ||
+                (visitRequired && !visitContext) ||
+                orders?.some(({ isOrderIncomplete }) => isOrderIncomplete)
+              }
+            >
+              {isSavingOrders ? (
+                <InlineLoading description={t('saving', 'Saving') + '...'} />
+              ) : (
+                <span>{t('signAndClose', 'Sign and close')}</span>
+              )}
+            </Button>
+          </ButtonSet>
+        </div>
+      </div>
+    </Workspace2>
+  );
+};
+
+export default OrderBasket;

package/src/order-basket/order-basket.workspace.tsx

@@ -1,262 +1,52 @@
-import React, { useCallback, useEffect, useState } from 'react';
-import classNames from 'classnames';
-import { useTranslation } from 'react-i18next';
-import type { TFunction } from 'i18next';
-import { ActionableNotification, Button, ButtonSet, InlineLoading, InlineNotification } from '@carbon/react';
+import React, { useMemo } from 'react';
 import {
-  ExtensionSlot,
-  showModal,
-  showSnackbar,
-  useConfig,
-  useLayoutType,
-  useSession,
-  type Visit,
-} from '@openmrs/esm-framework';
-import {
-  type DefaultPatientWorkspaceProps,
+  type OrderBasketExtensionProps,
+  type OrderBasketWindowProps,
   type OrderBasketItem,
-  invalidateVisitAndEncounterData,
-  postOrders,
-  postOrdersOnNewEncounter,
-  useOrderBasket,
+  type PatientWorkspace2DefinitionProps,
 } from '@openmrs/esm-patient-common-lib';
-import { useSWRConfig } from 'swr';
-import { type ConfigObject } from '../config-schema';
-import { useMutatePatientOrders, useOrderEncounter } from '../api/api';
-import GeneralOrderType from './general-order-type/general-order-type.component';
-import styles from './order-basket.scss';
-
-interface OrderBasketSlotProps {
-  patientUuid: string;
-  patient: fhir.Patient;
-  visitContext: Visit;
-  mutateVisitContext: () => void;
-}
-
-const OrderBasket: React.FC<DefaultPatientWorkspaceProps> = ({
-  patientUuid,
-  patient,
+import OrderBasket from './order-basket.component';
+
+/**
+ * This workspace renders the main order basket, which contains the buttons to add a drug order and to add a lab order.
+ *
+ * This workspace must only be used within the patient chart
+ * @see exported-order-basket.workspace.tsx
+ */
+const OrderBasketWorkspace: React.FC<PatientWorkspace2DefinitionProps<{}, OrderBasketWindowProps>> = ({
+  groupProps: { patientUuid, patient, visitContext, mutateVisitContext },
   closeWorkspace,
-  closeWorkspaceWithSavedChanges,
-  promptBeforeClosing,
-  visitContext,
-  mutateVisitContext,
+  launchChildWorkspace,
 }) => {
-  const { t } = useTranslation();
-  const isTablet = useLayoutType() === 'tablet';
-  const config = useConfig<ConfigObject>();
-  const session = useSession();
-  const { orders, clearOrders } = useOrderBasket(patient);
-  const [ordersWithErrors, setOrdersWithErrors] = useState<OrderBasketItem[]>([]);
-  const {
-    visitRequired,
-    isLoading: isLoadingEncounterUuid,
-    encounterUuid,
-    error: errorFetchingEncounterUuid,
-    mutate: mutateEncounterUuid,
-  } = useOrderEncounter(patientUuid, visitContext, mutateVisitContext, config.orderEncounterType);
-  const [isSavingOrders, setIsSavingOrders] = useState(false);
-  const [creatingEncounterError, setCreatingEncounterError] = useState('');
-  const { mutate: mutateOrders } = useMutatePatientOrders(patientUuid);
-  const { mutate } = useSWRConfig();
-
-  useEffect(() => {
-    promptBeforeClosing(() => !!orders.length);
-  }, [orders, promptBeforeClosing]);
-
-  const openStartVisitDialog = useCallback(() => {
-    const dispose = showModal('start-visit-dialog', {
-      patientUuid,
-      closeModal: () => dispose(),
-    });
-  }, [patientUuid]);
-
-  const handleSave = useCallback(async () => {
-    const abortController = new AbortController();
-    setCreatingEncounterError('');
-    let orderEncounterUuid = encounterUuid;
-    setIsSavingOrders(true);
-    // If there's no encounter present, create an encounter along with the orders.
-    if (!orderEncounterUuid) {
-      try {
-        await postOrdersOnNewEncounter(
-          patientUuid,
-          config?.orderEncounterType,
-          visitRequired ? visitContext : null,
-          session?.sessionLocation?.uuid,
-          abortController,
-        );
-        mutateEncounterUuid();
-        // Only revalidate current visit since orders create new encounters
-        mutateVisitContext?.();
-        clearOrders();
-        await mutateOrders();
-
-        closeWorkspaceWithSavedChanges();
-        showOrderSuccessToast(t, orders);
-      } catch (e) {
-        console.error(e);
-        setCreatingEncounterError(
-          e.responseBody?.error?.message ||
-            t('tryReopeningTheWorkspaceAgain', 'Please try launching the workspace again'),
-        );
-      }
-    } else {
-      const erroredItems = await postOrders(patientUuid, orderEncounterUuid, abortController);
-      clearOrders({ exceptThoseMatching: (item) => erroredItems.map((e) => e.display).includes(item.display) });
-      // Only revalidate current visit since orders create new encounters
-      mutateVisitContext?.();
-      await mutateOrders();
-      invalidateVisitAndEncounterData(mutate, patientUuid);
-
-      if (erroredItems.length == 0) {
-        closeWorkspaceWithSavedChanges();
-        showOrderSuccessToast(t, orders);
-      } else {
-        setOrdersWithErrors(erroredItems);
-      }
-    }
-    setIsSavingOrders(false);
-    return () => abortController.abort();
-  }, [
-    visitContext,
-    visitRequired,
-    clearOrders,
-    closeWorkspaceWithSavedChanges,
-    config,
-    encounterUuid,
-    mutateEncounterUuid,
-    mutateOrders,
-    mutateVisitContext,
-    orders,
-    patientUuid,
-    session,
-    t,
-    mutate,
-  ]);
-
-  const handleCancel = useCallback(() => {
-    closeWorkspace({ onWorkspaceClose: clearOrders });
-  }, [clearOrders, closeWorkspace]);
-
-  const extensionProps = {
-    patientUuid,
-    patient,
-    visitContext,
-    mutateVisitContext,
-  } satisfies OrderBasketSlotProps;
+  const orderBasketExtensionProps = useMemo(() => {
+    const launchDrugOrderForm = (order: OrderBasketItem) => {
+      launchChildWorkspace('add-drug-order', { order });
+    };
+    const launchLabOrderForm = (orderTypeUuid: string, order: OrderBasketItem) => {
+      launchChildWorkspace('add-lab-order', { orderTypeUuid, order });
+    };
+    const launchGeneralOrderForm = (orderTypeUuid: string, order: OrderBasketItem) => {
+      launchChildWorkspace('orderable-concept-workspace', { orderTypeUuid, order });
+    };
+
+    return {
+      patient,
+      launchDrugOrderForm,
+      launchLabOrderForm,
+      launchGeneralOrderForm,
+    } satisfies OrderBasketExtensionProps;
+  }, [launchChildWorkspace, patient]);
 
   return (
-    <>
-      <div className={styles.container}>
-        <ExtensionSlot name="visit-context-header-slot" state={extensionProps} />
-        <div className={styles.orderBasketContainer}>
-          <ExtensionSlot
-            className={classNames(styles.orderBasketSlot, {
-              [styles.orderBasketSlotTablet]: isTablet,
-            })}
-            name="order-basket-slot"
-            state={extensionProps}
-          />
-          {config?.orderTypes?.length > 0 &&
-            config.orderTypes.map((orderType) => (
-              <div className={styles.orderPanel} key={orderType.orderTypeUuid}>
-                <GeneralOrderType
-                  key={orderType.orderTypeUuid}
-                  orderTypeUuid={orderType.orderTypeUuid}
-                  label={orderType.label}
-                  orderableConceptSets={orderType.orderableConceptSets}
-                  closeWorkspace={closeWorkspace}
-                  patient={patient}
-                />
-              </div>
-            ))}
-        </div>
-
-        <div>
-          {(creatingEncounterError || errorFetchingEncounterUuid) && (
-            <InlineNotification
-              kind="error"
-              title={t('tryReopeningTheWorkspaceAgain', 'Please try launching the workspace again')}
-              subtitle={creatingEncounterError}
-              lowContrast={true}
-              className={styles.inlineNotification}
-            />
-          )}
-          {ordersWithErrors.map((order) => (
-            <InlineNotification
-              lowContrast
-              kind="error"
-              title={t('saveDrugOrderFailed', 'Error ordering {{orderName}}', { orderName: order.display })}
-              subtitle={order.extractedOrderError?.fieldErrors?.join(', ')}
-              className={styles.inlineNotification}
-            />
-          ))}
-          <ButtonSet className={styles.buttonSet}>
-            <Button className={styles.actionButton} kind="secondary" onClick={handleCancel}>
-              {t('cancel', 'Cancel')}
-            </Button>
-            <Button
-              className={styles.actionButton}
-              kind="primary"
-              onClick={handleSave}
-              disabled={
-                isSavingOrders ||
-                !orders?.length ||
-                isLoadingEncounterUuid ||
-                (visitRequired && !visitContext) ||
-                orders?.some(({ isOrderIncomplete }) => isOrderIncomplete)
-              }
-            >
-              {isSavingOrders ? (
-                <InlineLoading description={t('saving', 'Saving') + '...'} />
-              ) : (
-                <span>{t('signAndClose', 'Sign and close')}</span>
-              )}
-            </Button>
-          </ButtonSet>
-        </div>
-      </div>
-      {visitRequired && !visitContext && (
-        <ActionableNotification
-          kind="error"
-          actionButtonLabel={t('startVisit', 'Start visit')}
-          onActionButtonClick={openStartVisitDialog}
-          title={t('startAVisitToRecordOrders', 'Start a visit to order')}
-          subtitle={t('visitRequired', 'You must select a visit to make orders')}
-          lowContrast={true}
-          inline
-          className={styles.actionNotification}
-          hasFocus
-        />
-      )}
-    </>
+    <OrderBasket
+      patientUuid={patientUuid}
+      patient={patient}
+      visitContext={visitContext}
+      mutateVisitContext={mutateVisitContext}
+      closeWorkspace={closeWorkspace}
+      orderBasketExtensionProps={orderBasketExtensionProps}
+    />
   );
 };
 
-function showOrderSuccessToast(t: TFunction, patientOrderItems: OrderBasketItem[]) {
-  const orderedString = patientOrderItems
-    .filter((item) => ['NEW', 'RENEW'].includes(item.action))
-    .map((item) => item.display)
-    .join(', ');
-  const updatedString = patientOrderItems
-    .filter((item) => item.action === 'REVISE')
-    .map((item) => item.display)
-    .join(', ');
-  const discontinuedString = patientOrderItems
-    .filter((item) => item.action === 'DISCONTINUE')
-    .map((item) => item.display)
-    .join(', ');
-
-  showSnackbar({
-    isLowContrast: true,
-    kind: 'success',
-    title: t('orderCompleted', 'Placed orders'),
-    subtitle:
-      (orderedString && `${t('ordered', 'Placed order for')} ${orderedString}. `) +
-      (updatedString && `${t('updated', 'Updated')} ${updatedString}. `) +
-      (discontinuedString && `${t('discontinued', 'Discontinued')} ${discontinuedString}.`),
-  });
-}
-
-export default OrderBasket;
+export default OrderBasketWorkspace;