Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

(chore) Bump framework and update patient banner props #1342

Merged
merged 2 commits into from
Oct 11, 2024
Merged

(chore) Bump framework and update patient banner props #1342

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
94c956b
Updated the esm-framework and patient banner actions props
vasharma05 Oct 11, 2024
a0699e3
Additional mods
denniskigen Oct 11, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 8 additions & 16 deletions ...es/esm-patient-search-app/src/compact-patient-search/compact-patient-banner.component.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
import React, { forwardRef, useContext, useMemo } from 'react';
import classNames from 'classnames';
import { v4 as uuidv4 } from 'uuid';
import { useTranslation } from 'react-i18next';
Comment on lines +1 to +4
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This change just reorganises the imports (note to self to prioritise work on adding https://github.com/import-js/eslint-plugin-import/blob/main/docs/rules/order.md to our ESLint config for automatically handling this concern)

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That's amazing!

import { Tag } from '@carbon/react';
import {
age,
Expand All @@ -8,35 +12,23 @@ import {
PatientPhoto,
useConfig,
} from '@openmrs/esm-framework';
import classNames from 'classnames';
import React, { forwardRef, useContext, useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { PatientSearchContext } from '../patient-search-context';
import type { FHIRIdentifier, FHIRPatientType, Identifier, SearchedPatient } from '../types';
import { PatientSearchContext } from '../patient-search-context';
import styles from './compact-patient-banner.scss';

interface ClickablePatientContainerProps {
patient: SearchedPatient;
children: React.ReactNode;
patient: SearchedPatient;
}

interface CompactPatientBannerProps {
patients: Array<SearchedPatient>;
}

interface CustomIdentifierProps {
patient: SearchedPatient;
identifierName: string;
}

interface IdentifierTagProps {
identifier: Identifier;
}

interface IdentifiersProps {
identifiers: Array<Identifier>;
}

const CompactPatientBanner = forwardRef<HTMLDivElement, CompactPatientBannerProps>(({ patients }, ref) => {
const config = useConfig();
const { t } = useTranslation();
Expand Down Expand Up @@ -67,7 +59,7 @@ const CompactPatientBanner = forwardRef<HTMLDivElement, CompactPatientBannerProp
id: patient.uuid,
name: [
{
id: String(Math.random()), // not used
id: uuidv4(), // not used
given: [patient.person.personName.givenName, patient.person.personName.middleName],
family: patient.person.personName.familyName,
text: patient.person.personName.display,
Expand All @@ -81,7 +73,7 @@ const CompactPatientBanner = forwardRef<HTMLDivElement, CompactPatientBannerProp
address: preferredAddress
? [
{
id: String(Math.random()), // not used
id: uuidv4(), // not used
city: preferredAddress.cityVillage,
country: preferredAddress.country,
postalCode: preferredAddress.postalCode,
Expand Down
4 changes: 2 additions & 2 deletions packages/esm-patient-search-app/src/compact-patient-search/patient-search.component.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import React, { useRef, useCallback } from 'react';
import { useTranslation } from 'react-i18next';
import { Layer, Loading, Tile } from '@carbon/react';
import EmptyDataIllustration from '../ui-components/empty-data-illustration.component';
import type { PatientSearchResponse } from '../types';
import CompactPatientBanner from './compact-patient-banner.component';
import EmptyDataIllustration from '../ui-components/empty-data-illustration.component';
import Loader from './loader.component';
import type { PatientSearchResponse } from '../types';
import styles from './patient-search.scss';

interface PatientSearchProps extends PatientSearchResponse {
Expand Down
42 changes: 19 additions & 23 deletions ...ent-search-app/src/patient-search-page/patient-banner/banner/patient-banner.component.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,23 +1,29 @@
import React, { type MouseEvent, useContext, useCallback } from 'react';
import React, { type MouseEvent, useContext, useCallback, useState } from 'react';
import classNames from 'classnames';
import { useTranslation } from 'react-i18next';
import { ButtonSkeleton, SkeletonIcon, SkeletonText } from '@carbon/react';
import {
ExtensionSlot,
age,
ConfigurableLink,
ExtensionSlot,
formatDate,
parseDate,
useVisit,
useConfig,
ConfigurableLink,
PatientPhoto,
PatientBannerActionsMenu,
PatientBannerToggleContactDetailsButton,
PatientBannerContactDetails,
PatientBannerToggleContactDetailsButton,
PatientPhoto,
useConfig,
usePatient,
useVisit,
} from '@openmrs/esm-framework';
import { type SearchedPatient } from '../../../types';
import styles from './patient-banner.scss';
import { PatientSearchContext } from '../../../patient-search-context';
import styles from './patient-banner.scss';

interface ClickablePatientContainerProps {
patientUuid: string;
children: React.ReactNode;
}

interface PatientBannerProps {
patient: SearchedPatient;
Expand All @@ -28,11 +34,11 @@ interface PatientBannerProps {
const PatientBanner: React.FC<PatientBannerProps> = ({ patient, patientUuid, hideActionsOverflow }) => {
const { t } = useTranslation();
const { currentVisit } = useVisit(patientUuid);
const { patient: fhirPatient, isLoading } = usePatient(patientUuid);
const { nonNavigationSelectPatientAction } = useContext(PatientSearchContext);

const patientName = patient.person.personName.display;

const [showContactDetails, setShowContactDetails] = React.useState(false);
const [showContactDetails, setShowContactDetails] = useState(false);
const toggleContactDetails = useCallback((e: MouseEvent) => {
e.preventDefault();
e.stopPropagation();
Expand All @@ -56,12 +62,6 @@ const PatientBanner: React.FC<PatientBannerProps> = ({ patient, patientUuid, hid

const isDeceased = !!patient.person.deathDate;

const fhirPatient = React.useMemo(() => {
return {
deceasedDateTime: patient.person.deathDate,
};
}, [patient]);

return (
<>
<div
Expand All @@ -80,9 +80,9 @@ const PatientBanner: React.FC<PatientBannerProps> = ({ patient, patientUuid, hid
<div className={styles.flexRow}>
<span className={styles.patientName}>{patientName}</span>
<ExtensionSlot
className={styles.flexRow}
name="patient-banner-tags-slot"
state={{ patientUuid, patient: fhirPatient }}
className={styles.flexRow}
/>
</div>
<div className={styles.demographics}>
Expand All @@ -108,13 +108,14 @@ const PatientBanner: React.FC<PatientBannerProps> = ({ patient, patientUuid, hid
<div className={styles.buttonCol}>
{!hideActionsOverflow ? (
<PatientBannerActionsMenu
patientUuid={patientUuid}
actionsSlotName={'patient-search-actions-slot'}
additionalActionsSlotState={{
selectPatientAction: nonNavigationSelectPatientAction,
launchPatientChart: true,
}}
isDeceased={patient.person.dead}
patient={fhirPatient}
patientUuid={patientUuid}
/>
) : null}
{!isDeceased && !currentVisit && (
Expand All @@ -132,11 +133,6 @@ const PatientBanner: React.FC<PatientBannerProps> = ({ patient, patientUuid, hid
);
};

interface ClickablePatientContainerProps {
patientUuid: string;
children: React.ReactNode;
}

Comment on lines -135 to -138
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I've just lifted this interface higher up in the file.

const ClickablePatientContainer = ({ patientUuid, children }: ClickablePatientContainerProps) => {
const { nonNavigationSelectPatientAction, patientClickSideEffect } = useContext(PatientSearchContext);
const config = useConfig();
Expand Down
Loading
Loading