Standardise frontend hook fetch error handling and mark Task 12 done

frontend/src/hooks/useBans.ts

@@ -7,6 +7,7 @@
 
 import { useCallback, useEffect, useRef, useState } from "react";
 import { fetchBans } from "../api/dashboard";
+import { handleFetchError } from "../utils/fetchError";
 import type { DashboardBanItem, TimeRange, BanOriginFilter } from "../types/ban";
 
 /** Items per page for the ban table. */
@@ -63,7 +64,7 @@ export function useBans(
       setBanItems(data.items);
       setTotal(data.total);
     } catch (err: unknown) {
-      setError(err instanceof Error ? err.message : "Failed to fetch data");
+      handleFetchError(err, setError, "Failed to fetch bans");
     } finally {
       setLoading(false);
     }