diff --git a/src/Components/Resource/CommentSection.tsx b/src/Components/Resource/CommentSection.tsx index 8bc08357fc..f7df14228b 100644 --- a/src/Components/Resource/CommentSection.tsx +++ b/src/Components/Resource/CommentSection.tsx @@ -1,6 +1,4 @@ import { useState } from "react"; -import { useDispatch } from "react-redux"; -import { addResourceComments } from "../../Redux/actions"; import * as Notification from "../../Utils/Notifications.js"; import { formatDateTime } from "../../Utils/utils"; import CircularProgress from "../Common/components/CircularProgress"; @@ -10,9 +8,9 @@ import useQuery from "../../Utils/request/useQuery"; import routes from "../../Redux/api"; import PaginatedList from "../../CAREUI/misc/PaginatedList"; import { IComment } from "./models"; +import request from "../../Utils/request/request"; const CommentSection = (props: { id: string }) => { - const dispatch: any = useDispatch(); const [commentBox, setCommentBox] = useState(""); const offset = 0; const limit = 8; @@ -25,7 +23,7 @@ const CommentSection = (props: { id: string }) => { } ); - const onSubmitComment = () => { + const onSubmitComment = async () => { const payload = { comment: commentBox, }; @@ -35,10 +33,15 @@ const CommentSection = (props: { id: string }) => { }); return; } - dispatch(addResourceComments(props.id, payload)).then((_: any) => { + + const { res, data } = await request(routes.addResourceComments, { + pathParams: { id: props.id }, + body: payload, + }); + if (res && data) { Notification.Success({ msg: "Comment added successfully" }); resourceRefetch(); - }); + } setCommentBox(""); }; diff --git a/src/Components/Resource/ResourceCreate.tsx b/src/Components/Resource/ResourceCreate.tsx index cf9e5f6f22..215870032a 100644 --- a/src/Components/Resource/ResourceCreate.tsx +++ b/src/Components/Resource/ResourceCreate.tsx @@ -1,8 +1,8 @@ -import { useReducer, useState, useEffect, lazy } from "react"; +/* eslint-disable react-hooks/rules-of-hooks */ +import { useReducer, useState, lazy } from "react"; import { FacilitySelect } from "../Common/FacilitySelect"; import * as Notification from "../../Utils/Notifications.js"; -import { useDispatch } from "react-redux"; import { navigate } from "raviger"; import { OptionsType, @@ -11,8 +11,6 @@ import { } from "../../Common/constants"; import { parsePhoneNumber } from "../../Utils/utils"; import { phonePreg } from "../../Common/validation"; - -import { createResource, getAnyFacility } from "../../Redux/actions"; import { Cancel, Submit } from "../Common/components/ButtonV2"; import PhoneNumberFormField from "../Form/FormFields/PhoneNumberFormField"; import { FieldChangeEvent } from "../Form/FormFields/Utils"; @@ -26,6 +24,9 @@ import { FieldLabel } from "../Form/FormFields/FormField"; import Card from "../../CAREUI/display/Card"; import Page from "../Common/components/Page"; import { PhoneNumberValidator } from "../Form/FieldValidators"; +import useQuery from "../../Utils/request/useQuery"; +import routes from "../../Redux/api"; +import request from "../../Utils/request/request"; const Loading = lazy(() => import("../Common/Loading")); @@ -87,10 +88,7 @@ export default function ResourceCreate(props: resourceProps) { const { goBack } = useAppHistory(); const { facilityId } = props; const { t } = useTranslation(); - - const dispatchAction: any = useDispatch(); const [isLoading, setIsLoading] = useState(false); - const [facilityName, setFacilityName] = useState(""); const resourceFormReducer = (state = initialState, action: any) => { switch (action.type) { @@ -113,18 +111,11 @@ export default function ResourceCreate(props: resourceProps) { const [state, dispatch] = useReducer(resourceFormReducer, initialState); - useEffect(() => { - async function fetchFacilityName() { - if (facilityId) { - const res = await dispatchAction(getAnyFacility(facilityId)); - - setFacilityName(res?.data?.name || ""); - } else { - setFacilityName(""); - } - } - fetchFacilityName(); - }, [dispatchAction, facilityId]); + const { data: facilityData } = facilityId + ? useQuery(routes.getAnyFacility, { + pathParams: { id: String(facilityId) }, + }) + : { data: null }; const validateForm = () => { const errors = { ...initError }; @@ -184,11 +175,11 @@ export default function ResourceCreate(props: resourceProps) { if (validForm) { setIsLoading(true); - const data = { + const resourceData = { status: "PENDING", category: state.form.category, sub_category: state.form.sub_category, - origin_facility: props.facilityId, + origin_facility: String(props.facilityId), approving_facility: (state.form.approving_facility || {}).id, assigned_facility: (state.form.assigned_facility || {}).id, emergency: state.form.emergency === "true", @@ -202,16 +193,18 @@ export default function ResourceCreate(props: resourceProps) { requested_quantity: state.form.requested_quantity || 0, }; - const res = await dispatchAction(createResource(data)); + const { res, data } = await request(routes.createResource, { + body: resourceData, + }); setIsLoading(false); - if (res && res.data && (res.status == 201 || res.status == 200)) { + if (res && data && (res.status == 201 || res.status == 200)) { await dispatch({ type: "set_form", form: initForm }); Notification.Success({ msg: "Resource request created successfully", }); - navigate(`/resource/${res.data.id}`); + navigate(`/resource/${data.id}`); } } }; @@ -224,7 +217,7 @@ export default function ResourceCreate(props: resourceProps) { import("../Common/Loading")); @@ -67,13 +64,9 @@ const initialState = { export const ResourceDetailsUpdate = (props: resourceProps) => { const { goBack } = useAppHistory(); - const dispatchAction: any = useDispatch(); const [qParams, _] = useQueryParams(); const [isLoading, setIsLoading] = useState(true); - const [assignedQuantity, setAssignedQuantity] = useState(0); - const [requestTitle, setRequestTitle] = useState(""); - const [assignedUser, SetAssignedUser] = useState(null); - const [assignedUserLoading, setAssignedUserLoading] = useState(false); + const [assignedUser, SetAssignedUser] = useState(); const resourceFormReducer = (state = initialState, action: any) => { switch (action.type) { case "set_form": { @@ -95,23 +88,13 @@ export const ResourceDetailsUpdate = (props: resourceProps) => { const [state, dispatch] = useReducer(resourceFormReducer, initialState); - useEffect(() => { - async function fetchData() { - if (state.form.assigned_to) { - setAssignedUserLoading(true); - - const res = await dispatchAction( - getUserList({ id: state.form.assigned_to }) - ); - - if (res && res.data && res.data.count) - SetAssignedUser(res.data.results[0]); - - setAssignedUserLoading(false); + const { loading: assignedUserLoading } = useQuery(routes.userList, { + onResponse: ({ res, data }) => { + if (res && data && data.count) { + SetAssignedUser(data.results[0]); } - } - fetchData(); - }, [dispatchAction, state.form.assigned_to]); + }, + }); const validateForm = () => { const errors = { ...initError }; @@ -147,13 +130,25 @@ export const ResourceDetailsUpdate = (props: resourceProps) => { dispatch({ type: "set_form", form }); }; + const { data: resourceDetailsData } = useQuery(routes.getResourceDetails, { + pathParams: { id: props.id }, + onResponse: ({ res, data }) => { + if (res && data) { + const d = data; + d["status"] = qParams.status || data.status; + dispatch({ type: "set_form", form: d }); + } + setIsLoading(false); + }, + }); + const handleSubmit = async () => { const validForm = validateForm(); if (validForm) { setIsLoading(true); - const data = { + const resourceData = { category: "OXYGEN", status: state.form.status, origin_facility: state.form.origin_facility_object?.id, @@ -167,14 +162,17 @@ export const ResourceDetailsUpdate = (props: resourceProps) => { assigned_quantity: state.form.status === "PENDING" ? state.form.assigned_quantity - : assignedQuantity, + : resourceDetailsData?.assigned_quantity || 0, }; - const res = await dispatchAction(updateResource(props.id, data)); + const { res, data } = await request(routes.updateResource, { + pathParams: { id: props.id }, + body: resourceData, + }); setIsLoading(false); - if (res && res.status == 200 && res.data) { - dispatch({ type: "set_form", form: res.data }); + if (res && res.status == 200 && data) { + dispatch({ type: "set_form", form: data }); Notification.Success({ msg: "Resource request updated successfully", }); @@ -186,31 +184,6 @@ export const ResourceDetailsUpdate = (props: resourceProps) => { } }; - const fetchData = useCallback( - async (status: statusType) => { - setIsLoading(true); - const res = await dispatchAction(getResourceDetails({ id: props.id })); - if (!status.aborted) { - if (res && res.data) { - setRequestTitle(res.data.title); - setAssignedQuantity(res.data.assigned_quantity); - const d = res.data; - d["status"] = qParams.status || res.data.status; - dispatch({ type: "set_form", form: d }); - } - setIsLoading(false); - } - }, - [props.id, dispatchAction, qParams.status] - ); - - useAbortableEffect( - (status: statusType) => { - fetchData(status); - }, - [fetchData] - ); - if (isLoading) { return ; } @@ -219,7 +192,7 @@ export const ResourceDetailsUpdate = (props: resourceProps) => {
diff --git a/src/Redux/actions.tsx b/src/Redux/actions.tsx index 06a1279673..0e3e4827cd 100644 --- a/src/Redux/actions.tsx +++ b/src/Redux/actions.tsx @@ -805,30 +805,9 @@ export const listMedibaseMedicines = ( }; // Resource -export const createResource = (params: object) => { - return fireRequest("createResource", [], params); -}; -export const updateResource = (id: string, params: object) => { - return fireRequest("updateResource", [id], params); -}; -export const deleteResourceRecord = (id: string) => { - return fireRequest("deleteResourceRecord", [id], {}); -}; -export const listResourceRequests = (params: object, key: string) => { - return fireRequest("listResourceRequests", [], params, null, key); -}; -export const getResourceDetails = (pathParam: object) => { - return fireRequest("getResourceDetails", [], {}, pathParam); -}; export const downloadResourceRequests = (params: object) => { return fireRequest("downloadResourceRequests", [], params); }; -export const getResourceComments = (id: string, params: object) => { - return fireRequest("getResourceComments", [], params, { id }); -}; -export const addResourceComments = (id: string, params: object) => { - return fireRequest("addResourceComments", [], params, { id }); -}; export const listAssets = (params: object) => fireRequest("listAssets", [], params); diff --git a/src/Redux/api.tsx b/src/Redux/api.tsx index 5f5864bfb7..ac015f4d0b 100644 --- a/src/Redux/api.tsx +++ b/src/Redux/api.tsx @@ -101,6 +101,8 @@ const routes = { userList: { path: "/api/v1/users/", + method: "GET", + TRes: Type>(), }, userListSkill: { @@ -803,10 +805,14 @@ const routes = { createResource: { path: "/api/v1/resource/", method: "POST", + TRes: Type(), + TBody: Type>(), }, updateResource: { - path: "/api/v1/resource", + path: "/api/v1/resource/{id}", method: "PUT", + TRes: Type(), + TBody: Type>(), }, deleteResourceRecord: { path: "/api/v1/resource/{id}", @@ -837,6 +843,8 @@ const routes = { addResourceComments: { path: "/api/v1/resource/{id}/comment/", method: "POST", + TRes: Type(), + TBody: Type>(), }, // Assets endpoints