[CRCR] Fix client-side crash on CRCR pages after idle (#8341)

## Summary

All three CRCR pages (`/crcr`, `/crcr/[org]/[repo]`, `/crcr/metrics`)
use the bare `fetcher` from `GeneralUtils`, which calls `res.json()`
without checking `res.ok`. When SWR auto-revalidates and the API returns
a non-200 response (e.g. ClickHouse timeout, 502), the error object is
treated as valid data. This causes a `TypeError` when the code tries to
iterate over undefined fields (e.g. `allowlist["L4"]` on `{ error: "..."
}`), crashing the page with "Application error: a client-side exception
has occurred".

**Fix**: Switch all CRCR SWR calls from `fetcher` to
`fetcherHandleError`, which throws on non-200 responses so SWR captures
it as `error` and displays the error message gracefully instead of
crashing.

## Test plan

- [ ] Open `/crcr` and leave it idle for several minutes — verify no
crash
- [ ] Verify `/crcr`, `/crcr/pytorch/crcr-test`, and `/crcr/metrics` all
load correctly
- [ ] Simulate a ClickHouse timeout — verify error message is shown
instead of crash

Author: subinz1

torchci/pages/crcr/[org]/[repo].tsx

@@ -21,7 +21,7 @@ import type { CSSProperties } from "react";
 import { useEffect, useMemo, useState } from "react";
 import useSWR from "swr";
 
-import { fetcher } from "lib/GeneralUtils";
+import { fetcherHandleError } from "lib/GeneralUtils";
 
 // ---- Types ----
 
@@ -470,7 +470,7 @@ function usePrInfo(
           upstreamRepo
         )}&prs=${encodeURIComponent(dedupedPrs.join(","))}`
       : null;
-  const { data } = useSWR<PrInfo[]>(url, fetcher, {
+  const { data } = useSWR<PrInfo[]>(url, fetcherHandleError, {
     revalidateOnFocus: false,
   });
 
@@ -543,7 +543,7 @@ function CrcrMatrix({
       offset: String(offset),
     })
   )}`;
-  const { data, error } = useSWR<CrcrJobRow[]>(url, fetcher, {
+  const { data, error } = useSWR<CrcrJobRow[]>(url, fetcherHandleError, {
     refreshInterval: 60_000,
   });
 
@@ -769,9 +769,11 @@ export default function CrcrBackendPage() {
         JSON.stringify({ repo: repoFullName, days: String(days) })
       )}`
     : null;
-  const { data: summaryData } = useSWR<SummaryStats[]>(summaryUrl, fetcher, {
-    refreshInterval: 60_000,
-  });
+  const { data: summaryData } = useSWR<SummaryStats[]>(
+    summaryUrl,
+    fetcherHandleError,
+    { refreshInterval: 60_000 }
+  );
   const stats = summaryData?.[0] ?? null;
 
   if (!org || !repo) return null;

torchci/pages/crcr/index.tsx

@@ -20,7 +20,7 @@ import {
   Typography,
 } from "@mui/material";
 import { durationDisplay } from "components/common/TimeUtils";
-import { fetcher } from "lib/GeneralUtils";
+import { fetcherHandleError } from "lib/GeneralUtils";
 import Head from "next/head";
 import NextLink from "next/link";
 import { useMemo, useState } from "react";
@@ -352,12 +352,12 @@ export default function CrcrSummaryPage() {
   )}`;
   const { data: ciData, error: ciError } = useSWR<CiMetricsRow[]>(
     ciUrl,
-    fetcher,
+    fetcherHandleError,
     { refreshInterval: 60_000 }
   );
   const { data: allowlist, error: alError } = useSWR<AllowlistResponse>(
     "/api/crcr/allowlist",
-    fetcher,
+    fetcherHandleError,
     { refreshInterval: 5 * 60_000 }
   );
 

torchci/pages/crcr/metrics.tsx

@@ -16,7 +16,7 @@ import {
 } from "components/metrics/panels/TimeSeriesPanel";
 import dayjs from "dayjs";
 import utc from "dayjs/plugin/utc";
-import { fetcher } from "lib/GeneralUtils";
+import { fetcherHandleError } from "lib/GeneralUtils";
 import Head from "next/head";
 import NextLink from "next/link";
 import { useMemo, useState } from "react";
@@ -159,7 +159,7 @@ export default function CrcrMetricsPage() {
   const url = `/api/clickhouse/crcr_success_rate?parameters=${encodeURIComponent(
     JSON.stringify({ days: String(days) })
   )}`;
-  const { data, error } = useSWR<SuccessRateRow[]>(url, fetcher, {
+  const { data, error } = useSWR<SuccessRateRow[]>(url, fetcherHandleError, {
     refreshInterval: 5 * 60_000,
   });