Files
BanGUI/frontend/src/hooks/useJailDistribution.ts
Lukas 5166789b68 feat: Implement typed error contracts in generic hooks
Introduce discriminated FetchError union type to replace weak string error
handling in API calls and hooks. Enables actionable error diagnostics.

Changes:
- Create types/api.ts with FetchError discriminated union (api_error,
  network_error, abort_error)
- Export type guards: isAuthError, isAbortError, isNetworkError, isApiError
- Update useListData and usePolledData to expose typed FetchError instead of
  string
- Add getErrorMessage() helper to extract displayable messages from FetchError
- Add createStringErrorAdapter() for backward compatibility with string error
  state
- Update handleFetchError() to work with both FetchError and string setters
- Update all consumer hooks to expose typed errors
- Update components to use getErrorMessage() when displaying errors
- Update tests to mock FetchError instead of strings
- Add comprehensive typed error model documentation to Web-Development.md

This enables better error handling patterns:
- Check error.type to distinguish between API, network, and abort errors
- Extract status codes for specific handling (401/403 auth, 50x server errors)
- Maintain backward compatibility with existing string-based error states

All TypeScript compilation passes with no errors.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
2026-04-28 09:13:47 +02:00

87 lines
2.8 KiB
TypeScript

/**
* `useJailDistribution` hook.
*
* Fetches per-jail ban counts for the jail distribution chart.
* Re-fetches automatically when `timeRange` or `origin` changes.
*/
import { useCallback, useEffect, useRef, useState } from "react";
import { fetchBansByJail } from "../api/dashboard";
import { handleFetchError, createStringErrorAdapter } from "../utils/fetchError";
import type { BanOriginFilter, JailBanCount, TimeRange } from "../types/ban";
// ---------------------------------------------------------------------------
// Return type
// ---------------------------------------------------------------------------
/** Return value shape for {@link useJailDistribution}. */
export interface UseJailDistributionResult {
/** Jails ordered by ban count descending. */
jails: JailBanCount[];
/** Total ban count for the selected window. */
total: number;
/** True while a fetch is in flight. */
loading: boolean;
/** Error message or `null`. */
error: string | null;
/** Re-fetch the data immediately. */
reload: () => void;
}
// ---------------------------------------------------------------------------
// Hook
// ---------------------------------------------------------------------------
/**
* Fetch and expose per-jail ban counts for the `JailDistributionChart` component.
*
* @param timeRange - Time-range preset: `"24h"`, `"7d"`, `"30d"`, or `"365d"`.
* @param origin - Origin filter: `"all"`, `"blocklist"`, or `"selfblock"`.
* @returns Jail list, total count, loading state, and error.
*/
export function useJailDistribution(
timeRange: TimeRange,
origin: BanOriginFilter,
): UseJailDistributionResult {
const [jails, setJails] = useState<JailBanCount[]>([]);
const [total, setTotal] = useState<number>(0);
const [loading, setLoading] = useState<boolean>(true);
const [error, setError] = useState<string | null>(null);
const abortRef = useRef<AbortController | null>(null);
const load = useCallback((): void => {
abortRef.current?.abort();
const controller = new AbortController();
abortRef.current = controller;
setLoading(true);
setError(null);
fetchBansByJail(timeRange, origin, "fail2ban", controller.signal)
.then((data) => {
if (controller.signal.aborted) return;
setJails(data.jails);
setTotal(data.total);
})
.catch((err: unknown) => {
if (controller.signal.aborted) return;
handleFetchError(err, createStringErrorAdapter(setError), "Failed to fetch jail distribution");
})
.finally(() => {
if (!controller.signal.aborted) {
setLoading(false);
}
});
}, [timeRange, origin]);
useEffect(() => {
load();
return (): void => {
abortRef.current?.abort();
};
}, [load]);
return { jails, total, loading, error, reload: load };
}