@kenyaemr/esm-patient-registration-app 4.3.0 → 4.4.0

package/src/patient-verification/patient-verification-utils.ts

@@ -1,173 +0,0 @@
-import { showModal } from '@openmrs/esm-framework';
-import { FormikProps } from 'formik';
-import { FormValues } from '../patient-registration/patient-registration-types';
-import { ClientRegistryPatient, RegistryPatient } from './verification-types';
-import counties from './assets/counties.json';
-
-export function handleClientRegistryResponse(
-  clientResponse: ClientRegistryPatient,
-  props: FormikProps<FormValues>,
-  searchTerm: string,
-) {
-  if (clientResponse?.clientExists === false) {
-    const nupiIdentifiers = {
-      ['nationalId']: {
-        initialValue: searchTerm,
-        identifierUuid: undefined,
-        selectedSource: { uuid: '', name: '' },
-        preferred: false,
-        required: false,
-        identifierTypeUuid: '49af6cdc-7968-4abb-bf46-de10d7f4859f',
-        identifierName: 'National ID',
-        identifierValue: searchTerm,
-      },
-    };
-    const dispose = showModal('empty-client-registry-modal', {
-      onConfirm: () => {
-        props.setValues({ ...props.values, identifiers: { ...props.values.identifiers, ...nupiIdentifiers } });
-        dispose();
-      },
-      close: () => dispose(),
-    });
-  }
-
-  if (clientResponse?.clientExists) {
-    const {
-      client: {
-        middleName,
-        lastName,
-        firstName,
-        contact,
-        country,
-        countyOfBirth,
-        residence,
-        identifications,
-        gender,
-        dateOfBirth,
-        isAlive,
-        clientNumber,
-        educationLevel,
-        occupation,
-        maritalStatus,
-      },
-    } = clientResponse;
-
-    const nupiIdentifiers = {
-      ['nationalId']: {
-        initialValue: identifications !== undefined && identifications[0]?.identificationNumber,
-        identifierUuid: undefined,
-        selectedSource: { uuid: '', name: '' },
-        preferred: false,
-        required: false,
-        identifierTypeUuid: '49af6cdc-7968-4abb-bf46-de10d7f4859f',
-        identifierName: 'National ID',
-        identifierValue: identifications !== undefined && identifications[0]?.identificationNumber,
-      },
-
-      ['nationalUniquePatientIdentifier']: {
-        identifierTypeUuid: 'f85081e2-b4be-4e48-b3a4-7994b69bb101',
-        identifierName: 'National Unique patient identifier',
-        identifierValue: clientNumber,
-        initialValue: clientNumber,
-        identifierUuid: undefined,
-        selectedSource: { uuid: '', name: '' },
-        preferred: false,
-        required: false,
-      },
-    };
-
-    const dispose = showModal('confirm-client-registry-modal', {
-      onConfirm: () => {
-        props.setValues({
-          ...props.values,
-          familyName: lastName,
-          middleName: middleName,
-          givenName: firstName,
-          gender: gender === 'male' ? 'Male' : 'Female',
-          birthdate: new Date(dateOfBirth),
-          isDead: !isAlive,
-          attributes: {
-            'b2c38640-2603-4629-aebd-3b54f33f1e3a': contact?.primaryPhone,
-            '94614350-84c8-41e0-ac29-86bc107069be': contact?.secondaryPhone,
-            'b8d0b331-1d2d-4a9a-b741-1816f498bdb6': contact?.emailAddress ?? '',
-          },
-          address: {
-            address1: residence?.address,
-            address2: '',
-            address4: residence?.ward,
-            cityVillage: residence?.village,
-            stateProvince: residence?.subCounty,
-            countyDistrict: counties.find((county) => county.code === parseInt(residence?.county))?.name,
-            country: 'Kenya',
-            postalCode: residence?.address,
-          },
-          identifiers: { ...props.values.identifiers, ...nupiIdentifiers },
-          obs: {
-            '1054AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA':
-              props.values.concepts.find((concept) => concept.display?.toLowerCase() === maritalStatus?.toLowerCase())
-                ?.uuid ?? '',
-            '1712AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA':
-              props.values.concepts.find((concept) => concept.display?.toLowerCase() === educationLevel?.toLowerCase())
-                ?.uuid ?? '',
-            '1542AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA':
-              props.values.concepts.find((concept) => concept.display?.toLowerCase() === occupation?.toLowerCase())
-                ?.uuid ?? '',
-          },
-        });
-        dispose();
-      },
-      close: () => dispose(),
-      patient: clientResponse.client,
-    });
-  }
-}
-
-export function generateNUPIPayload(formValues: FormValues): RegistryPatient {
-  const educationLevel = formValues.concepts.find(
-    (concept) => concept.uuid === formValues.obs['1712AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA'],
-  );
-  const occupation = formValues.concepts.find(
-    (concept) => concept.uuid === formValues.obs['1542AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA'],
-  );
-  const maritalStatus = formValues.concepts.find(
-    (concept) => concept.uuid === formValues.obs['1054AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA'],
-  );
-
-  let createRegistryPatient: RegistryPatient = {
-    firstName: formValues?.givenName,
-    middleName: formValues?.middleName,
-    lastName: formValues?.familyName,
-    gender: formValues?.gender === 'Male' ? 'male' : 'female',
-    dateOfBirth: new Date(formValues.birthdate).toISOString(),
-    isAlive: !formValues.isDead,
-    residence: {
-      county: `0${counties.find((county) => county.name.includes(formValues.address['countyDistrict']))?.code}`,
-      subCounty: formValues.address['stateProvince']?.toLocaleLowerCase(),
-      ward: formValues.address['address4']?.toLocaleLowerCase(),
-      village: formValues.address['cityVillage'],
-      landmark: formValues.address['address2'],
-      address: formValues.address['postalCode'],
-    },
-    nextOfKins: [],
-    contact: {
-      primaryPhone: formValues.attributes['b2c38640-2603-4629-aebd-3b54f33f1e3a'],
-      secondaryPhone: formValues.attributes['94614350-84c8-41e0-ac29-86bc107069be'],
-      emailAddress: formValues.attributes['b8d0b331-1d2d-4a9a-b741-1816f498bdb6'],
-    },
-    country: 'KE',
-    countyOfBirth: `0${counties.find((county) => county.name.includes(formValues.address['countyDistrict']))?.code}`,
-    educationLevel: educationLevel?.display?.toLowerCase() ?? '',
-    religion: '',
-    occupation: occupation?.display?.toLowerCase() ?? '',
-    maritalStatus: maritalStatus?.display?.toLowerCase() ?? '',
-    originFacilityKmflCode: '',
-    nascopCCCNumber: '',
-    identifications: [
-      {
-        identificationType: 'national-id',
-        identificationNumber: formValues.identifiers['nationalId']?.identifierValue,
-      },
-    ],
-  };
-  return createRegistryPatient;
-}

