@kenyaemr/esm-admin-app 5.4.4-pre.36 → 5.4.4-pre.360

package/src/components/global-property/workspace/global-property.workspace.test.tsx

@@ -0,0 +1,172 @@
+import React from 'react';
+import { render, screen, fireEvent, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import '@testing-library/jest-dom';
+import { vi, describe, it, expect, beforeEach } from 'vitest';
+import GlobalPropertyWorkspace from './global-property.workspace';
+
+const mockShowSnackbar = vi.fn();
+const mockSaveOrUpdateGlobalProperty = vi.fn();
+const mockCloseWorkspace = vi.fn();
+const mockMutateGlobalProperty = vi.fn();
+
+vi.mock('react-i18next', () => ({
+  useTranslation: () => ({ t: (_key: string, fallback: string) => fallback }),
+}));
+
+vi.mock('@openmrs/esm-framework', () => ({
+  useLayoutType: vi.fn(() => 'desktop'),
+  showSnackbar: (...args: unknown[]) => mockShowSnackbar(...args),
+  ResponsiveWrapper: ({ children }: { children: React.ReactNode }) => <>{children}</>,
+  Workspace2: ({ children, title }: { children: React.ReactNode; title: string }) => (
+    <div>
+      <h2>{title}</h2>
+      {children}
+    </div>
+  ),
+}));
+
+vi.mock('../hooks/useGlobalProperty', () => ({
+  saveOrUpdateGlobalProperty: (...args: unknown[]) => mockSaveOrUpdateGlobalProperty(...args),
+}));
+
+vi.mock('@hookform/resolvers/zod', () => ({
+  zodResolver: () => async (values: unknown) => ({ values, errors: {} }),
+}));
+
+const baseProps = {
+  closeWorkspace: mockCloseWorkspace,
+  workspaceProps: {
+    systemSetting: null,
+    mutateGlobalProperty: mockMutateGlobalProperty,
+  },
+};
+
+describe('GlobalPropertyWorkspace', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it('shows "Add global property" title in add mode', () => {
+    render(<GlobalPropertyWorkspace {...baseProps} />);
+    expect(screen.getByText('Add global property')).toBeInTheDocument();
+  });
+
+  it('shows "Edit global property" title when editing an existing property', () => {
+    const props = {
+      ...baseProps,
+      workspaceProps: {
+        systemSetting: { uuid: 'uuid-1', property: 'setting.one', value: 'value1' },
+        mutateGlobalProperty: mockMutateGlobalProperty,
+      },
+    };
+    render(<GlobalPropertyWorkspace {...props} />);
+    expect(screen.getByText('Edit global property')).toBeInTheDocument();
+  });
+
+  it('pre-fills form fields when editing an existing property', () => {
+    const props = {
+      ...baseProps,
+      workspaceProps: {
+        systemSetting: { uuid: 'uuid-1', property: 'my.setting', value: 'my-value' },
+        mutateGlobalProperty: mockMutateGlobalProperty,
+      },
+    };
+    render(<GlobalPropertyWorkspace {...props} />);
+    expect(screen.getByDisplayValue('my.setting')).toBeInTheDocument();
+    expect(screen.getByDisplayValue('my-value')).toBeInTheDocument();
+  });
+
+  it('disables the property field when editing an existing property', () => {
+    const props = {
+      ...baseProps,
+      workspaceProps: {
+        systemSetting: { uuid: 'uuid-1', property: 'setting.one', value: 'value1' },
+        mutateGlobalProperty: mockMutateGlobalProperty,
+      },
+    };
+    render(<GlobalPropertyWorkspace {...props} />);
+    expect(screen.getByLabelText(/Property/i)).toBeDisabled();
+  });
+
+  it('enables the property field in add mode', () => {
+    render(<GlobalPropertyWorkspace {...baseProps} />);
+    expect(screen.getByLabelText(/Property/i)).not.toBeDisabled();
+  });
+
+  it('renders the Cancel and Save & close buttons', () => {
+    render(<GlobalPropertyWorkspace {...baseProps} />);
+    expect(screen.getByText('Cancel')).toBeInTheDocument();
+    expect(screen.getByText('Save & close')).toBeInTheDocument();
+  });
+
+  it('calls closeWorkspace when Cancel is clicked', () => {
+    render(<GlobalPropertyWorkspace {...baseProps} />);
+    fireEvent.click(screen.getByText('Cancel'));
+    expect(mockCloseWorkspace).toHaveBeenCalledTimes(1);
+  });
+
+  it('shows validation error when form is submitted with empty required fields', async () => {
+    render(<GlobalPropertyWorkspace {...baseProps} />);
+    const saveButton = screen.getByText('Save & close');
+    fireEvent.click(saveButton);
+    await waitFor(() => {
+      expect(mockSaveOrUpdateGlobalProperty).not.toHaveBeenCalled();
+    });
+  });
+
+  it('saves a new property with the entered values', async () => {
+    mockSaveOrUpdateGlobalProperty.mockResolvedValue(undefined);
+    render(<GlobalPropertyWorkspace {...baseProps} />);
+
+    await userEvent.type(screen.getByLabelText(/Property/i), 'new.setting');
+    await userEvent.type(screen.getByLabelText(/Value/i), 'new-value');
+
+    fireEvent.submit(screen.getByLabelText(/Property/i).closest('form')!);
+
+    await waitFor(() => {
+      expect(mockSaveOrUpdateGlobalProperty).toHaveBeenCalledWith(
+        expect.objectContaining({ property: 'new.setting', value: 'new-value' }),
+        undefined,
+      );
+    });
+  });
+
+  it('shows a success snackbar and closes workspace after saving', async () => {
+    mockSaveOrUpdateGlobalProperty.mockResolvedValue(undefined);
+    render(<GlobalPropertyWorkspace {...baseProps} />);
+
+    await userEvent.type(screen.getByLabelText(/Property/i), 'new.setting');
+    await userEvent.type(screen.getByLabelText(/Value/i), 'new-value');
+
+    fireEvent.submit(screen.getByLabelText(/Property/i).closest('form')!);
+
+    await waitFor(() => {
+      expect(mockShowSnackbar).toHaveBeenCalledWith(expect.objectContaining({ kind: 'success' }));
+      expect(mockMutateGlobalProperty).toHaveBeenCalled();
+      expect(mockCloseWorkspace).toHaveBeenCalled();
+    });
+  });
+
+  it('shows an error snackbar when saving fails', async () => {
+    mockSaveOrUpdateGlobalProperty.mockRejectedValue(new Error('Failed to save'));
+    render(<GlobalPropertyWorkspace {...baseProps} />);
+
+    await userEvent.type(screen.getByLabelText(/Property/i), 'new.setting');
+    await userEvent.type(screen.getByLabelText(/Value/i), 'new-value');
+
+    fireEvent.submit(screen.getByLabelText(/Property/i).closest('form')!);
+
+    await waitFor(() => {
+      expect(mockShowSnackbar).toHaveBeenCalledWith(expect.objectContaining({ kind: 'error' }));
+      expect(mockCloseWorkspace).not.toHaveBeenCalled();
+    });
+  });
+
+  it('renders optional fields: description, datatype config, handler config', () => {
+    render(<GlobalPropertyWorkspace {...baseProps} />);
+    expect(screen.getByLabelText(/Description/i)).toBeInTheDocument();
+    expect(screen.getByLabelText(/Datatype config/i)).toBeInTheDocument();
+    expect(screen.getByLabelText(/Handler config/i)).toBeInTheDocument();
+  });
+});

