- {isLoading ? (
+ {loading ? (
) : (
- comments.map((comment: any) => (
-
-
-
-
- {comment.modified_date
- ? formatDateTime(comment.modified_date)
- : "-"}
-
-
-
-
- {comment.created_by_object?.first_name?.charAt(0) ||
- t("unknown")}
+
+ {() => (
+
+
+ No comments available
+
+
+
+
+
>
+ {(item) => }
+
+
-
- {comment.created_by_object?.first_name || t("unknown")}{" "}
- {comment.created_by_object?.last_name}
-
- ))
+ )}
+
)}
@@ -110,3 +89,36 @@ const CommentSection = (props: CommentSectionProps) => {
};
export default CommentSection;
+
+export const Comment = ({
+ id,
+ comment,
+ created_by_object,
+ modified_date,
+}: IComment) => {
+ const { t } = useTranslation();
+ return (
+
+
+
+
+ {modified_date ? formatDateTime(modified_date) : "-"}
+
+
+
+
+ {created_by_object?.first_name?.charAt(0) || t("unknown")}
+
+
+ {created_by_object?.first_name || t("unknown")}{" "}
+ {created_by_object?.last_name}
+
+
+
+ );
+};
diff --git a/src/Components/Shifting/ListFilter.tsx b/src/Components/Shifting/ListFilter.tsx
index 5f2233c2263..903baf5c27d 100644
--- a/src/Components/Shifting/ListFilter.tsx
+++ b/src/Components/Shifting/ListFilter.tsx
@@ -4,12 +4,10 @@ import {
SHIFTING_FILTER_ORDER,
} from "../../Common/constants";
import { DateRange } from "../Common/DateRangeInputV2";
-import { useEffect, useState } from "react";
import {
SHIFTING_CHOICES_PEACETIME,
SHIFTING_CHOICES_WARTIME,
} from "../../Common/constants";
-import { getAnyFacility, getUserList } from "../../Redux/actions";
import CircularProgress from "../Common/components/CircularProgress";
import { FacilitySelect } from "../Common/FacilitySelect";
import { FieldChangeEvent } from "../Form/FormFields/Utils";
@@ -20,12 +18,13 @@ import { SelectFormField } from "../Form/FormFields/SelectFormField";
import PhoneNumberFormField from "../Form/FormFields/PhoneNumberFormField";
import { navigate } from "raviger";
import useConfig from "../../Common/hooks/useConfig";
-import { useDispatch } from "react-redux";
import useMergeState from "../../Common/hooks/useMergeState";
import { useTranslation } from "react-i18next";
import UserAutocompleteFormField from "../Common/UserAutocompleteFormField";
import { dateQueryString, parsePhoneNumber } from "../../Utils/utils";
import dayjs from "dayjs";
+import useQuery from "../../Utils/request/useQuery";
+import routes from "../../Redux/api";
const clearFilterState = {
origin_facility: "",
@@ -57,9 +56,6 @@ const getDate = (value: any) =>
export default function ListFilter(props: any) {
const { kasp_enabled, kasp_string, wartime_shifting } = useConfig();
const { filter, onChange, closeFilter } = props;
- const [isOriginLoading, setOriginLoading] = useState(false);
- const [isShiftingLoading, setShiftingLoading] = useState(false);
- const [isAssignedLoading, setAssignedLoading] = useState(false);
const { t } = useTranslation();
const shiftStatusOptions = (
@@ -89,73 +85,56 @@ export default function ListFilter(props: any) {
is_antenatal: filter.is_antenatal || "",
breathlessness_level: filter.breathlessness_level || "",
});
- const dispatch: any = useDispatch();
- useEffect(() => {
- async function fetchData() {
- if (filter.origin_facility) {
- setOriginLoading(true);
- const res = await dispatch(
- getAnyFacility(filter.origin_facility, "origin_facility")
- );
- if (res && res.data) {
- setFilterState({ origin_facility_ref: res.data });
- }
- setOriginLoading(false);
+ const { loading: isOriginLoading } = useQuery(routes.getAnyFacility, {
+ prefetch: filter.origin_facility ? true : false,
+ pathParams: { id: filter.origin_facility },
+ onResponse: ({ res, data }) => {
+ if (res && data) {
+ setFilterState({
+ origin_facility_ref: filter.origin_facility ? "" : data,
+ });
}
- }
- fetchData();
- }, [dispatch]);
+ },
+ });
- useEffect(() => {
- async function fetchData() {
- if (filter.shifting_approving_facility) {
- setShiftingLoading(true);
- const res = await dispatch(
- getAnyFacility(
- filter.shifting_approving_facility,
- "shifting_approving_facility"
- )
- );
- if (res && res.data) {
- setFilterState({ shifting_approving_facility_ref: res.data });
- }
- setShiftingLoading(false);
+ const { loading: isShiftingLoading } = useQuery(routes.getAnyFacility, {
+ prefetch: filter.shifting_approving_facility ? true : false,
+ pathParams: { id: filter.shifting_approving_facility },
+ onResponse: ({ res, data }) => {
+ if (res && data) {
+ setFilterState({
+ shifting_approving_facility_ref: filter.shifting_approving_facility
+ ? ""
+ : data,
+ });
}
- }
- fetchData();
- }, [dispatch]);
+ },
+ });
- useEffect(() => {
- async function fetchData() {
- if (filter.assigned_facility) {
- setAssignedLoading(true);
- const res = await dispatch(
- getAnyFacility(filter.assigned_facility, "assigned_facility")
- );
- if (res && res.data) {
- setFilterState({ assigned_facility_ref: res.data });
- }
- setAssignedLoading(false);
+ const { loading: isAssignedLoading } = useQuery(routes.getAnyFacility, {
+ prefetch: filter.assigned_facility ? true : false,
+ pathParams: { id: filter.assigned_facility },
+ onResponse: ({ res, data }) => {
+ if (res && data) {
+ setFilterState({
+ assigned_facility_ref: filter.assigned_facility ? "" : data,
+ });
}
- }
- fetchData();
- }, [dispatch]);
+ },
+ });
- useEffect(() => {
- async function fetchData() {
- if (filter.assigned_to) {
- const res = await dispatch(getUserList({ id: filter.assigned_to }));
- if (res && res.data && res.data.count) {
- setFilterState({
- ...filterState,
- assigned_user_ref: res.data.results[0],
- });
- }
+ useQuery(routes.userList, {
+ query: { id: filter.assigned_to },
+ prefetch: filter.assigned_to ? true : false,
+ onResponse: ({ res, data }) => {
+ if (res?.ok && data?.count) {
+ setFilterState({
+ assigned_user_ref: filter.assigned_to ? "" : data.results[0],
+ });
}
- }
- fetchData();
- }, [dispatch]);
+ },
+ });
const setFacility = (selected: any, name: string) => {
const filterData: any = { ...filterState };
diff --git a/src/Components/Shifting/ListView.tsx b/src/Components/Shifting/ListView.tsx
index f3fb14a4c0a..aa0a296f71c 100644
--- a/src/Components/Shifting/ListView.tsx
+++ b/src/Components/Shifting/ListView.tsx
@@ -1,9 +1,5 @@
-import {
- completeTransfer,
- downloadShiftRequests,
- listShiftRequests,
-} from "../../Redux/actions";
-import { lazy, useEffect, useState } from "react";
+import { downloadShiftRequests } from "../../Redux/actions";
+import { lazy, useState } from "react";
import BadgesList from "./BadgesList";
import ButtonV2 from "../Common/components/ButtonV2";
@@ -16,18 +12,19 @@ import { formatAge, formatDateTime } from "../../Utils/utils";
import { formatFilter } from "./Commons";
import { navigate } from "raviger";
import useConfig from "../../Common/hooks/useConfig";
-import { useDispatch } from "react-redux";
import useFilters from "../../Common/hooks/useFilters";
import { useTranslation } from "react-i18next";
import { AdvancedFilterButton } from "../../CAREUI/interactive/FiltersSlideover";
import CareIcon from "../../CAREUI/icons/CareIcon";
import dayjs from "../../Utils/dayjs";
import useAuthUser from "../../Common/hooks/useAuthUser";
+import request from "../../Utils/request/request";
+import routes from "../../Redux/api";
+import useQuery from "../../Utils/request/useQuery";
const Loading = lazy(() => import("../Common/Loading"));
export default function ListView() {
- const dispatch: any = useDispatch();
const { wartime_shifting } = useConfig();
const {
qParams,
@@ -37,9 +34,7 @@ export default function ListView() {
advancedFilter,
resultsPerPage,
} = useFilters({});
- const [data, setData] = useState
([]);
- const [totalCount, setTotalCount] = useState(0);
- const [isLoading, setIsLoading] = useState(false);
+
const [modalFor, setModalFor] = useState({
externalId: undefined,
loading: false,
@@ -47,62 +42,26 @@ export default function ListView() {
const authUser = useAuthUser();
const { t } = useTranslation();
- const handleTransferComplete = (shift: any) => {
+ const handleTransferComplete = async (shift: any) => {
setModalFor({ ...modalFor, loading: true });
- dispatch(completeTransfer({ externalId: modalFor })).then(() => {
- navigate(
- `/facility/${shift.assigned_facility}/patient/${shift.patient}/consultation`
- );
- });
- };
-
- const refreshList = () => {
- fetchData();
- };
-
- const fetchData = () => {
- setIsLoading(true);
- dispatch(
- listShiftRequests(
- formatFilter({
- ...qParams,
- offset: (qParams.page ? qParams.page - 1 : 0) * resultsPerPage,
- }),
- "shift-list-call"
- )
- ).then((res: any) => {
- if (res && res.data) {
- setData(res.data.results);
- setTotalCount(res.data.count);
- }
- setIsLoading(false);
+ await request(routes.completeTransfer, {
+ pathParams: { externalId: shift.external_id },
});
+ navigate(
+ `/facility/${shift.assigned_facility}/patient/${shift.patient}/consultation`
+ );
};
- useEffect(() => {
- fetchData();
- }, [
- qParams.status,
- qParams.facility,
- qParams.origin_facility,
- qParams.shifting_approving_facility,
- qParams.assigned_facility,
- qParams.emergency,
- qParams.is_up_shift,
- qParams.patient_name,
- qParams.created_date_before,
- qParams.created_date_after,
- qParams.modified_date_before,
- qParams.modified_date_after,
- qParams.patient_phone_number,
- qParams.ordering,
- qParams.is_kasp,
- qParams.assigned_to,
- qParams.disease_status,
- qParams.is_antenatal,
- qParams.breathlessness_level,
- qParams.page,
- ]);
+ const {
+ data: shiftingData,
+ loading,
+ refetch: fetchData,
+ } = useQuery(routes.listShiftRequests, {
+ query: formatFilter({
+ ...qParams,
+ offset: (qParams.page ? qParams.page - 1 : 0) * resultsPerPage,
+ }),
+ });
const showShiftingCardList = (data: any) => {
if (data && !data.length) {
@@ -327,14 +286,14 @@ export default function ListView() {
>
- {isLoading ? (
+ {loading ? (
) : (
- {showShiftingCardList(data)}
+ {showShiftingCardList(shiftingData?.results || [])}
)}
diff --git a/src/Components/Shifting/ShiftDetails.tsx b/src/Components/Shifting/ShiftDetails.tsx
index 7bffe429960..bfc73adab78 100644
--- a/src/Components/Shifting/ShiftDetails.tsx
+++ b/src/Components/Shifting/ShiftDetails.tsx
@@ -7,10 +7,7 @@ import {
TEST_TYPE_CHOICES,
} from "../../Common/constants";
import { Link, navigate } from "raviger";
-import { lazy, useCallback, useState } from "react";
-import { deleteShiftRecord, getShiftDetails } from "../../Redux/actions";
-import { statusType, useAbortableEffect } from "../../Common/utils";
-
+import { lazy, useState } from "react";
import ButtonV2 from "../Common/components/ButtonV2";
import CommentSection from "./CommentsSection";
import ConfirmDialog from "../Common/ConfirmDialog.js";
@@ -20,18 +17,18 @@ import QRCode from "qrcode.react";
import RecordMeta from "../../CAREUI/display/RecordMeta";
import { formatAge, formatDateTime } from "../../Utils/utils";
import useConfig from "../../Common/hooks/useConfig";
-import { useDispatch } from "react-redux";
+
import { useTranslation } from "react-i18next";
+import useQuery from "../../Utils/request/useQuery.js";
+import routes from "../../Redux/api.js";
+import request from "../../Utils/request/request.js";
const Loading = lazy(() => import("../Common/Loading"));
export default function ShiftDetails(props: { id: string }) {
const { header_logo, kasp_full_string, wartime_shifting, kasp_enabled } =
useConfig();
- const dispatch: any = useDispatch();
- const initialData: any = {};
- const [data, setData] = useState(initialData);
- const [isLoading, setIsLoading] = useState(true);
+
const [isPrintMode, setIsPrintMode] = useState(false);
const [isCopied, setIsCopied] = useState(false);
const [openDeleteShiftDialog, setOpenDeleteShiftDialog] = useState(false);
@@ -41,38 +38,23 @@ export default function ShiftDetails(props: { id: string }) {
? SHIFTING_CHOICES_WARTIME
: SHIFTING_CHOICES_PEACETIME;
- const fetchData = useCallback(
- async (status: statusType) => {
- setIsLoading(true);
- const res = await dispatch(getShiftDetails({ id: props.id }));
- if (!status.aborted) {
- if (res && res.data) {
- setData(res.data);
- }
- setIsLoading(false);
- }
- },
- [props.id, dispatch]
- );
-
- useAbortableEffect(
- (status: statusType) => {
- fetchData(status);
- },
- [fetchData]
- );
+ const { data, loading } = useQuery(routes.getShiftDetails, {
+ pathParams: { id: props.id },
+ });
const handleShiftDelete = async () => {
setOpenDeleteShiftDialog(true);
- const res = await dispatch(deleteShiftRecord(props.id));
+ const { res, data } = await request(routes.deleteShiftRecord, {
+ pathParams: { id: props.id },
+ });
if (res?.status == 204) {
Notification.Success({
msg: t("shifting_deleted"),
});
} else {
Notification.Error({
- msg: t("error_deleting_shifting") + (res?.data?.detail || ""),
+ msg: t("error_deleting_shifting") + (data?.detail || ""),
});
}
@@ -533,7 +515,7 @@ export default function ShiftDetails(props: { id: string }) {
);
};
- if (isLoading) {
+ if (loading) {
return
;
}
@@ -562,15 +544,17 @@ export default function ShiftDetails(props: { id: string }) {
+ navigate(`/shifting/${data?.external_id}/update`)
}
- onClick={() => navigate(`/shifting/${data.external_id}/update`)}
>
{t("update_status_details")}
@@ -581,13 +565,13 @@ export default function ShiftDetails(props: { id: string }) {
}
>
- {data.assigned_to_object && (
+ {data?.assigned_to_object && (
- {t("assigned_to")}: {data.assigned_to_object.first_name}{" "}
+ {t("assigned_to")}: {data?.assigned_to_object.first_name}{" "}
{data.assigned_to_object.last_name} -{" "}
{data.assigned_to_object.user_type}
@@ -602,51 +586,51 @@ export default function ShiftDetails(props: { id: string }) {
{t("patient_name")}:{" "}
-
- {data.patient_object?.name}
+
+ {data?.patient_object?.name}
Status:
{shiftStatusOptions.find(
- (option) => data.status === option.text
- )?.label || data.status}
+ (option) => data?.status === option.text
+ )?.label || data?.status}
{t("origin_facility")}:{" "}
- {data.origin_facility_object?.name || "--"}
+ {data?.origin_facility_object?.name || "--"}
{wartime_shifting && (
{t("shifting_approving_facility")}:{" "}
- {data.shifting_approving_facility_object?.name || "--"}
+ {data?.shifting_approving_facility_object?.name || "--"}
)}
{t("assigned_facility")}:{" "}
- {data.assigned_facility_external ||
- data.assigned_facility_object?.name ||
+ {data?.assigned_facility_external ||
+ data?.assigned_facility_object?.name ||
"--"}
{t("contact_person_at_the_facility")}:{" "}
- {data.refering_facility_contact_name || "--"}
+ {data?.refering_facility_contact_name || "--"}
{t("phone_number_at_current_facility")}:{" "}
- {data.refering_facility_contact_number ? (
+ {data?.refering_facility_contact_number ? (
{data.refering_facility_contact_number}
@@ -661,7 +645,7 @@ export default function ShiftDetails(props: { id: string }) {
{" "}
- {data.emergency ? t("yes") : t("no")}
+ {data?.emergency ? t("yes") : t("no")}
@@ -670,7 +654,7 @@ export default function ShiftDetails(props: { id: string }) {
{" "}
- {data.is_up_shift ? t("yes") : t("no")}
+ {data?.is_up_shift ? t("yes") : t("no")}
@@ -679,9 +663,9 @@ export default function ShiftDetails(props: { id: string }) {
{" "}
- {data.patient_object.last_consultation?.last_daily_round
+ {data?.patient_object.last_consultation?.last_daily_round
?.patient_category ??
- data.patient_object.last_consultation?.category}
+ data?.patient_object.last_consultation?.category}
{kasp_enabled && (
@@ -691,7 +675,7 @@ export default function ShiftDetails(props: { id: string }) {
{" "}
- {data.is_kasp ? t("yes") : t("no")}
+ {data?.is_kasp ? t("yes") : t("no")}
)}
@@ -703,26 +687,26 @@ export default function ShiftDetails(props: { id: string }) {
{" "}
- {data.is_kasp ? t("yes") : t("no")}
+ {data?.is_kasp ? t("yes") : t("no")}
{t("vehicle_preference")}:{" "}
- {data.vehicle_preference || data.preferred_vehicle_choice}
+ {data?.vehicle_preference || data?.preferred_vehicle_choice}
{t("facility_preference")}:{" "}
- {data.assigned_facility_type || "--"}
+ {data?.assigned_facility_type || "--"}
{t("severity_of_breathlessness")}:{" "}
- {data.breathlessness_level || "--"}
+ {data?.breathlessness_level || "--"}
{" "}
)}
@@ -731,14 +715,14 @@ export default function ShiftDetails(props: { id: string }) {
{t("reason")}:{" "}
-
{data.reason || "--"}
+
{data?.reason || "--"}
{t("ambulance_driver_name")}:{" "}
- {data.ambulance_driver_name || "--"}
+ {data?.ambulance_driver_name || "--"}
{t("comments")}:{" "}
- {data.comments || "--"}
+ {data?.comments || "--"}
}
- time={data.created_date}
+ time={data?.created_date}
/>
}
- time={data.modified_date}
+ time={data?.modified_date}
/>
- {data.created_date && formatDateTime(data.created_date)}
+ {data?.created_date && formatDateTime(data?.created_date)}
@@ -848,7 +832,8 @@ export default function ShiftDetails(props: { id: string }) {
{data?.last_edited_by_object?.last_name}
- {data.modified_date && formatDateTime(data.modified_date)}
+ {data?.modified_date &&
+ formatDateTime(data?.modified_date)}
@@ -856,12 +841,12 @@ export default function ShiftDetails(props: { id: string }) {