@digihmis/esm-patient-registration-app 1.0.0

package/src/type/index.ts

@@ -0,0 +1,463 @@
+import { type Visit, type OpenmrsResource, type Session } from '@openmrs/esm-framework';
+import { type RegistrationConfig } from '../config-schema';
+import { SavePatientTransactionManager } from '../registration-form/form-manager';
+
+interface NameValue {
+  uuid: string;
+  preferred: boolean;
+  givenName: string;
+  middleName: string;
+  familyName: string;
+}
+
+export interface AttributeValue {
+  attributeType: string;
+  value: string;
+}
+
+/**
+ * Patient Identifier data as it is fetched and composed from the APIs.
+ */
+export interface FetchedPatientIdentifierType {
+  name: string;
+  required: boolean;
+  uuid: string;
+  fieldName: string;
+  format: string;
+  formatDescription?: string;
+  isPrimary: boolean;
+  /** See: https://github.com/openmrs/openmrs-core/blob/e3fb1ac0a052aeff0f957a150731757dd319693b/api/src/main/java/org/openmrs/PatientIdentifierType.java#L41 */
+  uniquenessBehavior: undefined | null | 'UNIQUE' | 'NON_UNIQUE' | 'LOCATION';
+}
+
+export interface PatientIdentifierValue {
+  identifierUuid?: string;
+  identifierTypeUuid: string;
+  initialValue: string;
+  identifierValue: string;
+  identifierName: string;
+  selectedSource: IdentifierSource;
+  autoGeneration?: boolean;
+  preferred: boolean;
+  required: boolean;
+}
+
+/**
+ * Extends the `FetchedPatientIdentifierType` with aggregated data.
+ */
+export interface PatientIdentifierType extends FetchedPatientIdentifierType {
+  identifierSources: Array<IdentifierSource>;
+  autoGenerationSource?: IdentifierSource;
+  checked?: boolean;
+  source?: IdentifierSource;
+}
+
+export interface IdentifierSource {
+  uuid: string;
+  name: string;
+  autoGenerationOption?: IdentifierSourceAutoGenerationOption;
+}
+
+export interface IdentifierSourceAutoGenerationOption {
+  manualEntryEnabled: boolean;
+  automaticGenerationEnabled: boolean;
+}
+
+export interface PatientIdentifier {
+  uuid?: string;
+  identifier: string;
+  identifierType?: string;
+  location?: string;
+  preferred?: boolean;
+}
+
+export interface PatientRegistration {
+  id?: number;
+  /**
+   * The preliminary patient in the FHIR format.
+   */
+  fhirPatient: fhir.Patient;
+  /**
+   * Internal data collected by patient-registration. Required for later syncing and editing.
+   * Not supposed to be used outside of this module.
+   */
+  _patientRegistrationData: {
+    isNewPatient: boolean;
+    formValues: FormValues;
+    patientUuidMap: PatientUuidMapType;
+    initialAddressFieldValues: Record<string, any>;
+    capturePhotoProps: CapturePhotoProps;
+    currentLocation: string;
+    initialIdentifierValues: FormValues['identifiers'];
+    currentUser: Session;
+    config: RegistrationConfig;
+    savePatientTransactionManager: SavePatientTransactionManager;
+  };
+}
+
+export type Relationship = {
+  relationshipType: string;
+  personA: string;
+  personB: string;
+};
+
+export type Patient = {
+  uuid: string;
+  identifiers: Array<PatientIdentifier>;
+  person: {
+    uuid: string;
+    names: Array<NameValue>;
+    gender: string;
+    birthdate: string;
+    birthdateEstimated: boolean;
+    attributes: Array<AttributeValue>;
+    addresses: Array<Record<string, string>>;
+    dead: boolean;
+    deathDate?: string;
+    causeOfDeath?: string;
+  };
+};
+
+export interface Encounter {
+  encounterDatetime?: Date;
+  patient: string;
+  encounterType: string;
+  location: string;
+  encounterProviders: Array<{
+    provider: string;
+    encounterRole: string;
+  }>;
+  form: string;
+  obs: Array<{
+    concept: string | OpenmrsResource;
+    value: string | number | OpenmrsResource;
+  }>;
+}
+
+export interface RelationshipValue {
+  relatedPersonName?: string;
+  relatedPersonUuid: string;
+  relation?: string;
+  relationshipType: string;
+  /**
+   * Defines the action to be taken on the existing relationship
+   * @kind ADD -> adds a new relationship
+   * @kind UPDATE -> updates an existing relationship
+   * @kind DELETE -> deletes an existing relationship
+   * @kind undefined -> no operation on the existing relationship
+   */
+  action?: 'ADD' | 'UPDATE' | 'DELETE';
+  /**
+   * Value kept for restoring initial relationshipType value
+   */
+  initialrelationshipTypeValue?: string;
+  uuid?: string;
+}
+
+export interface FormValues {
+  additionalFamilyName: string;
+  additionalGivenName: string;
+  additionalMiddleName: string;
+  addNameInLocalLanguage: boolean;
+  address: {
+    [addressField: string]: string;
+  };
+  attributes?: {
+    [attributeTypeUuid: string]: string;
+  };
+  birthdate: Date | string;
+  birthdateEstimated: boolean;
+  deathCause: string;
+  deathDate: string | Date;
+  deathTime: string;
+  deathTimeFormat: 'AM' | 'PM';
+  familyName: string;
+  gender: string;
+  givenName: string;
+  identifiers: {
+    [identifierFieldName: string]: PatientIdentifierValue;
+  };
+  isDead: boolean;
+  middleName: string;
+  monthsEstimated: number;
+  nonCodedCauseOfDeath: string;
+  obs?: {
+    [conceptUuid: string]: string;
+  };
+  patientUuid: string;
+  relationships: Array<RelationshipValue>;
+  telephoneNumber: string;
+  yearsEstimated: number;
+  observation?: ObsResponse;
+  concepts?: Array<ConceptAnswers>;
+  token?: string;
+}
+
+export interface PatientUuidMapType {
+  additionalNameUuid?: string;
+  preferredNameUuid?: string;
+  preferredAddressUuid?: string;
+}
+
+export interface CapturePhotoProps {
+  imageData: string;
+  dateTime: string;
+}
+
+export interface AddressValidationSchemaType {
+  name: string;
+  label: string;
+  regex: RegExp;
+  regexFormat: string;
+}
+
+export interface CodedPersonAttributeConfig {
+  personAttributeUuid: string;
+  conceptUuid: string;
+}
+
+export interface TextBasedPersonAttributeConfig {
+  personAttributeUuid: string;
+  validationRegex: string;
+}
+
+export interface PatientIdentifierResponse {
+  uuid: string;
+  identifier: string;
+  preferred: boolean;
+  identifierType: {
+    uuid: string;
+    required: boolean;
+    name: string;
+  };
+}
+
+export interface PersonAttributeTypeResponse {
+  uuid: string;
+  display: string;
+  name: string;
+  description: string;
+  format: string;
+}
+
+export interface PersonAttributeResponse {
+  display: string;
+  uuid: string;
+  value:
+    | string
+    | {
+        uuid: string;
+        display: string;
+      };
+  attributeType: {
+    display: string;
+    uuid: string;
+    format: 'org.openmrs.Concept' | string;
+  };
+}
+
+export interface ConceptResponse {
+  uuid: string;
+  display: string;
+  datatype: {
+    uuid: string;
+    display: string;
+  };
+  answers: Array<ConceptAnswers>;
+  setMembers: Array<ConceptAnswers>;
+}
+
+export interface ConceptAnswers {
+  display: string;
+  uuid: string;
+}
+
+export type AddressProperties =
+  | 'cityVillage'
+  | 'stateProvince'
+  | 'countyDistrict'
+  | 'postalCode'
+  | 'country'
+  | 'address1'
+  | 'address2'
+  | 'address3'
+  | 'address4'
+  | 'address5'
+  | 'address6'
+  | 'address7'
+  | 'address8'
+  | 'address9'
+  | 'address10'
+  | 'address11'
+  | 'address12'
+  | 'address13'
+  | 'address14'
+  | 'address15';
+
+export type ExtensibleAddressProperties = { [p in AddressProperties]?: string } | null;
+
+export interface AddressTemplate {
+  displayName: string | null;
+  codeName: string | null;
+  country: string | null;
+  lines: Array<
+    Array<{
+      isToken: 'IS_NOT_ADDR_TOKEN' | 'IS_ADDR_TOKEN';
+      displayText: string;
+      codeName?: AddressProperties;
+      displaySize?: string;
+    }>
+  > | null;
+  lineByLineFormat: Array<string> | null;
+  nameMappings: ExtensibleAddressProperties;
+  sizeMappings: ExtensibleAddressProperties;
+  elementDefaults: ExtensibleAddressProperties;
+  elementRegex: ExtensibleAddressProperties;
+  elementRegexFormats: ExtensibleAddressProperties;
+  requiredElements: Array<AddressProperties> | null;
+}
+
+// https://rest.openmrs.org/#address-template
+export interface RestAddressTemplate {
+  uuid: string;
+  description: string;
+  property: string;
+  display: string;
+  value: string;
+}
+
+export interface ObsResponse {
+  results: Array<{ obs: Array<{ uuid: string; display: string; value: OpenmrsResource; concept: OpenmrsResource }> }>;
+}
+
+export interface SearchedPatient {
+  uuid: string;
+  identifiers: Array<Identifier>;
+  person: {
+    addresses: Array<Address>;
+    age: number;
+    birthdate: string;
+    gender: string;
+    dead: boolean;
+    deathDate: string | null;
+    personName: {
+      display: string;
+      givenName: string;
+      familyName: string;
+      middleName: string;
+    };
+  };
+  attributes: Array<{
+    value: OpenmrsResource | string;
+    attributeType: { uuid: string; display: string };
+  }>;
+}
+
+export interface Identifier {
+  display: string;
+  identifier: string;
+  identifierType: OpenmrsResource;
+  location: OpenmrsResource;
+  uuid: string;
+  preferred: boolean;
+}
+
+export interface Address {
+  preferred: boolean;
+  voided: boolean;
+  address1: string;
+  cityVillage: string;
+  country: string;
+  postalCode: string;
+  stateProvince: string;
+}
+
+export interface User {
+  uuid: string;
+  userProperties: {
+    [x: string]: string;
+    patientsVisited: string;
+    defaultLocation: string;
+  };
+}
+
+export interface PatientSearchResponse {
+  currentPage: number;
+  data?: Array<SearchedPatient>;
+  fetchError: Error;
+  hasMore: boolean;
+  isLoading: boolean;
+  isValidating: boolean;
+  setPage: (page: number | ((_page: number) => number)) => Promise<unknown[] | undefined>;
+  totalResults: number;
+}
+
+export interface Resources {
+  addressTemplate: AddressTemplate;
+  currentSession: Session;
+  relationshipTypes: any;
+  identifierTypes: Array<PatientIdentifierType>;
+}
+
+export interface OpenMRSPatient {
+  person: {
+    personName: {
+      display: string;
+    };
+    gender: string;
+    dead: boolean;
+    birthdate: string;
+  };
+  patientIdentifier: {
+    identifier: string;
+    identifierType: {
+      display: string;
+    };
+  };
+}
+
+export interface ActiveVisit {
+  age: string;
+  id: string;
+  idNumber: string;
+  gender: string;
+  location: string;
+  name: string;
+  patientUuid: string;
+  visitStartTime: string;
+  visitType: string;
+  visitUuid: string;
+  observations?: Record<string, Observation[]>;
+  [identifier: string]: string | Record<string, Observation[]>;
+}
+export interface Observation {
+  uuid: string;
+  concept: {
+    uuid: string;
+    display: string;
+    conceptClass: {
+      uuid: string;
+      display: string;
+    };
+  };
+  display: string;
+  groupMembers: null | Array<{
+    uuid: string;
+    concept: {
+      uuid: string;
+      display: string;
+    };
+    value: {
+      uuid: string;
+      display: string;
+    };
+  }>;
+  value: any;
+  obsDatetime: string;
+}
+
+export interface VisitResponse {
+  results: Array<Visit>;
+  links: Array<{ rel: 'prev' | 'next' }>;
+  totalCount: number;
+}

