@openmrs/esm-stock-management-app 3.1.1-pre.1179 → 3.1.1-pre.1186

package/src/stock-items/add-stock-item/stock-item-rules/add-stock-rules.component.tsx

@@ -136,9 +136,9 @@ const StockRulesAddOrUpdate: React.FC<AddStockRuleProps> = ({ model, stockItemUu
           () => {
             showSnackbar({
               isLowContrast: true,
-              title: t('addedRule', 'Add Rule'),
+              title: t('addedRule', 'Add rule'),
               kind: 'success',
-              subtitle: t('stockRuleAddedSuccessfully', 'Stock Rule Added Successfully'),
+              subtitle: t('stockRuleAddedSuccessfully', 'Stock rule added successfully'),
             });
             closeWorkspace?.();
           },
@@ -159,7 +159,7 @@ const StockRulesAddOrUpdate: React.FC<AddStockRuleProps> = ({ model, stockItemUu
   return (
     <Form onSubmit={onFormSubmit} className={styles.formContainer}>
       <div>
-        <FormGroup>
+        <FormGroup legendText={t('ruleConfiguration', 'Rule configuration')}>
           <section className={styles.section}>
             <section className={styles.section}>
               <Select
@@ -181,7 +181,7 @@ const StockRulesAddOrUpdate: React.FC<AddStockRuleProps> = ({ model, stockItemUu
               <TextInput
                 id="name"
                 type="text"
-                labelText={t('name', 'Rule Name')}
+                labelText={t('ruleName', 'Rule name')}
                 size="md"
                 onChange={onNameChanged}
                 value={model?.name}
@@ -193,7 +193,7 @@ const StockRulesAddOrUpdate: React.FC<AddStockRuleProps> = ({ model, stockItemUu
               <Select
                 name="quantityUnit"
                 className="select-field"
-                labelText={t('quantityUnit', 'Quantity Unit')}
+                labelText={t('quantityUnit', 'Quantity unit')}
                 id="quantityUnit"
                 value={formModel?.stockItemPackagingUOMUuid ? formModel.stockItemPackagingUOMUuid : ''}
                 onChange={onQuantityUnitChange}
@@ -215,7 +215,7 @@ const StockRulesAddOrUpdate: React.FC<AddStockRuleProps> = ({ model, stockItemUu
               <TextInput
                 id="quantity"
                 type="number"
-                labelText={t('quantity', 'Quantity Threshold')}
+                labelText={t('quantityThreshold', 'Quantity threshold')}
                 size="md"
                 onChange={onQuantityChanged}
                 value={model?.quantity}
@@ -225,12 +225,12 @@ const StockRulesAddOrUpdate: React.FC<AddStockRuleProps> = ({ model, stockItemUu
           </section>
         </FormGroup>
 
-        <FormGroup>
+        <FormGroup legendText={t('notifications', 'Notifications')}>
           <section className={styles.section}>
             <Select
               name="alertRole"
               className="select-field"
-              labelText={t('alertRole', 'Alert Role')}
+              labelText={t('alertRole', 'Alert role')}
               id="alertRole"
               value={formModel?.alertRole ? formModel.alertRole : ''}
               onChange={onAlertRoleChange}
@@ -245,7 +245,7 @@ const StockRulesAddOrUpdate: React.FC<AddStockRuleProps> = ({ model, stockItemUu
             <Select
               name="mailRole"
               className="select-field"
-              labelText={t('mailRole', 'Mail Role')}
+              labelText={t('mailRole', 'Mail role')}
               id="mailRole"
               value={formModel?.mailRole ? formModel.mailRole : ''}
               onChange={onMailRoleChange}
@@ -285,24 +285,24 @@ const StockRulesAddOrUpdate: React.FC<AddStockRuleProps> = ({ model, stockItemUu
             justifyContent: 'center',
           }}
         >
-          <FormGroup className="clear-margin-bottom">
-            <CheckboxGroup className={styles.checkboxGrid}>
+          <FormGroup className="clear-margin-bottom" legendText={t('enabled', 'Enabled')}>
+            <CheckboxGroup className={styles.checkboxGrid} legendText="">
               <Checkbox
                 onChange={onEnabledChanged}
                 checked={formModel?.enabled}
                 labelText={`Enabled ?`}
-                value={model?.enabled}
+                value={model?.enabled ? 'true' : 'false'}
                 id="chk-ruleEnabled"
               />
             </CheckboxGroup>
           </FormGroup>
-          <FormGroup className="clear-margin-bottom">
-            <CheckboxGroup className={styles.checkboxGrid}>
+          <FormGroup className="clear-margin-bottom" legendText={t('scope', 'Scope')}>
+            <CheckboxGroup className={styles.checkboxGrid} legendText="">
               <Checkbox
                 onChange={onAppliesToChildrenChanged}
                 name="appliesToChildren"
                 checked={formModel?.enableDescendants}
-                value={model?.enableDescendants}
+                value={model?.enableDescendants ? 'true' : 'false'}
                 labelText={`Applies to child locations?`}
                 id="chk-ruleAppliesToChildren"
               />
@@ -322,7 +322,7 @@ const StockRulesAddOrUpdate: React.FC<AddStockRuleProps> = ({ model, stockItemUu
           [styles.desktop]: !isTablet,
         })}
       >
-        <Button kind="secondary" onClick={closeWorkspace} className={styles.button}>
+        <Button kind="secondary" onClick={() => closeWorkspace()} className={styles.button}>
           {getCoreTranslation('cancel')}
         </Button>
         <Button type="submit" className={styles.button}>

package/src/stock-items/add-stock-item/stock-item-rules/stock-item-rules.component.tsx

@@ -18,9 +18,10 @@ import {
   TableToolbarSearch,
   Tile,
 } from '@carbon/react';
-import { isDesktop } from '@openmrs/esm-framework';
+import { isDesktop, restBaseUrl } from '@openmrs/esm-framework';
 import { formatDisplayDate } from '../../../core/utils/datetimeUtils';
 import { ResourceRepresentation } from '../../../core/api/api';
+import { handleMutate } from '../../../utils';
 import { type StockRule } from '../../../core/api/types/stockItem/StockRule';
 import { useStockItemRules } from './stock-item-rules.resource';
 import AddStockRuleActionButton from './add-stock-rule-button.component';
@@ -45,6 +46,10 @@ const StockItemRules: React.FC<StockItemRulesProps> = ({ stockItemUuid, model, c
       stockItemUuid: stockItemUuid,
     });
 
+  const handleRefresh = () => {
+    handleMutate(`${restBaseUrl}/stockmanagement/stockrule`);
+  };
+
   const tableRows = useMemo(() => {
     return items?.map((stockRule, index) => ({
       ...stockRule,
@@ -76,12 +81,8 @@ const StockItemRules: React.FC<StockItemRulesProps> = ({ stockItemUuid, model, c
 
   return (
     <div className={styles.tableOverride}>
-      <DataTable
-        rows={tableRows}
-        headers={tableHeaders}
-        isSortable={true}
-        useZebraStyles={true}
-        render={({ rows, headers, getHeaderProps, getTableProps, getRowProps, onInputChange }) => (
+      <DataTable rows={tableRows} headers={tableHeaders} isSortable useZebraStyles>
+        {({ rows, headers, getHeaderProps, getTableProps, getRowProps, onInputChange }) => (
           <TableContainer>
             <TableToolbar
               style={{
@@ -101,7 +102,7 @@ const StockItemRules: React.FC<StockItemRulesProps> = ({ stockItemUuid, model, c
                   <StockRulesFilter stockItemUuid={stockItemUuid} />
                 </div>
                 <TableToolbarMenu>
-                  <TableToolbarAction className={styles.toolbarMenuAction} onClick={''}>
+                  <TableToolbarAction className={styles.toolbarMenuAction} onClick={handleRefresh}>
                     {t('refresh', 'Refresh')}
                   </TableToolbarAction>
                 </TableToolbarMenu>
@@ -156,7 +157,7 @@ const StockItemRules: React.FC<StockItemRulesProps> = ({ stockItemUuid, model, c
             ) : null}
           </TableContainer>
         )}
-      ></DataTable>
+      </DataTable>
       <Pagination
         page={currentPage}
         pageSize={currentPageSize}

package/src/stock-items/add-stock-item/stock-item-rules/stock-rules-filter.component.tsx

@@ -1,14 +1,16 @@
-import styles from './stock-rules-filter.scss';
-import { Dropdown, DropdownSkeleton } from '@carbon/react';
 import React from 'react';
+import { Dropdown, DropdownSkeleton } from '@carbon/react';
+import { useTranslation } from 'react-i18next';
 import { useStockRules } from './stock-rules.resource';
 import { ResourceRepresentation } from '../../../core/api/api';
+import styles from './stock-rules-filter.scss';
 
 interface StockRulesFilterProps {
   stockItemUuid: string;
 }
 
 const StockRulesFilter: React.FC<StockRulesFilterProps> = ({ stockItemUuid }) => {
+  const { t } = useTranslation();
   const { items, isLoading, error } = useStockRules({
     v: ResourceRepresentation.Default,
     totalCount: true,
@@ -18,15 +20,18 @@ const StockRulesFilter: React.FC<StockRulesFilterProps> = ({ stockItemUuid }) =>
   if (isLoading || error) {
     return <DropdownSkeleton />;
   }
+
   return (
     <>
       <div className={styles.filterContainer}>
         <Dropdown
           id="stockRulesFiter"
           items={[...items.results]}
-          itemToString={(item) => (item ? item.display : 'Not Set')}
+          itemToString={(item) => (item ? item.name : t('notSet', 'Not Set'))}
           type="inline"
           size="sm"
+          label={t('filterStockRules', 'Filter stock rules')}
+          titleText={t('stockRules', 'Stock rules')}
         />
       </div>
     </>

package/src/stock-items/add-stock-item/stock-item-units-edit/stock-item-units-edit.component.tsx

@@ -1,11 +1,11 @@
 import React from 'react';
 import { useTranslation } from 'react-i18next';
+import { NumberInputSkeleton } from '@carbon/react';
 import { useStockItem } from '../../stock-items.resource';
-import DispensingPackageMeasurement from '../dispensing-package-measurement/dispensing-package-measurement.component';
 import { type Control, type FormState } from 'react-hook-form';
 import { type StockItemFormData } from '../../validationSchema';
 import ControlledNumberInput from '../../../core/components/carbon/controlled-number-input.component';
-import { NumberInputSkeleton } from '@carbon/react';
+import DispensingPackageMeasurement from '../dispensing-package-measurement/dispensing-package-measurement.component';
 
 interface StockItemUnitsEditProps {
   stockItemUuid: string;

package/src/stock-items/add-stock-item/transactions/printout/printable-bincard-transaction-header.component.tsx

@@ -1,8 +1,8 @@
 import React from 'react';
-import styles from './printable-transaction-header.scss';
-import { useConfig } from '@openmrs/esm-framework';
+import { startCase } from 'lodash-es';
 import { useTranslation } from 'react-i18next';
-import startCase from 'lodash-es/startCase';
+import { useConfig } from '@openmrs/esm-framework';
+import styles from './printable-transaction-header.scss';
 
 interface PrintableTransactionHeaderProps {
   itemName: string;
@@ -15,7 +15,7 @@ const PrintableBincardTransactionHeader: React.FC<PrintableTransactionHeaderProp
   return (
     <div className={styles.container}>
       <div className={styles.printableHeader}>
-        <p className={styles.heading}>{t('bincard', 'Bin Card')}</p>
+        <p className={styles.heading}>{t('binCard', 'Bin card')}</p>
         {logo?.src ? (
           <img className={styles.img} height={60} width={250} src={logo.src} alt={logo.alt} />
         ) : logo?.name ? (
@@ -41,7 +41,7 @@ const PrintableBincardTransactionHeader: React.FC<PrintableTransactionHeaderProp
 
       <div className={styles.printableBody}>
         <div className={styles.transactionDetails}>
-          <p className={styles.itemHeading}>{t('itemname', 'Item Name')}</p>
+          <p className={styles.itemHeading}>{t('itemName', 'Item name')}</p>
           <p className={styles.itemLabel}>{startCase(itemName)}</p>
         </div>
       </div>

package/src/stock-items/add-stock-item/transactions/printout/printable-stockcard-transaction-header.component.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import styles from './printable-transaction-header.scss';
 import { useConfig } from '@openmrs/esm-framework';
 import { useTranslation } from 'react-i18next';
-import startCase from 'lodash-es/startCase';
+import { startCase } from 'lodash-es';
 
 interface PrintableTransactionHeaderProps {
   itemName: string;
@@ -15,7 +15,7 @@ const PrintableStockcardTransactionHeader: React.FC<PrintableTransactionHeaderPr
   return (
     <div className={styles.container}>
       <div className={styles.printableHeader}>
-        <p className={styles.heading}>{t('bincard', 'Stock Card')}</p>
+        <p className={styles.heading}>{t('stockCard', 'Stock card')}</p>
         {logo?.src ? (
           <img className={styles.img} height={60} width={250} src={logo.src} alt={logo.alt} />
         ) : logo?.name ? (
@@ -41,7 +41,7 @@ const PrintableStockcardTransactionHeader: React.FC<PrintableTransactionHeaderPr
 
       <div className={styles.printableBody}>
         <div className={styles.transactionDetails}>
-          <p className={styles.itemHeading}>{t('itemname', 'Item Name')}</p>
+          <p className={styles.itemHeading}>{t('itemName', 'Item name')}</p>
           <p className={styles.itemLabel}>{startCase(itemName)}</p>
         </div>
       </div>

package/src/stock-items/add-stock-item/transactions/printout/transactions-print-action.component.tsx

@@ -1,13 +1,12 @@
 import React, { useEffect, useMemo, useState } from 'react';
-import { Button, Stack, ComboButton, MenuItem } from '@carbon/react';
+import { ComboButton, MenuItem } from '@carbon/react';
 import { Printer } from '@carbon/react/icons';
 import { useTranslation } from 'react-i18next';
 import { useStockItem, useStockItemInventory } from '../../../stock-items.resource';
 import { showModal, useConfig } from '@openmrs/esm-framework';
-import { type ConfigObject } from '../../../../config-schema';
-import styles from './printable-transaction.scss';
 import { type StockItemInventoryFilter, useStockItemTransactions } from '../../../stock-items.resource';
 import { ResourceRepresentation } from '../../../../core/api/api';
+import { type ConfigObject } from '../../../../config-schema';
 
 type Props = {
   itemUuid: string;
@@ -156,14 +155,12 @@ const TransactionsPrintAction: React.FC<Props> = ({ columns, data, itemUuid, fil
           <MenuItem
             label={t('printStockCard', 'Print Stock Card')}
             renderIcon={(props) => <Printer size={24} {...props} />}
-            iconDescription="Print Stock Card"
             onClick={handleStockcardClick}
             disabled={isStockItemLoading || isStockCardLoading}
           />
           <MenuItem
             label={t('printBinCard', 'Print Bin Card')}
             renderIcon={(props) => <Printer size={24} {...props} />}
-            iconDescription="Print Bin Card"
             onClick={handleBincardClick}
             disabled={isStockItemLoading}
           />

package/src/stock-items/add-stock-item/transactions/printout/transactions-print-bincard-preview.modal.tsx

@@ -28,7 +28,7 @@ const TransactionsBincardPrintPreviewModal: React.FC<TransactionsBincardPrintPre
   });
   return (
     <>
-      <ModalHeader closeModal={onClose} title={t('printbincard', 'Print Bin Card')} />
+      <ModalHeader closeModal={onClose} title={t('printBinCard', 'Print Bin Card')} />
       <ModalBody>
         <div ref={ref}>
           <TransactionsBincardPrintout title={title} columns={columns} data={data} />

package/src/stock-items/add-stock-item/transactions/transaction-filters/transaction-locations-filter.component.tsx

@@ -27,9 +27,6 @@ const TransactionsLocationsFilter = <T,>(props: TransactionsLocationsFilterProps
       render={({ field: { onChange, value, ref } }) => (
         <ComboBox
           titleText={props.title}
-          name={props.name}
-          control={props.control}
-          controllerName={props.controllerName}
           id={props.name}
           size={'md'}
           items={stockLocations ?? []}

package/src/stock-items/components/filter-stock-items/filter-stock-items.component.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import { useTranslation } from 'react-i18next';
 import { RadioButton, RadioButtonGroup } from '@carbon/react';
 import styles from './filter-stock-items.scss';
 
@@ -8,16 +9,17 @@ interface FilterStockItemsProps {
 }
 
 const FilterStockItems: React.FC<FilterStockItemsProps> = ({ filterType, changeFilterType }) => {
+  const { t } = useTranslation();
   return (
     <RadioButtonGroup
       name="is-drug"
       defaultSelected={filterType}
-      onChange={changeFilterType}
+      onChange={(value) => changeFilterType(value as string)}
       className={styles.spacing}
     >
-      <RadioButton labelText="All" value="" id="is-drug-all" />
-      <RadioButton labelText="Pharmaceuticals" value="true" id="is-drug-drug" />
-      <RadioButton labelText="Non Pharmaceuticals" value="false" id="is-drug-other" />
+      <RadioButton labelText={t('all', 'All')} value="" id="is-drug-all" />
+      <RadioButton labelText={t('pharmaceuticals', 'Pharmaceuticals')} value="true" id="is-drug-drug" />
+      <RadioButton labelText={t('nonPharmaceuticals', 'Non Pharmaceuticals')} value="false" id="is-drug-other" />
     </RadioButtonGroup>
   );
 };

package/src/stock-items/edit-stock-item/edit-stock-item-action-menu.component.tsx

@@ -19,7 +19,7 @@ const EditStockItemActionsMenu: React.FC<EditStockItemActionsMenuProps> = ({ dat
         data.isDrug = !!data.drugUuid;
         launchAddOrEditStockItemWorkspace(t, data);
       }}
-      iconDescription={t('editStockItem', 'Edit Stock Item')}
+      iconDescription={t('editStockItem', 'Edit stock item')}
     >
       {`${data?.drugName ?? data.conceptName}`}
     </Button>

package/src/stock-items/stock-items-table.component.tsx

@@ -31,6 +31,7 @@ import AddStockItemActionButton from './add-stock-item/add-stock-action-button.c
 import AddStockItemsBulktImportActionButton from './add-bulk-stock-item/add-stock-items-bulk-import-action-button.component';
 import EditStockItemActionsMenu from './edit-stock-item/edit-stock-item-action-menu.component';
 import FilterStockItems from './components/filter-stock-items/filter-stock-items.component';
+import { type CustomTableHeader } from '../core/components/table/types';
 import styles from './stock-items-table.scss';
 
 interface StockItemsTableProps {
@@ -80,17 +81,17 @@ const StockItemsTableComponent: React.FC<StockItemsTableProps> = () => {
       },
       {
         id: 1,
-        header: t('genericName', 'Generic Name'),
+        header: t('genericName', 'Generic name'),
         key: 'genericName',
       },
       {
         id: 2,
-        header: t('commonName', 'Common Name'),
+        header: t('commonName', 'Common name'),
         key: 'commonName',
       },
       {
         id: 3,
-        header: t('tradeName', 'Trade Name'),
+        header: t('tradeName', 'Trade name'),
         key: 'tradeName',
       },
       {
@@ -100,12 +101,12 @@ const StockItemsTableComponent: React.FC<StockItemsTableProps> = () => {
       },
       {
         id: 5,
-        header: t('defaultStockOperationsUoMName', 'Bulk Packaging'),
+        header: t('defaultStockOperationsUoMName', 'Bulk packaging'),
         key: 'defaultStockOperationsUoMName',
       },
       {
         id: 6,
-        header: t('reorderLevel', 'Reorder Level'),
+        header: t('reorderLevel', 'Reorder level'),
         key: 'reorderLevel',
       },
       {
@@ -159,12 +160,8 @@ const StockItemsTableComponent: React.FC<StockItemsTableProps> = () => {
       <h2 className={styles.tableHeader}>
         {t('stockItemsTableHeader', 'Drugs and other stock items managed by the system.')}
       </h2>
-      <DataTable
-        rows={tableRows}
-        headers={tableHeaders}
-        isSortable
-        useZebraStyles
-        render={({ rows, headers, getHeaderProps, getTableProps, getRowProps, getBatchActionProps }) => (
+      <DataTable rows={tableRows} headers={tableHeaders} isSortable useZebraStyles>
+        {({ rows, headers, getHeaderProps, getTableProps, getRowProps, getBatchActionProps }) => (
           <TableContainer>
             <TableToolbar
               style={{
@@ -181,7 +178,9 @@ const StockItemsTableComponent: React.FC<StockItemsTableProps> = () => {
                 }}
               >
                 <TableToolbarSearch
-                  onChange={(e) => handleSearch(e.target.value)}
+                  onChange={(e) =>
+                    handleSearch(typeof e === 'string' ? e : (e as React.ChangeEvent<HTMLInputElement>).target.value)
+                  }
                   persistent
                   placeholder={t('searchStockItems', 'Search stock items')}
                   value={searchInput}
@@ -205,13 +204,20 @@ const StockItemsTableComponent: React.FC<StockItemsTableProps> = () => {
                         <TableHeader
                           {...getHeaderProps({
                             header,
-                            isSortable: header.isSortable,
+                            isSortable: (header as CustomTableHeader).isSortable,
                           })}
                           className={isDesktop ? styles.desktopHeader : styles.tabletHeader}
                           key={`${header.key}`}
                           isSortable={header.key !== 'name'}
                         >
-                          {header.header?.content ?? header.header}
+                          {(() => {
+                            const customHeader = header as CustomTableHeader;
+                            return typeof customHeader.header === 'object' &&
+                              customHeader.header !== null &&
+                              'content' in customHeader.header
+                              ? (customHeader.header.content as React.ReactNode)
+                              : (customHeader.header as React.ReactNode);
+                          })()}
                         </TableHeader>
                       ),
                   )}
@@ -249,7 +255,7 @@ const StockItemsTableComponent: React.FC<StockItemsTableProps> = () => {
             ) : null}
           </TableContainer>
         )}
-      ></DataTable>
+      </DataTable>
       <Pagination
         className={styles.paginationOverride}
         onChange={({ page, pageSize }) => {

package/src/stock-items/stock-items-table.resource.ts

@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useState } from 'react';
+import { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { usePagination } from '@openmrs/esm-framework';
 import { type StockItemFilter, useStockItems } from './stock-items.resource';

package/src/stock-items/stock-items.resource.ts

@@ -10,8 +10,7 @@ import { type StockItemReference, type StockItemReferenceDTO } from '../core/api
 import { type StockItemTransactionDTO } from '../core/api/types/stockItem/StockItemTransaction';
 import { type StockRule } from '../core/api/types/stockItem/StockRule';
 import { type StockOperationItemCost } from '../core/api/types/stockOperation/StockOperationItemCost';
-import { z } from 'zod';
-import { stockItemDetailsSchema, type StockItemFormData } from './validationSchema';
+import { type StockItemFormData } from './validationSchema';
 
 export interface StockItemFilter extends ResourceFilterCriteria {
   isDrug?: string | null | undefined;

package/src/stock-locations/add-locations-form.workspace.tsx

@@ -3,8 +3,8 @@ import { useTranslation } from 'react-i18next';
 import { showSnackbar } from '@openmrs/esm-framework';
 import { saveLocation } from './stock-locations-table.resource';
 import { type locationData, type LocationMutator } from '../stock-items/types';
-import LocationAdministrationForm from './location-admin-form.component';
 import { extractErrorMessagesFromResponse } from '../constants';
+import LocationAdministrationForm from './location-admin-form.component';
 
 interface LocationFormProps {
   showModal: boolean;
@@ -33,7 +33,7 @@ const NewLocationForm: React.FC<LocationFormProps> = ({ showModal, onModalChange
       saveLocation({ locationPayload: locationbject })
         .then(() => {
           showSnackbar({
-            title: t('formCreated', 'Add Location'),
+            title: t('locationCreatedTitle', 'Location created'),
             kind: 'success',
             isLowContrast: true,
             subtitle: t('locationCreatedSuccessfully', 'Location {{locationName}} was created successfully.', {
@@ -60,15 +60,13 @@ const NewLocationForm: React.FC<LocationFormProps> = ({ showModal, onModalChange
   );
 
   return (
-    <>
-      <LocationAdministrationForm
-        onModalChange={onModalChange}
-        showModal={showModal}
-        handleCreateQuestion={handleCreateQuestion}
-        headerTitle={headerTitle}
-        initialData={initialData}
-      />
-    </>
+    <LocationAdministrationForm
+      onModalChange={onModalChange}
+      showModal={showModal}
+      handleCreateQuestion={handleCreateQuestion}
+      headerTitle={headerTitle}
+      initialData={initialData}
+    />
   );
 };
 export default NewLocationForm;

package/src/stock-locations/location-admin-form.component.tsx

@@ -101,7 +101,7 @@ const LocationAdministrationForm: React.FC<LocationAdministrationFormProps> = ({
                   <>
                     <TextInput
                       id="location"
-                      labelText={t('location', 'Location Name')}
+                      labelText={t('locationName', 'Location name')}
                       placeholder={t('locationPlaceholder', 'Add a location')}
                       invalidText={fieldState.error?.message}
                       {...field}
@@ -116,11 +116,16 @@ const LocationAdministrationForm: React.FC<LocationAdministrationFormProps> = ({
                   render={({ field }) => (
                     <FilterableMultiSelect
                       id="tag"
-                      titleText={t('selectTags', 'Select tag(s)')}
-                      helperText="This is helper text"
+                      titleText={t('selectTags', 'Select tags')}
+                      helperText={t('selectTagsHelper', 'Select one or more tags for this location')}
                       items={Tags ?? []}
                       {...field}
-                      itemToString={(item) => (item ? item.display : '')}
+                      itemToString={(item) => {
+                        if (item && typeof item === 'object' && 'display' in item) {
+                          return (item as { display: string }).display;
+                        }
+                        return '';
+                      }}
                       selectionFeedback="top-after-reopen"
                     />
                   )}

package/src/stock-locations/stock-locations-table.component.tsx

@@ -9,7 +9,7 @@ import {
 } from '@carbon/react';
 import { Add } from '@carbon/react/icons';
 import { useTranslation } from 'react-i18next';
-import { mutate } from 'swr';
+import { useSWRConfig } from 'swr';
 import { restBaseUrl } from '@openmrs/esm-framework';
 import { handleMutate } from '../utils';
 import { ResourceRepresentation } from '../core/api/api';
@@ -24,7 +24,7 @@ interface StockLocationsTableProps {
 
 const StockLocationsItems: React.FC<StockLocationsTableProps> = () => {
   const { t } = useTranslation();
-
+  const { mutate } = useSWRConfig();
   const [showLocationModal, setAddLocationModal] = useState(false);
 
   const { tableHeaders, tableRows, items, isLoading } = useStockLocationPages({
@@ -69,7 +69,7 @@ const StockLocationsItems: React.FC<StockLocationsTableProps> = () => {
   return (
     <div className={styles.tileContainer}>
       <Tile className={styles.tile}>
-        <p className={styles.content}>{t('noStockItemsToDisplay', 'No stock items to display')}</p>
+        <p className={styles.content}>{t('noLocationsToDisplay', 'No locations to display')}</p>
       </Tile>
     </div>
   );

package/src/stock-lookups/stock-lookups.resource.ts

@@ -15,7 +15,7 @@ import { type OpenMRSLocation, type OpenMRSLocationTag } from '../core/api/types
 import { type PageableResult } from '../core/api/types/PageableResult';
 import { type Party } from '../core/api/types/Party';
 import { type Patient } from '../core/api/types/identity/Patient';
-import { type ResourceFilterCriteria, toQueryParams } from '../core/api/api';
+import { type ResourceFilterCriteria, type ResourceRepresentation, toQueryParams } from '../core/api/api';
 import { type Role } from '../core/api/types/identity/Role';
 import { type StockOperationType } from '../core/api/types/stockOperation/StockOperationType';
 import { type User } from '../core/api/types/identity/User';
@@ -166,7 +166,7 @@ export function useUsers(filter: UserFilterCriteria) {
 
 // getUser
 export function useUser(id: string, v?: string) {
-  const apiUrl = `${restBaseUrl}/user/${id}${toQueryParams({ v: v as any })}`;
+  const apiUrl = `${restBaseUrl}/user/${id}${toQueryParams({ v: (v as ResourceRepresentation) || undefined })}`;
   const { data, error, isLoading } = useSWR<
     {
       data: User;

package/src/stock-management-admin-card-link.component.tsx

@@ -11,7 +11,7 @@ const StockManagementCardLink: React.FC = () => {
       <ClickableTile href={window.getOpenmrsSpaBase() + 'stock-management'} rel="noopener noreferrer">
         <div>
           <div className="heading">{header}</div>
-          <div className="content">{t('stockManagement', 'Stock Management')}</div>
+          <div className="content">{t('stockManagement', 'Stock management')}</div>
         </div>
         <div className="iconWrapper">
           <ArrowRight size={16} />