From d115c07015ca7f3c1a3b4cb1907e4866858b4704 Mon Sep 17 00:00:00 2001 From: rithviknishad Date: Thu, 14 Mar 2024 19:10:17 +0530 Subject: [PATCH] use updated patient age formatting --- cypress/pageobject/Patient/PatientCreation.ts | 4 +- .../ConsultationUpdatesTab.tsx | 13 ++-- .../Facility/DischargedPatientsList.tsx | 4 +- src/Components/Patient/ManagePatients.tsx | 4 +- src/Components/Patient/PatientRegister.tsx | 1 + src/Components/Patient/SampleDetails.tsx | 4 +- src/Components/Shifting/ListView.tsx | 8 +-- src/Components/Shifting/ShiftDetails.tsx | 17 ++--- src/Components/Shifting/ShiftingBoard.tsx | 12 ++-- src/Utils/utils.ts | 62 +++++++++++++++++-- 10 files changed, 85 insertions(+), 44 deletions(-) diff --git a/cypress/pageobject/Patient/PatientCreation.ts b/cypress/pageobject/Patient/PatientCreation.ts index 54890e165d2..b31be1d2d31 100644 --- a/cypress/pageobject/Patient/PatientCreation.ts +++ b/cypress/pageobject/Patient/PatientCreation.ts @@ -56,8 +56,8 @@ export class PatientPage { cy.get("#date-input").click().type(dateOfBirth); } typePatientAge(age: string) { - cy.get("#select-menu").click(); - cy.get("#select-menu").contains("Age").click(); + cy.get("#age-input-type-selector").click(); + cy.get("#age-input-type-selector").contains("Age").click(); cy.get("button").contains("Confirm").click(); cy.get("#age-div").click().type(age); } diff --git a/src/Components/Facility/ConsultationDetails/ConsultationUpdatesTab.tsx b/src/Components/Facility/ConsultationDetails/ConsultationUpdatesTab.tsx index fdbf4846329..8fb6ce895db 100644 --- a/src/Components/Facility/ConsultationDetails/ConsultationUpdatesTab.tsx +++ b/src/Components/Facility/ConsultationDetails/ConsultationUpdatesTab.tsx @@ -10,7 +10,11 @@ import useVitalsAspectRatioConfig from "../../VitalsMonitor/useVitalsAspectRatio import { DISCHARGE_REASONS, SYMPTOM_CHOICES } from "../../../Common/constants"; import PrescriptionsTable from "../../Medicine/PrescriptionsTable"; import Chip from "../../../CAREUI/display/Chip"; -import { formatAge, formatDate, formatDateTime } from "../../../Utils/utils"; +import { + formatDate, + formatDateTime, + formatPatientAge, +} from "../../../Utils/utils"; import ReadMore from "../../Common/components/Readmore"; import DailyRoundsList from "../Consultations/DailyRoundsList"; import EventsList from "./Events/EventsList"; @@ -629,12 +633,7 @@ export const ConsultationUpdatesTab = (props: ConsultationTabProps) => {
Age {" - "} - {props.patientData.age !== undefined // 0 is a valid age, so we need to check for undefined - ? formatAge( - props.patientData.age, - props.patientData.date_of_birth - ) - : "-"} + {formatPatientAge(props.patientData)}
diff --git a/src/Components/Facility/DischargedPatientsList.tsx b/src/Components/Facility/DischargedPatientsList.tsx index 7ce4e9dc21d..e8d967d6d3d 100644 --- a/src/Components/Facility/DischargedPatientsList.tsx +++ b/src/Components/Facility/DischargedPatientsList.tsx @@ -7,10 +7,10 @@ import { PatientModel } from "../Patient/models"; import useQuery from "../../Utils/request/useQuery"; import { debounce } from "lodash-es"; import SearchInput from "../Form/SearchInput"; -import { formatAge } from "../../Utils/utils"; import { GENDER_TYPES } from "../../Common/constants"; import CareIcon from "../../CAREUI/icons/CareIcon"; import RecordMeta from "../../CAREUI/display/RecordMeta"; +import { formatPatientAge } from "../../Utils/utils"; const DischargedPatientsList = ({ facility_external_id, @@ -88,7 +88,7 @@ const PatientListItem = ({ patient }: { patient: PatientModel }) => {

{patient.name}

{GENDER_TYPES.find((g) => g.id === patient.gender)?.text} -{" "} - {formatAge(patient.age, patient.date_of_birth)} + {formatPatientAge(patient)}
{ > {patient.name} - {formatAge(patient.age, patient.date_of_birth, true)} + {formatPatientAge(patient, true)}
diff --git a/src/Components/Patient/PatientRegister.tsx b/src/Components/Patient/PatientRegister.tsx index ba9032b5ff1..71eeb104637 100644 --- a/src/Components/Patient/PatientRegister.tsx +++ b/src/Components/Patient/PatientRegister.tsx @@ -1304,6 +1304,7 @@ export const PatientRegister = (props: PatientRegisterProps) => {
{ ) : (
Age: - {formatAge(patientData?.age, patientData?.date_of_birth)} + {formatPatientAge(patientData)}
)}
diff --git a/src/Components/Shifting/ListView.tsx b/src/Components/Shifting/ListView.tsx index 228732f9ced..ff579e339da 100644 --- a/src/Components/Shifting/ListView.tsx +++ b/src/Components/Shifting/ListView.tsx @@ -8,7 +8,7 @@ import { ExportButton } from "../Common/Export"; import ListFilter from "./ListFilter"; import Page from "../Common/components/Page"; import SearchInput from "../Form/SearchInput"; -import { formatAge, formatDateTime } from "../../Utils/utils"; +import { formatDateTime, formatPatientAge } from "../../Utils/utils"; import { formatFilter } from "./Commons"; import { navigate } from "raviger"; @@ -90,11 +90,7 @@ export default function ListView() {
{shift.patient_object.name} -{" "} - {formatAge( - shift.patient_object.age, - shift.patient_object.date_of_birth, - true - )} + {formatPatientAge(shift.patient_object, true)}
{shift.emergency && ( diff --git a/src/Components/Shifting/ShiftDetails.tsx b/src/Components/Shifting/ShiftDetails.tsx index acc3565487a..d0e60a27d2c 100644 --- a/src/Components/Shifting/ShiftDetails.tsx +++ b/src/Components/Shifting/ShiftDetails.tsx @@ -15,7 +15,7 @@ import { CopyToClipboard } from "react-copy-to-clipboard"; import Page from "../Common/components/Page"; import QRCode from "qrcode.react"; import RecordMeta from "../../CAREUI/display/RecordMeta"; -import { formatAge, formatDateTime } from "../../Utils/utils"; +import { formatDateTime, formatPatientAge } from "../../Utils/utils"; import useConfig from "../../Common/hooks/useConfig"; import { useTranslation } from "react-i18next"; @@ -24,6 +24,7 @@ import routes from "../../Redux/api.js"; import request from "../../Utils/request/request.js"; import { ConsultationModel } from "../Facility/models.js"; import CareIcon from "../../CAREUI/icons/CareIcon.js"; +import { PatientModel } from "../Patient/models.js"; const Loading = lazy(() => import("../Common/Loading")); @@ -94,13 +95,7 @@ export default function ShiftDetails(props: { id: string }) { "\n" + t("age") + ":" + - +( - formatAge( - data?.patient_object?.age, - data?.patient_object?.date_of_birth, - true - ) ?? "-" - ) + + +formatPatientAge(data.patient_object, true) + "\n" + t("origin_facility") + ":" + @@ -128,7 +123,7 @@ export default function ShiftDetails(props: { id: string }) { setIsCopied(false); }, 5000); - const showPatientCard = (patientData: any) => { + const showPatientCard = (patientData: PatientModel) => { const patientGender = GENDER_TYPES.find( (i) => i.id === patientData?.gender )?.text; @@ -185,7 +180,7 @@ export default function ShiftDetails(props: { id: string }) { {t("age")}:{" "} - {formatAge(patientData?.age, patientData?.date_of_birth, true)} + {formatPatientAge(patientData, true)}
)} {patientData?.gender === 2 && patientData?.is_antenatal && ( @@ -370,7 +365,7 @@ export default function ShiftDetails(props: { id: string }) { {t("age")}:{" "} - {formatAge(patientData.age, patientData.date_of_birth, true)} + {formatPatientAge(patientData, true)}
diff --git a/src/Components/Shifting/ShiftingBoard.tsx b/src/Components/Shifting/ShiftingBoard.tsx index ae94514e6e9..e07fb5d96e1 100644 --- a/src/Components/Shifting/ShiftingBoard.tsx +++ b/src/Components/Shifting/ShiftingBoard.tsx @@ -6,7 +6,11 @@ import { useRef, useState, } from "react"; -import { classNames, formatAge, formatDateTime } from "../../Utils/utils"; +import { + classNames, + formatDateTime, + formatPatientAge, +} from "../../Utils/utils"; import { downloadShiftRequests } from "../../Redux/actions"; import { useDrag, useDrop } from "react-dnd"; @@ -88,11 +92,7 @@ const ShiftCard = ({ shift, filter }: any) => {
{shift.patient_object.name} -{" "} - {formatAge( - shift.patient_object?.age, - shift.patient_object?.age.date_of_birth, - true - )} + {formatPatientAge(shift.patient_object, true)}
{shift.emergency && ( diff --git a/src/Utils/utils.ts b/src/Utils/utils.ts index 4e1d1626a59..3f629eca9d9 100644 --- a/src/Utils/utils.ts +++ b/src/Utils/utils.ts @@ -6,6 +6,7 @@ import { import phoneCodesJson from "../Common/static/countryPhoneAndFlags.json"; import dayjs from "./dayjs"; import { UserModel } from "../Components/Users/models"; +import { PatientModel } from "../Components/Patient/models"; interface ApacheParams { age: number; @@ -396,6 +397,14 @@ export const getCountryCode = (phoneNumber: string) => { return undefined; }; +const getRelativeDateSuffix = (abbreviated: boolean) => { + return { + day: abbreviated ? "d" : "days", + month: abbreviated ? "mo" : "months", + year: abbreviated ? "yr" : "years", + }; +}; + export const formatAge = ( age?: number, date_of_birth?: string, @@ -404,9 +413,7 @@ export const formatAge = ( if (!age && !date_of_birth) return undefined; if (!age) age = 0; - const daySuffix = abbreviated ? "d" : "days"; - const monthSuffix = abbreviated ? "mo" : "months"; - const yearSuffix = abbreviated ? "yr" : "years"; + const suffixes = getRelativeDateSuffix(abbreviated); if (age < 1 && date_of_birth) { const dob = new Date(date_of_birth); @@ -416,11 +423,54 @@ export const formatAge = ( const months = Math.floor(diffDays / 30); const days = diffDays % 30; if (months === 0) { - return `${days} ${daySuffix}`; + return `${days} ${suffixes.day}`; } - return `${months} ${monthSuffix} ${days} ${daySuffix}`; + return `${months} ${suffixes.month} ${days} ${suffixes.day}`; } - return `${age} ${yearSuffix}`; + return `${age} ${suffixes.year}`; +}; + +export const formatPatientAge = ( + data: Pick< + PatientModel, + "date_of_birth" | "year_of_birth" | "age" | "age_days" + >, + abbreviated = false +) => { + const suffixes = getRelativeDateSuffix(abbreviated); + + if (data.age) { + return `${data.age}${suffixes.year}`; + } + + const formatAgeFromDays = (ageDays: number) => { + const months = Math.floor(ageDays / 30); + const days = ageDays % 30; + + if (months) { + return `${months}${suffixes.month} ${days}${suffixes.day}`; + } + return `${days}${suffixes.day}`; + }; + + // Voluntarily checking if `date_of_birth` non null as age_days could have + // value if date_of_birth is null but has `year_of_birth`. + if (data.age_days != null && data.date_of_birth) { + return formatAgeFromDays(data.age_days); + } + + if (data.date_of_birth) { + return formatAgeFromDays( + dayjs(new Date()).diff(dayjs(data.date_of_birth), "days") + ); + } + + const years = new Date().getFullYear() - data.year_of_birth!; + if (years) { + return `${years}${suffixes.year}`; + } + + return `${data.year_of_birth} (birth year)`; }; export const scrollTo = (id: string | boolean) => {