package/src/utils/fhir-mapper.ts

@@ -0,0 +1,73 @@
+import { v4 as uuidv4 } from 'uuid';
+import { SearchedPatient } from '../type';
+
+const getGender = (gender: string) => {
+  switch (gender) {
+    case 'M':
+      return 'male';
+    case 'F':
+      return 'female';
+    case 'O':
+      return 'other';
+    case 'U':
+      return 'unknown';
+    default:
+      return gender;
+  }
+};
+
+export function mapToFhirPatient(patient: SearchedPatient) {
+  const preferredAddress = patient?.person?.addresses?.find((address) => address.preferred);
+  const addressId = uuidv4();
+  const nameId = uuidv4();
+
+  return {
+    resourceType: 'Patient',
+    address: preferredAddress
+      ? [
+          {
+            id: addressId,
+            city: preferredAddress.cityVillage,
+            country: preferredAddress.country,
+            postalCode: preferredAddress.postalCode,
+            state: preferredAddress.stateProvince,
+            use: 'home',
+          },
+        ]
+      : [],
+    birthDate: patient?.person?.birthdate,
+    deceasedBoolean: patient?.person?.dead,
+    deceasedDateTime: patient?.person?.deathDate ?? undefined,
+    gender: getGender(patient?.person?.gender),
+    id: patient?.uuid,
+    identifier: patient?.identifiers?.map((identifier) => ({
+      id: identifier?.uuid,
+      type: {
+        coding: [
+          {
+            code: identifier.identifierType.uuid,
+          },
+        ],
+        text: identifier.identifierType.display,
+      },
+      use: 'official',
+      value: identifier.identifier,
+    })),
+    name: [
+      {
+        id: nameId,
+        given: [patient?.person?.personName.givenName, patient.person?.personName?.middleName],
+        family: patient?.person?.personName.familyName,
+        text: patient?.person?.personName.display,
+      },
+    ],
+    telecom:
+      patient.attributes
+        ?.filter((attribute) => attribute?.attributeType.display === 'Telephone Number')
+        ?.map((phone) => ({
+          system: 'phone',
+          value: phone.value.toString(),
+          use: 'mobile',
+        })) ?? [],
+  };
+}

