@openmrs/esm-stock-management-app 1.0.1-pre.783 → 1.0.1-pre.788

package/src/stock-operations/stock-operations-forms/input-components/stock-operation-reason-selector.test.tsx

@@ -0,0 +1,216 @@
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import React from 'react';
+
+import { useConfig } from '@openmrs/esm-framework';
+import { useFormContext } from 'react-hook-form';
+import { useConcept } from '../../../stock-lookups/stock-lookups.resource';
+import StockOperationReasonSelector from './stock-operation-reason-selector.component';
+
+// Mock the hooks
+jest.mock('@openmrs/esm-framework', () => ({
+  useConfig: jest.fn(),
+}));
+
+jest.mock('react-hook-form', () => ({
+  useFormContext: jest.fn(),
+  Controller: ({ render }) => render({ field: {}, fieldState: {} }),
+}));
+jest.mock('../../../stock-lookups/stock-lookups.resource');
+jest.mock('react-i18next', () => ({
+  useTranslation: () => ({ t: (key: string) => key }),
+}));
+
+const mockUseConcept = useConcept as jest.Mock;
+const mockUseConfig = useConfig as jest.Mock;
+const mockUseFormContext = useFormContext as jest.Mock;
+
+describe('StockoperationReasonSelector', () => {
+  const mockConcepts = {
+    uuid: '3bbfaa44-d5b8-404d-b4c1-2bf49ad8ce25',
+    display: 'Stock Adjustment Reason',
+    name: {
+      display: 'Stock Adjustment Reason',
+      uuid: '4eb6556a-a2d4-4e85-9b62-4d076a1063fc',
+      name: 'Stock Adjustment Reason',
+      locale: 'en',
+      localePreferred: true,
+      conceptNameType: 'FULLY_SPECIFIED',
+      links: [
+        {
+          rel: 'self',
+          uri: 'http://qa.kenyahmis.org/openmrs/ws/rest/v1/concept/3bbfaa44-d5b8-404d-b4c1-2bf49ad8ce25/name/4eb6556a-a2d4-4e85-9b62-4d076a1063fc',
+          resourceAlias: 'name',
+        },
+        {
+          rel: 'full',
+          uri: 'http://qa.kenyahmis.org/openmrs/ws/rest/v1/concept/3bbfaa44-d5b8-404d-b4c1-2bf49ad8ce25/name/4eb6556a-a2d4-4e85-9b62-4d076a1063fc?v=full',
+          resourceAlias: 'name',
+        },
+      ],
+      resourceVersion: '1.9',
+    },
+    datatype: {
+      uuid: '8d4a48b6-c2cc-11de-8d13-0010c6dffd0f',
+      display: 'Coded',
+      links: [
+        {
+          rel: 'self',
+          uri: 'http://qa.kenyahmis.org/openmrs/ws/rest/v1/conceptdatatype/8d4a48b6-c2cc-11de-8d13-0010c6dffd0f',
+          resourceAlias: 'conceptdatatype',
+        },
+      ],
+    },
+    conceptClass: {
+      uuid: '8d491e50-c2cc-11de-8d13-0010c6dffd0f',
+      display: 'Question',
+      links: [
+        {
+          rel: 'self',
+          uri: 'http://qa.kenyahmis.org/openmrs/ws/rest/v1/conceptclass/8d491e50-c2cc-11de-8d13-0010c6dffd0f',
+          resourceAlias: 'conceptclass',
+        },
+      ],
+    },
+    set: false,
+    version: null,
+    retired: false,
+    names: [
+      {
+        uuid: '4eb6556a-a2d4-4e85-9b62-4d076a1063fc',
+        display: 'Stock Adjustment Reason',
+        links: [
+          {
+            rel: 'self',
+            uri: 'http://qa.kenyahmis.org/openmrs/ws/rest/v1/concept/3bbfaa44-d5b8-404d-b4c1-2bf49ad8ce25/name/4eb6556a-a2d4-4e85-9b62-4d076a1063fc',
+            resourceAlias: 'name',
+          },
+        ],
+      },
+      {
+        uuid: '36eb0855-c810-4816-9bed-1de5c615e702',
+        display: 'Stock Adjustment Reason',
+        links: [
+          {
+            rel: 'self',
+            uri: 'http://qa.kenyahmis.org/openmrs/ws/rest/v1/concept/3bbfaa44-d5b8-404d-b4c1-2bf49ad8ce25/name/36eb0855-c810-4816-9bed-1de5c615e702',
+            resourceAlias: 'name',
+          },
+        ],
+      },
+    ],
+    descriptions: [
+      {
+        uuid: '67311e07-1935-448b-8305-7d11abf0de63',
+        display: 'Stock Adjustment Reason',
+        links: [
+          {
+            rel: 'self',
+            uri: 'http://qa.kenyahmis.org/openmrs/ws/rest/v1/concept/3bbfaa44-d5b8-404d-b4c1-2bf49ad8ce25/description/67311e07-1935-448b-8305-7d11abf0de63',
+            resourceAlias: 'description',
+          },
+        ],
+      },
+    ],
+    mappings: [],
+    answers: [
+      {
+        uuid: '165420AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA',
+        display: 'Drug not available due to expired medication',
+        links: [
+          {
+            rel: 'self',
+            uri: 'http://qa.kenyahmis.org/openmrs/ws/rest/v1/concept/165420AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA',
+            resourceAlias: 'concept',
+          },
+        ],
+      },
+      {
+        uuid: '160584AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA',
+        display: 'Lost or ran out of medication',
+        links: [
+          {
+            rel: 'self',
+            uri: 'http://qa.kenyahmis.org/openmrs/ws/rest/v1/concept/160584AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA',
+            resourceAlias: 'concept',
+          },
+        ],
+      },
+      {
+        uuid: '122835AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA',
+        display: 'Work Shift Change',
+        links: [
+          {
+            rel: 'self',
+            uri: 'http://qa.kenyahmis.org/openmrs/ws/rest/v1/concept/122835AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA',
+            resourceAlias: 'concept',
+          },
+        ],
+      },
+      {
+        uuid: '160561AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA',
+        display: 'New drug available',
+        links: [
+          {
+            rel: 'self',
+            uri: 'http://qa.kenyahmis.org/openmrs/ws/rest/v1/concept/160561AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA',
+            resourceAlias: 'concept',
+          },
+        ],
+      },
+    ],
+    setMembers: [],
+    attributes: [],
+    links: [
+      {
+        rel: 'self',
+        uri: 'http://qa.kenyahmis.org/openmrs/ws/rest/v1/concept/3bbfaa44-d5b8-404d-b4c1-2bf49ad8ce25',
+        resourceAlias: 'concept',
+      },
+      {
+        rel: 'full',
+        uri: 'http://qa.kenyahmis.org/openmrs/ws/rest/v1/concept/3bbfaa44-d5b8-404d-b4c1-2bf49ad8ce25?v=full',
+        resourceAlias: 'concept',
+      },
+    ],
+    resourceVersion: '2.0',
+  };
+  beforeEach(() => {
+    jest.clearAllMocks();
+    mockUseConfig.mockReturnValue({ stockAdjustmentReasonUUID: 'uuid' });
+    mockUseConcept.mockReturnValue({
+      isLoading: false,
+      items: mockConcepts,
+    });
+  });
+
+  it('should display loading state while loading reason concepts', () => {
+    mockUseFormContext.mockReturnValue({ control: {} });
+    mockUseConcept.mockReturnValue({
+      isLoading: true,
+      items: mockConcepts,
+    });
+    render(<StockOperationReasonSelector />);
+    expect(screen.getByRole('progressbar')).toBeInTheDocument();
+  });
+  it('should display error notification when error encountered while fetching concepts', () => {
+    const errorMessahe = 'Error message';
+    mockUseConcept.mockReturnValue({
+      isLoading: false,
+      items: mockConcepts,
+      error: new Error(errorMessahe),
+    });
+    render(<StockOperationReasonSelector />);
+    expect(screen.getByRole('status')).toBeInTheDocument();
+    expect(screen.getByText(errorMessahe)).toBeInTheDocument();
+  });
+
+  it('renders ComboBox with reasons', async () => {
+    render(<StockOperationReasonSelector />);
+    const combobox = screen.getByRole('combobox');
+    await userEvent.click(combobox);
+    mockConcepts.answers.forEach((ans) => {
+      expect(screen.getByText(`${ans?.display}`)).toBeInTheDocument();
+    });
+  });
+});

