feat(frontend): add config hooks for jail, action, filter, and auto-save

- useJailFileConfig: manages jail.local section state with dirty tracking
- useActionConfig: manages action .conf file state
- useFilterConfig: manages filter .conf file state
- useAutoSave: debounced auto-save with status indicator support

frontend/src/hooks/useActionConfig.ts

@@ -0,0 +1,89 @@
+/**
+ * React hook for loading and updating a single parsed action config.
+ */
+
+import { useCallback, useEffect, useRef, useState } from "react";
+import { fetchParsedAction, updateParsedAction } from "../api/config";
+import type { ActionConfig, ActionConfigUpdate } from "../types/config";
+
+export interface UseActionConfigResult {
+  config: ActionConfig | null;
+  loading: boolean;
+  error: string | null;
+  saving: boolean;
+  saveError: string | null;
+  refresh: () => void;
+  save: (update: ActionConfigUpdate) => Promise<void>;
+}
+
+/**
+ * Load one action config by name and expose a ``save`` callback for partial
+ * updates.
+ *
+ * @param name - Action base name (e.g. ``"iptables"``).
+ */
+export function useActionConfig(name: string): UseActionConfigResult {
+  const [config, setConfig] = useState<ActionConfig | null>(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+  const [saving, setSaving] = useState(false);
+  const [saveError, setSaveError] = useState<string | null>(null);
+  const abortRef = useRef<AbortController | null>(null);
+
+  const load = useCallback((): void => {
+    abortRef.current?.abort();
+    const ctrl = new AbortController();
+    abortRef.current = ctrl;
+    setLoading(true);
+    setError(null);
+
+    fetchParsedAction(name)
+      .then((data) => {
+        if (!ctrl.signal.aborted) {
+          setConfig(data);
+          setLoading(false);
+        }
+      })
+      .catch((err: unknown) => {
+        if (!ctrl.signal.aborted) {
+          setError(err instanceof Error ? err.message : "Failed to load action config");
+          setLoading(false);
+        }
+      });
+  }, [name]);
+
+  useEffect(() => {
+    load();
+    return (): void => {
+      abortRef.current?.abort();
+    };
+  }, [load]);
+
+  const save = useCallback(
+    async (update: ActionConfigUpdate): Promise<void> => {
+      setSaving(true);
+      setSaveError(null);
+      try {
+        await updateParsedAction(name, update);
+        setConfig((prev) =>
+          prev
+            ? {
+                ...prev,
+                ...Object.fromEntries(
+                  Object.entries(update).filter(([, v]) => v !== null && v !== undefined)
+                ),
+              }
+            : prev
+        );
+      } catch (err: unknown) {
+        setSaveError(err instanceof Error ? err.message : "Failed to save action config");
+        throw err;
+      } finally {
+        setSaving(false);
+      }
+    },
+    [name]
+  );
+
+  return { config, loading, error, saving, saveError, refresh: load, save };
+}