package/src/visit-summary/visit-summary.component.tsx

@@ -0,0 +1,32 @@
+import React from 'react';
+import { Tile } from '@carbon/react';
+import { useTranslation } from 'react-i18next';
+import styles from './visit-summary.scss';
+import useActiveVisits, { useAppointmentsData, useTotalVisits } from './visit-summary.resource';
+
+const VisitSummaryTile: React.FC = () => {
+  const { count } = useActiveVisits();
+  const { data: visitsData } = useTotalVisits();
+  const { data: appointmentsData } = useAppointmentsData();
+
+  const { t } = useTranslation();
+
+  return (
+    <Tile className={styles.tileContainer}>
+      <div className={styles.displayDetails}>
+        <div className={styles.countLabel}>{t('activeVisits', 'Active Visits')}</div>
+        <div className={styles.displayData}>{count ?? 0}</div>
+      </div>
+      <div className={styles.displayDetails}>
+        <div className={styles.countLabel}>{t('totalVisits', 'Total Visits Today')}</div>
+        <div className={styles.displayData}>{visitsData?.length ?? 0}</div>
+      </div>
+      <div className={styles.displayDetails}>
+        <div className={styles.countLabel}>{t('scheduledForToday', 'Scheduled For Today')}</div>
+        <div className={styles.displayData}>{appointmentsData?.length ?? 0}</div>
+      </div>
+    </Tile>
+  );
+};
+
+export default VisitSummaryTile;

