From 15cb15f993bd44d53a2357f4964d563f34ddaf19 Mon Sep 17 00:00:00 2001 From: Mutagubya Jonathan Date: Wed, 27 Nov 2024 20:07:13 +0300 Subject: [PATCH 1/2] (chore) Bump @carbon/react to v1.71.0 (#1385) Co-authored-by: Dennis Kigen --- package.json | 2 +- packages/esm-active-visits-app/package.json | 2 +- packages/esm-appointments-app/package.json | 2 +- .../src/appointments.test.tsx | 4 +- .../src/form/appointments-form.component.tsx | 2 + .../src/form/appointments-form.test.tsx | 3 + packages/esm-bed-management-app/package.json | 2 +- .../package.json | 2 +- .../esm-patient-registration-app/package.json | 2 +- .../field/gender/gender-field.component.tsx | 8 +- .../patient-registration.test.tsx | 246 ++++++++---- packages/esm-patient-search-app/package.json | 2 +- .../compact-patient-banner.component.tsx | 4 +- packages/esm-service-queues-app/package.json | 2 +- .../clinic-metrics.component.tsx | 1 + .../metrics-header.component.tsx | 8 +- .../queue-linelist-base-table.component.tsx | 2 +- ...scheduled-appointments-table.component.tsx | 2 +- .../queue-service-form.workspace.tsx | 29 +- .../default-queue-table.component.tsx | 12 +- packages/esm-ward-app/package.json | 2 +- .../cancel-admission-request.test.tsx | 8 +- turbo.json | 7 +- yarn.lock | 352 +++++++++++++++++- 24 files changed, 569 insertions(+), 137 deletions(-) diff --git a/package.json b/package.json index 65701f7cf..31bc64daf 100644 --- a/package.json +++ b/package.json @@ -26,7 +26,7 @@ }, "devDependencies": { "@babel/core": "^7.11.6", - "@carbon/react": "~1.37.0", + "@carbon/react": "^1.71.0", "@openmrs/esm-framework": "next", "@openmrs/esm-patient-common-lib": "next", "@playwright/test": "1.48.2", diff --git a/packages/esm-active-visits-app/package.json b/packages/esm-active-visits-app/package.json index 4a9e4bb51..2bbad0817 100644 --- a/packages/esm-active-visits-app/package.json +++ b/packages/esm-active-visits-app/package.json @@ -37,7 +37,7 @@ "url": "https://github.com/openmrs/openmrs-esm-patient-management/issues" }, "dependencies": { - "@carbon/react": "~1.37.0", + "@carbon/react": "^1.71.0", "lodash-es": "^4.17.15" }, "peerDependencies": { diff --git a/packages/esm-appointments-app/package.json b/packages/esm-appointments-app/package.json index 2c67163be..c91ba8a0e 100644 --- a/packages/esm-appointments-app/package.json +++ b/packages/esm-appointments-app/package.json @@ -37,7 +37,7 @@ "url": "https://github.com/openmrs/openmrs-esm-patient-management/issues" }, "dependencies": { - "@carbon/react": "~1.37.0", + "@carbon/react": "^1.71.0", "formik": "^2.2.9", "lodash-es": "^4.17.15", "yup": "^0.32.11" diff --git a/packages/esm-appointments-app/src/appointments.test.tsx b/packages/esm-appointments-app/src/appointments.test.tsx index 972843323..9af425edf 100644 --- a/packages/esm-appointments-app/src/appointments.test.tsx +++ b/packages/esm-appointments-app/src/appointments.test.tsx @@ -9,7 +9,9 @@ describe('Appointments', () => { await screen.findByText(/^appointments$/i); expect(screen.getByRole('button', { name: /appointments calendar/i })).toBeInTheDocument(); expect(screen.getByPlaceholderText(/dd-mmm-yyyy/i)).toBeInTheDocument(); - expect(screen.getByRole('combobox', { name: /view/i })).toBeInTheDocument(); + screen.getByRole('combobox', { + name: /select service type/i, + }); expect(screen.getByText(/appointment metrics/i)).toBeInTheDocument(); }); }); diff --git a/packages/esm-appointments-app/src/form/appointments-form.component.tsx b/packages/esm-appointments-app/src/form/appointments-form.component.tsx index 97f20f5e7..bc92d335f 100644 --- a/packages/esm-appointments-app/src/form/appointments-form.component.tsx +++ b/packages/esm-appointments-app/src/form/appointments-form.component.tsx @@ -354,7 +354,9 @@ const AppointmentsForm: React.FC appointmentRequest: appointmentPayload, recurringPattern: constructRecurringPattern(data), }; + const abortController = new AbortController(); + (isRecurringAppointment ? saveRecurringAppointments(recurringAppointmentPayload, abortController) : saveAppointment(appointmentPayload, abortController) diff --git a/packages/esm-appointments-app/src/form/appointments-form.test.tsx b/packages/esm-appointments-app/src/form/appointments-form.test.tsx index 033bb185e..59e9963d3 100644 --- a/packages/esm-appointments-app/src/form/appointments-form.test.tsx +++ b/packages/esm-appointments-app/src/form/appointments-form.test.tsx @@ -20,6 +20,8 @@ const defaultProps = { closeWorkspace: jest.fn(), patientUuid: mockPatient.id, promptBeforeClosing: jest.fn(), + closeWorkspaceWithSavedChanges: jest.fn(), + setTitle: jest.fn(), }; const mockCreateAppointment = jest.mocked(saveAppointment); @@ -206,6 +208,7 @@ describe('AppointmentForm', () => { await user.selectOptions(timeFormat, 'AM'); await user.selectOptions(serviceSelect, ['Outpatient']); await user.selectOptions(appointmentTypeSelect, ['Scheduled']); + // TODO: Fix the `Error: Not implemented: HTMLFormElement.prototype.requestSubmit` error shown after the form is submitted await user.click(saveButton); }); }); diff --git a/packages/esm-bed-management-app/package.json b/packages/esm-bed-management-app/package.json index fe6cb162f..2772a26dc 100644 --- a/packages/esm-bed-management-app/package.json +++ b/packages/esm-bed-management-app/package.json @@ -37,7 +37,7 @@ "url": "https://github.com/openmrs/openmrs-esm-patient-management/issues" }, "dependencies": { - "@carbon/react": "~1.37.0", + "@carbon/react": "^1.71.0", "lodash-es": "^4.17.15" }, "peerDependencies": { diff --git a/packages/esm-patient-list-management-app/package.json b/packages/esm-patient-list-management-app/package.json index 02cfa77bc..7fb7edcdd 100644 --- a/packages/esm-patient-list-management-app/package.json +++ b/packages/esm-patient-list-management-app/package.json @@ -37,7 +37,7 @@ "url": "https://github.com/openmrs/openmrs-esm-patient-management/issues" }, "dependencies": { - "@carbon/react": "~1.37.0", + "@carbon/react": "^1.71.0", "dexie": "^3.0.3", "fuzzy": "^0.1.3", "lodash-es": "^4.17.15" diff --git a/packages/esm-patient-registration-app/package.json b/packages/esm-patient-registration-app/package.json index 5c0cbd36b..204e1ec42 100644 --- a/packages/esm-patient-registration-app/package.json +++ b/packages/esm-patient-registration-app/package.json @@ -37,7 +37,7 @@ "url": "https://github.com/openmrs/openmrs-esm-patient-management/issues" }, "dependencies": { - "@carbon/react": "~1.37.0", + "@carbon/react": "^1.71.0", "formik": "^2.1.5", "lodash-es": "^4.17.15", "uuid": "^8.3.2", diff --git a/packages/esm-patient-registration-app/src/patient-registration/field/gender/gender-field.component.tsx b/packages/esm-patient-registration-app/src/patient-registration/field/gender/gender-field.component.tsx index 75fa4663a..b2964df44 100644 --- a/packages/esm-patient-registration-app/src/patient-registration/field/gender/gender-field.component.tsx +++ b/packages/esm-patient-registration-app/src/patient-registration/field/gender/gender-field.component.tsx @@ -30,8 +30,12 @@ export const GenderField: React.FC = () => {

{t('sexFieldLabelText', 'Sex')}

-

{t('genderLabelText', 'Sex')}

- + {fieldConfigs.map((option) => ( ); const mockUsePatient = jest.mocked(usePatient); -const mockOpenmrsDatePicker = jest.mocked(OpenmrsDatePicker); +const mockUseParams = useParams as jest.Mock; +const mockUseInitialFormValues = jest.mocked(useInitialFormValues); jest.mock('./field/field.resource', () => ({ useConcept: jest.fn().mockImplementation((uuid: string) => { @@ -85,7 +88,7 @@ jest.mock('./field/field.resource', () => ({ })); jest.mock('react-router-dom', () => ({ - ...(jest.requireActual('react-router-dom') as any), + ...jest.requireActual('react-router-dom'), useLocation: () => ({ pathname: 'openmrs/spa/patient-registration', }), @@ -99,6 +102,13 @@ jest.mock('./patient-registration.resource', () => ({ savePatient: jest.fn(), })); +jest.mock('./patient-registration-hooks', () => ({ + ...jest.requireActual('./patient-registration-hooks'), + useInitialFormValues: jest.fn().mockReturnValue([{}, jest.fn()]), + useInitialAddressFieldValues: jest.fn().mockReturnValue([{}, jest.fn()]), + usePatientUuidMap: jest.fn().mockReturnValue([{}, jest.fn()]), +})); + mockOpenmrsDatePicker.mockImplementation(({ id, labelText, value, onChange }) => { return ( <> @@ -126,7 +136,7 @@ const mockResourcesContextValue = { identifierTypes: [], }; -let mockOpenmrsConfig: RegistrationConfig = { +const mockOpenmrsConfig: RegistrationConfig = { sections: ['demographics', 'contact'], sectionDefinitions: [ { id: 'demographics', name: 'Demographics', fields: ['name', 'gender', 'dob'] }, @@ -159,6 +169,10 @@ let mockOpenmrsConfig: RegistrationConfig = { value: 'male', label: 'Male', }, + { + value: 'female', + label: 'Female', + }, ], address: { useAddressHierarchy: { @@ -180,11 +194,10 @@ let mockOpenmrsConfig: RegistrationConfig = { encounterProviderRoleUuid: 'asdf', registrationFormUuid: null, }, + freeTextFieldConceptUuid: '', }; - -const path = `/patient/:patientUuid/edit`; - const configWithObs = JSON.parse(JSON.stringify(mockOpenmrsConfig)); + configWithObs.fieldDefinitions = [ { id: 'weight', @@ -217,7 +230,6 @@ configWithObs.fieldDefinitions = [ customConceptAnswers: [], }, ]; - configWithObs.sectionDefinitions?.push({ id: 'custom', name: 'Custom', @@ -238,16 +250,14 @@ const fillRequiredFields = async () => { await user.type(familyNameInput, 'Gaihre'); await user.clear(dateOfBirthInput); await user.type(dateOfBirthInput, '02/08/1993'); - user.click(genderInput); + await user.click(genderInput); }; -function Wrapper({ children }) { - return ( - - {children} - - ); -} +const Wrapper = ({ children }) => ( + + {children} + +); describe('Registering a new patient', () => { beforeEach(() => { @@ -258,15 +268,30 @@ describe('Registering a new patient', () => { mockSavePatient.mockReturnValue({ data: { uuid: 'new-pt-uuid' }, ok: true }); }); - it('renders without crashing', () => { + it('should render all the required fields and sections', async () => { render(, { wrapper: Wrapper }); - }); - it('has the expected sections', async () => { - render(, { wrapper: Wrapper }); + await screen.findByRole('heading', { name: /create new patient/i }); + + const demographicSection = screen.getByRole('region', { name: /demographics section/i }); + const contactSection = screen.getByRole('region', { name: /contact info section/i }); + + expect(demographicSection).toBeInTheDocument(); + expect(contactSection).toBeInTheDocument(); + expect(screen.getByText(/jump to/i)).toBeInTheDocument(); + expect(within(demographicSection).getByLabelText(/first name/i)).toBeInTheDocument(); + expect(within(demographicSection).getByLabelText(/middle name \(optional\)/i)).toBeInTheDocument(); + expect(within(demographicSection).getByLabelText(/family name/i)).toBeInTheDocument(); + expect(within(demographicSection).getByLabelText(/date of birth/i)).toBeInTheDocument(); + expect(within(demographicSection).getByRole('radio', { name: /^male$/i })).toBeInTheDocument(); + expect(within(demographicSection).getByRole('radio', { name: /^female$/i })).toBeInTheDocument(); + expect(within(demographicSection).getByText(/date of birth known\?/i)).toBeInTheDocument(); + expect(within(demographicSection).getByLabelText(/date of birth/i)).toBeInTheDocument(); - expect(screen.getByRole('region', { name: /demographics section/i })).toBeInTheDocument(); - expect(screen.getByRole('region', { name: /contact info section/i })).toBeInTheDocument(); + expect(within(contactSection).getByRole('heading', { name: /address/i })).toBeInTheDocument(); + + expect(screen.getByRole('button', { name: /register patient/i })).toBeInTheDocument(); + expect(screen.getByRole('button', { name: /cancel/i })).toBeInTheDocument(); }); // TODO O3-3482: Fix this test case when OpenmrsDatePicker gets fixed on core @@ -300,14 +325,12 @@ describe('Registering a new patient', () => { it('should not save the patient if validation fails', async () => { const user = userEvent.setup(); - const mockSavePatientForm = jest.fn(); - render(, { wrapper: Wrapper }); - const givenNameInput = (await screen.findByLabelText('First Name')) as HTMLInputElement; + render(, { wrapper: Wrapper }); - await user.type(givenNameInput, '5'); - await user.click(screen.getByText(/Register Patient/i)); + await screen.findByRole('heading', { name: /create new patient/i }); + await user.click(screen.getByRole('button', { name: /register patient/i })); expect(mockSavePatientForm).not.toHaveBeenCalled(); }); @@ -386,76 +409,149 @@ describe('Registering a new patient', () => { describe('Updating an existing patient record', () => { beforeEach(() => { - mockUseConfig.mockReturnValue(mockOpenmrsConfig); + mockUseConfig.mockReturnValue({ + ...getDefaultsFromConfigSchema(esmPatientRegistrationSchema), + ...mockOpenmrsConfig, + }); + mockUsePatient.mockImplementation(() => { + return { + error: null, + isLoading: false, + patient: mockPatient, + patientUuid: mockPatient.id, + }; + }); mockSavePatient.mockReturnValue({ data: { uuid: 'new-pt-uuid' }, ok: true }); + mockUseParams.mockReturnValue({ patientUuid: mockPatient.id }); }); it('edits patient demographics', async () => { const user = userEvent.setup(); - mockSavePatient.mockResolvedValue({} as FetchResponse); + const mockSavePatientForm = jest.fn(); - const mockUseParams = useParams as jest.Mock; + mockUseInitialFormValues.mockReturnValue([ + { + additionalFamilyName: '', + additionalGivenName: '', + additionalMiddleName: '', + addNameInLocalLanguage: false, + address: {}, + birthdate: mockPatient.birthDate, + birthdateEstimated: false, + deathCause: '', + deathDate: undefined, + deathTime: undefined, + deathTimeFormat: 'AM', + familyName: mockPatient.name[0].family, + gender: mockPatient.gender, + givenName: mockPatient.name[0].given[0], + identifiers: { + openMrsId: { + autoGeneration: false, + identifierName: 'OpenMRS ID', + identifierTypeUuid: '05a29f94-c0ed-11e2-94be-8c13b969e334', + identifierUuid: '1f0ad7a1-430f-4397-b571-59ea654a52db', + identifierValue: '100GEJ', + initialValue: '100GEJ', + preferred: true, + required: true, + selectedSource: null, + }, + idCard: { + autoGeneration: false, + identifierName: 'ID Card', + identifierTypeUuid: 'b4143563-16cd-4439-b288-f83d61670fc8', + identifierUuid: '346d09b1-8509-43c6-9697-3b4d1ce06ad6', + identifierValue: '1234567890', + initialValue: '1234567890', + preferred: false, + required: false, + selectedSource: null, + }, + }, + isDead: false, + middleName: '', + monthsEstimated: 0, + nonCodedCauseOfDeath: '', + patientUuid: mockPatient.id, + relationships: [], + telephoneNumber: '', + yearsEstimated: 0, + } as FormValues, + jest.fn(), + ]); - mockUseParams.mockReturnValue({ patientUuid: mockPatient.id }); + render(, { wrapper: Wrapper }); - mockUsePatient.mockReturnValue({ - isLoading: false, - patient: mockPatient, - patientUuid: mockPatient.id, - error: null, - }); + await screen.findByRole('heading', { name: /edit patient details/i }); - render(, { wrapper: Wrapper }); - - const givenNameInput: HTMLInputElement = screen.getByLabelText(/First Name/); - const familyNameInput: HTMLInputElement = screen.getByLabelText(/Family Name/); - const middleNameInput: HTMLInputElement = screen.getByLabelText(/Middle Name/); - const dateOfBirthInput: HTMLInputElement = screen.getByLabelText(/Date of Birth/i); - const genderInput: HTMLInputElement = screen.getByLabelText(/Male/); - - // assert initial values - expect(givenNameInput.value).toBe('John'); - expect(familyNameInput.value).toBe('Wilson'); - expect(middleNameInput.value).toBeFalsy(); - expect(dateOfBirthInput.value).toBe('04/04/1972'); - expect(genderInput.value).toBe('male'); - - // do some edits - await user.clear(givenNameInput); - await user.clear(middleNameInput); - await user.clear(familyNameInput); - await user.type(givenNameInput, 'Eric'); - await user.type(middleNameInput, 'Johnson'); - await user.type(familyNameInput, 'Smith'); - await user.click(screen.getByText(/Update patient/i)); + expect(screen.queryByRole('button', { name: /register patient/i })).not.toBeInTheDocument(); + expect(screen.getByRole('button', { name: /update patient/i })).toBeInTheDocument(); + expect(screen.getByRole('button', { name: /cancel/i })).toBeInTheDocument(); - expect(mockSavePatient).toHaveBeenCalledWith( + expect(screen.getByLabelText(/first name/i)).toHaveValue(mockPatient.name[0].given[0]); + expect(screen.getByLabelText(/family name/i)).toHaveValue(mockPatient.name[0].family); + expect(screen.getByLabelText(/date of birth/i)).toHaveValue('04/04/1972'); + expect( + screen.getByRole('radio', { + name: /^male$/i, + }), + ).toBeChecked(); + expect( + screen.getByRole('radio', { + name: /^female$/i, + }), + ).not.toBeChecked(); + expect(screen.getAllByRole('tab', { name: /yes/i })).toHaveLength(2); + + await user.click(screen.getByRole('button', { name: /update patient/i })); + + expect(mockSavePatientForm).toHaveBeenCalledWith( false, { - '0': { - oldIdentificationNumber: '100732HE', - }, - '1': { - openMrsId: '100GEJ', - }, - addNameInLocalLanguage: undefined, + addNameInLocalLanguage: false, additionalFamilyName: '', additionalGivenName: '', additionalMiddleName: '', - address: {}, - birthdate: new Date('1972-04-04T00:00:00.000Z'), + address: { + country: 'កម្ពុជា (Cambodia)', + }, + birthdate: '1972-04-04', birthdateEstimated: false, deathCause: '', nonCodedCauseOfDeath: '', deathDate: undefined, deathTime: undefined, deathTimeFormat: 'AM', - familyName: 'Smith', - gender: expect.stringMatching(/male/i), - givenName: 'Eric', - identifiers: {}, + familyName: 'Wilson', + gender: 'male', + givenName: 'John', + identifiers: { + idCard: { + autoGeneration: false, + identifierName: 'ID Card', + identifierTypeUuid: 'b4143563-16cd-4439-b288-f83d61670fc8', + identifierUuid: '346d09b1-8509-43c6-9697-3b4d1ce06ad6', + identifierValue: '1234567890', + initialValue: '1234567890', + preferred: false, + required: false, + selectedSource: null, + }, + openMrsId: { + autoGeneration: false, + identifierName: 'OpenMRS ID', + identifierTypeUuid: '05a29f94-c0ed-11e2-94be-8c13b969e334', + identifierUuid: '1f0ad7a1-430f-4397-b571-59ea654a52db', + identifierValue: '100GEJ', + initialValue: '100GEJ', + preferred: true, + required: true, + selectedSource: null, + }, + }, isDead: false, - middleName: 'Johnson', + middleName: '', monthsEstimated: 0, patientUuid: '8673ee4f-e2ab-4077-ba55-4980f408773e', relationships: [], diff --git a/packages/esm-patient-search-app/package.json b/packages/esm-patient-search-app/package.json index e70177005..2f03061e9 100644 --- a/packages/esm-patient-search-app/package.json +++ b/packages/esm-patient-search-app/package.json @@ -37,7 +37,7 @@ "url": "https://github.com/openmrs/openmrs-esm-patient-management/issues" }, "dependencies": { - "@carbon/react": "~1.37.0", + "@carbon/react": "^1.71.0", "lodash-es": "^4.17.15" }, "peerDependencies": { diff --git a/packages/esm-patient-search-app/src/compact-patient-search/compact-patient-banner.component.tsx b/packages/esm-patient-search-app/src/compact-patient-search/compact-patient-banner.component.tsx index 7cd9e425b..c64b8f3b0 100644 --- a/packages/esm-patient-search-app/src/compact-patient-search/compact-patient-banner.component.tsx +++ b/packages/esm-patient-search-app/src/compact-patient-search/compact-patient-banner.component.tsx @@ -1,6 +1,6 @@ import React, { forwardRef, useContext, useMemo } from 'react'; -import classNames from 'classnames'; import { v4 as uuidv4 } from 'uuid'; +import classNames from 'classnames'; import { useTranslation } from 'react-i18next'; import { Tag } from '@carbon/react'; import { @@ -173,7 +173,7 @@ const ClickablePatientContainer = ({ patient, children }: ClickablePatientContai const IdentifierTag: React.FC = ({ identifier }) => { return ( <> - + {identifier.identifierType.display} {identifier.identifier} diff --git a/packages/esm-service-queues-app/package.json b/packages/esm-service-queues-app/package.json index 949e986e4..6650bad2e 100644 --- a/packages/esm-service-queues-app/package.json +++ b/packages/esm-service-queues-app/package.json @@ -37,7 +37,7 @@ "url": "https://github.com/openmrs/openmrs-esm-patient-management/issues" }, "dependencies": { - "@carbon/react": "~1.37.0", + "@carbon/react": "^1.71.0", "lodash-es": "^4.17.15" }, "peerDependencies": { diff --git a/packages/esm-service-queues-app/src/patient-queue-metrics/clinic-metrics.component.tsx b/packages/esm-service-queues-app/src/patient-queue-metrics/clinic-metrics.component.tsx index 30747b368..ec1599e92 100644 --- a/packages/esm-service-queues-app/src/patient-queue-metrics/clinic-metrics.component.tsx +++ b/packages/esm-service-queues-app/src/patient-queue-metrics/clinic-metrics.component.tsx @@ -70,6 +70,7 @@ function ClinicMetrics() { label="" onChange={handleServiceChange} size={isDesktop(layout) ? 'sm' : 'lg'} + titleText="" type="inline" /> diff --git a/packages/esm-service-queues-app/src/patient-queue-metrics/metrics-header.component.tsx b/packages/esm-service-queues-app/src/patient-queue-metrics/metrics-header.component.tsx index c37499f12..96f590afd 100644 --- a/packages/esm-service-queues-app/src/patient-queue-metrics/metrics-header.component.tsx +++ b/packages/esm-service-queues-app/src/patient-queue-metrics/metrics-header.component.tsx @@ -37,12 +37,12 @@ const MetricsHeader = () => {
{metricsTitle} + onClick={navigateToQueueScreen} + size={isDesktop(layout) ? 'sm' : 'lg'} + tooltipAlignment="top-end"> = ({ - + {t('today', 'Today')} diff --git a/packages/esm-service-queues-app/src/queue-patient-linelists/scheduled-appointments-table.component.tsx b/packages/esm-service-queues-app/src/queue-patient-linelists/scheduled-appointments-table.component.tsx index ec0f5f50b..ff2b6cb23 100644 --- a/packages/esm-service-queues-app/src/queue-patient-linelists/scheduled-appointments-table.component.tsx +++ b/packages/esm-service-queues-app/src/queue-patient-linelists/scheduled-appointments-table.component.tsx @@ -193,7 +193,7 @@ const AppointmentsTable: React.FC = () => { - + {t('today', 'Today')} diff --git a/packages/esm-service-queues-app/src/queue-services/queue-service-form.workspace.tsx b/packages/esm-service-queues-app/src/queue-services/queue-service-form.workspace.tsx index d40f0cf8a..33acbb3b6 100644 --- a/packages/esm-service-queues-app/src/queue-services/queue-service-form.workspace.tsx +++ b/packages/esm-service-queues-app/src/queue-services/queue-service-form.workspace.tsx @@ -1,16 +1,16 @@ import React, { useCallback, useState } from 'react'; import { useTranslation } from 'react-i18next'; import { + Button, + ButtonSet, Column, Form, + InlineNotification, Layer, - Stack, - TextInput, Select, SelectItem, - ButtonSet, - Button, - InlineNotification, + Stack, + TextInput, } from '@carbon/react'; import { mutate } from 'swr'; import { type DefaultWorkspaceProps, restBaseUrl, showSnackbar } from '@openmrs/esm-framework'; @@ -21,13 +21,13 @@ import styles from './queue-service-form.scss'; const QueueServiceForm: React.FC = ({ closeWorkspace }) => { const { t } = useTranslation(); const { queueConcepts } = useServiceConcepts(); + const { queueLocations } = useQueueLocations(); const [queueName, setQueueName] = useState(''); const [queueConcept, setQueueConcept] = useState(''); const [isMissingName, setMissingName] = useState(false); const [isMissingQueue, setMissingQueue] = useState(false); const [isMissingLocation, setMissingLocation] = useState(false); const [userLocation, setUserLocation] = useState(''); - const { queueLocations } = useQueueLocations(); const createQueue = useCallback( (event) => { @@ -90,10 +90,11 @@ const QueueServiceForm: React.FC = ({ closeWorkspace }) = /> {isMissingName && (
+ {/* TODO: Use a zod schema instead of this */} @@ -108,8 +109,8 @@ const QueueServiceForm: React.FC = ({ closeWorkspace }) = labelText={t('selectServiceType', 'Select a service type')} id="queueConcept" invalidText="Required" - value={queueConcept} - onChange={(event) => setQueueConcept(event.target.value)}> + onChange={(event) => setQueueConcept(event.target.value)} + value={queueConcept}> {!queueConcept && } {queueConcepts.length === 0 && } {queueConcepts?.length > 0 && @@ -124,7 +125,7 @@ const QueueServiceForm: React.FC = ({ closeWorkspace }) = @@ -136,11 +137,11 @@ const QueueServiceForm: React.FC = ({ closeWorkspace }) =