@ampath/esm-patient-registration-app 9.2.0-next.17 → 9.2.0-next.19

package/src/patient-registration/client-registry/existing-client/types/index.ts

@@ -0,0 +1,185 @@
+import { type HieDependant, type HieClient } from '../../types';
+
+const HOUSE_HOLD_NUMBER_UUID = 'bb74b20e-dcee-4f59-bdf1-2dffc3abf106';
+const SHA_UUID = 'cf5362b2-8049-4442-b3c6-36f870e320cb';
+const CLIENT_REGISTRY_NO_UUID = 'e88dc246-3614-4ee3-8141-1f2a83054e72';
+const NATIONAL_ID_UUID = '58a47054-1359-11df-a1f1-0026b9348838';
+const PROVIDER_NATIONAL_ID_UUID = '4550df92-c684-4597-8ab8-d6b10eabdcfb';
+const REFUGEE_ID_UUID = '465e81af-8d69-47e9-9127-53a94adc75fb';
+const MANDATE_NUMBER_UUID = 'aae2d097-20ba-43ca-9b71-fd8296068f39';
+const ALIEN_ID_UUID = '12f5b147-3403-4a73-913d-7ded9ffec094';
+const TEMPORARY_DEPENDANT_ID_UUID = 'a3d34214-93e8-4faf-bf4d-0272eee079eb';
+const AMRS_UNIVERSAL_ID_UUID = '58a4732e-1359-11df-a1f1-0026b9348838';
+const UPI_NUMBER_UUID = 'cba702b9-4664-4b43-83f1-9ab473cbd64d';
+
+export const IdentifierTypesUuids = {
+  HOUSE_HOLD_NUMBER_UUID,
+  SHA_UUID,
+  CLIENT_REGISTRY_NO_UUID,
+  NATIONAL_ID_UUID,
+  PROVIDER_NATIONAL_ID_UUID,
+  REFUGEE_ID_UUID,
+  MANDATE_NUMBER_UUID,
+  ALIEN_ID_UUID,
+  TEMPORARY_DEPENDANT_ID_UUID,
+  AMRS_UNIVERSAL_ID_UUID,
+  UPI_NUMBER_UUID,
+};
+
+const CONTACT_PHONE_NUMBER_UUID = '72a759a8-1359-11df-a1f1-0026b9348838';
+const CITIZENSHIP_UUID = '72a759a8-1359-11df-a1f1-0026b9348838';
+const CONTACT_EMAIL_ADDRESS_UUID = '2f65dbcb-3e58-45a3-8be7-fd1dc9aa0faa';
+const ALTERNATIVE_CONTACT_PHONE_NUMBER_UUID = 'c725f524-c14a-4468-ac19-4a0e6661c930';
+const KRA_PIN_UUID = 'ae683747-b3fc-4e5c-bad3-c3be743b248f';
+const CIVIL_STATUS_UUID = '8d871f2a-c2cc-11de-8d13-0010c6dffd0f';
+const CLIENT_REGISTRY_ID_UUID = 'e068e02b-faac-4baf-bd58-fe6e0c29a81f';
+const PLACE_OF_BIRTH_UUID = '8d8718c2-c2cc-11de-8d13-0010c6dffd0f';
+const EMAIL_UUID = '2f65dbcb-3e58-45a3-8be7-fd1dc9aa0faa';
+
+export const PersonAttributeTypeUuids = {
+  CONTACT_PHONE_NUMBER_UUID,
+  CITIZENSHIP_UUID,
+  CONTACT_EMAIL_ADDRESS_UUID,
+  ALTERNATIVE_CONTACT_PHONE_NUMBER_UUID,
+  KRA_PIN_UUID,
+  CIVIL_STATUS_UUID,
+  CLIENT_REGISTRY_ID_UUID,
+  PLACE_OF_BIRTH_UUID,
+  EMAIL_UUID,
+};
+
+const PARENT_CHILD_UUID = '7878d348-1359-11df-a1f1-0026b9348838';
+const AUNT_UNCLE_NIECE_NEPHEW_UUID = '7878dd3e-1359-11df-a1f1-0026b9348838';
+const SPOUSE_UUID = '7878df3c-1359-11df-a1f1-0026b9348838';
+const GRANDCHILD_GRANDPARENT_UUID = '7878e144-1359-11df-a1f1-0026b9348838';
+const GUARDIAN_CHILD_UUUD = '01bc0cf5-d428-427f-be13-305eb9cad7ba';
+const FOSTER_CHILD_FOSTER_PARENT_UUID = '7878e52c-1359-11df-a1f1-0026b9348838';
+const OTHER_NON_CODED_UUID = 'af78531e-98ab-41da-be3a-6a871ecbf8c0';
+
+export const RelationshipTypeUuids = {
+  PARENT_CHILD_UUID,
+  AUNT_UNCLE_NIECE_NEPHEW_UUID,
+  SPOUSE_UUID,
+  GRANDCHILD_GRANDPARENT_UUID,
+  GUARDIAN_CHILD_UUUD,
+  FOSTER_CHILD_FOSTER_PARENT_UUID,
+  OTHER_NON_CODED_UUID,
+};
+
+export interface AmrsClient {
+  uuid: string;
+  identifiers: Identifier[];
+  display: string;
+  person: {
+    uuid: string;
+    display: string;
+    gender: string;
+    age: number;
+    birthdate: string;
+    birthdateEstimated: boolean;
+    dead: boolean;
+    deathDate?: any;
+    causeOfDeath?: any;
+    preferredAddress: {
+      address1: string;
+      address2: string;
+      address3: string;
+      address4: string;
+      address5: string;
+      address6: string;
+      address7: string;
+      cityVillage: string;
+      country: string;
+      postalCode: string;
+      stateProvince: string;
+      countyDistrict: string;
+      latitude: string;
+      longitude: string;
+    };
+    preferredName: {
+      display: string;
+      uuid: string;
+      givenName: string;
+      middleName: string;
+      familyName: string;
+    };
+    attributes: Array<Attributes>;
+    identifiers: Identifier[];
+    voided: boolean;
+    birthtime?: any;
+    deathdateEstimated: boolean;
+    resourceVersion: string;
+  };
+  attributes: { value: string; attributeType: { uuid: string; display: string } }[];
+  voided: boolean;
+}
+
+export interface Address {
+  preferred: boolean;
+  address1: string;
+  cityVillage: string;
+  country: string;
+  postalCode: string;
+  stateProvince: string;
+}
+
+export interface Identifier {
+  uuid: string;
+  display: string;
+  identifier: string;
+  identifierType: {
+    uuid: string;
+    display: string;
+  };
+}
+
+export interface Attributes {
+  uuid: string;
+  display: string;
+  value: {
+    uuid: string;
+    display: string;
+  };
+  attributeType: {
+    uuid: string;
+    display: string;
+  };
+}
+
+export interface CustomRelationship {
+  uuid: string;
+  display: string;
+  relative: string;
+  relatedPersonUuid: string;
+  relationshipType: string;
+  relationshipTypeUuId: string;
+  relationshipTypeName: string;
+  relatedPerson: any;
+}
+
+export interface ClientDetailsComparisonProps {
+  hieClient: HieClient;
+  amrsClient: AmrsClient;
+  fromDependant?: boolean;
+}
+
+export interface ComparisonTableRowProps {
+  field: string;
+  label: string;
+  amrsValue: string;
+  hieValue: string;
+  onChange?(e: boolean, field: string, value: string, multiple: boolean): void;
+  allChecked: boolean;
+}
+
+export interface ClientDependantsComparisonProps {
+  hieDependants: Array<HieDependant>;
+  amrsClient: AmrsClient;
+  patientRelationships: Array<CustomRelationship>;
+}
+
+export interface ClientDependantComparisonRowsProps {
+  hieDependant: HieDependant;
+  patientRelationships: Array<CustomRelationship>;
+  amrsClient: AmrsClient;
+}