package/src/components/global-property/workspace/global-property.workspace.tsx

@@ -0,0 +1,260 @@
+import React, { useEffect, useState } from 'react';
+import {
+  ResponsiveWrapper,
+  Workspace2,
+  showSnackbar,
+  useLayoutType,
+  type Workspace2DefinitionProps,
+} from '@openmrs/esm-framework';
+import { useTranslation } from 'react-i18next';
+import { Controller, useForm } from 'react-hook-form';
+import { Button, ButtonSet, ComboBox, Form, FormGroup, InlineLoading, Stack, TextArea, TextInput } from '@carbon/react';
+import { zodResolver } from '@hookform/resolvers/zod';
+import classNames from 'classnames';
+
+import styles from './global-property.workspace.scss';
+import { type SystemSettings } from '../../../types';
+import { saveOrUpdateGlobalProperty } from '../hooks/useGlobalProperty';
+import {
+  createGlobalPropertyFormSchema,
+  openmrsCustomDatatypes,
+  type GlobalPropertyFormType,
+} from './global-property-form-schema';
+
+type GlobalPropertyWorkspaceProps = {
+  systemSetting?: SystemSettings | null;
+  mutateGlobalProperty: () => void;
+};
+
+const GlobalPropertyWorkspace: React.FC<Workspace2DefinitionProps<GlobalPropertyWorkspaceProps, {}, {}>> = ({
+  closeWorkspace,
+  workspaceProps: { systemSetting, mutateGlobalProperty },
+}) => {
+  const { t } = useTranslation();
+  const isTablet = useLayoutType() === 'tablet';
+  const isEditMode = Boolean(systemSetting?.uuid);
+  const [hasUnsavedChanges, setHasUnsavedChanges] = useState(false);
+
+  const {
+    handleSubmit,
+    control,
+    formState: { isSubmitting, isDirty, errors },
+  } = useForm<GlobalPropertyFormType>({
+    resolver: zodResolver(createGlobalPropertyFormSchema(t)),
+    defaultValues: {
+      property: systemSetting?.property ?? '',
+      description: systemSetting?.description ?? '',
+      datatypeClassname: systemSetting?.datatypeClassname ?? '',
+      datatypeConfig: systemSetting?.datatypeConfig ?? '',
+      preferredHandlerClassname: systemSetting?.preferredHandlerClassname ?? '',
+      handlerConfig: systemSetting?.handlerConfig ?? '',
+      value: systemSetting?.value ?? '',
+    },
+  });
+
+  useEffect(() => {
+    setHasUnsavedChanges(isDirty);
+  }, [isDirty]);
+
+  const onSubmit = async (data: GlobalPropertyFormType) => {
+    const payload = {
+      property: data.property,
+      value: data.value,
+      description: data.description,
+      datatypeClassname: data.datatypeClassname,
+      datatypeConfig: data.datatypeConfig,
+      preferredHandlerClassname: data.preferredHandlerClassname,
+      handlerConfig: data.handlerConfig,
+    };
+    try {
+      await saveOrUpdateGlobalProperty(payload, systemSetting?.uuid);
+
+      showSnackbar({
+        title: t('success', 'Success'),
+        kind: 'success',
+        subtitle: isEditMode
+          ? t('gpUpdated', 'Global property {{property}} was updated successfully.', { property: data.property })
+          : t('gpCreated', 'Global property {{property}} was created successfully.', { property: data.property }),
+      });
+      mutateGlobalProperty();
+      closeWorkspace({ discardUnsavedChanges: true });
+    } catch (error: any) {
+      showSnackbar({
+        title: t('error', 'Error'),
+        kind: 'error',
+        subtitle: error?.message ?? t('gpSaveError', 'Error saving global property'),
+      });
+    }
+  };
+
+  const title = isEditMode
+    ? t('editGlobalProperty', 'Edit global property')
+    : t('addGlobalProperty', 'Add global property');
+
+  return (
+    <Workspace2 title={title} hasUnsavedChanges={hasUnsavedChanges}>
+      <Form onSubmit={handleSubmit(onSubmit)} className={styles.form}>
+        <div className={styles.formContainer}>
+          <Stack gap={4}>
+            <ResponsiveWrapper>
+              <FormGroup legendText="">
+                <Controller
+                  control={control}
+                  name="property"
+                  render={({ field }) => (
+                    <TextInput
+                      id="gpProperty"
+                      labelText={t('property', 'Property (required)')}
+                      placeholder={t('gpPropertyPlaceholder', 'e.g. setting.name')}
+                      value={field.value}
+                      onChange={field.onChange}
+                      invalid={!!errors.property}
+                      invalidText={errors.property?.message}
+                      disabled={isEditMode}
+                    />
+                  )}
+                />
+              </FormGroup>
+            </ResponsiveWrapper>
+
+            <ResponsiveWrapper>
+              <FormGroup legendText="">
+                <Controller
+                  control={control}
+                  name="value"
+                  render={({ field }) => (
+                    <TextArea
+                      id="gpValue"
+                      labelText={t('value', 'Value (required)')}
+                      placeholder={t('gpValuePlaceholder', 'Enter value')}
+                      value={field.value}
+                      onChange={field.onChange}
+                      invalid={!!errors.value}
+                      invalidText={errors.value?.message}
+                      rows={3}
+                    />
+                  )}
+                />
+              </FormGroup>
+            </ResponsiveWrapper>
+
+            <ResponsiveWrapper>
+              <FormGroup legendText="">
+                <Controller
+                  control={control}
+                  name="description"
+                  render={({ field }) => (
+                    <TextArea
+                      id="gpDescription"
+                      labelText={t('description', 'Description')}
+                      placeholder={t('gpDescriptionPlaceholder', 'Optional description')}
+                      value={field.value ?? ''}
+                      onChange={field.onChange}
+                      rows={2}
+                    />
+                  )}
+                />
+              </FormGroup>
+            </ResponsiveWrapper>
+
+            <ResponsiveWrapper>
+              <FormGroup legendText="">
+                <Controller
+                  control={control}
+                  name="datatypeClassname"
+                  render={({ field }) => (
+                    <ComboBox
+                      id="datatypeClassname"
+                      invalidText={errors.datatypeClassname?.message}
+                      items={openmrsCustomDatatypes}
+                      onChange={function Zye() {}}
+                      titleText={t('datatypeClassname', 'Datatype classname')}
+                      typeahead
+                      placeholder={t('selectDatatypeClassname', 'Select datatype classname')}
+                    />
+                  )}
+                />
+              </FormGroup>
+            </ResponsiveWrapper>
+
+            <ResponsiveWrapper>
+              <FormGroup legendText="">
+                <Controller
+                  control={control}
+                  name="datatypeConfig"
+                  render={({ field }) => (
+                    <TextInput
+                      id="gpDatatypeConfig"
+                      labelText={t('datatypeConfig', 'Datatype config')}
+                      placeholder={t('gpDatatypeConfigPlaceholder', 'Optional datatype configuration')}
+                      value={field.value ?? ''}
+                      onChange={field.onChange}
+                    />
+                  )}
+                />
+              </FormGroup>
+            </ResponsiveWrapper>
+
+            <ResponsiveWrapper>
+              <FormGroup legendText="">
+                <Controller
+                  control={control}
+                  name="preferredHandlerClassname"
+                  render={({ field }) => (
+                    <TextInput
+                      id="gpPreferredHandlerClassname"
+                      labelText={t('preferredHandlerClassname', 'Preferred handler classname')}
+                      placeholder={t('gpPreferredHandlerPlaceholder', 'Optional preferred handler classname')}
+                      value={field.value ?? ''}
+                      onChange={field.onChange}
+                    />
+                  )}
+                />
+              </FormGroup>
+            </ResponsiveWrapper>
+
+            <ResponsiveWrapper>
+              <FormGroup legendText="">
+                <Controller
+                  control={control}
+                  name="handlerConfig"
+                  render={({ field }) => (
+                    <TextInput
+                      id="gpHandlerConfig"
+                      labelText={t('handlerConfig', 'Handler config')}
+                      placeholder={t('gpHandlerConfigPlaceholder', 'Optional handler configuration')}
+                      value={field.value ?? ''}
+                      onChange={field.onChange}
+                    />
+                  )}
+                />
+              </FormGroup>
+            </ResponsiveWrapper>
+          </Stack>
+        </div>
+
+        <ButtonSet
+          className={classNames({
+            [styles.tablet]: isTablet,
+            [styles.desktop]: !isTablet,
+          })}>
+          <Button className={styles.buttonContainer} kind="secondary" onClick={() => closeWorkspace()}>
+            {t('cancel', 'Cancel')}
+          </Button>
+          <Button className={styles.buttonContainer} disabled={isSubmitting || !isDirty} kind="primary" type="submit">
+            {isSubmitting ? (
+              <span className={styles.inlineLoading}>
+                {t('submitting', 'Submitting...')}
+                <InlineLoading status="active" iconDescription="Loading" />
+              </span>
+            ) : (
+              t('saveAndClose', 'Save & close')
+            )}
+          </Button>
+        </ButtonSet>
+      </Form>
+    </Workspace2>
+  );
+};
+
+export default GlobalPropertyWorkspace;

