@kenyaemr/esm-morgue-app 5.4.2-pre.2297 → 5.4.2-pre.2301

package/src/forms/discharge-deceased-person-workspace/discharge-body.resource.ts

@@ -45,16 +45,24 @@ export const usePersonAttributes = (personUuid: string) => {
   ) => {
     const { attributeType, value } = payload;
 
-    const existingAttribute = person.attributes.find((attr) => attr.uuid === attributeType);
-
-    if (existingAttribute) {
-      return updatePersonAttributes(
-        { attributeType: existingAttribute.uuid, value },
-        personUuid,
-        existingAttribute.uuid,
-      );
-    } else {
-      return createPersonAttribute({ attributeType, value }, personUuid);
+    const existingAttribute = person.attributes.find((attr) => attr.attributeType?.uuid === attributeType);
+
+    try {
+      if (existingAttribute) {
+        return await updatePersonAttributes({ attributeType, value }, personUuid, existingAttribute.uuid);
+      } else {
+        return await createPersonAttribute({ attributeType, value }, personUuid);
+      }
+    } catch (error) {
+      console.error('Error creating/updating person attribute:', error);
+
+      if (error?.responseBody?.error?.message?.includes('already in use')) {
+        throw new Error(
+          `The identifier "${value}" is already in use by another patient. Please use a different identifier.`,
+        );
+      }
+
+      throw error;
     }
   };
 
@@ -67,74 +75,164 @@ export const usePersonAttributes = (personUuid: string) => {
     createOrUpdatePersonAttribute,
   };
 };
-
 export const useBills = (
   patientUuid: string = '',
-  billStatus: PaymentStatus.PENDING | '' | string = '',
+  billStatus: PaymentStatus | '' | string = '',
   startingDate: Date = dayjs().startOf('day').toDate(),
   endDate: Date = dayjs().endOf('day').toDate(),
 ) => {
   const startingDateISO = startingDate.toISOString();
   const endDateISO = endDate.toISOString();
 
-  const url = `${restBaseUrl}/cashier/bill?status=${billStatus}&v=custom:(uuid,display,voided,voidReason,adjustedBy,cashPoint:(uuid,name),cashier:(uuid,display),dateCreated,lineItems,patient:(uuid,display))&createdOnOrAfter=${startingDateISO}&createdOnOrBefore=${endDateISO}`;
+  let url = `${restBaseUrl}/cashier/bill?v=custom:(uuid,display,voided,voidReason,adjustedBy,cashPoint:(uuid,name),cashier:(uuid,display),dateCreated,lineItems,patient:(uuid,display),status,balance,totalPayments,totalExempted,totalDeposits,closed)&createdOnOrAfter=${startingDateISO}&createdOnOrBefore=${endDateISO}`;
+
+  if (patientUuid) {
+    url += `&patientUuid=${patientUuid}`;
+  }
+
+  if (billStatus) {
+    url += `&status=${billStatus}`;
+  }
 
   const { data, error, isLoading, isValidating, mutate } = useSWR<{ data: { results: Array<PatientInvoice> } }>(
-    patientUuid ? `${url}&patientUuid=${patientUuid}` : url,
+    url,
     openmrsFetch,
     {
       errorRetryCount: 2,
     },
   );
 
-  const sortBills = sortBy(data?.data?.results ?? [], ['dateCreated']).reverse();
-  const filteredBills = billStatus === '' ? sortBills : sortBills?.filter((bill) => bill?.status === billStatus);
-  const filteredResults = filteredBills?.filter((res) => res.patient?.uuid === patientUuid);
-  const formattedBills = isEmpty(patientUuid) ? filteredBills : filteredResults || [];
+  const results = data?.data?.results ?? [];
+
+  const sortedBills = sortBy(results, ['dateCreated']).reverse();
+
+  const patientFilteredBills = patientUuid
+    ? sortedBills.filter((bill) => bill.patient?.uuid === patientUuid)
+    : sortedBills;
+
+  const statusFilteredBills = billStatus
+    ? patientFilteredBills.filter((bill) => bill.status === billStatus)
+    : patientFilteredBills;
 
   return {
-    bills: formattedBills,
+    bills: statusFilteredBills,
     error,
     isLoading,
     isValidating,
     mutate,
   };
 };
