fix(location): duty doctors and staff for each location in a facility

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",

src/Components/Facility/AddLocationForm.tsx

@@ -1,19 +1,16 @@
-import { useState, useEffect, lazy, SyntheticEvent } from "react";
-import { useDispatch } from "react-redux";
-import {
-  createFacilityAssetLocation,
-  getAnyFacility,
-  getFacilityAssetLocation,
-  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 { SyntheticEvent, lazy, useEffect, useState } from "react";
+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";
 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"));
 
@@ -24,15 +21,19 @@ interface LocationFormProps {
 
 export const AddLocationForm = (props: LocationFormProps) => {
   const { facilityId, locationId } = props;
-  const dispatchAction: any = useDispatch();
-  const [isLoading, setIsLoading] = useState<boolean>(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 [errors, setErrors] = useState<any>({
+  const [locationType, setLocationType] = useState<AssetLocationType>(
+    AssetLocationType.OTHER
+  );
+  const [errors, setErrors] = useState<{
+    name: string;
+    description: string;
+    middlewareAddress: string;
+    locationType: string;
+  }>({
     name: "",
     description: "",
     middlewareAddress: "",
@@ -41,29 +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 res = await dispatchAction(getAnyFacility(facilityId));
+  const { data: facility } = useQuery(routes.getAnyFacility, {
+    pathParams: { id: facilityId },
+  });
 
-        setFacilityName(res?.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: 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;
@@ -72,6 +70,7 @@ export const AddLocationForm = (props: LocationFormProps) => {
       description: "",
       middlewareAddress: "",
       locationType: "",
+      duty_staff: "",
     };
 
     if (name.trim().length === 0) {
@@ -104,44 +103,49 @@ 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";
 
-        navigate(`/facility/${facilityId}/location`, {
-          replace: true,
-        });
         Notification.Success({
           msg: notificationMessage,
         });
-      } else if (res.status === 400) {
-        Object.keys(res.data).forEach((key) => {
-          setErrors((prevState: any) => ({
-            ...prevState,
-            [key]: res.data[key],
-          }));
+
+        navigate(`/facility/${facilityId}/location`, {
+          replace: true,
         });
       }
     }
   };
 
-  if (isLoading) {
+  if (loading) {
     return <Loading />;
   }
 
@@ -150,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`,
           },
         }),
@@ -167,7 +171,7 @@ export const AddLocationForm = (props: LocationFormProps) => {
                 <TextFormField
                   name="name"
                   type="text"
-                  label="Name"
+                  label={t("name")}
                   required
                   value={name}
                   onChange={(e) => setName(e.value)}
@@ -178,7 +182,7 @@ export const AddLocationForm = (props: LocationFormProps) => {
                 <TextAreaFormField
                   rows={5}
                   name="description"
-                  label="Description"
+                  label={t("description")}
                   value={description}
                   onChange={(e) => setDescription(e.value)}
                   error={errors.description}
@@ -188,7 +192,7 @@ export const AddLocationForm = (props: LocationFormProps) => {
                 <SelectFormField
                   id="location-type"
                   name="location_type"
-                  label="Location Type"
+                  label={t("location_type")}
                   options={[
                     { title: "ICU", value: AssetLocationType.ICU },
                     {
@@ -210,7 +214,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}