package/src/patient-verification/patient-verification.component.tsx

@@ -1,118 +0,0 @@
-import React, { useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Tile, ComboBox, Layer, Button, Search, InlineLoading, InlineNotification } from '@carbon/react';
-import styles from './patient-verification.scss';
-import { countries, verificationIdentifierTypes } from './assets/verification-assets';
-import { searchClientRegistry, useGlobalProperties } from './patient-verification-hook';
-import { showToast } from '@openmrs/esm-framework';
-import { handleClientRegistryResponse } from './patient-verification-utils';
-import { FormValues } from '../patient-registration/patient-registration-types';
-import { FormikProps } from 'formik';
-
-interface PatientVerificationProps {
-  props: FormikProps<FormValues>;
-}
-
-const PatientVerification: React.FC<PatientVerificationProps> = ({ props }) => {
-  const { t } = useTranslation();
-  const { data, isLoading, error } = useGlobalProperties();
-  const [verificationCriteria, setVerificationCriteria] = useState({
-    searchTerm: '',
-    identifierType: '',
-  });
-  const [isLoadingSearch, setIsLoadingSearch] = useState(false);
-
-  const handleSearch = async () => {
-    setIsLoadingSearch(true);
-    try {
-      const clientRegistryResponse = await searchClientRegistry(
-        verificationCriteria.identifierType,
-        verificationCriteria.searchTerm,
-        props.values.token,
-      );
-      setIsLoadingSearch(false);
-      handleClientRegistryResponse(clientRegistryResponse, props, verificationCriteria.searchTerm);
-    } catch (error) {
-      showToast({
-        title: 'Client registry error',
-        description: `Please reload the registration page and re-try again, if the issue persist contact system administrator`,
-        millis: 10000,
-        kind: 'error',
-        critical: true,
-      });
-      setIsLoadingSearch(false);
-    }
-  };
-
-  if (isLoading) {
-    <InlineLoading status="active" iconDescription="Loading" description="Loading data..." />;
-  }
-
-  if (error) {
-    return (
-      <InlineNotification
-        lowContrast
-        hideCloseButton
-        title="Client registry network error"
-        subtitle="Could not connect to client registry, please proceed with registration and try again later"
-        style={{ marginBottom: '0.5rem' }}
-      />
-    );
-  }
-  return (
-    <div id={'patientVerification'}>
-      <h3 className={styles.productiveHeading02} style={{ color: '#161616' }}>
-        {t('clientVerificationWithClientRegistry', 'Client verification with client registry')}
-      </h3>
-      <div style={{ margin: '1rem 0 1rem' }}>
-        <Layer>
-          {isLoading && <InlineLoading status="active" iconDescription="Loading" description="Loading data..." />}
-        </Layer>
-        <Tile className={styles.verificationWrapper}>
-          <Layer>
-            <ComboBox
-              ariaLabel={t('selectCountry', 'Select country')}
-              id="selectCountry"
-              items={countries}
-              itemToString={(item) => item?.name ?? ''}
-              label="Combo box menu options"
-              titleText={t('selectCountry', 'Select country')}
-              initialSelectedItem={countries[0]}
-            />
-          </Layer>
-          <Layer>
-            <ComboBox
-              ariaLabel={t('selectIdentifierType', 'Select identifier type')}
-              id="selectIdentifierType"
-              items={verificationIdentifierTypes}
-              itemToString={(item) => item?.name ?? ''}
-              label="Combo box menu options"
-              titleText={t('selectIdentifierType', 'Select identifier type')}
-              onChange={({ selectedItem }) =>
-                setVerificationCriteria({ ...verificationCriteria, identifierType: selectedItem.value })
-              }
-            />
-          </Layer>
-          <Layer>
-            <Search
-              id="search-1"
-              autoFocus
-              placeHolderText="Search"
-              disabled={!verificationCriteria.identifierType}
-              onChange={(event) => setVerificationCriteria({ ...verificationCriteria, searchTerm: event.target.value })}
-            />
-          </Layer>
-          {!isLoadingSearch ? (
-            <Button disabled={!verificationCriteria.identifierType && !isLoading} size="md" onClick={handleSearch}>
-              {t('validate', 'Validate')}
-            </Button>
-          ) : (
-            <InlineLoading status="active" iconDescription="Loading" description="Searching client registry" />
-          )}
-        </Tile>
-      </div>
-    </div>
-  );
-};
-
-export default PatientVerification;