package/src/patient-registration/client-registry/hie-client-adapter.ts

@@ -0,0 +1,56 @@
+import { type HieIdentifications, type HieClient } from './types';
+
+const clientDatailsFields = [
+  'id',
+  'other_identifications',
+  'first_name',
+  'middle_name',
+  'last_name',
+  'gender',
+  'date_of_birth',
+  'is_alive',
+  'deceased_datetime',
+  'phone',
+  'email',
+  'civil_status',
+  'place_of_birth',
+  'citizenship',
+  'country',
+  'county',
+  'sub_county',
+  'ward',
+  'village_estate',
+  'longitude',
+  'latitude',
+  'identification_type',
+];
+
+export function generateHieClientDetails(hieClient: HieClient) {
+  let data = {};
+  Object.keys(hieClient)
+    .filter((key) => {
+      return clientDatailsFields.includes(key);
+    })
+    .forEach((key) => {
+      if (key === 'other_identifications') {
+        const otherIds = generateOtherIdentifications(hieClient[key]);
+        data = {
+          ...data,
+          ...otherIds,
+        };
+      } else if (key === 'identification_type') {
+        data[hieClient['identification_type']] = hieClient.identification_number;
+      } else {
+        const value = hieClient[key];
+        data[key] = value;
+      }
+    });
+  return data;
+}
+function generateOtherIdentifications(hieIdentifications: HieIdentifications[]) {
+  const other = {};
+  hieIdentifications.forEach((id) => {
+    other[id.identification_type] = id.identification_number;
+  });
+  return other;
+}

