@openmrs/esm-stock-management-app 3.0.1-pre.853 → 3.0.1-pre.855

package/src/stock-operations/stock-operations-forms/steps/stock-operation-submission-form-step.component.tsx

@@ -1,20 +1,20 @@
-import React, { useCallback, useMemo, useState } from 'react';
 import { Button, Column, InlineLoading, RadioButton, RadioButtonGroup, Stack } from '@carbon/react';
 import { ArrowLeft, ArrowRight, Departure, ListChecked, Save, SendFilled } from '@carbon/react/icons';
+import { restBaseUrl, showSnackbar } from '@openmrs/esm-framework';
+import React, { useCallback, useMemo, useState } from 'react';
 import { useFormContext } from 'react-hook-form';
 import { useTranslation } from 'react-i18next';
-import { restBaseUrl, showSnackbar } from '@openmrs/esm-framework';
-import { createStockOperation, deleteStockOperationItem, updateStockOperation } from '../../stock-operations.resource';
 import { extractErrorMessagesFromResponse } from '../../../constants';
-import { handleMutate } from '../../../utils';
+import { type StockOperationDTO } from '../../../core/api/types/stockOperation/StockOperationDTO';
+import { type StockOperationItemDTO } from '../../../core/api/types/stockOperation/StockOperationItemDTO';
 import { OperationType, type StockOperationType } from '../../../core/api/types/stockOperation/StockOperationType';
 import { otherUser } from '../../../core/utils/utils';
+import { handleMutate } from '../../../utils';
 import { showActionDialogButton } from '../../stock-operation.utils';
-import { type StockOperationDTO } from '../../../core/api/types/stockOperation/StockOperationDTO';
-import { type StockOperationItemDTO } from '../../../core/api/types/stockOperation/StockOperationItemDTO';
+import { createStockOperation, deleteStockOperationItem, updateStockOperation } from '../../stock-operations.resource';
 import { type StockOperationItemDtoSchema } from '../../validation-schema';
-import styles from '../stock-operation-form.scss';
 import useOperationTypePermisions from '../hooks/useOperationTypePermisions';