package/src/visit-summary/visit-summary.resource.ts

@@ -0,0 +1,56 @@
+import useSWR from 'swr';
+import { openmrsFetch, restBaseUrl, useSession, Visit } from '@openmrs/esm-framework';
+import dayjs from 'dayjs';
+
+export default function useActiveVisits() {
+  const session = useSession();
+  const sessionLocation = session?.sessionLocation?.uuid;
+
+  const customRepresentation = 'custom:(uuid,startDatetime,stopDatetime)';
+
+  const getUrl = () => {
+    let url = `${restBaseUrl}/visit?v=${customRepresentation}&`;
+    let urlSearchParams = new URLSearchParams();
+
+    urlSearchParams.append('includeParentLocations', 'true');
+    urlSearchParams.append('includeInactive', 'false');
+    urlSearchParams.append('totalCount', 'true');
+    urlSearchParams.append('location', `${sessionLocation}`);
+
+    return url + urlSearchParams.toString();
+  };
+
+  const { data, error, isLoading } = useSWR<{ data: { totalCount: number } }>(getUrl, openmrsFetch);
+
+  return {
+    count: data?.data?.totalCount,
+    error,
+    isLoading,
+  };
+}
+
+export const useTotalVisits = () => {
+  const customRepresentation = 'custom:(uuid,startDatetime,stopDatetime)';
+
+  const visitsUrl = `${restBaseUrl}/visit?includeInactive=true&v=${customRepresentation}&fromStartDate=${dayjs().format(
+    'YYYY-MM-DD',
+  )}`;
+
+  const { data, error, isLoading } = useSWR<{ data: { results: Array<Visit> } }>(visitsUrl, openmrsFetch);
+
+  return {
+    data: data?.data?.results,
+    error,
+    isLoading,
+  };
+};
+
+export const useAppointmentsData = () => {
+  const appointmentDate = dayjs(new Date().setHours(0, 0, 0, 0)).toISOString();
+
+  const url = `${restBaseUrl}/appointment/all?forDate=${appointmentDate}`;
+
+  const { data, error, isLoading } = useSWR<{ data: Array<any> }>(url, openmrsFetch);
+
+  return { data: data?.data, error, isLoading };
+};

