Skip to content

Commit

Permalink
code refactor and ensure that Infant status outcomes showing on infan…
Browse files Browse the repository at this point in the history
…t banner
  • Loading branch information
Lucy Jemutai authored and Lucy Jemutai committed Nov 27, 2024
1 parent 5313b4f commit 3727c77
Show file tree
Hide file tree
Showing 9 changed files with 83 additions and 137 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -3,21 +3,11 @@ import { render, screen } from '@testing-library/react';
import '@testing-library/jest-dom';
import { PatientStatusBannerTag } from './patient-status-tag.component';
import { usePatientHivStatus } from './patientHivStatus';
import { usePatientOutcome } from './useInfantFinalOutcome';
import { usePatientFamilyNames } from './usePatientFamilyNames';

jest.mock('./patientHivStatus', () => ({
usePatientHivStatus: jest.fn(),
}));

jest.mock('./useInfantFinalOutcome', () => ({
usePatientOutcome: jest.fn(),
}));

jest.mock('./usePatientFamilyNames', () => ({
usePatientFamilyNames: jest.fn(),
}));

describe('PatientStatusBannerTag', () => {
const hivPositiveSampleUuid = '138571AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA';

Expand All @@ -32,19 +22,6 @@ describe('PatientStatusBannerTag', () => {
isError: false,
});

(usePatientOutcome as jest.Mock).mockReturnValue({
patientOutcome: null,
});

(usePatientFamilyNames as jest.Mock).mockReturnValue({
childrenNames: [],
motherName: null,
patientAge: null,
patientGender: null,
isLoading: true,
isError: false,
});

const { container } = render(<PatientStatusBannerTag patientUuid={hivPositiveSampleUuid} />);
expect(container.firstChild).toBeNull();
});
Expand All @@ -56,22 +33,8 @@ describe('PatientStatusBannerTag', () => {
isError: false,
});

(usePatientOutcome as jest.Mock).mockReturnValue({
patientOutcome: 'Still in Care',
});

(usePatientFamilyNames as jest.Mock).mockReturnValue({
childrenNames: [],
motherName: null,
patientAge: null,
patientGender: null,
isLoading: false,
isError: false,
});

render(<PatientStatusBannerTag patientUuid={hivPositiveSampleUuid} />);
expect(screen.getByText('HIV Positive')).toBeInTheDocument();
expect(screen.getByText('Still in Care')).toBeInTheDocument();
});

it('should display the correct tag for HIV negative status', () => {
Expand All @@ -81,69 +44,7 @@ describe('PatientStatusBannerTag', () => {
isError: false,
});

(usePatientOutcome as jest.Mock).mockReturnValue({
patientOutcome: 'HIV negative infant discharged from PMTCT',
});

(usePatientFamilyNames as jest.Mock).mockReturnValue({
childrenNames: [],
motherName: null,
patientAge: null,
patientGender: null,
isLoading: false,
isError: false,
});

render(<PatientStatusBannerTag patientUuid={hivPositiveSampleUuid} />);
expect(screen.getByText('HIV Negative')).toBeInTheDocument();
expect(screen.getByText('HIV negative infant discharged from PMTCT')).toBeInTheDocument();
});

it('should display mother’s name on the Infant banner', () => {
(usePatientHivStatus as jest.Mock).mockReturnValue({
hivStatus: 'negative',
isLoading: false,
isError: false,
});

(usePatientOutcome as jest.Mock).mockReturnValue({
patientOutcome: 'Still in Care',
});

(usePatientFamilyNames as jest.Mock).mockReturnValue({
childrenNames: [],
motherName: 'Jane Doe',
patientAge: 10,
patientGender: 'M',
isLoading: false,
isError: false,
});

render(<PatientStatusBannerTag patientUuid={hivPositiveSampleUuid} />);
expect(screen.getByText('Mother: Jane Doe')).toBeInTheDocument();
});

it('should show an error message when there is an error fetching data', () => {
(usePatientHivStatus as jest.Mock).mockReturnValue({
hivStatus: null,
isLoading: false,
isError: false,
});

(usePatientOutcome as jest.Mock).mockReturnValue({
patientOutcome: null,
});

(usePatientFamilyNames as jest.Mock).mockReturnValue({
childrenNames: [],
motherName: null,
patientAge: null,
patientGender: null,
isLoading: false,
isError: true,
});

render(<PatientStatusBannerTag patientUuid={hivPositiveSampleUuid} />);
expect(screen.getByText('Error fetching family information')).toBeInTheDocument();
});
});
Original file line number Diff line number Diff line change
Expand Up @@ -2,48 +2,40 @@ import React from 'react';
import { Tag } from '@carbon/react';
import { useTranslation } from 'react-i18next';
import { usePatientHivStatus } from './patientHivStatus';
import { usePatientOutcome } from './useInfantFinalOutcome';
import { usePatientFamilyNames } from './usePatientFamilyNames';

