diff --git a/src/Common/hooks/useRangePagination.ts b/src/Common/hooks/useRangePagination.ts index e6bbe9f573e..7652ae546c1 100644 --- a/src/Common/hooks/useRangePagination.ts +++ b/src/Common/hooks/useRangePagination.ts @@ -9,18 +9,17 @@ interface Props { bounds: DateRange; perPage: number; slots?: number; - snapToLatest?: boolean; - reverse?: boolean; + defaultEnd?: boolean; } const useRangePagination = ({ bounds, perPage, ...props }: Props) => { const [currentRange, setCurrentRange] = useState( - getInitialBounds(bounds, perPage, props.snapToLatest) + getInitialBounds(bounds, perPage, props.defaultEnd) ); useEffect(() => { - setCurrentRange(getInitialBounds(bounds, perPage, props.snapToLatest)); - }, [bounds, perPage, props.snapToLatest]); + setCurrentRange(getInitialBounds(bounds, perPage, props.defaultEnd)); + }, [bounds, perPage, props.defaultEnd]); const next = () => { const { end } = currentRange; @@ -63,24 +62,17 @@ const useRangePagination = ({ bounds, perPage, ...props }: Props) => { } const slots: DateRange[] = []; - const { start, end } = currentRange; + const { start } = currentRange; const delta = perPage / props.slots; for (let i = 0; i < props.slots; i++) { - if (props.snapToLatest) { - slots.push({ - start: new Date(end.valueOf() - delta * (i - 1)), - end: new Date(end.valueOf() - delta * i), - }); - } else { - slots.push({ - start: new Date(start.valueOf() + delta * i), - end: new Date(start.valueOf() + delta * (i + 1)), - }); - } + slots.push({ + start: new Date(start.valueOf() + delta * i), + end: new Date(start.valueOf() + delta * (i + 1)), + }); } - return props.reverse ? slots.reverse() : slots; + return slots; }, [currentRange, props.slots, perPage]); return { @@ -98,7 +90,7 @@ export default useRangePagination; const getInitialBounds = ( bounds: DateRange, perPage: number, - snapToLatest?: boolean + defaultEnd?: boolean ) => { const deltaBounds = bounds.end.valueOf() - bounds.start.valueOf(); @@ -106,7 +98,7 @@ const getInitialBounds = ( return bounds; } - if (snapToLatest) { + if (defaultEnd) { return { start: new Date(bounds.end.valueOf() - perPage), end: bounds.end, diff --git a/src/Components/Medicine/PrescriptionAdministrationsTable.tsx b/src/Components/Medicine/PrescriptionAdministrationsTable.tsx index 470caa1042b..81282126d7c 100644 --- a/src/Components/Medicine/PrescriptionAdministrationsTable.tsx +++ b/src/Components/Medicine/PrescriptionAdministrationsTable.tsx @@ -47,10 +47,6 @@ export default function PrescriptionAdministrationsTable({ const { t } = useTranslation(); const [state, setState] = useState(); - - const [showDiscontinued, setShowDiscontinued] = useState(false); - const [discontinuedCount, setDiscontinuedCount] = useState(); - const pagination = useRangePagination({ bounds: state?.administrationsTimeBounds ?? { start: new Date(), @@ -58,8 +54,7 @@ export default function PrescriptionAdministrationsTable({ }, perPage: 24 * 60 * 60 * 1000, slots: 24, - snapToLatest: true, - reverse: true, + defaultEnd: true, }); const [showBulkAdminister, setShowBulkAdminister] = useState(false); @@ -69,13 +64,8 @@ export default function PrescriptionAdministrationsTable({ ); const refetch = useCallback(async () => { - const filters = { - is_prn: prn, - prescription_type: "REGULAR", - }; - const res = await dispatch( - list(showDiscontinued ? filters : { ...filters, discontinued: false }) + list({ is_prn: prn, prescription_type: "REGULAR" }) ); setState({ @@ -84,14 +74,7 @@ export default function PrescriptionAdministrationsTable({ ), administrationsTimeBounds: getAdministrationBounds(res.data.results), }); - - if (showDiscontinued === false) { - const discontinuedRes = await dispatch( - list({ ...filters, discontinued: true, limit: 0 }) - ); - setDiscontinuedCount(discontinuedRes.data.count); - } - }, [consultation_id, showDiscontinued, dispatch]); + }, [consultation_id, dispatch]); useEffect(() => { refetch(); @@ -158,22 +141,17 @@ export default function PrescriptionAdministrationsTable({ } /> -
- +
+
- + + )) - : pagination.slots - ?.map(({ start, end }, index) => ( - - )) - .reverse()} + : pagination.slots?.map(({ start, end }, index) => ( + + ))}
-
- {t("medicine")} - -

Dosage &

-

- {!state?.prescriptions[0]?.is_prn - ? "Frequency" - : "Indicator"} -

-
-
+
{t("medicine")} +

Dosage &

+

+ {!state?.prescriptions[0]?.is_prn ? "Frequency" : "Indicator"} +

@@ -184,10 +162,8 @@ export default function PrescriptionAdministrationsTable({ border className="mx-2 px-1" variant="secondary" - disabled={!pagination.hasNext} - onClick={pagination.next} - tooltip="Next 24 hours" - tooltipClassName="tooltip-bottom -translate-x-1/2 text-xs" + disabled={!pagination.hasPrevious} + onClick={pagination.previous} > @@ -201,26 +177,24 @@ export default function PrescriptionAdministrationsTable({

-

{formatDateTime(end, "DD/MM")}

-

{formatDateTime(end, "HH:mm")}

- - - Administration(s) between -
- {formatTime(start)} and{" "} - {formatTime(end)} -
- on {formatDate(start)} -
-
+

{formatDateTime(start, "DD/MM")}

+

{formatDateTime(start, "HH:mm")}

+ + + Administration(s) between +
+ {formatTime(start)} and{" "} + {formatTime(end)} +
+ on {formatDate(start)} +
+
@@ -255,23 +227,6 @@ export default function PrescriptionAdministrationsTable({
- {showDiscontinued === false && !!discontinuedCount && ( - setShowDiscontinued(true)} - > - - - - Show {discontinuedCount} other discontinued - prescription(s) - - - - )} - {state?.prescriptions.length === 0 && (
@@ -328,7 +283,12 @@ const PrescriptionRow = ({ prescription, ...props }: PrescriptionRowProps) => { }, [prescription.id, dispatch, props.intervals]); return ( - <> + {showDiscontinue && ( {
)} - setShowDetails(true)} > - setShowDetails(true)} - > -
-
- - {prescription.medicine_object?.name ?? - prescription.medicine_old} - - - {prescription.discontinued && ( - - {t("discontinued")} - - )} - - {prescription.route && ( - - {t(prescription.route)} - - )} -
+
+ + {prescription.medicine_object?.name ?? prescription.medicine_old} + -
-

{prescription.dosage}

-

- {!prescription.is_prn - ? t("PRESCRIPTION_FREQUENCY_" + prescription.frequency) - : prescription.indicator} -

-
-
- + {prescription.discontinued && ( + + {t("discontinued")} + + )} - - {/* Administration Cells */} - {props.intervals - .map(({ start, end }, index) => ( - - {administrations === undefined ? ( - - ) : ( - - )} - - )) - .reverse()} - - - {/* Action Buttons */} - - setShowAdminister(true)} - > - {t("administer")} - + {prescription.route && ( + + {t(prescription.route)} + + )} +
+ + + +

{prescription.dosage}

+

+ {!prescription.is_prn + ? t("PRESCRIPTION_FREQUENCY_" + prescription.frequency) + : prescription.indicator} +

+ + + + {/* Administration Cells */} + {props.intervals.map(({ start, end }, index) => ( + + {administrations === undefined ? ( + + ) : ( + + )} - - + ))} + + + {/* Action Buttons */} + + setShowAdminister(true)} + > + {t("administer")} + + + ); }; diff --git a/src/Redux/actions.tsx b/src/Redux/actions.tsx index 1a5bd7e4fb1..6e0d91fc59d 100644 --- a/src/Redux/actions.tsx +++ b/src/Redux/actions.tsx @@ -1003,7 +1003,7 @@ export const PrescriptionActions = (consultation_external_id: string) => { const pathParams = { consultation_external_id }; return { - list: (query?: Record) => { + list: (query?: Partial) => { let altKey; if (query?.is_prn !== undefined) { altKey = query?.is_prn