package/src/patient-registration/client-registry/new-client/client-dependants/list/client-depandants.component.tsx

@@ -0,0 +1,55 @@
+import React, { useMemo } from 'react';
+import { Table, TableHead, TableRow, TableHeader, TableBody, TableCell } from '@carbon/react';
+import { type HieDependant } from '../../../types';
+
+interface ClientDependantsListProps {
+  hieDependants: HieDependant[];
+}
+
+const ClientDependantList: React.FC<ClientDependantsListProps> = ({ hieDependants }) => {
+  const dependants = useMemo(() => generateDependantList(hieDependants), [hieDependants]);
+  if (!hieDependants) {
+    return <>No dependants</>;
+  }
+  function generateDependantList(hieDependants: HieDependant[]) {
+    const dependants = [];
+    hieDependants.forEach((dep) => {
+      dependants.push({
+        ...dep.result[0],
+        relationship: dep.relationship,
+      });
+    });
+    return dependants;
+  }
+
+  return (
+    <>
+      <Table>
+        <TableHead>
+          <TableRow>
+            <TableHeader>No</TableHeader>
+            <TableHeader>CR</TableHeader>
+            <TableHeader>Relationship</TableHeader>
+            <TableHeader>Full Name</TableHeader>
+            <TableHeader>Gender</TableHeader>
+            <TableHeader>Date of Birth</TableHeader>
+          </TableRow>
+        </TableHead>
+        <TableBody>
+          {dependants.map((dep, index) => (
+            <TableRow id={dep.id}>
+              <TableCell>{index + 1}</TableCell>
+              <TableCell>{dep.id}</TableCell>
+              <TableCell>{dep.relationship}</TableCell>
+              <TableCell>{`${dep.first_name} ${dep.middle_name} ${dep.last_name}`}</TableCell>
+              <TableCell>{dep.gender}</TableCell>
+              <TableCell>{dep.date_of_birth}</TableCell>
+            </TableRow>
+          ))}
+        </TableBody>
+      </Table>
+    </>
+  );
+};
+
+export default ClientDependantList;

package/src/patient-registration/client-registry/new-client/client-details/client-details.tsx

