diff --git a/src/FetchRequest/FetchRequestDetail.tsx b/src/FetchRequest/FetchRequestDetail.tsx index c846f4e..e246357 100644 --- a/src/FetchRequest/FetchRequestDetail.tsx +++ b/src/FetchRequest/FetchRequestDetail.tsx @@ -19,7 +19,7 @@ import WarningAmberIcon from "@mui/icons-material/WarningAmber"; import PlayArrowIcon from "@mui/icons-material/PlayArrow"; import RemoveCircleOutlineIcon from "@mui/icons-material/RemoveCircleOutline"; import FiberManualRecordIcon from "@mui/icons-material/FiberManualRecord"; -import { useResource, useItemSse, DetailFieldRenderer } from "../../react-openapi"; +import { useResource, useItemSse, useAppContext, DetailFieldRenderer, applyDisplayFormat } from "../../react-openapi"; import { useQuery } from "@tanstack/react-query"; import { RETRY_MAX, formatApiError } from "../features/fetch-requests"; import type { FetchRequestStatus, SSEEvent, ProgressMessage } from "../features/fetch-requests"; @@ -71,6 +71,7 @@ export default function FetchRequestDetail() { const { id } = useParams<{ id: string }>(); const navigate = useNavigate(); const { get, patch, resource } = useResource("fetch-requests"); + const { resources: allResources } = useAppContext(); const [stepStats, setStepStats] = useState>({}); const [liveParsedCount, setLiveParsedCount] = useState(undefined); const [retrying, setRetrying] = useState(false); @@ -158,6 +159,29 @@ export default function FetchRequestDetail() { } }; + const req = fetchRequest as any; + const retryCount = req?.retry_count ?? 0; + const isRetryExhausted = retryCount >= RETRY_MAX; + const status = req?.status as FetchRequestStatus | undefined; + const detailFields = (resource?.orderedFields ?? []).filter( + (f) => f.name !== "source", + ); + + const displayTitle = useMemo(() => { + if (!resource || !req) return ""; + const resolved = Object.fromEntries( + resource.orderedFields.map((field) => { + const value = req[field.name]; + if (field.fk && typeof value === "object" && value != null) { + const target = allResources.find((r) => r.name === field.fk!.resource); + if (target) return [field.name, applyDisplayFormat(value, target.displayFormat)]; + } + return [field.name, value]; + }), + ); + return applyDisplayFormat(resolved, resource.displayFormat); + }, [resource, req, allResources]); + if (isLoading) { return ( @@ -177,15 +201,6 @@ export default function FetchRequestDetail() { ); } - const req = fetchRequest as any; - const retryCount = req.retry_count ?? 0; - const isRetryExhausted = retryCount >= RETRY_MAX; - const status = req.status as FetchRequestStatus; - - const detailFields = (resource?.orderedFields ?? []).filter( - (f) => f.name !== "source", - ); - return (