package/src/components/hook/healthWorkerRegistry.ts

@@ -0,0 +1,78 @@
+import { FetchResponse, openmrsFetch, restBaseUrl } from '@openmrs/esm-framework';
+import useSWR from 'swr';
+import { HWR_API_NO_CREDENTIALS, PROVIDER_NOT_FOUND, RESOURCE_NOT_FOUND, UNKNOWN } from '../../constants';
+
+export interface ProfessionalRegistryResponse {
+  success: boolean;
+  regulator: string;
+  identification_type: string;
+  identification_number: string;
+  professional: {
+    membership: {
+      id: string;
+      full_name: string;
+      gender: string;
+      first_name: string;
+      middle_name: string;
+      last_name: string;
+      registration_id: string;
+      external_reference_id: string;
+      licensing_body: string;
+      specialty: string;
+      is_active: number;
+    };
+    licenses?: Array<{
+      id: string;
+      external_reference_id: string;
+      license_type: string;
+      license_start: string;
+      license_end: string;
+    }>;
+    professional_details?: {
+      professional_cadre?: string;
+      practice_type?: string;
+      educational_qualifications?: string;
+    };
+    contacts?: {
+      phone?: string;
+      email?: string;
+      postal_address?: string;
+    };
+    identifiers?: {
+      identification_type?: string;
+      identification_number?: string;
+    };
+  };
+}
+
+export const searchHealthCareWork = async (
+  identifierType: string,
+  identifierNumber: string,
+  regulator: string,
+): Promise<ProfessionalRegistryResponse> => {
+  const url = `${restBaseUrl}/virtualclaims/professional-registry?${new URLSearchParams({
+    identification_number: identifierNumber,
+    identification_type: identifierType,
+    regulator,
+  }).toString()}`;
+
+  try {
+    const response = await openmrsFetch<ProfessionalRegistryResponse>(url);
+    if (!response.data?.success || !response.data?.professional) {
+      throw new Error(PROVIDER_NOT_FOUND);
+    }
+    return response.data;
+  } catch (err: any) {
+    if (err?.message === PROVIDER_NOT_FOUND) {
+      throw err;
+    }
+    const status = err?.response?.status;
+    if (status === 401) {
+      throw new Error(HWR_API_NO_CREDENTIALS);
+    }
+    if (status === 404) {
+      throw new Error(RESOURCE_NOT_FOUND);
+    }
+    throw new Error(UNKNOWN);
+  }
+};