package/src/patient-verification/patient-verification.scss

@@ -1,30 +0,0 @@
-@use '@carbon/colors';
-@import '../patient-registration/patient-registration.scss';
-
-/* Desktop */
-:global(.omrs-breakpoint-gt-tablet) {
-  .verificationWrapper {
-    display: grid;
-    grid-template-columns: 1fr 1fr 1fr 1fr;
-    column-gap: 0.325rem;
-    align-items: flex-end;
-  }
-}
-
-/* Tablet */
-:global(.omrs-breakpoint-lt-desktop) {
-  .verificationWrapper {
-    row-gap: 0.5rem;
-    display: flex;
-    flex-direction: column;
-
-  }
-}
-
-.errorWrapper {
-  color: colors.$red-50;
-  margin: 0 0 1rem 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}

package/src/patient-verification/verification-modal/confirm-prompt.component.tsx

@@ -1,69 +0,0 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import { Button } from '@carbon/react';
-import { age, ExtensionSlot, formatDate } from '@openmrs/esm-framework';
-import capitalize from 'lodash-es/capitalize';
-
-const PatientInfo: React.FC<{ label: string; value: string }> = ({ label, value }) => {
-  return (
-    <div style={{ display: 'grid', gridTemplateColumns: '0.25fr 0.75fr', margin: '0.25rem' }}>
-      <span style={{ minWidth: '5rem', fontWeight: 'bold' }}>{label}</span>
-      <span>{value}</span>
-    </div>
-  );
-};
-
-interface ConfirmPromptProps {
-  onConfirm: void;
-  close: void;
-  patient: any;
-}
-
-const ConfirmPrompt: React.FC<ConfirmPromptProps> = ({ close, onConfirm, patient }) => {
-  const { t } = useTranslation();
-  return (
-    <>
-      <div className="cds--modal-header">
-        <h3 className="cds--modal-header__heading">
-          {t('clientRegistryEmpty', `Patient ${patient?.firstName} ${patient?.lastName} found`)}
-        </h3>
-      </div>
-      <div className="cds--modal-content">
-        <p>
-          {t(
-            'patientDetailsFound',
-            'Patient information found in the registry, do you want to use the information to continue with registration?',
-          )}
-        </p>
-        <div style={{ display: 'flex', margin: '1rem' }}>
-          <ExtensionSlot
-            style={{ display: 'flex', alignItems: 'center' }}
-            extensionSlotName="patient-photo-slot"
-            state={{ patientName: `${patient?.firstName} ${patient?.lastName}` }}
-          />
-          <div style={{ width: '100%', marginLeft: '0.625rem' }}>
-            <PatientInfo
-              label={t('patientName', 'Patient name')}
-              value={`${patient?.firstName} ${patient?.lastName}`}
-            />
-            <PatientInfo
-              label={t('nationalId', 'National ID')}
-              value={patient?.identifications[0]?.identificationNumber}
-            />
-            <PatientInfo label={t('age', 'Age')} value={age(patient?.dateOfBirth)} />
-            <PatientInfo label={t('dateOfBirth', 'Date of birth')} value={formatDate(new Date(patient?.dateOfBirth))} />
-            <PatientInfo label={t('gender', 'Gender')} value={capitalize(patient?.gender)} />
-          </div>
-        </div>
-      </div>
-      <div className="cds--modal-footer">
-        <Button kind="secondary" onClick={close}>
-          {t('cancel', 'Cancel')}
-        </Button>
-        <Button onClick={onConfirm}>{t('useValues', 'Use values')}</Button>
-      </div>
-    </>
-  );
-};
-
-export default ConfirmPrompt;

