From 391b72b12e962b2fbd954524acb132331ca6050a Mon Sep 17 00:00:00 2001
From: Alexander Madsen <alexander.madsen@ess.eu>
Date: Thu, 21 Sep 2023 13:32:32 +0000
Subject: [PATCH] CE-2081: Convert useRecord
---
src/api/SwaggerApi.js | 7 ----
src/views/records/RecordDetailsView.js | 49 ++++++++++++++++++++------
2 files changed, 38 insertions(+), 18 deletions(-)
diff --git a/src/api/SwaggerApi.js b/src/api/SwaggerApi.js
index 59444ee7..9724a8db 100644
--- a/src/api/SwaggerApi.js
+++ b/src/api/SwaggerApi.js
@@ -372,13 +372,6 @@ const emptyRecordListResponse = {
recordList: []
};
-export function useRecord(name, onError) {
- const api = useContext(apiContext);
- const method = useCallAndUnpack(api.apis.Records.getRecord, unpackRecord);
- const boundMethod = useCallback(method.bind(null, { name: name }), [name]);
- return useAsync({ fcn: boundMethod, onError: onError });
-}
-
export function unpackLogin(loginResponse) {
return { ...loginResponse };
}
diff --git a/src/views/records/RecordDetailsView.js b/src/views/records/RecordDetailsView.js
index 7ae3cd86..8eca4382 100644
--- a/src/views/records/RecordDetailsView.js
+++ b/src/views/records/RecordDetailsView.js
@@ -1,5 +1,10 @@
-import React, { useEffect, useCallback, useState, useContext } from "react";
-import { useRecord } from "../../api/SwaggerApi";
+import React, {
+ useEffect,
+ useCallback,
+ useState,
+ useContext,
+ useMemo
+} from "react";
import {
Paper,
IconButton,
@@ -22,17 +27,39 @@ import { useNavigate } from "react-router-dom";
import { onFetchEntityError } from "../../components/common/Helper";
import NotFoundView from "../../components/navigation/NotFoundView/NotFoundView";
+import { apiContext } from "../../api/DeployApi";
+import { useAPIMethod } from "@ess-ics/ce-ui-common";
+
export function RecordDetailsView() {
const { name } = useParams();
const decodedName = decodeURIComponent(name);
- const [notFoundError, setNotFoundError] = useState();
- const [record /* getRecord*/ /* reset*/, , , recordLoading] = useRecord(
- decodedName,
- (m, s) => {
- // handle error code 404, and define custom message on the UI because BE sends back generic error message
- onFetchEntityError(m, s, setNotFoundError);
- }
+ const [error, setError] = useState(null);
+
+ const client = useContext(apiContext);
+
+ const params = useMemo(
+ () => ({
+ name: decodedName
+ }),
+ [decodedName]
);
+
+ const {
+ value: record,
+ error: fetchError,
+ loading: recordLoading,
+ dataReady
+ } = useAPIMethod({
+ fcn: client.apis.Records.getRecord,
+ params
+ });
+
+ useEffect(() => {
+ if (fetchError) {
+ onFetchEntityError(fetchError?.message, fetchError?.status, setError);
+ }
+ }, [fetchError]);
+
const navigate = useNavigate();
const { setTitle } = useContext(GlobalAppBarContext);
@@ -112,9 +139,9 @@ export function RecordDetailsView() {
return (
<RootContainer>
- {notFoundError ? (
+ {error ? (
<NotFoundView />
- ) : recordLoading ? (
+ ) : recordLoading || !dataReady ? (
<LinearProgress color="primary" />
) : (
<Paper>
--
GitLab