Syntax changes in front and back end dirs. These do not affect functionality and are purely intended to better capture and describe the app's functionality and purpose

client/src/hooks/useSourceCorpus.js

@@ -0,0 +1,50 @@
+import { useState, useEffect, useCallback } from 'react';
+import * as sourceCorpusApi from '../api/sourceCorpus.js';
+
+export function useSourceCorpus() {
+  const [sourceCorpora, setSourceCorpora] = useState([]);
+  const [activeSourceCorpus, setActiveSourceCorpus] = useState(null);
+
+  useEffect(() => {
+    sourceCorpusApi.listSourceCorpora().then(setSourceCorpora).catch(console.error);
+  }, []);
+
+  const selectSourceCorpus = useCallback(
+    (id) => {
+      const corpus = sourceCorpora.find((n) => n.id === id) || null;
+      setActiveSourceCorpus(corpus);
+    },
+    [sourceCorpora],
+  );
+
+  const createSourceCorpus = useCallback(async (name) => {
+    if (!name) return;
+    const corpus = await sourceCorpusApi.createSourceCorpus(name);
+    setSourceCorpora((prev) => [...prev, corpus]);
+    setActiveSourceCorpus(corpus);
+  }, []);
+
+  const deleteSourceCorpus = useCallback(
+    async (id) => {
+      try {
+        await sourceCorpusApi.deleteSourceCorpus(id);
+      } catch (err) {
+        console.error('Failed to delete sourceCorpus', err);
+        return;
+      }
+      setSourceCorpora((prev) => prev.filter((n) => n.id !== id));
+      if (activeSourceCorpus?.id === id) {
+        setActiveSourceCorpus(null);
+      }
+    },
+    [activeSourceCorpus],
+  );
+
+  return {
+    sourceCorpora,
+    activeSourceCorpus,
+    selectSourceCorpus,
+    createSourceCorpus,
+    deleteSourceCorpus,
+  };
+}