updated sse supporting react-openapi

src/FetchRequestDetail.tsx

@@ -35,7 +35,8 @@ import type {
   ProgressMessage,
 } from "./features/fetch-requests";
 import { RETRY_MAX, formatApiError } from "./features/fetch-requests";
-import { useResourceByName, useConfig, defaultFieldComponents } from "../react-openapi";
+import { useAppContext, useResource } from "../react-openapi";
+import { useQuery, useMutation } from "@tanstack/react-query";
 
 const statusColors: Record<FetchRequestStatus, "default" | "primary" | "warning" | "info" | "success" | "error"> = {
   pending: "default",
@@ -144,11 +145,18 @@ function isMathValid(candidate: { amount: number; balance: number }, prevBalance
 export default function FetchRequestDetail() {
   const { id } = useParams<{ id: string }>();
   const navigate = useNavigate();
-  const config = useConfig();
+  const { resources, config } = useAppContext();
+  const fetchRequestResource = resources.find(r => r.name === "fetch-requests")!;
+  const { get, update } = useResource(fetchRequestResource);
 
-  const { useRead, usePatch } = useResourceByName("fetch-requests", { fieldComponents: defaultFieldComponents });
-  const { data: fetchRequest, isLoading, error: fetchError, refetch: refetchRequest } = useRead(id!);
-  const updateMutation = usePatch();
+  const { data: fetchRequest, isLoading, error: fetchError, refetch: refetchRequest } = useQuery({
+    queryKey: ["fetch-requests", "detail", id],
+    queryFn: () => get(id!),
+    enabled: !!id,
+  });
+  const updateMutation = useMutation({
+    mutationFn: ({ id: rid, data }: { id: string; data: any }) => update(rid, data),
+  });
   const resolveMutation = useResolveAmbiguity();
   const { data: ambiguities, refetch: refetchAmbiguities } = useFetchRequestAmbiguities(id!);
 
@@ -193,8 +201,8 @@ export default function FetchRequestDetail() {
   }, [fetchRequest, stepStats, liveParsedCount, txnBlockCount]);
 
   React.useEffect(() => {
-    if (!id || !config?.baseUrl) return;
-    const url = `${config.baseUrl}/fetch-requests/${id}/events`;
+    if (!id || !config?.baseApiUrl) return;
+    const url = `${config.baseApiUrl}/fetch-requests/${id}/events`;
     const es = new EventSource(url);
     sseRef.current = es;
 
@@ -243,7 +251,7 @@ export default function FetchRequestDetail() {
       es.close();
       sseRef.current = null;
     };
-  }, [id, config?.baseUrl]);
+  }, [id, config?.baseApiUrl]);
 
   React.useEffect(() => {
     if (feedRef.current) {