export function PatientStatusBannerTag({ patientUuid }) {
interface PatientStatusBannerTagProps {
patientUuid: string;
outcomeTagColor?: string;
mappedOutcome?: string;
motherName?: string;
childrenNames?: string[];
patientGender?: string;
}

export const PatientStatusBannerTag: React.FC<PatientStatusBannerTagProps> = ({
patientUuid,
outcomeTagColor,
mappedOutcome,
motherName,
childrenNames,
patientGender,
}) => {
const { t } = useTranslation();

const { hivStatus } = usePatientHivStatus(patientUuid);

const { patientOutcome } = usePatientOutcome(patientUuid);

const greenOutcomes = ['Still in Care', 'HIV negative infant discharged from PMTCT'];
const redOutcomes = ['Confirmed HIV positive', 'Lost to follow up', 'Dead', 'Transferred out'];

let outcomeTagColor = '';
if (greenOutcomes.includes(patientOutcome)) {
outcomeTagColor = 'green';
} else if (redOutcomes.includes(patientOutcome)) {
outcomeTagColor = 'red';
}

const { childrenNames, motherName, patientGender, isLoading, isError } = usePatientFamilyNames(patientUuid);

if (isLoading) {
return null;
}

if (isError) {
return <div>Error fetching family information</div>;
}

return (
<>
{hivStatus === 'positive' && <Tag type="red">{t('hivPositive', 'HIV Positive')}</Tag>}
{hivStatus === 'negative' && <Tag type="green">{t('hivNegative', 'HIV Negative')}</Tag>}

{patientOutcome && outcomeTagColor && <Tag type={outcomeTagColor}>{patientOutcome}</Tag>}
{mappedOutcome && outcomeTagColor && <Tag type={outcomeTagColor}>{mappedOutcome}</Tag>}

{motherName && <Tag type="purple">Mother: {motherName}</Tag>}

{patientGender === 'F' && childrenNames.length > 0 && (
<Tag type="purple">Children: {childrenNames.join(' || ')}</Tag>
<Tag type="purple">Children: {childrenNames.join(' || ')}</Tag>
)}
</>
);
}
};
5 changes: 2 additions & 3 deletions packages/esm-commons-lib/src/index.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { FormEngine } from '@openmrs/openmrs-form-engine-lib';
import { defineConfigSchema, getSyncLifecycle } from '@openmrs/esm-framework';
import { PatientStatusBannerTag } from './components/banner-tags/patient-status-tag.component';
import { configSchema } from './config.schema';
import { PatientStatusBannerTag } from './components/banner-tags/patient-status-tag.component';

export * from './constants';
export * from './api.resource';
Expand Down Expand Up @@ -30,6 +30,7 @@ export * from './components/patient-lists/patient-list.component';
export * from './components/tile/ohri-programme-summary-tiles.component';
export * from './components/tile/ohri-summary-tile-tablet.component';
export * from './components/tile/ohri-summary-tile.component';
export * from './components/banner-tags/patient-status-tag.component';
export * from './utils/compare';
export * from './utils/createOHRIDashboardLink';
export * from './utils/createNewOHRIDashboardLink';
Expand Down Expand Up @@ -72,5 +73,3 @@ export function startupApp() {

// t('ohriForms', "OHRI Forms")
export const ohriFormsWorkspace = getSyncLifecycle(FormEngine, options);

export const patientStatusBannerTagExtension = getSyncLifecycle(PatientStatusBannerTag, options);
5 changes: 0 additions & 5 deletions packages/esm-commons-lib/src/routes.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,6 @@
},
"pages": [],
"extensions": [
{
"name": "patient-status-banner-tag",
"slot": "patient-banner-tags-slot",
"component": "patientStatusBannerTagExtension"
}
],
"workspaces": [
{
Expand Down
5 changes: 5 additions & 0 deletions packages/esm-ohri-pmtct-app/src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -101,3 +101,8 @@ export const maternalChildDashboard = getSyncLifecycle(OHRIHome, {
export const ptrackerReportNavLink = getSyncLifecycle(ptrackerdashboardPath, options);

export const patientStatusBannerTagExtension = getSyncLifecycle(PatientStatusBannerTag, options);

export const pmtctBannerTagExtension = getAsyncLifecycle(
() => import('./pmtct/patient-chart/banner-tags/banner-tags.component'),
options,
)
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
import React from 'react';
import { useTranslation } from 'react-i18next';
import { usePatientOutcome } from './useInfantFinalOutcome';
import { usePatientFamilyNames } from './usePatientFamilyNames';
import { PatientStatusBannerTag } from '@ohri/openmrs-esm-ohri-commons-lib';

interface MotherChildTagProps {
patientUuid: string;
}

const MotherChildTag: React.FC<MotherChildTagProps> = ({ patientUuid }) => {
const { t } = useTranslation();

const { patientOutcome } = usePatientOutcome(patientUuid);
const { childrenNames, motherName, patientGender, isLoading, isError } = usePatientFamilyNames(patientUuid);

if (isLoading) {
return null;
}

if (isError) {
console.error('Error fetching family information');
return null;
}

const outcomeColorMapping: { [key: string]: string } = {
'Still in Care': 'green',
'HIV negative infant discharged from PMTCT': 'green',
'Lost to followup': 'red',
Dead: 'red',
'Transferred out': 'red',
'Transfer in': 'red',
'Confirmed HIV positive': 'red',
};

const outcomeTagColor = outcomeColorMapping[patientOutcome] || 'gray';
//Not to future self -- transfer in shouldnt be confirmed HIV positive
const mappedOutcome =
patientOutcome === 'Transfer in' ? t('confirmedHivPositive', 'Confirmed HIV Positive') : patientOutcome;

return (
<PatientStatusBannerTag
patientUuid={patientUuid}
outcomeTagColor={outcomeTagColor}
mappedOutcome={mappedOutcome}
motherName={motherName}
childrenNames={childrenNames}
patientGender={patientGender}
/>
);
};

export default MotherChildTag;
5 changes: 3 additions & 2 deletions packages/esm-ohri-pmtct-app/src/routes.json
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,11 @@
"pages": [],
"extensions": [
{
"name": "patient-status-banner-tag",
"name": "pmtct-status-banner-tag",
"slot": "patient-banner-tags-slot",
"component": "patientStatusBannerTagExtension"
"component": "pmtctBannerTagExtension"
},

{
"name": "maternal-child-health-results-summary",
"slot": "homepage-dashboard-slot",
Expand Down

0 comments on commit 3727c77

Please sign in to comment.