Implement state contexts

frontend/src/hooks/useFileNavigation.js

@@ -0,0 +1,39 @@
+// hooks/useFileNavigation.js
+import { useCallback } from 'react';
+import { useToasts } from '@geist-ui/core';
+import { lookupFileByName } from '../services/api';
+import { useFileContentContext } from '../contexts/FileContentContext';
+
+export const useFileNavigation = () => {
+  const { setToast } = useToasts();
+  const { handleFileSelect } = useFileContentContext();
+
+  const handleLinkClick = useCallback(
+    async (filename) => {
+      try {
+        const filePaths = await lookupFileByName(filename);
+        if (filePaths.length === 1) {
+          handleFileSelect(filePaths[0]);
+        } else if (filePaths.length > 1) {
+          // Handle multiple file options (you may want to show a modal or dropdown)
+          console.log('Multiple files found:', filePaths);
+          setToast({
+            text: 'Multiple files found with the same name. Please specify the full path.',
+            type: 'warning',
+          });
+        } else {
+          setToast({ text: `File "${filename}" not found`, type: 'error' });
+        }
+      } catch (error) {
+        console.error('Error looking up file:', error);
+        setToast({
+          text: 'Failed to lookup file. Please try again.',
+          type: 'error',
+        });
+      }
+    },
+    [handleFileSelect, setToast]
+  );
+
+  return { handleLinkClick };
+};