thedotmack/claude-mem · error · Error

Failed to load

Error message

Failed to load ${dataType}: ${response.statusText}

What it means

usePaginationFor's fetch loop throws when the paginated API endpoint responds with a non-OK HTTP status, surfacing response.statusText in the message. React Query hooks like observations, summaries, and prompts use this loader, so the error surfaces as a failed query for that data type. It is a client-side guard against silently rendering empty data after a server failure.

Solutions

  1. Check the response status in server logs and fix the server-side failure
  2. Re-authenticate if the status is 401/403
  3. Verify the `project` filter value matches a valid project
  4. Retry the request; consider adding retry/backoff in the hook's query config

Example fix

// before
const response = await fetch(`${endpoint}?${params}`);
if (!response.ok) throw new Error(`Failed to load ${dataType}: ${response.statusText}`);
// after
const response = await fetch(`${endpoint}?${params}`);
if (response.status === 401) { await reauth(); }
if (!response.ok) throw new Error(`Failed to load ${dataType}: ${response.status} ${response.statusText}`);
Defensive patterns

Strategy: retry

Validate before calling

const res = await fetch(`${endpoint}?ping=1`);
if (!res.ok) console.warn('API unhealthy before paginated load:', res.status);

Try / catch

useQuery({ queryKey: [dataType, filter], queryFn: loadPage, retry: (count, err) => count < 3 && !String(err).includes('401') });

Prevention

When it happens

Trigger: Fetching `${endpoint}?${params}` (with project filter appended when set) where the server returns 4xx/5xx — e.g. 500 server error, 401 unauthorized, 404 unknown project filter.

Common situations: Backend API down or erroring; expired session/token causing 401; filtering by a project name the server doesn't recognize; network proxies returning error pages.

Understand the failure class

Background: "API error: {status}" and "HTTP 401/403/404/429/5xx" errors: non-2xx HTTP responses explained — this error's family across 27 libraries.

Related errors

AI-assisted analysis of thedotmack/claude-mem@d8bc9755e7 (2026-09-17). Data as JSON: /api/errors/3ab49b95a83682fe. Report an issue: GitHub.

Appendix: source

Thrown at src/ui/viewer/hooks/usePagination.ts:55

      return [];
    }

    stateRef.current = { ...stateRef.current, isLoading: true };
    setState(prev => ({ ...prev, isLoading: true }));

    const params = new URLSearchParams({
      offset: offsetRef.current.toString(),
      limit: UI.PAGINATION_PAGE_SIZE.toString()
    });

    if (currentFilter) {
      params.append('project', currentFilter);
    }

    const response = await fetch(`${endpoint}?${params}`);

    if (!response.ok) {
      throw new Error(`Failed to load ${dataType}: ${response.statusText}`);
    }

    const data = await response.json() as { items: TItem[], hasMore: boolean };

    const nextState = {
      ...stateRef.current,
      isLoading: false,
      hasMore: data.hasMore
    };
    stateRef.current = nextState;

    setState(prev => ({
      ...prev,
      isLoading: false,
      hasMore: data.hasMore
    }));

    offsetRef.current += UI.PAGINATION_PAGE_SIZE;

View on GitHub (pinned to d8bc9755e7)