@@ -0,0 +1,42 @@
+import React, { useMemo } from 'react';
+import { type HieClient } from '../../types';
+import { DataTable, Table, TableHead, TableRow, TableHeader, TableBody, TableCell } from '@carbon/react';
+import { generateHieClientDetails } from '../../hie-client-adapter';
+
+interface ClientdetailsProps {
+  client: HieClient;
+}
+
+const ClientDetails: React.FC<ClientdetailsProps> = ({ client }) => {
+  const clientDetails = useMemo(() => generateHieClientDetails(client), [client]);
+
+  if (!client || !clientDetails) {
+    return (
+      <>
+        <h4>No patient Data to Display</h4>
+      </>
+    );
+  }
+  return (
+    <>
+      <Table>
+        <TableHead>
+          <TableRow>
+            <TableHeader>Field</TableHeader>
+            <TableHeader>Value</TableHeader>
+          </TableRow>
+        </TableHead>
+        <TableBody>
+          {Object.keys(clientDetails).map((key) => (
+            <TableRow>
+              <TableCell>{key}</TableCell>
+              <TableCell>{clientDetails[key]}</TableCell>
+            </TableRow>
+          ))}
+        </TableBody>
+      </Table>
+    </>
+  );
+};
+
+export default ClientDetails;

package/src/patient-registration/client-registry/new-client/new-client-tab.component.tsx

@@ -0,0 +1,30 @@
+import React from 'react';
+import { Tabs, TabList, Tab, TabPanels, TabPanel, Button } from '@carbon/react';
+import { type HieClient } from '../types';
+import ClientDependantList from './client-dependants/list/client-depandants.component';
+import ClientDetails from './client-details/client-details';
+
+interface NewClientTabProps {
+  client: HieClient;
+  useHieData: () => void;
+}
+
+const NewClientTab: React.FC<NewClientTabProps> = ({ client, useHieData }) => {
+  return (
+    <>
+      <Tabs>
+        <TabList contained>
+          <Tab>Patient</Tab>
+          <Tab>Dependants</Tab>
+        </TabList>
+        <TabPanels>
+          <TabPanel>{client ? <ClientDetails client={client} /> : <></>}</TabPanel>
+          <TabPanel>{client.dependants ? <ClientDependantList hieDependants={client.dependants} /> : <></>}</TabPanel>
+        </TabPanels>
+      </Tabs>
+      <Button onClick={useHieData}>Use Data</Button>
+    </>
+  );
+};
+
+export default NewClientTab;

package/src/patient-registration/client-registry/types/index.ts

