diff --git a/src/Components/Assets/AssetConfigure.tsx b/src/Components/Assets/AssetConfigure.tsx index 7099f911463..fd431ae35ea 100644 --- a/src/Components/Assets/AssetConfigure.tsx +++ b/src/Components/Assets/AssetConfigure.tsx @@ -1,60 +1,32 @@ -import { useCallback, useState } from "react"; import Loading from "../Common/Loading"; -import { AssetData } from "./AssetTypes"; -import { statusType, useAbortableEffect } from "../../Common/utils"; -import { useDispatch } from "react-redux"; -import { getAsset } from "../../Redux/actions"; -import * as Notification from "../../Utils/Notifications.js"; import HL7Monitor from "./AssetType/HL7Monitor"; import ONVIFCamera from "./AssetType/ONVIFCamera"; import Page from "../Common/components/Page"; +import useQuery from "../../Utils/request/useQuery"; +import routes from "../../Redux/api"; interface AssetConfigureProps { assetId: string; facilityId: string; } -const AssetConfigure = (props: AssetConfigureProps) => { - const { assetId, facilityId } = props; - const [asset, setAsset] = useState(); - const [isLoading, setIsLoading] = useState(true); - const [assetType, setAssetType] = useState(""); - const dispatch = useDispatch(); +const AssetConfigure = ({ assetId, facilityId }: AssetConfigureProps) => { + const { + data: asset, + loading, + refetch, + } = useQuery(routes.getAsset, { pathParams: { external_id: assetId } }); - const fetchData = useCallback( - async (status: statusType) => { - setIsLoading(true); - const [assetData]: any = await Promise.all([dispatch(getAsset(assetId))]); - if (!status.aborted) { - setIsLoading(false); - if (!assetData.data) - Notification.Error({ - msg: "Something went wrong..!", - }); - else { - setAsset(assetData.data); - setAssetType(assetData.data.asset_class); - } - } - }, - [dispatch, assetId] - ); - - useAbortableEffect( - (status: statusType) => { - fetchData(status); - }, - [dispatch, fetchData] - ); - - if (isLoading) return ; + if (loading || !asset) { + return ; + } - if (assetType === "HL7MONITOR") { + if (asset.asset_class === "HL7MONITOR") { return ( { ); } - if (assetType === "VENTILATOR") { + if (asset.asset_class === "VENTILATOR") { return ( { }} backUrl={`/facility/${facilityId}/assets/${assetId}`} > - + refetch()} + /> ); }; diff --git a/src/Components/Assets/AssetType/ONVIFCamera.tsx b/src/Components/Assets/AssetType/ONVIFCamera.tsx index 5cb518a3855..4720c876010 100644 --- a/src/Components/Assets/AssetType/ONVIFCamera.tsx +++ b/src/Components/Assets/AssetType/ONVIFCamera.tsx @@ -18,14 +18,14 @@ import { Submit } from "../../Common/components/ButtonV2"; import { SyntheticEvent } from "react"; import useAuthUser from "../../../Common/hooks/useAuthUser"; -interface ONVIFCameraProps { +interface Props { assetId: string; facilityId: string; asset: any; + onUpdated?: () => void; } -const ONVIFCamera = (props: ONVIFCameraProps) => { - const { assetId, facilityId, asset } = props; +const ONVIFCamera = ({ assetId, facilityId, asset, onUpdated }: Props) => { const [isLoading, setIsLoading] = useState(true); const [assetType, setAssetType] = useState(""); const [middlewareHostname, setMiddlewareHostname] = useState(""); @@ -43,7 +43,6 @@ const ONVIFCamera = (props: ONVIFCameraProps) => { const [refreshPresetsHash, setRefreshPresetsHash] = useState( Number(new Date()) ); - const [refreshHash, setRefreshHash] = useState(Number(new Date())); const dispatch = useDispatch(); const authUser = useAuthUser(); useEffect(() => { @@ -88,14 +87,10 @@ const ONVIFCamera = (props: ONVIFCameraProps) => { dispatch(partialUpdateAsset(assetId, data)) ); if (res?.status === 200) { - Notification.Success({ - msg: "Asset Configured Successfully", - }); - setRefreshHash(Number(new Date())); + Notification.Success({ msg: "Asset Configured Successfully" }); + onUpdated?.(); } else { - Notification.Error({ - msg: "Something went wrong..!", - }); + Notification.Error({ msg: "Something went wrong..!" }); } setLoadingSetConfiguration(false); } else { @@ -204,7 +199,6 @@ const ONVIFCamera = (props: ONVIFCameraProps) => { {assetType === "ONVIF" ? ( (), }, deleteAsset: { path: "/api/v1/asset/{external_id}/",