package/src/components/hook/useProfessionalRegistryEnums.ts

@@ -0,0 +1,59 @@
+import { FetchResponse, openmrsFetch, restBaseUrl, useSession } from '@openmrs/esm-framework';
+import useSWR from 'swr';
+
+export type EnumEntry = {
+  code: string;
+  label: string;
+};
+
+type RegulatorsResponse = {
+  count: number;
+  regulators: Array<EnumEntry>;
+};
+
+type IdentificationTypesResponse = {
+  count: number;
+  identification_types: Array<EnumEntry>;
+};
+
+const ONE_DAY_MS = 24 * 60 * 60 * 1000;
+
+export const useProfessionalRegistryRegulators = () => {
+  const { authenticated } = useSession();
+  const url = `${restBaseUrl}/virtualclaims/professional-registry/regulators`;
+
+  const { data, error, isLoading } = useSWR<FetchResponse<RegulatorsResponse>>(
+    authenticated ? url : null,
+    openmrsFetch,
+    {
+      revalidateOnFocus: false,
+      dedupingInterval: ONE_DAY_MS,
+    },
+  );
+
+  return {
+    regulators: data?.data?.regulators ?? [],
+    isLoading,
+    error,
+  };
+};
+
+export const useProfessionalRegistryIdentificationTypes = () => {
+  const { authenticated } = useSession();
+  const url = `${restBaseUrl}/virtualclaims/professional-registry/identification-types`;
+
+  const { data, error, isLoading } = useSWR<FetchResponse<IdentificationTypesResponse>>(
+    authenticated ? url : null,
+    openmrsFetch,
+    {
+      revalidateOnFocus: false,
+      dedupingInterval: ONE_DAY_MS,
+    },
+  );
+
+  return {
+    identificationTypes: data?.data?.identification_types ?? [],
+    isLoading,
+    error,
+  };
+};