package/src/patient-verification/verification-modal/empty-prompt.component.tsx

@@ -1,35 +0,0 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import { Button } from '@carbon/react';
-
-interface EmptyPromptProps {
-  onConfirm: void;
-  close: void;
-}
-
-const EmptyPrompt: React.FC<EmptyPromptProps> = ({ close, onConfirm }) => {
-  const { t } = useTranslation();
-  return (
-    <>
-      <div className="cds--modal-header">
-        <h3 className="cds--modal-header__heading">{t('clientRegistryEmpty', 'Create & Post Patient')}</h3>
-      </div>
-      <div className="cds--modal-content">
-        <p>
-          {t(
-            'patientNotFound',
-            'The patient records could not be found in Client registry, do you want to continue to create and post patient to registry',
-          )}
-        </p>
-      </div>
-      <div className="cds--modal-footer">
-        <Button kind="secondary" onClick={close}>
-          {t('cancel', 'Cancel')}
-        </Button>
-        <Button onClick={onConfirm}>{t('continue', 'Continue to registration')}</Button>
-      </div>
-    </>
-  );
-};
-
-export default EmptyPrompt;

package/src/patient-verification/verification-types.ts

@@ -1,50 +0,0 @@
-export interface ClientIdentification {
-  identificationType: string;
-  identificationNumber: string;
-}
-
-interface ClientContact {
-  primaryPhone: string;
-  secondaryPhone?: string;
-  emailAddress?: string;
-}
-
-export interface ClientRegistryPatient {
-  clientExists: boolean;
-  client?: RegistryPatient;
-}
-
-export interface RegistryPatient {
-  clientNumber?: string;
-  firstName: string;
-  middleName: string;
-  lastName: string;
-  dateOfBirth: string;
-  maritalStatus?: string;
-  gender: string;
-  occupation?: string;
-  religion?: string;
-  educationLevel?: string;
-  country: string;
-  countyOfBirth?: string;
-  isAlive: boolean;
-  originFacilityKmflCode?: string;
-  isOnART?: string;
-  nascopCCCNumber?: string;
-  residence: {
-    county: string;
-    subCounty: string;
-    ward: string;
-    village: string;
-    landmark: string;
-    address: string;
-  };
-  identifications: Array<ClientIdentification>;
-  contact: ClientContact;
-  nextOfKins: Array<{
-    name: string;
-    relationship: string;
-    residence: string;
-    contact: ClientContact;
-  }>;
-}