@@ -0,0 +1,210 @@
+export enum HieIdentificationType {
+  NationalID = 'National ID',
+  SHANumber = 'SHA Number',
+  HouseholdNumber = 'Household Number',
+  RefugeeID = 'Refugee ID',
+  AlienID = 'Alien ID',
+  MandateNumber = 'Mandate Number',
+  Cr = 'id',
+  TemporaryDependantID = 'Temporary Dependant ID',
+}
+
+export enum HieAttributeType {
+  KRAPin = 'kra_pin',
+  CivilStatus = 'civil_status',
+  Email = 'email',
+  Phone = 'phone',
+  PlaceOfBirth = 'place_of_birth',
+  Citizenship = 'citizenship',
+  Cr = 'id',
+}
+
+export interface HieIdentifications {
+  identification_number: string;
+  identification_type: HieIdentificationType;
+}
+
+export interface HieDependant {
+  date_added: string;
+  relationship: string;
+  total: number;
+  result: HieClient[];
+}
+
+export interface AlternateContact {
+  contact_type: string;
+  contact_id: string;
+  contact_name: string;
+  relationship: string;
+  remarks: string;
+}
+
+export interface HieClient {
+  resourceType: string;
+  id: string;
+  meta: {
+    versionId: string;
+    creationTime: string;
+    lastUpdated: string;
+    source: string;
+  };
+  originSystem: {
+    system: string;
+    record_id: string;
+  };
+  title: string;
+  first_name: string;
+  middle_name: string;
+  last_name: string;
+  gender: string;
+  date_of_birth: string;
+  place_of_birth: string;
+  person_with_disability: number;
+  citizenship: string;
+  kra_pin: string;
+  preferred_primary_care_network: string;
+  employment_type: string;
+  domestic_worker_type: string;
+  civil_status: string;
+  identification_type: HieIdentificationType;
+  identification_number: string;
+  other_identifications: HieIdentifications[];
+  dependants: HieDependant[];
+  is_alive: number;
+  deceased_datetime: string;
+  phone: string;
+  biometrics_verified: number;
+  biometrics_score: number;
+  email: string;
+  country: string;
+  county: string;
+  sub_county: string;
+  ward: string;
+  village_estate: string;
+  building_house_no: string;
+  latitude: string;
+  longitude: string;
+  province_state_country: string;
+  zip_code: string;
+  identification_residence: string;
+  employer_name: string;
+  employer_pin: string;
+  disability_category: string;
+  disability_subcategory: string;
+  disability_cause: string;
+  in_lawful_custody: string;
+  admission_remand_number: string;
+  document_uploads: any[];
+  alternative_contacts: AlternateContact[];
+  gross_income: number;
+  gross_income_currency: string;
+  postal_address: string;
+  estimated_contribution: number;
+  estimated_annual_contribution: number;
+  city: string;
+  id_serial: string;
+  learning_institution_code: string;
+  learning_institution_name: string;
+  grade_level: string;
+  admission_number: string;
+  expected_year_of_graduation: string;
+  unconfirmed_dependants: HieDependant[];
+  is_agent: number;
+  agent_id: string;
+}
+
+export interface HieClientSearchDto {
+  identificationNumber: number | string;
+  identificationType: HieIdentificationType;
+  locationUuid: string;
+}
+
+export interface HieAmrsObj {
+  key: string;
+  title: string;
+  hieValue: string | number | boolean;
+  amrsValue: string | number | boolean;
+}
+
+export interface ValidateHieCustomOtpDto {
+  sessionId: string;
+  otp: number | string;
+  locationUuid: string;
+}
+
+export type HieOtpValidationStatus = 'valid' | 'invalid';
+
+export interface ValidateHieCustomOtpResponse {
+  data: {
+    identification_type: string;
+    identification_number: string;
+    status: HieOtpValidationStatus;
+  };
+  source?: string;
+}
+
+export interface ValidateHieCustomOtpErrorResponse {
+  error: string;
+  details: string;
+}
+
+export interface RequestCustomOtpDto {
+  identificationNumber: string | number;
+  identificationType: string;
+  locationUuid: string;
+}
+
+export interface RequestCustomOtpResponse {
+  message: string;
+  sessionId: string;
+  maskedPhone: string;
+}
+export interface RequestCustomOtpErrorResponse {
+  error: string;
+  details: string;
+}
+
+export interface HieClientDependant extends HieClient {
+  date_added: string;
+  relationship: string;
+}
+
+export interface HieFacility {
+  id: string;
+  facility_name: string;
+  registration_number: string;
+  facility_code: string;
+  regulator: string;
+  facility_level: string;
+  facility_category: string;
+  facility_owner: string;
+  facility_type: string;
+  county: string;
+  sub_county: string;
+  ward: string;
+  found: number;
+  approved: number;
+  operational_status: string;
+  current_license_expiry_date: string;
+}
+
+export interface HieFacilitySearchResponse {
+  message: HieFacility;
+}
+
+export interface FacilitySearchFilter {
+  filterType: string;
+  filterValue: string;
+  locationUuid: string;
+}
+
+export enum FacilitySearchFilterType {
+  location = 'location',
+  facilityCode = 'facilityCode',
+  registrationNumber = 'registrationNumber',
+}
+
+export interface PatientShrSummaryFilter {
+  cr_id: string;
+  locationUuid: string;
+}

package/src/patient-registration/custom-patient-registration.scss

