From 502779e9f50372a20e6346d83783f376cf1172b1 Mon Sep 17 00:00:00 2001 From: nravilla Date: Tue, 11 Jun 2024 20:47:27 -0400 Subject: [PATCH] Contd Changes for ESLint react-hooks/exhaustive-deps --- .husky/pre-commit | 4 +- .../tabs/viral-load-results.component.tsx | 61 ++++++++++--------- .../ohri-dashboard.component.tsx | 47 ++++++++------ .../tabs/hiv-exposed-infant.component.tsx | 50 ++++++++------- yarn.lock | 6 +- 5 files changed, 92 insertions(+), 76 deletions(-) diff --git a/.husky/pre-commit b/.husky/pre-commit index a85cc869e..1ac852bb9 100755 --- a/.husky/pre-commit +++ b/.husky/pre-commit @@ -7,5 +7,5 @@ set -e # die on error # yarn turbo run extract-translations // commented because it creates new translations files that are not related to the commit # yarn pretty-quick --staged -#npx lint-staged -yarn turbo run extract-translations +npx lint-staged +#yarn turbo run extract-translations diff --git a/packages/esm-hiv-care-treatment-app/src/views/home-dashboard/lab-results/tabs/viral-load-results.component.tsx b/packages/esm-hiv-care-treatment-app/src/views/home-dashboard/lab-results/tabs/viral-load-results.component.tsx index 833d4460b..4b73b0622 100644 --- a/packages/esm-hiv-care-treatment-app/src/views/home-dashboard/lab-results/tabs/viral-load-results.component.tsx +++ b/packages/esm-hiv-care-treatment-app/src/views/home-dashboard/lab-results/tabs/viral-load-results.component.tsx @@ -52,7 +52,7 @@ const ViralLoadResultsList: React.FC = () => { setPatientCount(data.total); setIsLoading(false); }); - }, [page, pageSize]); + }, [nextOffSet, page, pageSize]); useEffect(() => { let rows = []; @@ -92,6 +92,36 @@ const ViralLoadResultsList: React.FC = () => { setAllRows(rows); }, [patients, patientToViralLoadMap]); + const fetchPatientLastViralEncounters = useCallback( + async (patientUuid) => { + let latestViralEncounter = { + result: '--', + date: '--', + encounterUuid: '', + }; + const query = `encounterType=${encounterTypes.ViralLoadResultsEncounter_UUID}&patient=${patientUuid}`; + const viralResults = await openmrsFetch(`/ws/rest/v1/encounter?${query}&v=${encounterRepresentation}`); + if (viralResults.data.results?.length > 0) { + const sortedEncounters = viralResults.data.results.sort( + (firstEncounter, secondEncounter) => + new Date(secondEncounter.encounterDatetime).getTime() - + new Date(firstEncounter.encounterDatetime).getTime(), + ); + const lastEncounter = sortedEncounters[0]; + + latestViralEncounter.result = getObsFromEncounter(lastEncounter, obsConcepts.ViralLoadResult_UUID); + latestViralEncounter.date = getObsFromEncounter(lastEncounter, obsConcepts.ViralLoadResultDate_UUID, true); + latestViralEncounter.encounterUuid = lastEncounter.uuid; + } + return latestViralEncounter; + }, + [ + encounterTypes.ViralLoadResultsEncounter_UUID, + obsConcepts.ViralLoadResult_UUID, + obsConcepts.ViralLoadResultDate_UUID, + ], + ); + useEffect(() => { const patientToviralLoadResultsPromises = patients.map((patient) => fetchPatientLastViralEncounters(patient.resource.id), @@ -106,7 +136,7 @@ const ViralLoadResultsList: React.FC = () => { })), ); }); - }, [patients]); + }, [fetchPatientLastViralEncounters, patients]); const handleSearch = useCallback( (searchTerm) => { @@ -115,34 +145,9 @@ const ViralLoadResultsList: React.FC = () => { setFilteredResults(filtrate); return true; }, - [searchTerm], + [allRows], ); - - const addNewPatient = () => navigate({ to: '${openmrsSpaBase}/patient-registration' }); const getPatientURL = (patientUuid) => `/openmrs/spa/patient/${patientUuid}/chart/hts-summary`; - - async function fetchPatientLastViralEncounters(patientUuid: string) { - let latestViralEncounter = { - result: '--', - date: '--', - encounterUuid: '', - }; - const query = `encounterType=${encounterTypes.ViralLoadResultsEncounter_UUID}&patient=${patientUuid}`; - const viralResults = await openmrsFetch(`/ws/rest/v1/encounter?${query}&v=${encounterRepresentation}`); - if (viralResults.data.results?.length > 0) { - const sortedEncounters = viralResults.data.results.sort( - (firstEncounter, secondEncounter) => - new Date(secondEncounter.encounterDatetime).getTime() - new Date(firstEncounter.encounterDatetime).getTime(), - ); - const lastEncounter = sortedEncounters[0]; - - latestViralEncounter.result = getObsFromEncounter(lastEncounter, obsConcepts.ViralLoadResult_UUID); - latestViralEncounter.date = getObsFromEncounter(lastEncounter, obsConcepts.ViralLoadResultDate_UUID, true); - latestViralEncounter.encounterUuid = lastEncounter.uuid; - } - return latestViralEncounter; - } - return ( <> {isLoading ? ( diff --git a/packages/esm-ohri-core-app/src/ohri-dashboard/ohri-dashboard.component.tsx b/packages/esm-ohri-core-app/src/ohri-dashboard/ohri-dashboard.component.tsx index d4a5801a9..f7b0568c6 100644 --- a/packages/esm-ohri-core-app/src/ohri-dashboard/ohri-dashboard.component.tsx +++ b/packages/esm-ohri-core-app/src/ohri-dashboard/ohri-dashboard.component.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useMemo, useState } from 'react'; +import React, { useEffect, useMemo, useState, useCallback } from 'react'; import { attach, detach, ExtensionSlot, isDesktop, useExtensionSlotMeta, useLayoutType } from '@openmrs/esm-framework'; import styles from './ohri-dashboard.scss'; import { useParams } from 'react-router-dom'; @@ -11,13 +11,17 @@ const OHRIDashboard = () => { const [currentDashboard, setCurrentDashboard] = useState(null); const layout = useLayoutType(); - useEffect(() => { + const updateCurrentDashboard = useCallback(() => { if (view) { setCurrentDashboard(dashboards.find((db) => db.name == view)); } else if (!currentDashboard) { setCurrentDashboard(dashboards[0]); } - }, [view, dashboards]); + }, [view, dashboards, currentDashboard]); + + useEffect(() => { + updateCurrentDashboard(); + }, [view, dashboards, currentDashboard, updateCurrentDashboard]); useEffect(() => { if (!isDesktop(layout)) { @@ -26,7 +30,7 @@ const OHRIDashboard = () => { return () => detach('nav-menu-slot', 'ohri-nav-items-ext'); }, [layout]); - useEffect(() => { + const updateDashboards = useCallback(() => { const programSpecificLinks = metaFolders ? Object.values(metaFolders).filter((link) => link.isLink) : []; const linksWithDashboardMeta = [ ...Object.values(metaLinks).filter((link) => Object.keys(link).length), @@ -35,7 +39,11 @@ const OHRIDashboard = () => { if (linksWithDashboardMeta.length) { setDashboards([...dashboards, ...linksWithDashboardMeta]); } - }, [metaLinks, metaFolders]); + }, [metaLinks, metaFolders, dashboards]); + + useEffect(() => { + updateDashboards(); + }, [metaLinks, metaFolders, updateDashboards]); const state = useMemo(() => { if (currentDashboard) { @@ -46,17 +54,15 @@ const OHRIDashboard = () => { return (
- {Object.values(metaFolders).map((f, index) => { - return ( - - ); - })} + {Object.values(metaFolders).map((f, index) => ( + + ))} {isDesktop(layout) && }
{currentDashboard && } @@ -67,14 +73,15 @@ const OHRIDashboard = () => { const GroupAbleMenuItem = ({ groupSlot, dashboards, setDashboards, updateDashboardState }) => { const meta = useExtensionSlotMeta(groupSlot); + useEffect(() => { if (meta && Object.keys(meta).length) { - dashboards.push(...Object.values(meta).filter((entry) => Object.keys(entry).length)); - updateDashboardState && setDashboards([...dashboards]); + const newDashboards = [...dashboards, ...Object.values(meta).filter((entry) => Object.keys(entry).length)]; + updateDashboardState && setDashboards(newDashboards); } - }, [meta]); + }, [dashboards, meta, setDashboards, updateDashboardState]); - return <>; + return null; }; export default OHRIDashboard; diff --git a/packages/esm-ohri-pmtct-app/src/views/mch-summary/tabs/hiv-exposed-infant.component.tsx b/packages/esm-ohri-pmtct-app/src/views/mch-summary/tabs/hiv-exposed-infant.component.tsx index dc79d3522..8a5b5ae1a 100644 --- a/packages/esm-ohri-pmtct-app/src/views/mch-summary/tabs/hiv-exposed-infant.component.tsx +++ b/packages/esm-ohri-pmtct-app/src/views/mch-summary/tabs/hiv-exposed-infant.component.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useMemo, useState } from 'react'; +import React, { useCallback, useEffect, useMemo, useState } from 'react'; import { useTranslation } from 'react-i18next'; import { ExpandableList, @@ -25,6 +25,17 @@ const HivExposedInfant: React.FC<{ const [relativeToIdentifierMap, setRelativeToIdentifierMap] = useState([]); const { formNames, formUuids, encounterTypes, obsConcepts } = useConfig(); + const getParentRelationships = useCallback(async () => { + let relationships = []; + const relationshipsData = await fetchPatientRelationships(patientUuid); + if (relationshipsData?.length) { + relationshipsData.forEach((item) => { + relationships.push(item); + }); + } + setRelatives(relationships); + }, [patientUuid]); + useEffect(() => { getParentRelationships(); }, [getParentRelationships]); @@ -131,35 +142,28 @@ const HivExposedInfant: React.FC<{ }, ]; - async function getParentRelationships() { - let relationships = []; - const relationshipsData = await fetchPatientRelationships(patientUuid); - if (relationshipsData?.length) { - relationshipsData.forEach((item) => { - relationships.push(item); - }); - } - setRelatives(relationships); - } + const getChildPTracker = useCallback( + async (patientUuid) => { + let pTrackerMap = { patientId: '', pTrackerId: '--' }; + const identifiers = await fetchPatientIdentifiers(patientUuid); + if (identifiers) { + pTrackerMap.pTrackerId = identifiers.find( + (id) => id.identifierType.uuid === encounterTypes.PTrackerIdentifierType, + ).identifier; + pTrackerMap.patientId = patientUuid; + } + return pTrackerMap; + }, + [encounterTypes.PTrackerIdentifierType], + ); useEffect(() => { const relativeToPtrackerPromises = relatives.map((relative) => getChildPTracker(relative.personA.uuid)); Promise.all(relativeToPtrackerPromises).then((values) => { setRelativeToIdentifierMap(values.map((value) => ({ patientId: value.patientId, pTrackerId: value.pTrackerId }))); }); - }, [relatives]); + }, [getChildPTracker, relatives]); - async function getChildPTracker(patientUuid: string) { - let pTrackerMap = { patientId: '', pTrackerId: '--' }; - const identifiers = await fetchPatientIdentifiers(patientUuid); - if (identifiers) { - pTrackerMap.pTrackerId = identifiers.find( - (id) => id.identifierType.uuid === encounterTypes.PTrackerIdentifierType, - ).identifier; - pTrackerMap.patientId = patientUuid; - } - return pTrackerMap; - } const parentRelationships: familyItemProps[] = useMemo(() => { let items = []; relatives.forEach((relative) => { diff --git a/yarn.lock b/yarn.lock index 98f8a726e..e5eb1eb7f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6841,9 +6841,9 @@ __metadata: linkType: hard "caniuse-lite@npm:^1.0.0, caniuse-lite@npm:^1.0.30001400, caniuse-lite@npm:^1.0.30001426": - version: 1.0.30001517 - resolution: "caniuse-lite@npm:1.0.30001517" - checksum: 3b9aa01e5e1c112bbe15d653cf4f909748b3ede87613b4381306c3510dab1adb0b09594febdacdf0eb963d8f0d37dcb3b88cea12c579ed14a9ede4581544c7c4 + version: 1.0.30001632 + resolution: "caniuse-lite@npm:1.0.30001632" + checksum: 80b8b75007e525c30ec204adff4a16797a83ac9faeec33ed20ad14b55239c2721693f248389ee3bc9a76f8fd0182870872af7a9c80d48484a3eab7c5e8af173f languageName: node linkType: hard