@kenyaemr/esm-express-workflow-app 5.4.3 → 5.4.4-pre.100

package/src/components/registration/helper/index.ts

@@ -736,3 +736,7 @@ export const getEligibilityTags = (patient: fhir.Patient, eligibilityData?: Elig
 
   return tags;
 };
+
+export const sanitizeName = (name: string): string => {
+  return name?.trim().replace(/[^\w\s'\-\.]/g, '') || '';
+};

package/src/components/registration/index.ts

@@ -1,20 +1,21 @@
-import { getSyncLifecycle } from '@openmrs/esm-framework';
+import { getAsyncLifecycle } from '@openmrs/esm-framework';
 
 import { moduleName } from '../../constants';
-import { createLeftPanelLink } from '../../shared/dashboard-link/dashboard-link.component';
-import Registration from './registration.component';
 
 const options = {
   featureName: 'express-workflow',
   moduleName,
 };
 
-export const registrationDashboard = getSyncLifecycle(Registration, options);
+export const registrationDashboard = getAsyncLifecycle(() => import('./registration.component'), options);
 // t('registration', 'Registration')
-export const registrationLeftPanelLink = getSyncLifecycle(
-  createLeftPanelLink({
-    title: 'registration',
-    name: 'registration',
-  }),
+export const registrationLeftPanelLink = getAsyncLifecycle(
+  () =>
+    import('../../shared/dashboard-link/dashboard-link.component').then((m) => ({
+      default: m.createLeftPanelLink({
+        title: 'registration',
+        name: 'registration',
+      }),
+    })),
   options,
 );

package/src/components/registration/search-bar/search-bar.resource.ts

@@ -1,5 +1,13 @@
 import { useMemo } from 'react';
-import { FetchResponse, launchWorkspace, makeUrl, openmrsFetch, restBaseUrl } from '@openmrs/esm-framework';
+import {
+  FetchResponse,
+  launchWorkspace2,
+  launchWorkspaceGroup2,
+  makeUrl,
+  openmrsFetch,
+  restBaseUrl,
+  type Visit,
+} from '@openmrs/esm-framework';
 import useSWR from 'swr';
 import { type EligibilityResponse, type HIEEligibilityResponse, type LocalPatientApiResponse } from '../type';
 import {
@@ -11,6 +19,7 @@ import {
 } from '../constant';
 import { createDependentPatient, createHIEPatient } from '../dependants/dependants.resource';
 import { transformToDependentPayload } from '../helper';
+import { VisitFormProps } from '../start-visit-form/visit-form-workspace/visit-form.workspace';
 
 export const searchPatientFromHIE = async (identifierType: string, searchQuery: string) => {
   const url = `${restBaseUrl}/kenyaemr/getSHAPatient/${searchQuery}/${identifierType}`;
@@ -64,11 +73,10 @@ export const useSHAEligibility = (nationalId: string) => {
 };
 
 export const extractPatientIdentifiers = (patient: any, isDependent = false) => {
-  const identifiers = [];
+  const identifiers: Array<{ value: string; type: string }> = [];
 
   if (isDependent) {
     const identifierExtensions = patient.extension?.filter((ext: any) => ext.url === 'identifiers') || [];
-
     identifierExtensions.forEach((ext: any) => {
       if (ext.valueIdentifier?.value && ext.valueIdentifier?.type?.coding?.[0]?.code) {
         identifiers.push({
@@ -101,7 +109,7 @@ export const findExistingLocalPatient = async (patient: any, isDependent = false
   }
 
   const prioritizedIdentifiers = identifiers.sort((a, b) => {
-    const priorityOrder = { 'national-id': 1, 'sha-number': 2, 'birth-certificate': 3 };
+    const priorityOrder: Record<string, number> = { 'national-id': 1, 'sha-number': 2, 'birth-certificate': 3 };
     return (priorityOrder[a.type] || 999) - (priorityOrder[b.type] || 999);
   });
 
@@ -119,26 +127,30 @@ export const findExistingLocalPatient = async (patient: any, isDependent = false
   return null;
 };
 
-/**
- * Registers a new patient if they don't exist locally, or launches the start visit workspace if they do.
- *
- * @param {Object} hiePatient - The patient object returned from the HIE
- * @param {Object} t - The i18n translation function
- * @returns {Promise<Object>} The patient record for the newly registered or existing patient
- */
+async function launchCheckInWorkspace(patient: any, patientUuid: string) {
+  await launchWorkspaceGroup2('ewf-patient-chart', {
+    patient,
+    patientUuid,
+    visitContext: null as unknown as Visit,
+    mutateVisitContext: () => {},
+  });
+
+  launchWorkspace2<VisitFormProps, {}, {}>(
+    'custom-start-visit-workspace-form',
+    {
+      openedFrom: 'registration-check-in',
+      showPatientHeader: false,
+    },
+    {},
+    null,
+  );
+}
+
 export const registerOrLaunchHIEPatient = async (hiePatient: any, t: any) => {
   try {
     const existingLocalPatient = await findExistingLocalPatient(hiePatient, false);
 
     if (existingLocalPatient) {
-      const patientName =
-        existingLocalPatient.person?.personName?.display ||
-        `${existingLocalPatient.person?.personName?.givenName || ''} ${
-          existingLocalPatient.person?.personName?.middleName || ''
-        } ${existingLocalPatient.person?.personName?.familyName || ''}`.trim() ||
-        hiePatient.name?.[0]?.text ||
-        'Unknown Patient';
-
       return existingLocalPatient;
     } else {
       return await createHIEPatient(hiePatient, t);
@@ -148,32 +160,12 @@ export const registerOrLaunchHIEPatient = async (hiePatient: any, t: any) => {
   }
 };
 
-/**
- * Registers a new dependent patient if they don't exist locally, or launches the start visit workspace if they do.
- *
- * @param {Object} dependent - The dependent object returned from the HIE
- * @param {Object} t - The i18n translation function
- * @returns {Promise<Object>} The patient record for the newly registered or existing patient
- */
 export const registerOrLaunchDependent = async (dependent: any, t: any) => {
   try {
     const existingLocalPatient = await findExistingLocalPatient(dependent.contactData, true);
 
     if (existingLocalPatient) {
-      const patientName =
-        existingLocalPatient.person?.personName?.display ||
-        `${existingLocalPatient.person?.personName?.givenName || ''} ${
-          existingLocalPatient.person?.personName?.middleName || ''
-        } ${existingLocalPatient.person?.personName?.familyName || ''}`.trim() ||
-        dependent.name;
-
-      launchWorkspace('start-visit-workspace-form', {
-        patientUuid: existingLocalPatient.uuid,
-        workspaceTitle: t('startVisitWorkspaceTitle', 'Start Visit for {{patientName}}', {
-          patientName: patientName,
-        }),
-      });
-
+      await launchCheckInWorkspace(existingLocalPatient, existingLocalPatient.uuid);
       return existingLocalPatient;
     } else {
       const dependentPayload = transformToDependentPayload(dependent);
@@ -184,12 +176,6 @@ export const registerOrLaunchDependent = async (dependent: any, t: any) => {
   }
 };
 
-/**
- * Searches for multiple dependents locally.
- *
- * @param {Object[]} dependents - Array of dependent objects returned from the HIE
- * @returns {Promise<Map<string, any>>} A Map of dependent IDs to the corresponding patient records if found, or `null` if the dependent is not found.
- */
 export const searchMultipleDependentsLocally = async (dependents: any[]) => {
   const results = new Map();
 
@@ -205,13 +191,6 @@ export const searchMultipleDependentsLocally = async (dependents: any[]) => {
   return results;
 };
 
-/**
- * Searches for a patient by identifier value in the local OpenMRS database.
- *
- * @param {string} identifierValue - The value of the identifier to search for
- * @param {string} [identifierType] - The type of identifier to search by, if specified
- * @returns {Promise<Object | null>} The patient record for the matching patient, or `null` if no match is found
- */
 export const searchLocalPatientByIdentifier = async (identifierValue: string, identifierType?: string) => {
   if (!identifierValue) {
     return null;
@@ -253,22 +232,6 @@ export const searchLocalPatientByIdentifier = async (identifierValue: string, id
   }
 };
 
-/**
- * @param {string | null} identifierValue - The identifier value to search for, or null to not search.
- * @returns {object} An object containing the local patient, if found, and booleans indicating whether the search is loading or encountered an error.
- *
- * @example
- * const { localPatient, isLoading, error } = useLocalPatientByIdentifier('12345678');
- * if (isLoading) {
- *   // show a loading indicator
- * }
- * if (error) {
- *   // handle the error
- * }
- * if (localPatient) {
- *   // do something with the local patient
- * }
- */
 export const useLocalPatientByIdentifier = (identifierValue: string | null) => {
   const { data, error, isLoading } = useSWR(
     identifierValue ? `local-patient-${identifierValue}` : null,
@@ -287,30 +250,6 @@ export const useLocalPatientByIdentifier = (identifierValue: string | null) => {
   };
 };
 
-/**
- * Searches for local patients with the given identifiers and returns an array of results.
- *
- * Each result is an object with an `identifier` property (the identifier that was searched for),
- * a `patient` property (the local patient that was found, or null if none was found), and an
- * `error` property (an error message if the search failed, or null if the search was successful).
- *
- * @param {Array<{ value: string; type: string }>} identifiers - The identifiers to search for.
- * @returns {Promise<Array<{ identifier: { value: string; type: string }; patient: LocalPatient | null; error: string | null }>>} The results of the search.
- *
- * @example
- * const results = await searchLocalPatientsByIdentifiers([
- *   { value: '12345678', type: 'national-id' },
- *   { value: '1234567890', type: 'ccc-number' },
- * ]);
- * results.forEach((result) => {
- *   if (result.patient) {
- *     // do something with the local patient
- *   }
- *   if (result.error) {
- *     // handle the error
- *   }
- * });
- */
 export const searchLocalPatientsByIdentifiers = async (identifiers: Array<{ value: string; type: string }>) => {
   const results = await Promise.allSettled(
     identifiers.map((identifier) => searchLocalPatientByIdentifier(identifier.value, identifier.type)),

package/src/components/registration/start-visit-form/hooks/useDefaultFacilityLocation.tsx

@@ -0,0 +1,15 @@
+import { type FetchResponse, openmrsFetch, useConfig } from '@openmrs/esm-framework';
+import useSWRImmutable from 'swr/immutable';
+import { ExpressWorkflowConfig } from '../../../../config-schema';
+
+export const useDefaultFacilityLocation = () => {
+  const config = useConfig() as ExpressWorkflowConfig;
+  const apiUrl = config.defaultFacilityUrl;
+  const { data, error, isLoading } = useSWRImmutable<FetchResponse>(apiUrl, openmrsFetch);
+
+  return {
+    defaultFacility: data ? data?.data : null,
+    isLoading: isLoading,
+    error: error,
+  };
+};

package/src/components/registration/start-visit-form/hooks/useDefaultVisitLocation.tsx

@@ -0,0 +1,24 @@
+import { type FetchResponse, type Location, openmrsFetch, restBaseUrl } from '@openmrs/esm-framework';
+import { useEffect } from 'react';
+import useSWR from 'swr';
+
+/**
+ * Fetches the default visit location based on the location and the restrictByVisitLocationTag
+ * If restrictByVisitLocationTag is true, it fetches the nearest ancestor location that supports visits, otherwise it returns the passed-in location
+ *
+ * @param location
+ * @param restrictByVisitLocationTag
+ */
+export function useDefaultVisitLocation(location: Location | undefined, restrictByVisitLocationTag: boolean) {
+  let url = location?.uuid ? `${restBaseUrl}/emrapi/locationThatSupportsVisits?location=${location.uuid}` : null;
+
+  const { data, error } = useSWR<FetchResponse>(restrictByVisitLocationTag ? url : null, openmrsFetch);
+
+  useEffect(() => {
+    if (error) {
+      console.error(error);
+    }
+  }, [error]);
+
+  return !restrictByVisitLocationTag ? location : data?.data;
+}

package/src/components/registration/start-visit-form/hooks/useOfflineVisitType.tsx

@@ -0,0 +1,18 @@
+import { type VisitType, useConfig } from '@openmrs/esm-framework';
+import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { ExpressWorkflowConfig } from '../../../../config-schema';
+
+export const useOfflineVisitType = () => {
+  const config = useConfig() as ExpressWorkflowConfig;
+  const { t } = useTranslation();
+  const [visitTypes, setVisitTypes] = useState<Array<VisitType>>([]);
+
+  useEffect(() => {
+    setVisitTypes([
+      { uuid: config.offlineVisitTypeUuid, name: 'Offline Visit', display: t('offlineVisit', 'Offline Visit') },
+    ]);
+  }, [t, config.offlineVisitTypeUuid]);
+
+  return visitTypes;
+};

package/src/components/registration/start-visit-form/hooks/useRecommendedVisitTypes.tsx

@@ -0,0 +1,36 @@
+import { useMemo } from 'react';
+import useSWR from 'swr';
+import { openmrsFetch, useConfig } from '@openmrs/esm-framework';
+import { ExpressWorkflowConfig } from '../../../../config-schema';
+
+interface EnrollmentVisitType {
+  uuid: string;
+  dataDependencies: Array<string>;
+  enrollmentOptions: object;
+  incompatibleWith: Array<string>;
+  name: string;
+  visitTypes: { allowed: Array<EnrollmentVisitType>; disallowed: Array<EnrollmentVisitType> };
+}
+
+export const useRecommendedVisitTypes = (
+  patientUuid: string,
+  enrollmentUuid: string,
+  programUuid: string,
+  locationUuid: string,
+) => {
+  const { visitTypeResourceUrl, showRecommendedVisitTypeTab } = useConfig() as ExpressWorkflowConfig;
+  const url = `${visitTypeResourceUrl}${patientUuid}/program/${programUuid}/enrollment/${enrollmentUuid}?intendedLocationUuid=${locationUuid}`;
+
+  const { data, error, isLoading } = useSWR<{ data: EnrollmentVisitType }>(
+    showRecommendedVisitTypeTab && patientUuid && enrollmentUuid && programUuid ? url : null,
+    openmrsFetch,
+  );
+
+  const recommendedVisitTypes = useMemo(() => data?.data?.visitTypes?.allowed.map(mapToVisitType) ?? [], [data]);
+  return { recommendedVisitTypes, error, isLoading };
+};
+
+const mapToVisitType = (visitType: EnrollmentVisitType) => ({
+  ...visitType,
+  display: visitType.name,
+});

package/src/components/registration/start-visit-form/hooks/useVisitAttributeType.tsx

@@ -0,0 +1,102 @@
+import { useMemo } from 'react';
+import { type FetchResponse, openmrsFetch, restBaseUrl } from '@openmrs/esm-framework';
+import useSWRImmutable from 'swr/immutable';
+
+interface VisitAttributeType {
+  uuid: string;
+  display: string;
+  name: string;
+  description: string | null;
+  datatypeClassname:
+    | 'org.openmrs.customdatatype.datatype.ConceptDatatype'
+    | 'org.openmrs.customdatatype.datatype.FloatDatatype'
+    | 'org.openmrs.customdatatype.datatype.BooleanDatatype'
+    | 'org.openmrs.customdatatype.datatype.LongFreeTextDatatype'
+    | 'org.openmrs.customdatatype.datatype.FreeTextDatatype'
+    | 'org.openmrs.customdatatype.datatype.DateDatatype';
+  datatypeConfig: string;
+  preferredHandlerClassname: any;
+  retired: boolean;
+}
+
+interface Concept {
+  uuid: string;
+  name: {
+    display: string;
+  };
+  display: string;
+  answers: Array<{
+    display: string;
+    uuid: string;
+  }>;
+}
+
+const visitAttributeTypeCustomRepresentation =
+  'custom:(uuid,display,name,description,datatypeClassname,datatypeConfig)';
+
+export function useVisitAttributeTypes() {
+  const { data, error, isLoading } = useSWRImmutable<FetchResponse<{ results: VisitAttributeType[] }>, Error>(
+    `${restBaseUrl}/visitattributetype?v=${visitAttributeTypeCustomRepresentation}`,
+    openmrsFetch,
+  );
+
+  if (error) {
+    console.error('Failed to fetch visit attribute types: ', error);
+  }
+
+  const results = useMemo(
+    () => ({
+      isLoading,
+      error,
+      visitAttributeTypes: data?.data?.results ?? [],
+    }),
+    [data, error, isLoading],
+  );
+
+  return results;
+}
+
+export function useVisitAttributeType(uuid: string) {
+  const { data, error, isLoading } = useSWRImmutable<FetchResponse<VisitAttributeType>, Error>(
+    `${restBaseUrl}/visitattributetype/${uuid}?v=${visitAttributeTypeCustomRepresentation}`,
+    openmrsFetch,
+  );
+
+  if (error) {
+    console.error(`Failed to fetch visit attribute type ${uuid}: `, error);
+  }
+
+  const results = useMemo(
+    () => ({
+      isLoading,
+      error: error,
+      data: data?.data,
+    }),
+    [data, error, isLoading],
+  );
+
+  return results;
+}
+
+export function useConceptAnswersForVisitAttributeType(conceptUuid: string | null) {
+  const { data, error, isLoading } = useSWRImmutable<FetchResponse<Concept>, Error>(
+    conceptUuid ? `${restBaseUrl}/concept/${conceptUuid}` : null,
+    openmrsFetch,
+  );
+
+  if (error) {
+    console.error(`Failed to fetch concept answers for visit attribute type ${conceptUuid}: `, error);
+  }
+
+  const results = useMemo(
+    () => ({
+      isLoading,
+      error: error,
+      data: data?.data,
+      answers: data?.data?.answers,
+    }),
+    [data, error, isLoading],
+  );
+
+  return results;
+}

package/src/components/registration/start-visit-form/overflow-menu-extension/overflow-menu-item.extension.tsx

@@ -0,0 +1,55 @@
+import React, { useCallback } from 'react';
+import { OverflowMenuItem } from '@carbon/react';
+import { useTranslation } from 'react-i18next';
+import { launchWorkspace2, launchWorkspaceGroup2, type Visit } from '@openmrs/esm-framework';
+import styles from './overflow-menu-item.scss';
+import { type VisitFormProps } from '../visit-form-workspace/visit-form.workspace';
+
+interface CustomStartVisitOverflowMenuItemProps {
+  patientUuid?: string;
+  patient?: fhir.Patient;
+  closeMenu?: () => void;
+}
+
+const CustomStartVisitOverflowMenuItem: React.FC<CustomStartVisitOverflowMenuItemProps> = ({
+  patient,
+  patientUuid,
+  closeMenu,
+}) => {
+  const { t } = useTranslation();
+  const isDeceased = Boolean(patient?.deceasedDateTime);
+
+  const handleLaunchModal = useCallback(async () => {
+    const resolvedPatientUuid = patient?.id ?? patientUuid ?? '';
+
+    await launchWorkspaceGroup2('ewf-patient-chart', {
+      patient,
+      patientUuid: resolvedPatientUuid,
+      visitContext: null as unknown as Visit,
+      mutateVisitContext: () => {},
+    });
+
+    launchWorkspace2<VisitFormProps, {}, {}>(
+      'custom-start-visit-workspace-form',
+      {
+        openedFrom: 'patient-chart-start-visit',
+        showPatientHeader: false,
+      },
+      {},
+      null,
+    );
+  }, [patient, patientUuid]);
+
+  return (
+    !isDeceased && (
+      <OverflowMenuItem
+        className={styles.menuitem}
+        itemText={t('customCheckin', 'Check in')}
+        onClick={handleLaunchModal}
+        closeMenu={closeMenu}
+      />
+    )
+  );
+};
+
+export default CustomStartVisitOverflowMenuItem;

package/src/components/registration/start-visit-form/overflow-menu-extension/overflow-menu-item.scss

@@ -0,0 +1,3 @@
+.menuitem {
+  max-width: none;
+}

package/src/components/registration/start-visit-form/start-visit-workspace/base-visit-type.component.tsx

@@ -0,0 +1,126 @@
+import React, { useState, useMemo, useCallback, useEffect, useRef, type ChangeEvent } from 'react';
+import classNames from 'classnames';
+import { Layer, RadioButton, RadioButtonGroup, Search, StructuredListSkeleton, Tile } from '@carbon/react';
+import { useTranslation } from 'react-i18next';
+import { useFormContext, Controller } from 'react-hook-form';
+import { PatientChartPagination } from '@openmrs/esm-patient-common-lib';
+import { useConfig, useDebounce, useLayoutType, usePagination, type VisitType } from '@openmrs/esm-framework';
+import { type VisitFormData } from './visit-form.resource';
+import { type ExpressWorkflowConfig } from '../../../../config-schema';
+import styles from './base-visit-type.scss';
+
+interface BaseVisitTypeProps {
+  visitTypes: Array<VisitType>;
+}
+
+const BaseVisitType: React.FC<BaseVisitTypeProps> = ({ visitTypes }) => {
+  const { t } = useTranslation();
+  const { control, setValue } = useFormContext<VisitFormData>();
+  const isTablet = useLayoutType() === 'tablet';
+  const [searchTerm, setSearchTerm] = useState<string>('');
+  const debouncedSearchTerm = useDebounce(searchTerm, 300);
+  const config = useConfig<ExpressWorkflowConfig>();
+
+  const filteredVisitTypes = useMemo(() => {
+    const excluded = config?.excludedVisitTypeUuids;
+    return visitTypes.filter((visitType) => !excluded.includes(visitType.uuid));
+  }, [visitTypes, config?.excludedVisitTypeUuids]);
+
+  const searchResults = useMemo(() => {
+    if (!debouncedSearchTerm.trim()) {
+      return filteredVisitTypes;
+    }
+    const lowercasedTerm = debouncedSearchTerm.toLowerCase();
+    return filteredVisitTypes.filter((visitType) => visitType.display.toLowerCase().includes(lowercasedTerm));
+  }, [debouncedSearchTerm, filteredVisitTypes]);
+
+  const { results, currentPage, goTo } = usePagination(searchResults, 5);
+  const hasNoMatchingSearchResults = debouncedSearchTerm.trim() !== '' && searchResults.length === 0;
+  const prevSearchTermRef = useRef(debouncedSearchTerm);
+
+  const handleSearchTermChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {
+    setSearchTerm(e.target.value);
+  }, []);
+
+  useEffect(() => {
+    if (searchResults?.length === 1) {
+      setValue('visitType', searchResults[0].uuid);
+    }
+  }, [searchResults, setValue]);
+
+  useEffect(() => {
+    if (prevSearchTermRef.current !== debouncedSearchTerm && currentPage !== 1) {
+      goTo(1);
+    }
+    prevSearchTermRef.current = debouncedSearchTerm;
+  }, [debouncedSearchTerm, currentPage, goTo]);
+
+  const searchComponent = (
+    <Search
+      labelText={t('searchForAVisitType', 'Search for a visit type')}
+      onChange={handleSearchTermChange}
+      placeholder={t('searchForAVisitType', 'Search for a visit type')}
+      value={searchTerm}
+    />
+  );
+
+  return (
+    <div className={classNames(styles.visitTypeOverviewWrapper, isTablet ? styles.tablet : styles.desktop)}>
+      {filteredVisitTypes.length ? (
+        <>
+          {isTablet ? <Layer>{searchComponent}</Layer> : searchComponent}
+
+          {hasNoMatchingSearchResults ? (
+            <div className={styles.tileContainer}>
+              <Tile className={styles.tile}>
+                <div className={styles.tileContent}>
+                  <p className={styles.content}>{t('noVisitTypesToDisplay', 'No visit types to display')}</p>
+                  <p className={styles.helper}>{t('checkFilters', 'Check the filters above')}</p>
+                </div>
+              </Tile>
+            </div>
+          ) : (
+            <Controller
+              name="visitType"
+              control={control}
+              render={({ field: { onChange, value } }) => (
+                <RadioButtonGroup
+                  className={styles.radioButtonGroup}
+                  name="visit-types"
+                  onChange={onChange}
+                  orientation="vertical"
+                  valueSelected={value}>
+                  {results.map(({ display, uuid }) => (
+                    <RadioButton
+                      className={styles.radioButton}
+                      id={`visit-type-${uuid}`}
+                      key={uuid}
+                      labelText={display}
+                      value={uuid}
+                    />
+                  ))}
+                </RadioButtonGroup>
+              )}
+            />
+          )}
+
+          {!hasNoMatchingSearchResults && (
+            <div className={styles.paginationContainer}>
+              <PatientChartPagination
+                currentItems={results.length}
+                onPageNumberChange={({ page }: { page: number }) => goTo(page)}
+                pageNumber={currentPage}
+                pageSize={5}
+                totalItems={searchResults.length}
+              />
+            </div>
+          )}
+        </>
+      ) : (
+        <StructuredListSkeleton className={styles.skeleton} />
+      )}
+    </div>
+  );
+};
+
+export default BaseVisitType;