+
 interface UseBlockDischargeWithPendingBillsProps {
   patientUuid: string;
+  actionType: 'discharge' | 'dispose';
 }
 
 interface UseBlockDischargeWithPendingBillsReturn {
   isDischargeBlocked: boolean;
-  pendingBills: any[];
+  pendingBills: PatientInvoice[];
   pendingBillsCount: number;
   isLoadingBills: boolean;
   billsError: any;
   blockingMessage: string;
 }
+
 export const useBlockDischargeWithPendingBills = ({
   patientUuid,
+  actionType,
 }: UseBlockDischargeWithPendingBillsProps): UseBlockDischargeWithPendingBillsReturn => {
-  const { bills, isLoading, error } = useBills(patientUuid, PaymentStatus.PENDING);
+  const { bills, isLoading, isValidating, error } = useBills(patientUuid, '');
 
   const result = useMemo(() => {
-    const pendingBills = bills?.filter((bill) => bill.status === PaymentStatus.PENDING) || [];
+    if (isLoading || isValidating) {
+      return {
+        isDischargeBlocked: false,
+        pendingBills: [],
+        pendingBillsCount: 0,
+        isLoadingBills: true,
+        billsError: error,
+        blockingMessage: '',
+      };
+    }
+
+    if (error) {
+      console.error('Error fetching bills:', error);
+      return {
+        isDischargeBlocked: false,
+        pendingBills: [],
+        pendingBillsCount: 0,
+        isLoadingBills: false,
+        billsError: error,
+        blockingMessage: '',
+      };
+    }
+
+    const pendingBills =
+      bills?.filter((bill) => {
+        const isPending = bill.status === PaymentStatus.PENDING;
+        const isNotVoided = !bill.voided;
+
+        let hasBalance = false;
+        if (bill.balance !== undefined) {
+          hasBalance = bill.balance > 0;
+        } else {
+          const totalAmount =
+            bill.lineItems?.reduce((sum, item) => {
+              return sum + (item as any).price * (item as any).quantity;
+            }, 0) || 0;
+
+          const totalPayments =
+            bill.totalPayments || bill.payments?.reduce((sum, payment) => sum + (payment.amount || 0), 0) || 0;
+
+          const totalExempted = bill.totalExempted || 0;
+          const totalDeposits = bill.totalDeposits || 0;
+
+          const outstandingBalance = totalAmount - totalPayments - totalExempted - totalDeposits;
+          hasBalance = outstandingBalance > 0;
+        }
+
+        const isNotClosed = bill.closed !== undefined ? !bill.closed : true;
+
+        return isPending && hasBalance && isNotVoided && isNotClosed;
+      }) || [];
+
     const pendingBillsCount = pendingBills.length;
     const isDischargeBlocked = pendingBillsCount > 0;
 
+    const totalOutstandingBalance = pendingBills.reduce((acc, bill) => {
+      if (bill.balance !== undefined) {
+        return acc + bill.balance;
+      } else {
+        const totalAmount =
+          bill.lineItems?.reduce((sum, item) => {
+            return sum + (item as any).price * (item as any).quantity;
+          }, 0) || 0;
+
+        const totalPayments =
+          bill.totalPayments || bill.payments?.reduce((sum, payment) => sum + (payment.amount || 0), 0) || 0;
+
+        const totalExempted = bill.totalExempted || 0;
+        const totalDeposits = bill.totalDeposits || 0;
+
+        const outstandingBalance = totalAmount - totalPayments - totalExempted - totalDeposits;
+        return acc + Math.max(0, outstandingBalance);
+      }
+    }, 0);
+
     const blockingMessage = isDischargeBlocked
-      ? `Sorry, Pending bills must be resolved before discharging a deceased patient.
-`
+      ? `The deceased patient cannot be ${actionType}d due to ${pendingBillsCount} unpaid ${
+          pendingBillsCount === 1 ? 'bill' : 'bills'
+        } (Total balance: Ksh.${totalOutstandingBalance.toLocaleString()}). Please visit the cashier to settle all outstanding bills before ${actionType}.`
       : '';
     return {
       isDischargeBlocked,
       pendingBills,
       pendingBillsCount,
-      isLoadingBills: isLoading,
+      isLoadingBills: false,
       billsError: error,
       blockingMessage,
     };
-  }, [bills, isLoading, error]);
+  }, [bills, isLoading, isValidating, error, actionType]);
 
   return result;
 };

package/src/forms/discharge-deceased-person-workspace/discharge-body.workspace.tsx