+import styles from '../stock-operation-form.scss';
 
 type StockOperationSubmissionFormStepProps = {
   onPrevious?: () => void;
@@ -23,7 +23,6 @@ type StockOperationSubmissionFormStepProps = {
   onNext?: () => void;
   dismissWorkspace?: () => void;
 };
-
 const StockOperationSubmissionFormStep: React.FC<StockOperationSubmissionFormStepProps> = ({
   onPrevious,
   stockOperationType,
@@ -153,12 +152,12 @@ const StockOperationSubmissionFormStep: React.FC<StockOperationSubmissionFormSte
         <RadioButtonGroup
           name="rbgApprovelRequired"
           legendText={t('doesThisTransactionRequireApproval', 'Does the transaction require approval ?')}
-          onChange={(value) => handleRadioButtonChange(value === 'true')}
+          onChange={handleRadioButtonChange}
           readOnly={!editable}
-          valueSelected={approvalRequired === true ? 'true' : approvalRequired === false ? 'false' : null}
+          valueSelected={approvalRequired === true ? true : approvalRequired === false ? false : null}
         >
-          <RadioButton value="true" id="rbgApprovelRequired-true" labelText={t('yes', 'Yes')} />
-          <RadioButton value="false" id="rbgApprovelRequired-false" labelText={t('no', 'No')} />
+          <RadioButton value={true} id="rbgApprovelRequired-true" labelText={t('yes', 'Yes')} />
+          <RadioButton value={false} id="rbgApprovelRequired-false" labelText={t('no', 'No')} />
         </RadioButtonGroup>
       </Column>
       {editable && (

package/src/stock-operations/stock-operations-forms/stock-item-form/stock-item-form.scss

@@ -16,7 +16,6 @@
 }
 
 .button {
-  height: layout.$spacing-10;
   display: flex;
   align-content: flex-start;
   align-items: baseline;

package/src/stock-operations/stock-operations-forms/stock-item-form/stock-item-form.workspace.tsx

@@ -1,5 +1,3 @@
-import React, { useMemo } from 'react';
-import classNames from 'classnames';
 import {
   Button,
   ButtonSet,
@@ -12,7 +10,8 @@ import {
   TextInput,
 } from '@carbon/react';
 import { zodResolver } from '@hookform/resolvers/zod';
-import { useConfig, useLayoutType } from '@openmrs/esm-framework';
+import { DefaultWorkspaceProps, useConfig } from '@openmrs/esm-framework';
+import React, { useMemo } from 'react';
 import { Controller, useForm } from 'react-hook-form';
 import { useTranslation } from 'react-i18next';
 import { type z } from 'zod';
@@ -21,14 +20,14 @@ import {
   operationFromString,
   type StockOperationType,
 } from '../../../core/api/types/stockOperation/StockOperationType';
-import { type BaseStockOperationItemFormData, getStockOperationItemFormSchema } from '../../validation-schema';
-import { type ConfigObject } from '../../../config-schema';
 import { useStockItem } from '../../../stock-items/stock-items.resource';
+import { type BaseStockOperationItemFormData, getStockOperationItemFormSchema } from '../../validation-schema';
+import useOperationTypePermisions from '../hooks/useOperationTypePermisions';
 import BatchNoSelector from '../input-components/batch-no-selector.component';
 import QtyUomSelector from '../input-components/quantity-uom-selector.component';
-import UniqueBatchNoEntryInput from '../input-components/unique-batch-no-entry-input.component';
-import useOperationTypePermisions from '../hooks/useOperationTypePermisions';
 import styles from './stock-item-form.scss';
+import UniqueBatchNoEntryInput from '../input-components/unique-batch-no-entry-input.component';
+import { type ConfigObject } from '../../../config-schema';
 
 export interface StockItemFormProps {
   stockOperationType: StockOperationType;
@@ -38,19 +37,18 @@ export interface StockItemFormProps {
 }
 
 const StockItemForm: React.FC<StockItemFormProps> = ({ stockOperationType, stockOperationItem, onSave, onBack }) => {
-  const isTablet = useLayoutType() === 'tablet';
   const operationType = useMemo(() => {
     return operationFromString(stockOperationType.operationType);
   }, [stockOperationType]);
-  const formSchema = useMemo(() => {
+  const formschema = useMemo(() => {
     return getStockOperationItemFormSchema(operationType);
   }, [operationType]);
   const operationTypePermision = useOperationTypePermisions(stockOperationType);
   const { useItemCommonNameAsDisplay } = useConfig<ConfigObject>();
 
-  const fields = formSchema.keyof().options;
-  const form = useForm<z.infer<typeof formSchema>>({
-    resolver: zodResolver(formSchema),
+  const fields = formschema.keyof().options;
+  const form = useForm<z.infer<typeof formschema>>({
+    resolver: zodResolver(formschema),
     defaultValues: stockOperationItem,
     mode: 'all',
   });
@@ -68,10 +66,9 @@ const StockItemForm: React.FC<StockItemFormProps> = ({ stockOperationType, stock
     return `${item?.drugName || t('noDrugNameAvailable', 'No drug name available') + (commonName ?? '')}`;
   }, [item, useItemCommonNameAsDisplay, t]);
 
-  const onSubmit = (data: z.infer<typeof formSchema>) => {
+  const onSubmit = (data: z.infer<typeof formschema>) => {
     onSave?.(data);
   };
-
   return (
     <Form onSubmit={form.handleSubmit(onSubmit)} className={styles.form}>
       <Stack gap={4} className={styles.grid}>
@@ -200,12 +197,7 @@ const StockItemForm: React.FC<StockItemFormProps> = ({ stockOperationType, stock
         )}
       </Stack>
 
-      <ButtonSet
-        className={classNames(styles.buttonSet, {
-          [styles.tablet]: isTablet,
-          [styles.desktop]: !isTablet,
-        })}
-      >
+      <ButtonSet className={styles.buttonSet}>
         <Button className={styles.button} kind="secondary" onClick={onBack}>
           {t('discard', 'Discard')}
         </Button>

package/src/stock-operations/stock-operations-forms/stock-operation-form.scss

@@ -17,7 +17,6 @@
 }
 
 .button {
-  height: layout.$spacing-10;
   display: flex;
   align-content: flex-start;
   align-items: baseline;

package/src/stock-operations/stock-operations-forms/stock-operation-stepper/stepper.scss

@@ -5,7 +5,8 @@
 .layer {
   display: flex;
   flex-direction: row;
-  padding: 0 layout.$spacing-03 0;
+  gap: layout.$spacing-05;
+  padding: layout.$spacing-03;
   height: 100%;
 }
 
@@ -39,4 +40,5 @@
 
 .content {
   flex: 1;
+  overflow: auto;
 }

package/src/stock-operations/stock-operations-forms/stock-operation-stepper/stock-operation-stepper.component.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
 import { Layer } from '@carbon/react';
+import React from 'react';
 import styles from './stepper.scss';
 
 export type Step = {
@@ -17,7 +17,6 @@ type StockOperationStepperProps = {
   selectedIndex?: number;
   onChange?: (index: number) => void;
 };
-
 const StockOperationStepper: React.FC<StockOperationStepperProps> = ({
   steps,
   hasContainer,

package/src/stock-reports/generate-report/create-stock-report.scss

@@ -1,5 +1,5 @@
-@use '@carbon/layout';
-@use '@carbon/type';
+@use '@carbon/styles/scss/spacing';
+@use '@carbon/styles/scss/type';
 @use '@openmrs/esm-styleguide/src/vars' as *;
 
 .formContainer {
@@ -11,7 +11,6 @@
 }
 
 .button {
-  height: layout.$spacing-10;
   display: flex;
   align-content: flex-start;
   align-items: baseline;

package/src/stock-reports/generate-report/create-stock-report.workspace.tsx

@@ -1,48 +1,48 @@
 import React, { useEffect, useMemo, useState } from 'react';
-import classNames from 'classnames';
-import { useTranslation } from 'react-i18next';
 import {
   Button,
-  ButtonSet,
-  Checkbox,
+  InlineLoading,
   ComboBox,
-  DatePicker,
   DatePickerInput,
-  InlineLoading,
-  NumberInput,
-  RadioButton,
-  RadioButtonGroup,
+  DatePicker,
   Select,
   SelectItem,
+  RadioButtonGroup,
+  RadioButton,
+  Form,
+  Checkbox,
+  NumberInput,
+  ButtonSet,
 } from '@carbon/react';
+import styles from './create-stock-report.scss';
+import { useTranslation } from 'react-i18next';
+import { useReportTypes } from '../stock-reports.resource';
+import { DATE_PICKER_CONTROL_FORMAT, DATE_PICKER_FORMAT, formatForDatePicker, today } from '../../constants';
+import { Controller, useForm } from 'react-hook-form';
+import { zodResolver } from '@hookform/resolvers/zod';
+import { type StockReportSchema, reportSchema } from '../report-validation-schema';
+import { useConcept, useStockTagLocations } from '../../stock-lookups/stock-lookups.resource';
 import {
   type ConfigObject,
   type DefaultWorkspaceProps,
-  getCoreTranslation,
   restBaseUrl,
   showSnackbar,
   useConfig,
-  useLayoutType,
+  getCoreTranslation,
 } from '@openmrs/esm-framework';
-import { Controller, useForm } from 'react-hook-form';
-import { zodResolver } from '@hookform/resolvers/zod';
+import { type Concept } from '../../core/api/types/concept/Concept';
+import { createBatchJob } from '../../stock-batch/stock-batch.resource';
 import {
+  ReportParameter,
   getParamDefaultLimit,
   getReportEndDateLabel,
   getReportLimitLabel,
   getReportStartDateLabel,
-  ReportParameter,
 } from '../ReportType';
-import { DATE_PICKER_CONTROL_FORMAT, DATE_PICKER_FORMAT, formatForDatePicker, today } from '../../constants';
-import { BatchJobTypeReport } from '../../core/api/types/BatchJob';
-import { createBatchJob } from '../../stock-batch/stock-batch.resource';
 import { formatDisplayDate } from '../../core/utils/datetimeUtils';
+import { BatchJobTypeReport } from '../../core/api/types/BatchJob';
 import { handleMutate } from '../../utils';
-import { type Concept } from '../../core/api/types/concept/Concept';
-import { type StockReportSchema, reportSchema } from '../report-validation-schema';
-import { useConcept, useStockTagLocations } from '../../stock-lookups/stock-lookups.resource';
-import { useReportTypes } from '../stock-reports.resource';
-import styles from './create-stock-report.scss';
+import { Save } from '@carbon/react/icons';
 
 type CreateReportProps = DefaultWorkspaceProps & {
   model?: ReportModel;
@@ -76,11 +76,9 @@ export interface ReportModel {
   mostLeastMovingName?: string;
   fullFillment?: string[];
 }
-
 const CreateReport: React.FC<CreateReportProps> = ({ model, closeWorkspace }) => {
   const { t } = useTranslation();
   const { stockItemCategoryUUID } = useConfig<ConfigObject>();
-  const isTablet = useLayoutType() === 'tablet';
 
   const { reportTypes, isLoading } = useReportTypes();
   const { stockLocations } = useStockTagLocations();
@@ -642,17 +640,12 @@ const CreateReport: React.FC<CreateReportProps> = ({ model, closeWorkspace }) =>
         )}
       </div>
 
-      <ButtonSet
-        className={classNames(styles.buttonSet, {
-          [styles.tablet]: isTablet,
-          [styles.desktop]: !isTablet,
-        })}
-      >
+      <ButtonSet className={styles.buttonSet}>
         <Button kind="secondary" onClick={closeWorkspace} className={styles.button}>
-          {getCoreTranslation('cancel')}
+          {getCoreTranslation('cancel', 'Cancel')}
         </Button>
         <Button type="submit" className={styles.button} onClick={handleSave}>
-          {getCoreTranslation('save')}
+          {getCoreTranslation('save', 'Save')}
         </Button>
       </ButtonSet>
     </div>

package/src/stock-reports/report-list/stock-report-parameters.component.tsx

@@ -35,7 +35,7 @@ const StockReportParameters = (props: StockReportParametersProps) => {
       parseParametersToMap(props.model?.parameters, ['param.report']),
     );
   } catch (ex) {
-    console.error(ex);
+    console.log(ex);
   }
 
   return <span>{parameterMap}</span>;

package/src/stock-reports/report-list/stock-report-status.component.tsx

@@ -37,7 +37,7 @@ const StockReportStatus = (props: StockReportStatusProps) => {
   try {
     executionStateMap = displayParameterMap(props.model?.uuid, parseParametersToMap(props.model?.executionState));
   } catch (ex) {
-    console.error(ex);
+    console.log(ex);
   }
   return (
     <div className={styles.statusContainer}>

package/src/stock-reports/report-list/stock-reports.component.tsx

@@ -1,39 +1,32 @@
 import React, { useCallback, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import {
-  Button,
   DataTable,
   DataTableSkeleton,
-  InlineLoading,
+  TabPanel,
   Pagination,
   Table,
   TableBody,
   TableCell,
   TableContainer,
-  TableExpandedRow,
-  TableExpandHeader,
-  TableExpandRow,
   TableHead,
   TableHeader,
   TableRow,
   TableToolbar,
-  TableToolbarAction,
   TableToolbarContent,
-  TableToolbarMenu,
   TableToolbarSearch,
-  TabPanel,
   Tile,
+  Button,
+  InlineLoading,
+  TableToolbarMenu,
+  TableToolbarAction,
+  TableExpandHeader,
+  TableExpandRow,
+  TableExpandedRow,
 } from '@carbon/react';
-import {
-  CheckmarkOutline,
-  Copy,
-  Download,
-  IncompleteCancel,
-  MisuseOutline,
-  View,
-  WarningAltFilled,
-} from '@carbon/react/icons';
 import { isDesktop, restBaseUrl, useSession } from '@openmrs/esm-framework';
+import NewReportActionButton from './new-report-button.component';
+import styles from './stock-reports.scss';
 import { useGetReports } from '../stock-reports.resource';
 import {
   URL_BATCH_JOB_ARTIFACT,
@@ -48,12 +41,19 @@ import {
   BatchJobStatusFailed,
   BatchJobStatusPending,
 } from '../../core/api/types/BatchJob';
+import {
+  CheckmarkOutline,
+  Copy,
+  Download,
+  IncompleteCancel,
+  MisuseOutline,
+  View,
+  WarningAltFilled,
+} from '@carbon/react/icons';
 import { handleMutate } from '../../utils';
 import { PrivilagedView } from '../../core/components/privilages-component/privilages.component';
-import NewReportActionButton from './new-report-button.component';
 import StockReportStatus from './stock-report-status.component';
 import StockReportParameters from './stock-report-parameters.component';
-import styles from './stock-reports.scss';
 
 const StockReports: React.FC = () => {
   const { t } = useTranslation();
@@ -202,9 +202,12 @@ const StockReports: React.FC = () => {
   }
 
   return (
-    <div className={styles.container}>
+    <div className={styles.tableOverride}>
       <TabPanel>{t('ReportDescription', 'List of reports requested by users')}</TabPanel>
-
+      <div id="table-tool-bar">
+        <div></div>
+        <div className="right-filters"></div>
+      </div>
       <DataTable
         rows={tableRows}
         headers={tableHeaders}
@@ -222,9 +225,7 @@ const StockReports: React.FC = () => {
               <TableToolbarContent className={styles.toolbarContent}>
                 <TableToolbarSearch persistent onChange={onInputChange} />
                 <TableToolbarMenu>
-                  <TableToolbarAction className={styles.toolbarMenuAction} onClick={handleRefresh}>
-                    {t('refresh', 'Refresh')}
-                  </TableToolbarAction>
+                  <TableToolbarAction onClick={handleRefresh}>Refresh</TableToolbarAction>
                 </TableToolbarMenu>
                 {canCreateReport && <NewReportActionButton />}
               </TableToolbarContent>

package/src/stock-reports/report-list/stock-reports.scss

@@ -1,12 +1,8 @@
-@use '@carbon/colors';
+@use '@carbon/styles/scss/colors';
+@use '@carbon/styles/scss/type';
 @use '@carbon/layout';
-@use '@carbon/type';
 @use '@openmrs/esm-styleguide/src/vars' as *;
 
-.container {
-  margin: layout.$spacing-05;
-}
-
 .content {
   @include type.type-style('heading-compact-02');
   color: $text-02;
@@ -82,7 +78,3 @@
     margin-right: 4px;
   }
 }
-
-.toolbarMenuAction {
-  max-width: none;
-}

package/src/stock-sources/add-stock-sources/add-stock-sources.scss

@@ -2,6 +2,10 @@
 @use '@carbon/type';
 @use '@openmrs/esm-styleguide/src/vars' as *;
 
+.section {
+  margin: layout.$spacing-03;
+}
+
 .sectionTitle {
   @include type.type-style('heading-compact-02');
   color: $text-02;
@@ -11,7 +15,6 @@
 .modalBody {
   padding-bottom: layout.$spacing-05;
 }
-
 .formContainer {
   display: flex;
   flex-direction: column;
@@ -21,7 +24,6 @@
 }
 
 .button {
-  height: layout.$spacing-10;
   display: flex;
   align-content: flex-start;
   align-items: baseline;
@@ -37,12 +39,3 @@
 .body {
   padding: 1rem;
 }
-
-.tablet {
-  padding: layout.$spacing-06 layout.$spacing-05;
-  background-color: white;
-}
-
-.desktop {
-  padding: 0;
-}

package/src/stock-sources/add-stock-sources/add-stock-sources.test.tsx

@@ -1,16 +1,24 @@
 import React from 'react';
-import userEvent from '@testing-library/user-event';
 import { render, screen } from '@testing-library/react';
-import { type FetchResponse, useConfig } from '@openmrs/esm-framework';
-import { type StockSource } from '../../core/api/types/stockOperation/StockSource';
-import { createOrUpdateStockSource } from '../stock-sources.resource';
+import userEvent from '@testing-library/user-event';
+import '@testing-library/jest-dom/extend-expect';
 import StockSourcesAddOrUpdate from './add-stock-sources.workspace';
+import { createOrUpdateStockSource } from '../stock-sources.resource';
+import { useConfig } from '@openmrs/esm-framework';
 
-const mockCreateOrUpdateStockSource = jest.mocked(createOrUpdateStockSource);
-const mockUseConfig = jest.mocked(useConfig);
+import { type StockSource } from '../../core/api/types/stockOperation/StockSource';
 
-jest.mock('../stock-sources.resource', () => ({
-  createOrUpdateStockSource: jest.fn(),
+jest.mock('../stock-sources.resource');
+jest.mock('@openmrs/esm-framework', () => ({
+  showSnackbar: jest.fn(),
+  useConfig: jest.fn(),
+  getCoreTranslation: jest.fn((key, defaultValue) => {
+    const translations: Record<string, string> = {
+      cancel: 'Cancel',
+      save: 'Save',
+    };
+    return translations[key] ?? defaultValue;
+  }),
 }));
 
 jest.mock('../../stock-lookups/stock-lookups.resource', () => ({
@@ -26,7 +34,7 @@ jest.mock('../../stock-lookups/stock-lookups.resource', () => ({
 
 describe('StockSourcesAddOrUpdate', () => {
   beforeEach(() => {
-    mockUseConfig.mockReturnValue({ stockSourceTypeUUID: 'mock-uuid' });
+    (useConfig as jest.Mock).mockReturnValue({ stockSourceTypeUUID: 'mock-uuid' });
   });
 
   it('renders correctly without model prop', () => {
@@ -38,9 +46,9 @@ describe('StockSourcesAddOrUpdate', () => {
         promptBeforeClosing={jest.fn()}
       />,
     );
-    expect(screen.getByLabelText(/full name/i)).toBeInTheDocument();
-    expect(screen.getByLabelText(/acronym\/code/i)).toBeInTheDocument();
-    expect(screen.getByLabelText(/source type/i)).toBeInTheDocument();
+    expect(screen.getByLabelText('Full Name')).toBeInTheDocument();
+    expect(screen.getByLabelText('Acronym/Code')).toBeInTheDocument();
+    expect(screen.getByLabelText('Source Type')).toBeInTheDocument();
   });
 
   it('renders correctly with model prop', () => {
@@ -102,9 +110,9 @@ describe('StockSourcesAddOrUpdate', () => {
         promptBeforeClosing={jest.fn()}
       />,
     );
-    expect(screen.getByLabelText(/full name/i)).toHaveValue('Test Source');
-    expect(screen.getByLabelText(/acronym\/code/i)).toHaveValue('TS');
-    expect(screen.getByLabelText(/source type/i)).toHaveValue('type1');
+    expect(screen.getByLabelText('Full Name')).toHaveValue('Test Source');
+    expect(screen.getByLabelText('Acronym/Code')).toHaveValue('TS');
+    expect(screen.getByLabelText('Source Type')).toHaveValue('type1');
   });
 
   it('updates form fields correctly on user input', async () => {
@@ -118,21 +126,16 @@ describe('StockSourcesAddOrUpdate', () => {
       />,
     );
 
-    await user.type(screen.getByLabelText(/full name/i), 'New Source');
-    await user.type(screen.getByLabelText(/acronym\/code/i), 'NS');
+    await user.type(screen.getByLabelText('Full Name'), 'New Source');
+    await user.type(screen.getByLabelText('Acronym/Code'), 'NS');
 
-    expect(screen.getByLabelText(/full name/i)).toHaveValue('New Source');
-    expect(screen.getByLabelText(/acronym\/code/i)).toHaveValue('NS');
+    expect(screen.getByLabelText('Full Name')).toHaveValue('New Source');
+    expect(screen.getByLabelText('Acronym/Code')).toHaveValue('NS');
   });
 
   it('calls createOrUpdateStockSource with correct data on form submission', async () => {
     const user = userEvent.setup();
-    mockCreateOrUpdateStockSource.mockResolvedValue({
-      data: {},
-      ok: true,
-      status: 200,
-      statusText: 'OK',
-    } as unknown as FetchResponse);
+    (createOrUpdateStockSource as jest.Mock).mockResolvedValue({});
 
     render(
       <StockSourcesAddOrUpdate
@@ -143,20 +146,15 @@ describe('StockSourcesAddOrUpdate', () => {
       />,
     );
 
-    await user.type(screen.getByLabelText(/full name/i), 'New Source');
-    await user.type(screen.getByLabelText(/acronym\/code/i), 'NS');
-    await user.selectOptions(screen.getByLabelText(/source type/i), 'type2');
+    await user.type(screen.getByLabelText('Full Name'), 'New Source');
+    await user.type(screen.getByLabelText('Acronym/Code'), 'NS');
+    await user.selectOptions(screen.getByLabelText('Source Type'), 'type2');
     await user.click(screen.getByText('Save'));
   });
 
   it('shows success message and closes overlay on successful submission', async () => {
     const user = userEvent.setup();
-    mockCreateOrUpdateStockSource.mockResolvedValue({
-      data: {},
-      ok: true,
-      status: 200,
-      statusText: 'OK',
-    } as unknown as FetchResponse);
+    (createOrUpdateStockSource as jest.Mock).mockResolvedValue({});
 
     render(
       <StockSourcesAddOrUpdate
@@ -167,12 +165,12 @@ describe('StockSourcesAddOrUpdate', () => {
       />,
     );
 
-    await user.click(screen.getByText(/save/i));
+    await user.click(screen.getByText('Save'));
   });
 
   it('shows error message on failed submission', async () => {
     const user = userEvent.setup();
-    mockCreateOrUpdateStockSource.mockRejectedValue(new Error('API Error'));
+    (createOrUpdateStockSource as jest.Mock).mockRejectedValue(new Error('API Error'));
 
     render(
       <StockSourcesAddOrUpdate
@@ -183,7 +181,7 @@ describe('StockSourcesAddOrUpdate', () => {
       />,
     );
 
-    await user.click(screen.getByText(/save/i));
+    await user.click(screen.getByText('Save'));
   });
 
   it('closes overlay when cancel button is clicked', async () => {
@@ -197,6 +195,6 @@ describe('StockSourcesAddOrUpdate', () => {
       />,
     );
 
-    await user.click(screen.getByText(/cancel/i));
+    await user.click(screen.getByText('Cancel'));
   });
 });