@@ -0,0 +1,6 @@
+.patientVerification {
+  display: flex;
+  flex-direction: column;
+  row-gap: 10px;
+  padding-bottom: 10px;
+}

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

@@ -25,6 +25,7 @@ import { type SavePatientForm, SavePatientTransactionManager } from './form-mana
 import { useInitialAddressFieldValues, useInitialFormValues, usePatientUuidMap } from './patient-registration-hooks';
 import BeforeSavePrompt from './before-save-prompt';
 import styles from './patient-registration.scss';
+import customStyles from './custom-patient-registration.scss';
 import ClientRegistryLookupSection from './client-registry/client-registry-search.component';
 
 let exportedInitialFormValuesForTesting = {} as FormValues;
@@ -65,6 +66,7 @@ export const PatientRegistration: React.FC<PatientRegistrationProps> = ({ savePa
   const { data: photo } = usePatientPhoto(patientToEdit?.id);
   const savePatientTransactionManager = useRef(new SavePatientTransactionManager());
   const validationSchema = getValidationSchema(config, t);
+  const [showVerifyModal, setShowVerifyModal] = useState<boolean>(false);
 
   useEffect(() => {
     exportedInitialFormValuesForTesting = initialFormValues;
@@ -166,6 +168,13 @@ export const PatientRegistration: React.FC<PatientRegistrationProps> = ({ savePa
     }
   };
 
+  const openVerifyModal = () => {
+    setShowVerifyModal(true);
+  };
+  const closeVerifyModal = () => {
+    setShowVerifyModal(false);
+  };
+
   const createContextValue = useCallback(
     (formikProps) => ({
       identifierTypes,
@@ -244,20 +253,23 @@ export const PatientRegistration: React.FC<PatientRegistrationProps> = ({ savePa
             </div>
             <div className={styles.infoGrid}>
               <PatientRegistrationContextProvider value={createContextValue(props)}>
-                <div>
-                  {!isClientVerified && !inEditMode && (
-                    <div className={styles.notificationSpacing} style={{ marginTop: '1rem' }}>
-                      <InlineNotification
-                        title="Verification required"
-                        subtitle="Please complete Client Registry OTP verification before proceeding with registration."
-                        kind="info"
-                        lowContrast
+                <div className={customStyles.patientVerification}>
+                  <h4>Patient Verification</h4>
+                  <Button onClick={openVerifyModal}>Verify CR</Button>
+                  {showVerifyModal ? (
+                    <>
+                      <ClientRegistryLookupSection
+                        onClientVerified={() => setIsClientVerified(true)}
+                        onModalClose={closeVerifyModal}
+                        open={showVerifyModal}
+                        isNewClient={true}
                       />
-                    </div>
+                    </>
+                  ) : (
+                    <></>
                   )}
-
-                  <ClientRegistryLookupSection onClientVerified={() => setIsClientVerified(true)} />
-
+                </div>
+                <div>
                   {sections.map((section, index) => (
                     <SectionWrapper
                       key={`registration-section-${section.id}`}

package/src/widgets/client-registry-verification.modal.tsx

@@ -14,12 +14,25 @@ const ClientRegistryVerificationModal: React.FC<ClientRegistryVerificationPropsM
   props,
 }) => {
   const { t } = useTranslation();
+
+  const registerOnAfyaYangu = () => {
+    window.open('https://afyayangu.go.ke/', '_blank');
+  };
+
   return (
     <>
       <ModalHeader closeModal={close} title={t('hieClientVerificationTitle', 'HIE Client Verification')} />
       <ModalBody>
         <Component {...props} />
       </ModalBody>
+      <ModalFooter>
+        <Button kind="secondary" size="lg" onClick={close}>
+          {t('cancel', 'Cancel')}
+        </Button>
+        <Button kind="primary" size="lg" onClick={() => registerOnAfyaYangu()}>
+          {t('registerOnAfyaYangu', 'Register on Afya Yangu')}
+        </Button>
+      </ModalFooter>
     </>
   );
 };