@@ -25,7 +25,7 @@ import {
   useLayoutType,
   useVisit,
 } from '@openmrs/esm-framework';
-import React, { useCallback, useEffect } from 'react';
+import React, { useCallback, useEffect, useState } from 'react';
 import { Controller, useForm } from 'react-hook-form';
 import { useTranslation } from 'react-i18next';
 import { mutate as mutateSWR } from 'swr';
@@ -33,7 +33,7 @@ import { z } from 'zod';
 import styles from './discharge-body.scss';
 import DeceasedInfo from '../../deceased-patient-header/deceasedInfo/deceased-info.component';
 import { PatientInfo } from '../../types';
-import { useBills, useBlockDischargeWithPendingBills, usePersonAttributes } from './discharge-body.resource';
+import { useBlockDischargeWithPendingBills, usePersonAttributes } from './discharge-body.resource';
 import { ConfigObject } from '../../config-schema';
 import { getCurrentTime } from '../../utils/utils';
 import { dischargeSchema } from '../../schemas';
@@ -44,47 +44,66 @@ import { useMortuaryOperation } from '../admit-deceased-person-workspace/admit-d
 interface DischargeFormProps {
   closeWorkspace: () => void;
   patientUuid: string;
-  personUuid: string;
   bedId: number;
   mutate: () => void;
 }
 
 type DischargeFormValues = z.infer<typeof dischargeSchema>;
 
