From 1773a15a5c5aa85b522f41727a1bacb7eb60b739 Mon Sep 17 00:00:00 2001 From: Gampa Sri Harsh <114745442+sriharsh05@users.noreply.github.com> Date: Wed, 7 Feb 2024 01:08:13 +0530 Subject: [PATCH] Replaced useDispatch with useQuery/request in Treatment Summary and Transfer Patient. (#7084) * replace useDispatch with useQuery/request in TreatmentSummary page * replace useDispatch with useQuery/request in TransferPatientDialog * remove unused fire request --------- Co-authored-by: Rithvik Nishad --- .../Facility/TransferPatientDialog.tsx | 27 +- src/Components/Facility/TreatmentSummary.tsx | 622 ++++++++---------- src/Components/Facility/models.tsx | 7 + src/Redux/actions.tsx | 4 +- src/Redux/api.tsx | 4 + 5 files changed, 302 insertions(+), 362 deletions(-) diff --git a/src/Components/Facility/TransferPatientDialog.tsx b/src/Components/Facility/TransferPatientDialog.tsx index 259d497f684..4c38965c235 100644 --- a/src/Components/Facility/TransferPatientDialog.tsx +++ b/src/Components/Facility/TransferPatientDialog.tsx @@ -9,10 +9,10 @@ import { FieldLabel } from "../Form/FormFields/FormField"; import { OptionsType } from "../../Common/constants"; import { SelectFormField } from "../Form/FormFields/SelectFormField"; import { navigate } from "raviger"; -import { transferPatient } from "../../Redux/actions"; -import { useDispatch } from "react-redux"; import { dateQueryString } from "../../Utils/utils.js"; import dayjs from "dayjs"; +import request from "../../Utils/request/request.js"; +import routes from "../../Redux/api.js"; interface Props { patientList: Array; @@ -60,7 +60,6 @@ const patientFormReducer = (state = initialState, action: any) => { const TransferPatientDialog = (props: Props) => { const { patientList, handleOk, handleCancel, facilityId } = props; - const dispatchAction: any = useDispatch(); const [isLoading, setIsLoading] = useState(false); const [state, dispatch] = useReducer(patientFormReducer, initialState); const patientOptions: Array = patientList.map((patient) => { @@ -114,15 +113,17 @@ const TransferPatientDialog = (props: Props) => { const validForm = validateForm(); if (validForm) { setIsLoading(true); - const data = { - date_of_birth: dateQueryString(state.form.date_of_birth), - facility: facilityId, - }; - const res = await dispatchAction( - transferPatient(data, { id: state.form.patient }) - ); + const { res, data } = await request(routes.transferPatient, { + body: { + facility: facilityId, + date_of_birth: dateQueryString(state.form.date_of_birth), + }, + pathParams: { + id: state.form.patient, + }, + }); setIsLoading(false); - if (res && res.data && res.status === 200) { + if (res?.ok && data) { dispatch({ type: "set_form", form: initForm }); handleOk(); @@ -132,10 +133,10 @@ const TransferPatientDialog = (props: Props) => { msg: `Patient ${patientName} transferred successfully`, }); const newFacilityId = - res.data && res.data.facility_object && res.data.facility_object.id; + data && data.facility_object && data.facility_object.id; if (newFacilityId) { navigate( - `/facility/${newFacilityId}/patient/${res.data.patient}/consultation` + `/facility/${newFacilityId}/patient/${data.patient}/consultation` ); } else { navigate("/facility"); diff --git a/src/Components/Facility/TreatmentSummary.tsx b/src/Components/Facility/TreatmentSummary.tsx index f41f540a12d..b6caebc750e 100644 --- a/src/Components/Facility/TreatmentSummary.tsx +++ b/src/Components/Facility/TreatmentSummary.tsx @@ -1,402 +1,332 @@ -import { lazy, useCallback, useState } from "react"; -import { useDispatch } from "react-redux"; -import { - getPatient, - getInvestigation, - getConsultation, -} from "../../Redux/actions"; -import { ConsultationModel } from "./models"; -import { statusType, useAbortableEffect } from "../../Common/utils"; -import { PatientModel } from "../Patient/models"; - import { GENDER_TYPES } from "../../Common/constants"; import { formatAge, formatDate, formatDateTime } from "../../Utils/utils"; import useSlug from "../../Common/hooks/useSlug"; import useAppHistory from "../../Common/hooks/useAppHistory"; - -const Loading = lazy(() => import("../Common/Loading")); +import routes from "../../Redux/api"; +import useQuery from "../../Utils/request/useQuery"; const TreatmentSummary = (props: any) => { const { consultationId, patientId } = props; const date = new Date(); - const dispatch: any = useDispatch(); - const [patientData, setPatientData] = useState({}); - const [consultationData, setConsultationData] = useState( - {} - ); - const [isLoading, setIsLoading] = useState(false); - const [investigations, setInvestigations] = useState>([]); - const [dailyRounds, setDailyRounds] = useState({}); const facilityId = useSlug("facility"); const { goBack } = useAppHistory(); const url = `/facility/${facilityId}/patient/${patientId}/consultation/${consultationId}`; - const fetchPatientData = useCallback( - async (status: statusType) => { - setIsLoading(true); - const res = await dispatch(getPatient({ id: patientId })); - if (!status.aborted) { - if (res?.data) { - setPatientData(res.data); - } else { - setPatientData({}); - } - } - setIsLoading(false); - }, - [patientId, dispatch] - ); - - const fetchInvestigationData = useCallback( - async (status: statusType) => { - setIsLoading(true); - const res = await dispatch(getInvestigation({}, consultationId)); - - if (!status.aborted) { - if (res?.data?.results) { - const valueMap = res.data.results.reduce( - (acc: any, cur: { id: any }) => ({ ...acc, [cur.id]: cur }), - {} - ); - setInvestigations(valueMap); - } else { - setInvestigations([]); - } - } - setIsLoading(false); - }, - [consultationId, dispatch] - ); - - const fetchConsultation = useCallback( - async (status: statusType) => { - setIsLoading(true); - const [res] = await Promise.all([ - dispatch(getConsultation(consultationId)), - ]); - if (!status.aborted) { - if (res?.data) { - setConsultationData(res.data); - if (res.data.last_daily_round) { - setDailyRounds(res.data.last_daily_round); - } - } else { - setConsultationData({}); - } - } - setIsLoading(false); - }, - [consultationId, dispatch] - ); + const { data: patientData } = useQuery(routes.getPatient, { + pathParams: { id: patientId }, + prefetch: patientId !== undefined, + }); - useAbortableEffect((status: statusType) => { - fetchPatientData(status); - fetchInvestigationData(status); + const { data: investigations } = useQuery(routes.getInvestigation, { + pathParams: { consultation_external_id: consultationId }, + prefetch: consultationId !== undefined, + }); - fetchConsultation(status); - }, []); + const { data: consultationData } = useQuery(routes.getConsultation, { + pathParams: { id: consultationId }, + prefetch: consultationId !== undefined, + }); return (
- {isLoading ? ( - - ) : ( -
-
- - -
+
+
+ + +
+ +
+

+ {consultationData?.facility_name ?? ""} +

-
-

- {consultationData.facility_name} -

+

INTERIM TREATMENT SUMMARY

-

INTERIM TREATMENT SUMMARY

+
{formatDate(date)}
-
{formatDate(date)}
+
+
+
+ Name : {patientData?.name ?? ""} +
+
+ Address : {patientData?.address ?? ""} +
+
-
-
+
+
- Name : {patientData.name} + Age :{" "} + {formatAge( + patientData?.age ?? 0, + patientData?.date_of_birth ?? "", + true + )}
-
- Address : {patientData.address} +
+ OP : {consultationData?.patient_no ?? ""}
-
-
-
- Age :{" "} - {formatAge( - patientData.age, - patientData.date_of_birth, - true - )} -
-
- OP : {consultationData.patient_no} -
-
- -
- Date of admission : - - {consultationData.admitted - ? formatDateTime(consultationData.encounter_date) - : " --/--/----"} - -
+
+ Date of admission : + + {consultationData?.admitted + ? formatDateTime(consultationData.encounter_date) + : " --/--/----"} +
+
-
-
- Gender : - {GENDER_TYPES.find((i) => i.id === patientData.gender)?.text} -
+
+
+ Gender : + {GENDER_TYPES.find((i) => i.id === patientData?.gender)?.text} +
-
- Contact person : - - {" "} - {patientData.emergency_phone_number - ? patientData.emergency_phone_number - : " -"} - -
+
+ Contact person : + + {" "} + {patientData?.emergency_phone_number + ? patientData.emergency_phone_number + : " -"} +
+
-
- Comorbidities : -
- - +
+ Comorbidities : +
+
+ + + + + + + + {patientData?.medical_history && + patientData.medical_history.length > 0 ? ( + patientData.medical_history.map( + (obj: any, index: number) => { + return ( + + + + + ); + } + ) + ) : ( - - + + - - - {patientData.medical_history && - patientData.medical_history.length > 0 ? ( - patientData.medical_history.map( - (obj: any, index: number) => { - return ( - - - - - ); - } - ) - ) : ( - - - - - )} - -
DiseaseDetails
+ {obj["disease"]} + + {obj["details"] ? obj["details"] : "---"} +
DiseaseDetails + --- + + --- +
- {obj["disease"]} - - {obj["details"] ? obj["details"] : "---"} -
- --- - - --- -
-
+ )} + +
+
-
- Diagnosis : -
-
- History of present illness : - {consultationData.history_of_present_illness - ? consultationData.history_of_present_illness - : " ---"} -
+
+ Diagnosis : +
+
+ History of present illness : + {consultationData?.history_of_present_illness + ? consultationData.history_of_present_illness + : " ---"} +
-
- Examination details and clinical conditions : - {consultationData.examination_details - ? consultationData.examination_details - : " ---"} -
+
+ Examination details and clinical conditions : + {consultationData?.examination_details + ? consultationData.examination_details + : " ---"} +
-
- Physical Examination info : - {dailyRounds.physical_examination_info - ? dailyRounds.physical_examination_info - : " ---"} -
+
+ Physical Examination info : + {consultationData?.last_daily_round?.physical_examination_info + ? consultationData.last_daily_round + ?.physical_examination_info + : " ---"}
+
-
- General Instructions : - {patientData?.last_consultation?.consultation_notes ? ( -
- {patientData.last_consultation.consultation_notes} -
- ) : ( - " ---" - )} -
+
+ General Instructions : + {patientData?.last_consultation?.consultation_notes ? ( +
+ {patientData.last_consultation.consultation_notes} +
+ ) : ( + " ---" + )} +
+ +
+ Relevant investigations : -
- Relevant investigations : +
+ + + + + + + + + + + -
-
+ Date + + Name + + Result + + Ideal value + + values range + + unit +
- + + {investigations && investigations.results.length > 0 ? ( + investigations.results.map( + (value: any, index: number) => { + return ( + + + + + + + + + ); + } + ) + ) : ( - - - - - - + + + + + + - - - - {Object.values(investigations).length > 0 ? ( - Object.values(investigations).map( - (value: any, index: number) => { - return ( - - - - - - - - - ); - } - ) - ) : ( - - - - - - - - - )} - -
+ {formatDate( + value["session_object"][ + "session_created_date" + ] + )} + + {value["investigation_object"]["name"]} + + {value["notes"] || value["value"]} + + {value["investigation_object"]["ideal_value"] || + "-"} + + {value["investigation_object"]["min_value"]} -{" "} + {value["investigation_object"]["max_value"]} + + {value["investigation_object"]["unit"] || "-"} +
- Date - - Name - - Result - - Ideal value - - values range - - unit - + --- + + --- + + --- + + --- + + --- + + --- +
- {formatDate( - value["session_object"][ - "session_created_date" - ] - )} - - {value["investigation_object"]["name"]} - - {value["notes"] || value["value"]} - - {value["investigation_object"][ - "ideal_value" - ] || "-"} - - {value["investigation_object"]["min_value"]} -{" "} - {value["investigation_object"]["max_value"]} - - {value["investigation_object"]["unit"] || "-"} -
- --- - - --- - - --- - - --- - - --- - - --- -
-
+ )} + +
+
-
- Treatment : - {consultationData.treatment_plan ? ( -

{consultationData.treatment_plan}

- ) : ( -

---

- )} - Treatment summary/Treament Plan : +
+ Treatment : + {consultationData?.treatment_plan ? ( +

{consultationData.treatment_plan}

+ ) : ( +

---

+ )} + Treatment summary/Treament Plan : -
- - +
+
+ + + + + + + + + + {consultationData?.last_daily_round ? ( - - - + + + - - - - {dailyRounds ? ( - - - - - - ) : ( - - - - - - )} - -
DateSpo2Temperature
DateSpo2Temperature + {formatDateTime( + consultationData.last_daily_round.modified_date + )} + + {consultationData.last_daily_round.ventilator_spo2 || + "-"} + + {consultationData.last_daily_round.temperature || "-"} +
- {formatDateTime(dailyRounds.modified_date)} - - {dailyRounds.ventilator_spo2 || "-"} - - {dailyRounds.temperature || "-"} -
- --- - - --- - - --- -
-
+ ) : ( + + + --- + + + --- + + + --- + + + )} + +
- )} +
); }; diff --git a/src/Components/Facility/models.tsx b/src/Components/Facility/models.tsx index 999c54a2e3a..de035f9ffea 100644 --- a/src/Components/Facility/models.tsx +++ b/src/Components/Facility/models.tsx @@ -572,3 +572,10 @@ export type InventoryLogResponse = InventorySummaryResponse & { unit: number; created_by: number; }; + +export type PatientTransferResponse = { + id: string; + patient: string; + date_of_birth: string; + facility_object: BaseFacilityModel; +}; diff --git a/src/Redux/actions.tsx b/src/Redux/actions.tsx index 8e3ae382547..280abbce5cc 100644 --- a/src/Redux/actions.tsx +++ b/src/Redux/actions.tsx @@ -102,9 +102,7 @@ export const updatePatient = (params: object, pathParam: object) => { export const patchPatient = (params: object, pathParam: object) => { return fireRequest("patchPatient", [], params, pathParam); }; -export const transferPatient = (params: object, pathParam: object) => { - return fireRequest("transferPatient", [], params, pathParam); -}; + export const getStates = () => { return fireRequest("statesList", []); }; diff --git a/src/Redux/api.tsx b/src/Redux/api.tsx index 6425ff8eab0..eed17ad3b4b 100644 --- a/src/Redux/api.tsx +++ b/src/Redux/api.tsx @@ -55,6 +55,7 @@ import { InventorySummaryResponse, InventoryLogResponse, InventoryItemsModel, + PatientTransferResponse, } from "../Components/Facility/models"; import { IDeleteBedCapacity, @@ -86,6 +87,7 @@ import { InvestigationGroup, InvestigationType, } from "../Components/Facility/Investigations"; +import { Investigation } from "../Components/Facility/Investigations/Reports/types"; import { ICD11DiagnosisModel } from "../Components/Diagnosis/types"; /** @@ -657,6 +659,7 @@ const routes = { transferPatient: { path: "/api/v1/patient/{id}/transfer/", method: "POST", + TRes: Type(), }, getPatientNotes: { path: "/api/v1/patient/{patientId}/notes/", @@ -998,6 +1001,7 @@ const routes = { getInvestigation: { path: "/api/v1/consultation/{consultation_external_id}/investigation/", method: "GET", + TRes: Type>(), }, getPatientInvestigation: { path: "/api/v1/patient/{patient_external_id}/investigation/",