1 files changed, 108 insertions, 0 deletions
diff --git a/makima/frontend/src/hooks/useDirectives.ts b/makima/frontend/src/hooks/useDirectives.ts
new file mode 100644
index 0000000..001cf89
--- /dev/null
+++ b/makima/frontend/src/hooks/useDirectives.ts
@@ -0,0 +1,108 @@
+import { useState, useCallback, useEffect } from "react";
+import {
+  listDirectives,
+  getDirective,
+  createDirective,
+  updateDirective,
+  deleteDirective,
+  type DirectiveSummary,
+  type DirectiveWithChains,
+  type CreateDirectiveRequest,
+  type UpdateDirectiveRequest,
+} from "../lib/api";
+
+export function useDirectives() {
+  const [directives, setDirectives] = useState<DirectiveSummary[]>([]);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  const fetchDirectives = useCallback(async () => {
+    setLoading(true);
+    setError(null);
+    try {
+      const response = await listDirectives();
+      setDirectives(response.directives);
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Failed to fetch directives");
+    } finally {
+      setLoading(false);
+    }
+  }, []);
+
+  const fetchDirective = useCallback(
+    async (id: string): Promise<DirectiveWithChains | null> => {
+      setError(null);
+      try {
+        return await getDirective(id);
+      } catch (e) {
+        setError(e instanceof Error ? e.message : "Failed to fetch directive");
+        return null;
+      }
+    },
+    []
+  );
+
+  const saveDirective = useCallback(
+    async (data: CreateDirectiveRequest): Promise<DirectiveSummary | null> => {
+      setError(null);
+      try {
+        const directive = await createDirective(data);
+        await fetchDirectives();
+        return directive as unknown as DirectiveSummary;
+      } catch (e) {
+        setError(e instanceof Error ? e.message : "Failed to create directive");
+        return null;
+      }
+    },
+    [fetchDirectives]
+  );
+
+  const editDirective = useCallback(
+    async (
+      id: string,
+      data: UpdateDirectiveRequest
+    ): Promise<DirectiveSummary | null> => {
+      setError(null);
+      try {
+        const directive = await updateDirective(id, data);
+        await fetchDirectives();
+        return directive as unknown as DirectiveSummary;
+      } catch (e) {
+        setError(e instanceof Error ? e.message : "Failed to update directive");
+        return null;
+      }
+    },
+    [fetchDirectives]
+  );
+
+  const removeDirective = useCallback(
+    async (id: string): Promise<boolean> => {
+      setError(null);
+      try {
+        await deleteDirective(id);
+        await fetchDirectives();
+        return true;
+      } catch (e) {
+        setError(e instanceof Error ? e.message : "Failed to delete directive");
+        return false;
+      }
+    },
+    [fetchDirectives]
+  );
+
+  // Initial fetch
+  useEffect(() => {
+    fetchDirectives();
+  }, [fetchDirectives]);
+
+  return {
+    directives,
+    loading,
+    error,
+    fetchDirectives,
+    fetchDirective,
+    saveDirective,
+    editDirective,
+    removeDirective,
+  };
+}