From 87ddd89d5d2f382bff8d9540c5cd78b9a23e2bef Mon Sep 17 00:00:00 2001 From: Abhiuday Date: Sat, 28 Oct 2023 18:45:31 +0530 Subject: [PATCH 1/6] fix(location): added modal to add/remove duty staff --- src/Components/Assets/AssetTypes.tsx | 6 + src/Components/Facility/AddLocationForm.tsx | 42 ++- .../Facility/LocationManagement.tsx | 295 +++++++++++++----- src/Components/Facility/models.tsx | 12 +- src/Locale/en/Asset.json | 7 +- src/Locale/en/Location.json | 6 + src/Locale/en/index.js | 18 +- src/Redux/actions.tsx | 29 ++ src/Redux/api.tsx | 66 ++-- 9 files changed, 358 insertions(+), 123 deletions(-) create mode 100644 src/Locale/en/Location.json diff --git a/src/Components/Assets/AssetTypes.tsx b/src/Components/Assets/AssetTypes.tsx index 436c9370dd8..300cfc63758 100644 --- a/src/Components/Assets/AssetTypes.tsx +++ b/src/Components/Assets/AssetTypes.tsx @@ -1,6 +1,7 @@ import { BedModel } from "../Facility/models"; import { PerformedByModel } from "../HCX/misc"; import { PatientModel } from "../Patient/models"; +import { UserAssignedModel } from "../Users/models"; export enum AssetLocationType { OTHER = "OTHER", @@ -22,6 +23,11 @@ export interface AssetLocationObject { }; } +export interface AssetLocationDutyStaffObject { + duty_staff_objects: UserAssignedModel[]; + duty_staff: number; +} + export enum AssetType { NONE = "NONE", INTERNAL = "INTERNAL", diff --git a/src/Components/Facility/AddLocationForm.tsx b/src/Components/Facility/AddLocationForm.tsx index 8f756f91781..899d33a7e46 100644 --- a/src/Components/Facility/AddLocationForm.tsx +++ b/src/Components/Facility/AddLocationForm.tsx @@ -1,4 +1,5 @@ -import { useState, useEffect, lazy, SyntheticEvent } from "react"; +import { navigate } from "raviger"; +import { SyntheticEvent, lazy, useEffect, useState } from "react"; import { useDispatch } from "react-redux"; import { createFacilityAssetLocation, @@ -7,13 +8,12 @@ import { updateFacilityAssetLocation, } from "../../Redux/actions"; import * as Notification from "../../Utils/Notifications.js"; -import { navigate } from "raviger"; -import { Submit, Cancel } from "../Common/components/ButtonV2"; -import TextFormField from "../Form/FormFields/TextFormField"; -import TextAreaFormField from "../Form/FormFields/TextAreaFormField"; +import { AssetLocationType } from "../Assets/AssetTypes"; +import { Cancel, Submit } from "../Common/components/ButtonV2"; import Page from "../Common/components/Page"; import { SelectFormField } from "../Form/FormFields/SelectFormField"; -import { AssetLocationType } from "../Assets/AssetTypes"; +import TextAreaFormField from "../Form/FormFields/TextAreaFormField"; +import TextFormField from "../Form/FormFields/TextFormField"; const Loading = lazy(() => import("../Common/Loading")); @@ -32,10 +32,17 @@ export const AddLocationForm = (props: LocationFormProps) => { const [facilityName, setFacilityName] = useState(""); const [locationName, setLocationName] = useState(""); const [locationType, setLocationType] = useState(""); - const [errors, setErrors] = useState({ + const [errors, setErrors] = useState<{ + name: string; + description: string; + middlewareAddress: string; + duty_staff: string; + locationType: string; + }>({ name: "", description: "", middlewareAddress: "", + duty_staff: "", locationType: "", }); const headerText = !locationId ? "Add Location" : "Update Location"; @@ -45,9 +52,8 @@ export const AddLocationForm = (props: LocationFormProps) => { async function fetchFacilityName() { setIsLoading(true); if (facilityId) { - const res = await dispatchAction(getAnyFacility(facilityId)); - - setFacilityName(res?.data?.name || ""); + const facility = await dispatchAction(getAnyFacility(facilityId)); + setFacilityName(facility?.data?.name || ""); } if (locationId) { const res = await dispatchAction( @@ -72,6 +78,7 @@ export const AddLocationForm = (props: LocationFormProps) => { description: "", middlewareAddress: "", locationType: "", + duty_staff: "", }; if (name.trim().length === 0) { @@ -124,15 +131,16 @@ export const AddLocationForm = (props: LocationFormProps) => { ? "Location updated successfully" : "Location created successfully"; - navigate(`/facility/${facilityId}/location`, { - replace: true, - }); Notification.Success({ msg: notificationMessage, }); + + navigate(`/facility/${facilityId}/location`, { + replace: true, + }); } else if (res.status === 400) { Object.keys(res.data).forEach((key) => { - setErrors((prevState: any) => ({ + setErrors((prevState) => ({ ...prevState, [key]: res.data[key], })); @@ -163,6 +171,12 @@ export const AddLocationForm = (props: LocationFormProps) => {
+
+ +
+
import("../Common/Loading")); @@ -15,6 +22,7 @@ interface Props { } export default function LocationManagement({ facilityId }: Props) { + const { t } = useTranslation(); return ( {() => ( - Add New Location + {t("add_new_location")}
+
- No locations available + {t("no_locations_available")} className="my-8 grid gap-3 @4xl:grid-cols-2 @6xl:grid-cols-3 @[100rem]:grid-cols-4 lg:mx-8"> - {(item) => } + {(item) => }
@@ -67,77 +76,219 @@ export default function LocationManagement({ facilityId }: Props) { ); } +interface LocationProps extends LocationModel { + facilityId: string; +} -const Location = ({ - name, - description, - middleware_address, - location_type, - created_date, - modified_date, - id, -}: LocationModel) => ( -
-
-
-
-

- {name} -

-
-

- {location_type} +const Location = (props: LocationProps) => { + const { t } = useTranslation(); + const { + id, + name, + description, + middleware_address, + location_type, + created_date, + modified_date, + facilityId, + } = props; + const [toggle, setToggle] = useState(false); + const [disabled, setDisabled] = useState(false); + const { data, loading } = useQuery(routes.getFacilityUsers, { + pathParams: { facility_id: facilityId }, + }); + const [selected, setSelected] = useState(); + const userList = + data?.results.filter( + (u) => u.user_type === "Doctor" || u.user_type === "Staff" + ) || []; + + const { + data: dutyStaffList, + loading: dutyStaffLoading, + refetch, + } = useQuery(routes.getFacilityAssetLocationDutyStaff, { + pathParams: { facility_external_id: facilityId, external_id: id ?? "" }, + }); + + const handleAssign = async () => { + if (!selected) return; + setDisabled(true); + + const { res } = await request(routes.createFacilityAssetLocationDutyStaff, { + pathParams: { facility_external_id: facilityId, external_id: id ?? "" }, + body: { duty_staff: selected.id }, + }); + + if (res) { + if (res?.ok && res.status === 201) { + Notification.Success({ + msg: "Duty Staff Assigned Successfully", + }); + refetch(); + } + } else { + Notification.Error({ + msg: "Something went wrong", + }); + } + + setDisabled(false); + setSelected(undefined); + }; + + const handleDelete = async (userId: number) => { + if (!userId) return; + setDisabled(true); + + const { res } = await request(routes.removeFacilityAssetLocationDutyStaff, { + pathParams: { facility_external_id: facilityId, external_id: id ?? "" }, + body: { duty_staff: userId }, + }); + + if (res) { + if (res?.ok && res.status === 204) { + Notification.Success({ + msg: "Duty Staff removed Successfully", + }); + refetch(); + } + } else { + Notification.Error({ + msg: "Something went wrong", + }); + } + setDisabled(false); + }; + + if (loading || dutyStaffLoading) { + return ; + } + + return ( +

+
+
+
+

+ {name}

+
+

+ {location_type} +

+
+ + + {t("edit")} +
+ +

+ {description || "-"} +

+

+ Middleware Address: +

+

+ {middleware_address || "-"} +

+
+ +
+ {toggle && ( + setToggle((prev) => !prev)} + > +
+ {dutyStaffList?.map((user) => ( + + ))} +
+
+ setSelected(e.value)} + options={userList} + optionLabel={(option) => + `${option.first_name} ${option.last_name} (${option.user_type})` + } + optionValue={(option) => option} + isLoading={loading} + /> + handleAssign()} + disabled={!selected} + > + {t("assign")} + +
+ + )} +
+
setToggle((prev) => !prev)} > - - Edit + + {t("assign_duty_staff")} -
-

- {description || "-"} -

-

- Middleware Address: -

-

- {middleware_address || "-"} -

-
- - - Manage Beds - + + + {t("manage_beds")} + +
-
- - +
+ + +
-
-); + ); +}; diff --git a/src/Components/Facility/models.tsx b/src/Components/Facility/models.tsx index c3ac910970c..2e180cca7c2 100644 --- a/src/Components/Facility/models.tsx +++ b/src/Components/Facility/models.tsx @@ -1,11 +1,11 @@ -import { AssignedToObjectModel, DailyRoundsModel } from "../Patient/models"; -import { ProcedureType } from "../Common/prescription-builder/ProcedureBuilder"; -import { NormalPrescription, PRNPrescription } from "../Medicine/models"; +import { ConsultationSuggestionValue } from "../../Common/constants"; import { AssetData, AssetLocationType } from "../Assets/AssetTypes"; -import { UserBareMinimum } from "../Users/models"; import { RouteToFacility } from "../Common/RouteToFacilitySelect"; +import { ProcedureType } from "../Common/prescription-builder/ProcedureBuilder"; import { ConsultationDiagnosis, CreateDiagnosis } from "../Diagnosis/types"; -import { ConsultationSuggestionValue } from "../../Common/constants"; +import { NormalPrescription, PRNPrescription } from "../Medicine/models"; +import { AssignedToObjectModel, DailyRoundsModel } from "../Patient/models"; +import { UserAssignedModel, UserBareMinimum } from "../Users/models"; export interface LocalBodyModel { id: number; @@ -213,6 +213,8 @@ export interface LocationModel { }; created_date?: string; modified_date?: string; + + users?: UserAssignedModel[]; } export interface BedModel { diff --git a/src/Locale/en/Asset.json b/src/Locale/en/Asset.json index f24549ee0b6..7b9979b7d8b 100644 --- a/src/Locale/en/Asset.json +++ b/src/Locale/en/Asset.json @@ -11,5 +11,8 @@ "update_asset_service_record": "Update Asset Service Record", "eg_details_on_functionality_service_etc": "Eg. Details on functionality, service, etc.", "updating": "Updating", - "update": "Update" -} + "update": "Update", + "search_user_placeholder": "Search User", + "assign_duty_staff": "Assign Duty Staff", + "assign": "Assign" +} \ No newline at end of file diff --git a/src/Locale/en/Location.json b/src/Locale/en/Location.json new file mode 100644 index 00000000000..626cbada8da --- /dev/null +++ b/src/Locale/en/Location.json @@ -0,0 +1,6 @@ +{ + "location_management": "Location Management", + "manage_beds": "Manage Beds", + "add_new_location": "Add New Location", + "no_locations_available": "No Locations Available" +} \ No newline at end of file diff --git a/src/Locale/en/index.js b/src/Locale/en/index.js index 781ce97b009..d214226e0f7 100644 --- a/src/Locale/en/index.js +++ b/src/Locale/en/index.js @@ -1,20 +1,21 @@ -import Auth from "./Auth.json"; import Asset from "./Asset.json"; +import Auth from "./Auth.json"; +import Bed from "./Bed.json"; import Common from "./Common.json"; import Consultation from "./Consultation.json"; +import CoverImageEdit from "./CoverImageEdit.json"; +import Diagnosis from "./Diagnosis.json"; import Entities from "./Entities.json"; +import ErrorPages from "./ErrorPages.json"; +import ExternalResult from "./ExternalResult.json"; import Facility from "./Facility.json"; import Hub from "./Hub.json"; -import ErrorPages from "./ErrorPages.json"; -import Shifting from "./Shifting.json"; +import Location from "./Location.json"; +import Medicine from "./Medicine.json"; import Notifications from "./Notifications.json"; -import ExternalResult from "./ExternalResult.json"; -import CoverImageEdit from "./CoverImageEdit.json"; import Resource from "./Resource.json"; +import Shifting from "./Shifting.json"; import SortOptions from "./SortOptions.json"; -import Bed from "./Bed.json"; -import Medicine from "./Medicine.json"; -import Diagnosis from "./Diagnosis.json"; export default { ...Auth, @@ -33,5 +34,6 @@ export default { ...Resource, ...Shifting, ...Bed, + ...Location, SortOptions, }; diff --git a/src/Redux/actions.tsx b/src/Redux/actions.tsx index 32af9609263..788d0824f14 100644 --- a/src/Redux/actions.tsx +++ b/src/Redux/actions.tsx @@ -74,6 +74,35 @@ export const updateFacilityAssetLocation = ( external_id, }); +export const createFacilityAssetLocationDutyStaff = ( + params: object, + facility_external_id: string, + external_id: string +) => + fireRequest("createFacilityAssetLocationDutyStaff", [], params, { + facility_external_id, + external_id, + }); + +export const removeFacilityAssetLocationDutyStaff = ( + duty_staff: number[], + facility_external_id: string, + external_id: string +) => + fireRequest( + "removeFacilityAssetLocationDutyStaff", + [], + { + data: { + duty_staff: duty_staff, + }, + }, + { + facility_external_id, + external_id, + } + ); + // asset bed export const listAssetBeds = (params: object, altKey?: string) => fireRequest("listAssetBeds", [], params, {}, altKey); diff --git a/src/Redux/api.tsx b/src/Redux/api.tsx index 2b8d4f8f51b..9adeaa69ce0 100644 --- a/src/Redux/api.tsx +++ b/src/Redux/api.tsx @@ -29,52 +29,53 @@ import { AssetUpdate, } from "../Components/Assets/AssetTypes"; import { + IDeleteExternalResult, + IExternalResult, + IExternalResultCsv, + ILocalBodies, + ILocalBodyByDistrict, + IPartialUpdateExternalResult, +} from "../Components/ExternalResult/models"; +import { + BedModel, CapacityModal, ConsultationModel, CreateBedBody, CurrentBed, - DistrictModel, DailyRoundsBody, DailyRoundsRes, + DistrictModel, DoctorModal, FacilityModel, + FacilityRequest, IFacilityNotificationRequest, IFacilityNotificationResponse, IUserFacilityRequest, LocalBodyModel, + LocationModel, + PatientNotesModel, PatientStatsModel, - FacilityRequest, StateModel, WardModel, - LocationModel, - PatientNotesModel, - BedModel, } from "../Components/Facility/models"; + +import { HCXPolicyModel } from "../Components/HCX/models"; +import { Prescription } from "../Components/Medicine/models"; import { - IDeleteExternalResult, - IExternalResult, - IExternalResultCsv, - ILocalBodies, - ILocalBodyByDistrict, - IPartialUpdateExternalResult, -} from "../Components/ExternalResult/models"; + NotificationData, + PNconfigData, +} from "../Components/Notifications/models"; +import { DailyRoundsModel, PatientModel } from "../Components/Patient/models"; +import { IComment, IResource } from "../Components/Resource/models"; +import { IShift } from "../Components/Shifting/models"; import { SkillModel, SkillObjectModel, UpdatePasswordForm, + UserBareMinimum, UserModel, } from "../Components/Users/models"; -import { Prescription } from "../Components/Medicine/models"; -import { DailyRoundsModel, PatientModel } from "../Components/Patient/models"; import { PaginatedResponse } from "../Utils/request/types"; -import { - NotificationData, - PNconfigData, -} from "../Components/Notifications/models"; - -import { IComment, IResource } from "../Components/Resource/models"; -import { IShift } from "../Components/Shifting/models"; -import { HCXPolicyModel } from "../Components/HCX/models"; /** * A fake function that returns an empty object casted to type T @@ -351,6 +352,27 @@ const routes = { path: "/api/v1/facility/{facility_external_id}/asset_location/{external_id}/", method: "PATCH", }, + getFacilityAssetLocationDutyStaff: { + path: "/api/v1/facility/{facility_external_id}/asset_location/{external_id}/duty_staff/", + method: "GET", + TRes: Type(), + }, + createFacilityAssetLocationDutyStaff: { + path: "/api/v1/facility/{facility_external_id}/asset_location/{external_id}/duty_staff/", + method: "POST", + TRes: Type>(), + TBody: Type<{ + duty_staff: number; + }>(), + }, + removeFacilityAssetLocationDutyStaff: { + path: "/api/v1/facility/{facility_external_id}/asset_location/{external_id}/duty_staff/", + method: "DELETE", + TRes: Type>(), + TBody: Type<{ + duty_staff: number; + }>(), + }, // Asset bed listAssetBeds: { From 55583e6ef85c5c27accb31a98d6772c70ecbce87 Mon Sep 17 00:00:00 2001 From: Abhiuday Date: Mon, 4 Dec 2023 20:17:38 +0530 Subject: [PATCH 2/6] fix(location): updated UI --- .../Facility/LocationManagement.tsx | 34 ++++++++++++------- 1 file changed, 22 insertions(+), 12 deletions(-) diff --git a/src/Components/Facility/LocationManagement.tsx b/src/Components/Facility/LocationManagement.tsx index abe6a1488fe..6cf0d954080 100644 --- a/src/Components/Facility/LocationManagement.tsx +++ b/src/Components/Facility/LocationManagement.tsx @@ -221,18 +221,6 @@ const Location = (props: LocationProps) => { show={toggle} onClose={() => setToggle((prev) => !prev)} > -
- {dutyStaffList?.map((user) => ( - - ))} -
{ {t("assign")}
+
+ {dutyStaffList?.map((user) => ( +
+
+ +
{`${user.first_name} ${user.last_name} (${user.user_type})`}
+
+ handleDelete(user.id)} + > + {t("remove")} + +
+ ))} +
)}
From f70f5888e53d969bec66d53f126f186da12c852b Mon Sep 17 00:00:00 2001 From: Abhiuday Date: Tue, 5 Dec 2023 16:14:31 +0530 Subject: [PATCH 3/6] fix(location): updated modal UI and fixed reloading --- .../Facility/LocationManagement.tsx | 194 ++++++++++-------- 1 file changed, 113 insertions(+), 81 deletions(-) diff --git a/src/Components/Facility/LocationManagement.tsx b/src/Components/Facility/LocationManagement.tsx index 6cf0d954080..85dbfe6eacd 100644 --- a/src/Components/Facility/LocationManagement.tsx +++ b/src/Components/Facility/LocationManagement.tsx @@ -76,47 +76,50 @@ export default function LocationManagement({ facilityId }: Props) { ); } -interface LocationProps extends LocationModel { - facilityId: string; -} -const Location = (props: LocationProps) => { +const DutyStaff = ({ + facilityId, + locationId, + toggle, + setToggle, +}: { + facilityId: string; + locationId: string; + toggle: boolean; + setToggle: React.Dispatch>; +}) => { const { t } = useTranslation(); - const { - id, - name, - description, - middleware_address, - location_type, - created_date, - modified_date, - facilityId, - } = props; - const [toggle, setToggle] = useState(false); const [disabled, setDisabled] = useState(false); const { data, loading } = useQuery(routes.getFacilityUsers, { pathParams: { facility_id: facilityId }, }); const [selected, setSelected] = useState(); - const userList = - data?.results.filter( - (u) => u.user_type === "Doctor" || u.user_type === "Staff" - ) || []; - const { data: dutyStaffList, - loading: dutyStaffLoading, + loading: _dutyStaffLoading, refetch, } = useQuery(routes.getFacilityAssetLocationDutyStaff, { - pathParams: { facility_external_id: facilityId, external_id: id ?? "" }, + pathParams: { + facility_external_id: facilityId, + external_id: locationId ?? "", + }, }); + const dutyStaffIds = dutyStaffList?.map((u) => u.id) || []; + const userList = + data?.results + .filter((u) => u.user_type === "Doctor" || u.user_type === "Staff") + .filter((u) => !dutyStaffIds.includes(u.id)) || []; + const handleAssign = async () => { if (!selected) return; setDisabled(true); const { res } = await request(routes.createFacilityAssetLocationDutyStaff, { - pathParams: { facility_external_id: facilityId, external_id: id ?? "" }, + pathParams: { + facility_external_id: facilityId, + external_id: locationId ?? "", + }, body: { duty_staff: selected.id }, }); @@ -142,7 +145,10 @@ const Location = (props: LocationProps) => { setDisabled(true); const { res } = await request(routes.removeFacilityAssetLocationDutyStaff, { - pathParams: { facility_external_id: facilityId, external_id: id ?? "" }, + pathParams: { + facility_external_id: facilityId, + external_id: locationId ?? "", + }, body: { duty_staff: userId }, }); @@ -161,9 +167,83 @@ const Location = (props: LocationProps) => { setDisabled(false); }; - if (loading || dutyStaffLoading) { - return ; - } + return ( + setToggle((prev) => !prev)} + > +
+ setSelected(e.value)} + options={userList} + optionLabel={(option) => + `${option.first_name} ${option.last_name} (${option.user_type})` + } + optionValue={(option) => option} + isLoading={loading} + /> + handleAssign()} + disabled={!selected} + > + {t("assign")} + +
+
+ {dutyStaffList?.map((user) => ( +
+
+ +
{`${user.first_name} ${user.last_name} (${user.user_type})`}
+
+ handleDelete(user.id)} + > + + +
+ ))} +
+ + ); +}; + +interface LocationProps extends LocationModel { + facilityId: string; +} + +const Location = (props: LocationProps) => { + const { t } = useTranslation(); + const { + id, + name, + description, + middleware_address, + location_type, + created_date, + modified_date, + facilityId, + } = props; + const [toggle, setToggle] = useState(false); return (
@@ -216,60 +296,12 @@ const Location = (props: LocationProps) => {
{toggle && ( - setToggle((prev) => !prev)} - > -
- setSelected(e.value)} - options={userList} - optionLabel={(option) => - `${option.first_name} ${option.last_name} (${option.user_type})` - } - optionValue={(option) => option} - isLoading={loading} - /> - handleAssign()} - disabled={!selected} - > - {t("assign")} - -
-
- {dutyStaffList?.map((user) => ( -
-
- -
{`${user.first_name} ${user.last_name} (${user.user_type})`}
-
- handleDelete(user.id)} - > - {t("remove")} - -
- ))} -
- + )}
From 2e65424ba3a864df7ff9df576dc6a58f90373281 Mon Sep 17 00:00:00 2001 From: Abhiuday Date: Fri, 15 Dec 2023 09:19:14 +0530 Subject: [PATCH 4/6] fix(actions): removed unnecessary actions for duty staff --- .../Facility/LocationManagement.tsx | 6 ++-- src/Redux/actions.tsx | 29 ------------------- 2 files changed, 3 insertions(+), 32 deletions(-) diff --git a/src/Components/Facility/LocationManagement.tsx b/src/Components/Facility/LocationManagement.tsx index 85dbfe6eacd..813484c82eb 100644 --- a/src/Components/Facility/LocationManagement.tsx +++ b/src/Components/Facility/LocationManagement.tsx @@ -304,11 +304,11 @@ const Location = (props: LocationProps) => { /> )}
-
+
setToggle((prev) => !prev)} > @@ -319,7 +319,7 @@ const Location = (props: LocationProps) => { id="manage-bed-button" variant="secondary" border - className="w-full lg:w-auto" + className="w-full md:w-auto" href={`location/${id}/beds`} > diff --git a/src/Redux/actions.tsx b/src/Redux/actions.tsx index 788d0824f14..32af9609263 100644 --- a/src/Redux/actions.tsx +++ b/src/Redux/actions.tsx @@ -74,35 +74,6 @@ export const updateFacilityAssetLocation = ( external_id, }); -export const createFacilityAssetLocationDutyStaff = ( - params: object, - facility_external_id: string, - external_id: string -) => - fireRequest("createFacilityAssetLocationDutyStaff", [], params, { - facility_external_id, - external_id, - }); - -export const removeFacilityAssetLocationDutyStaff = ( - duty_staff: number[], - facility_external_id: string, - external_id: string -) => - fireRequest( - "removeFacilityAssetLocationDutyStaff", - [], - { - data: { - duty_staff: duty_staff, - }, - }, - { - facility_external_id, - external_id, - } - ); - // asset bed export const listAssetBeds = (params: object, altKey?: string) => fireRequest("listAssetBeds", [], params, {}, altKey); From 1a9a2a472b74c63c77feaa5e4571f72528ea679b Mon Sep 17 00:00:00 2001 From: Abhiuday Date: Wed, 27 Dec 2023 13:40:06 +0530 Subject: [PATCH 5/6] fix(location): removed heading --- src/Components/Facility/AddLocationForm.tsx | 8 -------- 1 file changed, 8 deletions(-) diff --git a/src/Components/Facility/AddLocationForm.tsx b/src/Components/Facility/AddLocationForm.tsx index 899d33a7e46..49e75582412 100644 --- a/src/Components/Facility/AddLocationForm.tsx +++ b/src/Components/Facility/AddLocationForm.tsx @@ -36,13 +36,11 @@ export const AddLocationForm = (props: LocationFormProps) => { name: string; description: string; middlewareAddress: string; - duty_staff: string; locationType: string; }>({ name: "", description: "", middlewareAddress: "", - duty_staff: "", locationType: "", }); const headerText = !locationId ? "Add Location" : "Update Location"; @@ -171,12 +169,6 @@ export const AddLocationForm = (props: LocationFormProps) => {
-
- -
-
Date: Wed, 3 Jan 2024 18:39:07 +0530 Subject: [PATCH 6/6] fix(location): replaced dispatch with useQuery/request --- src/Components/Facility/AddLocationForm.tsx | 112 ++++++++++---------- src/Locale/en/Location.json | 4 +- src/Redux/api.tsx | 4 + 3 files changed, 62 insertions(+), 58 deletions(-) diff --git a/src/Components/Facility/AddLocationForm.tsx b/src/Components/Facility/AddLocationForm.tsx index 49e75582412..1738024fb7f 100644 --- a/src/Components/Facility/AddLocationForm.tsx +++ b/src/Components/Facility/AddLocationForm.tsx @@ -1,13 +1,10 @@ import { navigate } from "raviger"; import { SyntheticEvent, lazy, useEffect, useState } from "react"; -import { useDispatch } from "react-redux"; -import { - createFacilityAssetLocation, - getAnyFacility, - getFacilityAssetLocation, - updateFacilityAssetLocation, -} from "../../Redux/actions"; +import { useTranslation } from "react-i18next"; +import routes from "../../Redux/api"; import * as Notification from "../../Utils/Notifications.js"; +import request from "../../Utils/request/request"; +import useQuery from "../../Utils/request/useQuery"; import { AssetLocationType } from "../Assets/AssetTypes"; import { Cancel, Submit } from "../Common/components/ButtonV2"; import Page from "../Common/components/Page"; @@ -24,14 +21,13 @@ interface LocationFormProps { export const AddLocationForm = (props: LocationFormProps) => { const { facilityId, locationId } = props; - const dispatchAction: any = useDispatch(); - const [isLoading, setIsLoading] = useState(false); + const { t } = useTranslation(); const [name, setName] = useState(""); const [middlewareAddress, setMiddlewareAddress] = useState(""); const [description, setDescription] = useState(""); - const [facilityName, setFacilityName] = useState(""); - const [locationName, setLocationName] = useState(""); - const [locationType, setLocationType] = useState(""); + const [locationType, setLocationType] = useState( + AssetLocationType.OTHER + ); const [errors, setErrors] = useState<{ name: string; description: string; @@ -46,28 +42,26 @@ export const AddLocationForm = (props: LocationFormProps) => { const headerText = !locationId ? "Add Location" : "Update Location"; const buttonText = !locationId ? "Add Location" : "Update Location"; - useEffect(() => { - async function fetchFacilityName() { - setIsLoading(true); - if (facilityId) { - const facility = await dispatchAction(getAnyFacility(facilityId)); - setFacilityName(facility?.data?.name || ""); - } - if (locationId) { - const res = await dispatchAction( - getFacilityAssetLocation(facilityId, locationId) - ); - - setName(res?.data?.name || ""); - setLocationName(res?.data?.name || ""); - setDescription(res?.data?.description || ""); - setLocationType(res?.data?.location_type || ""); - setMiddlewareAddress(res?.data?.middleware_address || ""); - } - setIsLoading(false); + const { data: facility } = useQuery(routes.getAnyFacility, { + pathParams: { id: facilityId }, + }); + + const { data: location, loading } = useQuery( + routes.getFacilityAssetLocation, + { + pathParams: { + facility_external_id: facilityId, + external_id: locationId || "", + }, } - fetchFacilityName(); - }, [dispatchAction, facilityId, locationId]); + ); + + useEffect(() => { + setName(location?.name || ""); + setDescription(location?.description || ""); + setMiddlewareAddress(location?.middleware_address || ""); + setLocationType(location?.location_type || AssetLocationType.OTHER); + }, [location]); const validateForm = () => { let formValid = true; @@ -109,22 +103,33 @@ export const AddLocationForm = (props: LocationFormProps) => { return; } - setIsLoading(true); - const data = { + const bodyData = { name, description, middleware_address: middlewareAddress, location_type: locationType, }; - const res = await dispatchAction( - locationId - ? updateFacilityAssetLocation(data, facilityId, locationId) - : createFacilityAssetLocation(data, facilityId) - ); - setIsLoading(false); - if (res) { - if (res.status === 201 || res.status === 200) { + let response: Response | undefined; + + if (locationId) { + const { res } = await request(routes.updateFacilityAssetLocation, { + pathParams: { + facility_external_id: facilityId, + external_id: locationId, + }, + body: bodyData, + }); + response = res; + } else { + const { res } = await request(routes.createFacilityAssetLocation, { + pathParams: { facility_external_id: facilityId }, + body: bodyData, + }); + response = res; + } + if (response) { + if (response.status === 201 || response.status === 200) { const notificationMessage = locationId ? "Location updated successfully" : "Location created successfully"; @@ -136,18 +141,11 @@ export const AddLocationForm = (props: LocationFormProps) => { navigate(`/facility/${facilityId}/location`, { replace: true, }); - } else if (res.status === 400) { - Object.keys(res.data).forEach((key) => { - setErrors((prevState) => ({ - ...prevState, - [key]: res.data[key], - })); - }); } } }; - if (isLoading) { + if (loading) { return ; } @@ -156,10 +154,10 @@ export const AddLocationForm = (props: LocationFormProps) => { title={headerText} backUrl={`/facility/${facilityId}/location`} crumbsReplacements={{ - [facilityId]: { name: facilityName }, + [facilityId]: { name: facility?.name }, ...(locationId && { [locationId]: { - name: locationName, + name: location?.name, uri: `/facility/${facilityId}/location`, }, }), @@ -173,7 +171,7 @@ export const AddLocationForm = (props: LocationFormProps) => { setName(e.value)} @@ -184,7 +182,7 @@ export const AddLocationForm = (props: LocationFormProps) => { setDescription(e.value)} error={errors.description} @@ -194,7 +192,7 @@ export const AddLocationForm = (props: LocationFormProps) => { { id="location-middleware-address" name="Location Middleware Address" type="text" - label="Location Middleware Address" + label={t("location_middleware_address")} value={middlewareAddress} onChange={(e) => setMiddlewareAddress(e.value)} error={errors.middlewareAddress} diff --git a/src/Locale/en/Location.json b/src/Locale/en/Location.json index 626cbada8da..c25681e39ae 100644 --- a/src/Locale/en/Location.json +++ b/src/Locale/en/Location.json @@ -2,5 +2,7 @@ "location_management": "Location Management", "manage_beds": "Manage Beds", "add_new_location": "Add New Location", - "no_locations_available": "No Locations Available" + "no_locations_available": "No Locations Available", + "location_type": "Location Type", + "location_middleware_address": "Location Middleware Address" } \ No newline at end of file diff --git a/src/Redux/api.tsx b/src/Redux/api.tsx index 9adeaa69ce0..ec097fb7d74 100644 --- a/src/Redux/api.tsx +++ b/src/Redux/api.tsx @@ -338,6 +338,8 @@ const routes = { createFacilityAssetLocation: { path: "/api/v1/facility/{facility_external_id}/asset_location/", method: "POST", + TRes: Type>(), + TBody: Type(), }, getFacilityAssetLocation: { path: "/api/v1/facility/{facility_external_id}/asset_location/{external_id}/", @@ -347,6 +349,8 @@ const routes = { updateFacilityAssetLocation: { path: "/api/v1/facility/{facility_external_id}/asset_location/{external_id}/", method: "PUT", + TRes: Type>(), + TBody: Type(), }, partialUpdateFacilityAssetLocation: { path: "/api/v1/facility/{facility_external_id}/asset_location/{external_id}/",