package/src/visit-summary/visit-summary.scss

@@ -0,0 +1,74 @@
+@use '@carbon/layout';
+@use '@carbon/type';
+@use '@carbon/colors';
+@use '@openmrs/esm-styleguide/src/vars' as *;
+
+.tileContainer {
+  border: 1px solid colors.$cool-gray-30;
+  margin-bottom: layout.$spacing-04;
+  display: grid;
+  grid-template-columns: 1fr 1fr 1fr;
+  gap: 0;
+  height: 80px;
+
+  :global(.omrs-breakpoint-lt-desktop) & {
+    padding: layout.$spacing-04;
+  }
+
+  :global(.omrs-breakpoint-lt-tablet) & {
+    padding: layout.$spacing-03;
+    grid-template-columns: 1fr;
+    grid-template-rows: auto auto auto;
+    gap: layout.$spacing-04;
+  }
+}
+
+.tileHeader {
+  color: colors.$gray-70;
+  margin-bottom: layout.$spacing-03;
+  text-transform: none;
+  letter-spacing: 0;
+
+  :global(.omrs-breakpoint-lt-tablet) & {
+    margin-bottom: layout.$spacing-02;
+  }
+}
+
+.displayDetails {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+
+  :global(.omrs-breakpoint-lt-tablet) & {
+    padding: layout.$spacing-03 0;
+    border-right: none;
+    border-bottom: 1px solid colors.$gray-20;
+    padding-bottom: layout.$spacing-04;
+    margin-bottom: layout.$spacing-03;
+  }
+}
+
+.countLabel {
+  color: colors.$gray-70;
+  margin-bottom: layout.$spacing-02;
+  @include type.type-style('caption-01');
+  font-weight: bold;
+
+  :global(.omrs-breakpoint-lt-tablet) & {
+    @include type.type-style('caption-01');
+    font-weight: bold;
+    margin-bottom: layout.$spacing-01;
+  }
+}
+
+.displayData {
+  color: colors.$gray-100;
+  font-weight: bold;
+  @include type.type-style('caption-01');
+  font-size: 25px;
+
+  :global(.omrs-breakpoint-lt-tablet) & {
+    font-size: 2.625rem;
+    line-height: 2.75rem;
+  }
+}