-const DischargeForm: React.FC<DischargeFormProps> = ({ closeWorkspace, patientUuid, bedId, personUuid, mutate }) => {
+const DischargeForm: React.FC<DischargeFormProps> = ({ closeWorkspace, patientUuid, bedId, mutate }) => {
   const { t } = useTranslation();
   const isTablet = useLayoutType() === 'tablet';
+  const [submissionError, setSubmissionError] = useState<string | null>(null);
+
   const { activeVisit, currentVisitIsRetrospective } = useVisit(patientUuid);
   const { queueEntry } = useVisitQueueEntry(patientUuid, activeVisit?.uuid);
+
   const { dischargeBody, isLoadingEmrConfiguration } = useMortuaryOperation();
-  const { createOrUpdatePersonAttribute, personAttributes } = usePersonAttributes(personUuid);
+
+  const {
+    createOrUpdatePersonAttribute,
+    personAttributes,
+    isLoading: isLoadingAttributes,
+  } = usePersonAttributes(patientUuid);
+
   const { isDischargeBlocked, blockingMessage, isLoadingBills } = useBlockDischargeWithPendingBills({
     patientUuid,
+    actionType: 'discharge',
   });
 
-  const { time: defaultTime, period: defaultPeriod } = getCurrentTime();
-
-  const { nextOfKinAddressUuid, nextOfKinNameUuid, nextOfKinPhoneUuid, nextOfKinRelationshipUuid } =
+  const { nextOfKinNameUuid, nextOfKinRelationshipUuid, nextOfKinPhoneUuid, nextOfKinAddressUuid } =
     useConfig<ConfigObject>();
 
+  const { time: defaultTime, period: defaultPeriod } = getCurrentTime();
+
   const getAttributeValue = useCallback(
     (attributeTypeUuid: string) => {
-      if (!personAttributes) {
+      if (!personAttributes || !Array.isArray(personAttributes)) {
         return '';
       }
-      const attributes = Array.isArray(personAttributes) ? personAttributes : [];
-      const attribute = attributes.find((attr) => attr.attributeType.uuid === attributeTypeUuid);
+      const attribute = personAttributes.find((attr) => attr.attributeType.uuid === attributeTypeUuid);
       return attribute ? attribute.value : '';
     },
     [personAttributes],
   );
 
+  const getExistingAttributeUuid = useCallback(
+    (attributeTypeUuid: string) => {
+      if (!personAttributes || !Array.isArray(personAttributes)) {
+        return null;
+      }
+      const attribute = personAttributes.find((attr) => attr.attributeType.uuid === attributeTypeUuid);
+      return attribute ? attribute.uuid : null;
+    },
+    [personAttributes],
+  );
+
   const {
-    watch,
     control,
     setValue,
     handleSubmit,
     formState: { errors, isDirty, isSubmitting },
+    watch,
   } = useForm<DischargeFormValues>({
     resolver: zodResolver(dischargeSchema),
     defaultValues: {
@@ -92,96 +111,176 @@ const DischargeForm: React.FC<DischargeFormProps> = ({ closeWorkspace, patientUu
       timeOfDischarge: defaultTime,
       period: defaultPeriod,
       burialPermitNumber: '',
+      nextOfKinNames: '',
+      relationshipType: '',
+      nextOfKinContact: '',
+      nextOfKinAddress: '',
     },
   });
+
   useEffect(() => {
     if (Array.isArray(personAttributes) && personAttributes.length > 0) {
-      setValue('nextOfKinNames', getAttributeValue(nextOfKinNameUuid));
-      setValue('relationshipType', getAttributeValue(nextOfKinRelationshipUuid));
-      setValue('nextOfKinContact', getAttributeValue(nextOfKinPhoneUuid));
-      setValue('nextOfKinAddress', getAttributeValue(nextOfKinAddressUuid));
+      const initialValues = {
+        nextOfKinNames: getAttributeValue(nextOfKinNameUuid),
+        relationshipType: getAttributeValue(nextOfKinRelationshipUuid),
+        nextOfKinContact: getAttributeValue(nextOfKinPhoneUuid),
+        nextOfKinAddress: getAttributeValue(nextOfKinAddressUuid),
+      };
+
+      Object.entries(initialValues).forEach(([field, value]) => {
+        if (value !== undefined && value !== null && value !== '') {
+          setValue(field as keyof DischargeFormValues, value);
+        }
+      });
     }
   }, [
     personAttributes,
+    setValue,
     getAttributeValue,
     nextOfKinNameUuid,
     nextOfKinRelationshipUuid,
     nextOfKinPhoneUuid,
     nextOfKinAddressUuid,
-    setValue,
   ]);
+
   const onSubmit = async (data: DischargeFormValues) => {
+    setSubmissionError(null);
+
     if (currentVisitIsRetrospective) {
       setCurrentVisit(null, null);
       closeWorkspace();
-    } else {
-      try {
-        const nextOfKinAttributes = [
-          { attributeType: nextOfKinNameUuid, value: data.nextOfKinNames },
-          { attributeType: nextOfKinRelationshipUuid, value: data.relationshipType },
-          { attributeType: nextOfKinPhoneUuid, value: data.nextOfKinContact },
-          { attributeType: nextOfKinAddressUuid, value: data.nextOfKinAddress },
-        ];
-        const patientInfo: PatientInfo = {
-          uuid: activeVisit.patient.uuid,
-          attributes: (activeVisit?.patient?.person?.attributes || []).map((attr) => ({
-            uuid: attr.uuid,
-            display: attr.display || '',
-          })),
-        };
-
-        for (const attribute of nextOfKinAttributes) {
-          await createOrUpdatePersonAttribute(patientUuid, attribute, patientInfo);
+      return;
+    }
+
+    try {
+      // First, perform the discharge operation
+      await dischargeBody(activeVisit, queueEntry, bedId, data);
+
+      // Then update person attributes
+      const attributeUpdates = [
+        {
+          uuid: nextOfKinNameUuid,
+          value: data.nextOfKinNames,
+          existingUuid: getExistingAttributeUuid(nextOfKinNameUuid),
+        },
+        {
+          uuid: nextOfKinRelationshipUuid,
+          value: data.relationshipType,
+          existingUuid: getExistingAttributeUuid(nextOfKinRelationshipUuid),
+        },
+        {
+          uuid: nextOfKinPhoneUuid,
+          value: data.nextOfKinContact,
+          existingUuid: getExistingAttributeUuid(nextOfKinPhoneUuid),
+        },
+        {
+          uuid: nextOfKinAddressUuid,
+          value: data.nextOfKinAddress,
+          existingUuid: getExistingAttributeUuid(nextOfKinAddressUuid),
+        },
+      ].filter((attr) => attr.value !== undefined && attr.value !== null && attr.value !== '');
+
+      const patientInfo: PatientInfo = {
+        uuid: activeVisit.patient.uuid,
+        attributes: personAttributes || [],
+      };
+
+      for (const attr of attributeUpdates) {
+        try {
+          const attributeData: any = {
+            attributeType: attr.uuid,
+            value: attr.value,
+          };
+
+          if (attr.existingUuid) {
+            attributeData.uuid = attr.existingUuid;
+          }
+
+          await createOrUpdatePersonAttribute(patientUuid, attributeData, patientInfo);
+        } catch (error) {
+          showSnackbar({
+            title: t('errorUpdatingAttribute', 'Error Updating Attribute'),
+            subtitle: t('errorUpdatingAttributeDescription', 'An error occurred while updating the attribute'),
+            kind: 'error',
+            isLowContrast: true,
+          });
         }
+      }
+
+      // Invalidate relevant caches
+      await Promise.all([
+        mutateSWR((key) => typeof key === 'string' && key.startsWith(`${restBaseUrl}/visit`)),
+        mutateSWR((key) => typeof key === 'string' && key.startsWith(`${restBaseUrl}/patient`)),
+        mutateSWR((key) => typeof key === 'string' && key.startsWith(`${fhirBaseUrl}/Encounter`)),
+      ]);
+
+      showSnackbar({
+        title: t('dischargeDeceasedPatient', 'Deceased patient discharged'),
+        subtitle: t('deceasedPatientDischargedSuccessfully', 'Deceased patient has been discharged successfully'),
+        kind: 'success',
+        isLowContrast: true,
+      });
 
-        await dischargeBody(activeVisit, queueEntry, bedId, data);
-
-        showSnackbar({
-          title: t('dischargeDeceasedPatient', 'Deceased patient'),
-          subtitle: t('deceasedPatientDischargedSuccessfully', 'Deceased patient has been discharged successfully'),
-          kind: 'success',
-          isLowContrast: true,
-        });
-        mutateSWR((key) => typeof key === 'string' && key.startsWith(`${restBaseUrl}/visit`));
-        mutateSWR((key) => typeof key === 'string' && key.startsWith(`${restBaseUrl}/patient`));
-        mutateSWR((key) => typeof key === 'string' && key.startsWith(`${fhirBaseUrl}/Encounter`));
-
-        mutate();
-        closeWorkspace();
-      } catch (error) {
-        console.error(error);
-        const errorMessage = JSON.stringify(error?.responseBody?.error?.message?.replace(/\[/g, '').replace(/\]/g, ''));
-        showSnackbar({
-          title: t('visitError', 'Visit Error'),
-          subtitle: t(
-            'visitErrorMessage',
-            `An error has occurred while ending visit, Contact system administrator quoting this error ${errorMessage}`,
-          ),
-          kind: 'error',
-          isLowContrast: true,
-        });
+      mutate();
+      closeWorkspace();
+    } catch (error) {
+      let errorMessage = t('dischargeUnknownError', 'An unknown error occurred');
+      if (error?.message) {
+        errorMessage = error.message;
+      } else if (error?.responseBody?.error?.message) {
+        errorMessage = error.responseBody.error.message.replace(/\[|\]/g, '');
+      } else if (error?.responseBody?.error?.globalErrors) {
+        errorMessage = error.responseBody.error.globalErrors[0]?.message || errorMessage;
       }
+
+      setSubmissionError(errorMessage);
+      showSnackbar({
+        title: t('dischargeError', 'Discharge Error'),
+        subtitle: errorMessage,
+        kind: 'error',
+        isLowContrast: true,
+      });
     }
   };
 
-  if (isLoadingEmrConfiguration || !personAttributes) {
-    return <InlineLoading status="active" iconDescription="Loading" description="Loading ..." />;
+  if (isLoadingEmrConfiguration || isLoadingAttributes || !activeVisit) {
+    return <InlineLoading status="active" iconDescription="Loading" description={t('loading', 'Loading...')} />;
   }
 
   return (
     <Form onSubmit={handleSubmit(onSubmit)} className={styles.form}>
       <div className={styles.formContainer}>
+        {isLoadingBills && (
+          <InlineLoading
+            status="active"
+            iconDescription="Loading"
+            description={t('loadingBills', 'Loading bills...')}
+          />
+        )}
+
+        {isDischargeBlocked && (
+          <InlineNotification
+            kind="warning"
+            title={t('warningMsg', 'Warning')}
+            subtitle={blockingMessage}
+            lowContrast={true}
+            className={styles.blockingNotification}
+          />
+        )}
+
+        {submissionError && (
+          <InlineNotification
+            kind="error"
+            title={t('error', 'Error')}
+            subtitle={submissionError}
+            lowContrast={true}
+            className={styles.errorNotification}
+          />
+        )}
+
         <Stack gap={3}>
           <DeceasedInfo patientUuid={patientUuid} />
-          {isDischargeBlocked && (
-            <InlineNotification
-              kind="error"
-              title={t('dischargeBlocked', 'Discharge Blocked')}
-              subtitle={blockingMessage}
-              lowContrast={true}
-              className={styles.blockingNotification}
-            />
-          )}
+
           <ResponsiveWrapper>
             <div className={styles.dateTimePickerContainer}>
               <Column>
@@ -200,9 +299,9 @@ const DischargeForm: React.FC<DischargeFormProps> = ({ closeWorkspace, patientUu
                       value={field.value ? new Date(field.value) : null}>
                       <DatePickerInput
                         {...field}
-                        id="date-of-admission"
+                        id="date-of-discharge"
                         placeholder="yyyy-mm-dd"
-                        labelText={t('dateOfAdmission', 'Date of discharge*')}
+                        labelText={t('dateOfDischarge', 'Date of discharge*')}
                         invalid={!!errors.dateOfDischarge}
                         invalidText={errors.dateOfDischarge?.message}
                       />
@@ -245,6 +344,7 @@ const DischargeForm: React.FC<DischargeFormProps> = ({ closeWorkspace, patientUu
                 </div>
               </Column>
             </div>
+
             <Column className={styles.fieldColumn}>
               <Controller
                 name="burialPermitNumber"
@@ -263,6 +363,7 @@ const DischargeForm: React.FC<DischargeFormProps> = ({ closeWorkspace, patientUu
                 )}
               />
             </Column>
+
             <Column className={styles.fieldColumn}>
               <Controller
                 name="nextOfKinNames"
@@ -281,6 +382,7 @@ const DischargeForm: React.FC<DischargeFormProps> = ({ closeWorkspace, patientUu
                 )}
               />
             </Column>
+
             <Column className={styles.fieldColumn}>
               <Controller
                 name="relationshipType"
@@ -288,17 +390,18 @@ const DischargeForm: React.FC<DischargeFormProps> = ({ closeWorkspace, patientUu
                 render={({ field }) => (
                   <TextInput
                     {...field}
-                    id="relationship"
+                    id="relationshipType"
                     type="text"
                     className={styles.sectionField}
-                    placeholder={t('relationship', 'Relationship')}
-                    labelText={t('relationship', 'Relationship')}
+                    placeholder={t('relationshipType', 'Relationship')}
+                    labelText={t('relationshipType', 'Relationship')}
                     invalid={!!errors.relationshipType}
                     invalidText={errors.relationshipType?.message}
                   />
                 )}
               />
             </Column>
+
             <Column className={styles.fieldColumn}>
               <Controller
                 name="nextOfKinContact"
@@ -306,17 +409,18 @@ const DischargeForm: React.FC<DischargeFormProps> = ({ closeWorkspace, patientUu
                 render={({ field }) => (
                   <TextInput
                     {...field}
-                    id="telephone"
+                    id="nextOfKinContact"
                     type="text"
-                    className={styles.fieldSection}
-                    placeholder={t('telephone', 'Telephone number')}
-                    labelText={t('telephone', 'Telephone number')}
+                    className={styles.sectionField}
+                    placeholder={t('nextOfKinContact', 'Next of kin contact')}
+                    labelText={t('nextOfKinContact', 'Next of kin contact')}
                     invalid={!!errors.nextOfKinContact}
                     invalidText={errors.nextOfKinContact?.message}
                   />
                 )}
               />
             </Column>
+
             <Column className={styles.fieldColumn}>
               <Controller
                 name="nextOfKinAddress"
@@ -336,6 +440,7 @@ const DischargeForm: React.FC<DischargeFormProps> = ({ closeWorkspace, patientUu
               />
             </Column>
           </ResponsiveWrapper>
+
           <ResponsiveWrapper>
             <Column>
               <ExtensionSlot
@@ -349,6 +454,7 @@ const DischargeForm: React.FC<DischargeFormProps> = ({ closeWorkspace, patientUu
           </ResponsiveWrapper>
         </Stack>
       </div>
+
       <ButtonSet
         className={classNames({
           [styles.tablet]: isTablet,
@@ -364,7 +470,7 @@ const DischargeForm: React.FC<DischargeFormProps> = ({ closeWorkspace, patientUu
           type="submit">
           {isSubmitting ? (
             <span className={styles.inlineLoading}>
-              {t('submitting', 'Submitting' + '...')}
+              {t('submitting', 'Submitting...')}
               <InlineLoading status="active" iconDescription="Loading" />
             </span>
           ) : (