package/src/stock-operations/{batch-no-selector → stock-operations-forms/input-components}/unique-batch-no-entry-input.component.tsx

@@ -1,31 +1,35 @@
 import { TextInput } from '@carbon/react';
 import React, { ChangeEvent, useEffect, useMemo, useState } from 'react';
-import { useStockItemBatchNos } from './batch-no-selector.resource';
 import { TextInputSkeleton } from '@carbon/react';
+import { useStockItemBatchNumbers } from '../hooks/useStockItemBatchNumbers';
+import { useTranslation } from 'react-i18next';
 
 type UniqueBatchNoEntryInputProps = {
   defaultValue?: string;
   onValueChange?: (value: string) => void;
   error?: string;
   stockItemUuid: string;
+  stockOperationItemUuid: string;
 };
 const UniqueBatchNoEntryInput: React.FC<UniqueBatchNoEntryInputProps> = ({
   defaultValue,
   onValueChange,
   error,
   stockItemUuid,
+  stockOperationItemUuid,
 }) => {
-  const { isLoading, stockItemBatchNos } = useStockItemBatchNos(stockItemUuid);
+  const { isLoading, stockItemBatchNos } = useStockItemBatchNumbers(stockItemUuid);
   const [value, setValue] = useState(defaultValue);
   const [_error, setError] = useState<string>();
-
+  const { t } = useTranslation();
+  const isNewItem = useMemo(() => stockOperationItemUuid.startsWith('new-item'), [stockOperationItemUuid]);
   const batchNoAlreadyUsed = useMemo(
-    () => stockItemBatchNos?.findIndex((batchNo) => batchNo.batchNo === value) !== -1,
-    [stockItemBatchNos, value],
+    () => isNewItem && stockItemBatchNos?.findIndex((batchNo) => batchNo.batchNo === value) !== -1,
+    [stockItemBatchNos, value, isNewItem],
   );
 
   useEffect(() => {
-    if (defaultValue) setValue(defaultValue);
+    if (defaultValue) setValue(defaultValue ?? '');
   }, [defaultValue]);
 
   useEffect(() => {
@@ -41,12 +45,13 @@ const UniqueBatchNoEntryInput: React.FC<UniqueBatchNoEntryInputProps> = ({
 
   return (
     <TextInput
-      size="sm"
       maxLength={50}
       onChange={(e: ChangeEvent<HTMLInputElement>) => setValue(e.target.value)}
       value={value}
       invalidText={_error ?? error}
       invalid={_error ?? error}
+      placeholder={t('batchNumber', 'Batch Number')}
+      labelText={t('batchNumber', 'Batch Number')}
     />
   );
 };

package/src/stock-operations/stock-operations-forms/input-components/user-selector.test.tsx

@@ -0,0 +1,110 @@
+import { fireEvent, render, screen, waitFor } from '@testing-library/react';
+import React from 'react';
+import { useFormContext } from 'react-hook-form';
+import { useUser } from '../../../stock-lookups/stock-lookups.resource';
+import useSearchUser from '../hooks/useSearchUser';
+import UsersSelector from './users-selector.component';
+import { otherUser } from '../../../core/utils/utils';
+import userEvent from '@testing-library/user-event';
+
+jest.mock('../hooks/useSearchUser');
+jest.mock('../../../stock-lookups/stock-lookups.resource');
+jest.mock('react-hook-form', () => ({
+  useFormContext: jest.fn(),
+  Controller: ({ render }) => render({ field: {}, fieldState: {} }),
+}));
+jest.mock('react-i18next', () => ({
+  useTranslation: () => ({ t: (key: string) => key }),
+}));
+
+const mockUseSearchUser = useSearchUser as jest.Mock;
+const mockUseUser = useUser as jest.Mock;
+const mockUseFormContext = useFormContext as jest.Mock;
+
+describe('UsersSelector', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    mockUseFormContext.mockReturnValue({
+      control: {},
+      watch: jest.fn().mockImplementation((field) => {
+        if (field === 'responsiblePersonUuid') return 'responsibleperson.uuid';
+        if (field === 'responsiblePersonOther') return 'responsiblepersonother.uuid';
+        return '';
+      }),
+      resetField: jest.fn(),
+    });
+  });
+
+  it('renders loading state', async () => {
+    mockUseSearchUser.mockReturnValue({ isLoading: true, userList: [], setSearchString: jest.fn() });
+    mockUseUser.mockReturnValue({ isLoading: true, data: null, error: null });
+
+    render(<UsersSelector />);
+
+    expect(screen.getByRole('progressbar')).toBeInTheDocument();
+  });
+
+  it('renders error state', () => {
+    const errorMessage = 'Error message';
+    mockUseSearchUser.mockReturnValue({ isLoading: false, userList: [], setSearchString: jest.fn() });
+    mockUseUser.mockReturnValue({ isLoading: false, data: null, error: new Error(errorMessage) });
+    render(<UsersSelector />);
+    expect(screen.getByText('responsiblePersonError')).toBeInTheDocument();
+    expect(screen.getByText(errorMessage)).toBeInTheDocument();
+  });
+
+  it('renders ComboBox with user list', async () => {
+    mockUseSearchUser.mockReturnValue({
+      isLoading: false,
+      userList: [
+        { uuid: '1', person: { display: 'User 1' } },
+        { uuid: '2', person: { display: 'User 2' } },
+      ],
+      setSearchString: jest.fn(),
+    });
+
+    mockUseUser.mockReturnValue({ isLoading: false, data: null, error: null });
+    render(<UsersSelector />);
+    expect(screen.getByText('responsiblePerson')).toBeInTheDocument();
+    const combobox = screen.getByRole('combobox');
+    fireEvent.click(combobox);
+    expect(screen.getByText('User 1')).toBeInTheDocument();
+    expect(screen.getByText('User 2')).toBeInTheDocument();
+  });
+
+  it('renders TextInput for other user', async () => {
+    mockUseSearchUser.mockReturnValue({ isLoading: false, userList: [], setSearchString: jest.fn() });
+    mockUseFormContext.mockReturnValue({
+      control: {},
+      watch: jest.fn().mockImplementation((field) => {
+        if (field === 'responsiblePersonUuid') return otherUser.uuid;
+        if (field === 'responsiblePersonOther') return '';
+        return '';
+      }),
+      resetField: jest.fn(),
+    });
+    mockUseUser.mockReturnValue({ isLoading: false, data: null, error: null });
+
+    render(<UsersSelector />);
+    expect(screen.getByRole('textbox')).toBeInTheDocument();
+    expect(screen.getByPlaceholderText('pleaseSpecify')).toBeInTheDocument();
+  });
+
+  it('calls setSearchString on input change after delay simulating debounce timout', async () => {
+    const setSearchString = jest.fn();
+    mockUseSearchUser.mockReturnValue({
+      isLoading: false,
+      userList: [],
+      setSearchString,
+    });
+
+    mockUseUser.mockReturnValue({ isLoading: false, data: null, error: null });
+
+    render(<UsersSelector />);
+    const combobox = screen.getByRole('combobox');
+    await userEvent.click(combobox);
+    await userEvent.type(combobox, 'test');
+    await new Promise((resolve) => setTimeout(resolve, 2000)); // Simulate debounce
+    expect(setSearchString).toHaveBeenCalledWith('test');
+  });
+});

package/src/stock-operations/stock-operations-forms/input-components/users-selector.component.tsx

@@ -0,0 +1,111 @@
+import { ComboBox, InlineNotification, SelectSkeleton } from '@carbon/react';
+import React, { useEffect } from 'react';
+import { Controller, useFormContext } from 'react-hook-form';
+import { useTranslation } from 'react-i18next';
+import { User } from '../../../core/api/types/identity/User';
+import { useDebounce } from '../../../core/hooks/debounce-hook';
+import { otherUser } from '../../../core/utils/utils';
+import { useUser } from '../../../stock-lookups/stock-lookups.resource';
+import useSearchUser from '../hooks/useSearchUser';
+import { Column } from '@carbon/react';
+import { TextInput } from '@carbon/react';
+
+const UsersSelector = () => {
+  const { isLoading, userList, setSearchString } = useSearchUser();
+  const { t } = useTranslation();
+  const debouncedSearch = useDebounce((query: string) => {
+    setSearchString(query);
+  }, 1000);
+
+  const form = useFormContext<{ responsiblePersonUuid: string; responsiblePersonOther: string }>();
+  const observableresponsiblePersonUuid = form.watch('responsiblePersonUuid');
+  const observableresponsiblePersonOther = form.watch('responsiblePersonOther');
+  const {
+    data,
+    isLoading: isLoadingUser,
+    error: userError,
+  } = useUser(observableresponsiblePersonUuid ?? null, 'custom:(uuid,display,person:(uuid,display))');
+  useEffect(() => {
+    // Whenever person uuid changes and not equal to other person, the other is reset to initial default value
+    if (observableresponsiblePersonUuid && observableresponsiblePersonUuid !== otherUser.uuid) {
+      form.resetField('responsiblePersonOther');
+    }
+  }, [observableresponsiblePersonUuid, form]);
+
+  if (isLoadingUser && observableresponsiblePersonUuid !== otherUser.uuid && observableresponsiblePersonUuid)
+    return <SelectSkeleton role="progressbar" />;
+
+  if (observableresponsiblePersonUuid && observableresponsiblePersonUuid !== otherUser.uuid && userError)
+    return (
+      <InlineNotification
+        lowContrast
+        title={t('responsiblePersonError', 'Error loading responsible person')}
+        subtitle={userError?.message}
+      />
+    );
+
+  return (
+    <React.Fragment>
+      <Column>
+        <Controller
+          name={'responsiblePersonUuid'}
+          control={form.control}
+          render={({ field, fieldState: { error } }) => (
+            <ComboBox
+              readOnly={field.disabled}
+              titleText={t('responsiblePerson', 'Responsible Person')}
+              name={'responsiblePersonUuid'}
+              id={'responsiblePersonUuid'}
+              size={'xl'}
+              items={[...(userList || []), otherUser]}
+              onChange={(data: { selectedItem: User }) => {
+                field.onChange(data.selectedItem?.uuid);
+              }}
+              initialSelectedItem={
+                field.value
+                  ? field.value === otherUser.uuid
+                    ? otherUser
+                    : data
+                  : observableresponsiblePersonOther && !observableresponsiblePersonUuid
+                  ? otherUser
+                  : ''
+              }
+              itemToString={(item) => item?.person?.display || ''}
+              onInputChange={debouncedSearch}
+              placeholder={t('filter', 'Filter ...')}
+              invalid={error?.message}
+              invalidText={error?.message}
+              ref={field.ref}
+            />
+          )}
+        />
+      </Column>
+      {(observableresponsiblePersonUuid === otherUser.uuid ||
+        (observableresponsiblePersonOther && !observableresponsiblePersonUuid)) && (
+        <Column>
+          <Controller
+            control={form.control}
+            name="responsiblePersonOther"
+            render={({ field, fieldState: { error } }) => (
+              <TextInput
+                {...field}
+                readOnly={field.disabled}
+                disabled={false}
+                id="responsiblePersonOther"
+                name="responsiblePersonOther"
+                size={'xl'}
+                labelText={t('responsiblePerson', 'Responsible Person')}
+                placeholder={t('pleaseSpecify', 'Please Specify')}
+                invalid={error?.message}
+                invalidText={error?.message}
+              />
+            )}
+          />
+        </Column>
+      )}
+    </React.Fragment>
+    // {isLoading && <InlineLoading status="active" iconDescription="Searching" description="Searching..." />}
+  );
+};
+
+export default UsersSelector;