Function useFileAccess

frontend/src/hooks/useFileAccess.ts:11–231

()

}

export function useFileAccess() {
  const [recentFiles, setRecentFiles] = useState<FileAccessEntry[]>([]);
  const [isLoading, setIsLoading] = useState(false);
  const [error, setError] = useState<string | null>(null);

  // Load recent files from localStorage on component mount
  useEffect(() => {
    try {
      const storedFiles = localStorage.getItem("datakit_recent_files");
      if (storedFiles) {
        // Parse the stored files - remove handle which can't be serialized
        const parsedFiles = JSON.parse(storedFiles) as FileAccessEntry[];
        setRecentFiles(parsedFiles);
      }
    } catch (err) {
      console.error("Failed to load recent files:", err);
    }
  }, []);

  // Update localStorage when recentFiles changes
  useEffect(() => {
    if (recentFiles.length > 0) {
      try {
        // Store files without handle property
        const storable = recentFiles.map(({ handle, ...rest }) => rest);
        localStorage.setItem("datakit_recent_files", JSON.stringify(storable));
      } catch (err) {
        console.error("Failed to save recent files:", err);
      }
    }
  }, [recentFiles]);

  // Add a file to recent files list
  const addRecentFile = useCallback(
    (file: File, handle?: FileSystemFileHandle) => {
      const fileType = file.name.split(".").pop()?.toLowerCase() || "";

      const newEntry: FileAccessEntry = {
        name: file.name,
        size: file.size,
        type: fileType,
        lastAccessed: Date.now(),
        handle,
      };

      setRecentFiles((prev) => {
        // Add to the beginning, remove duplicates, keep only the 10 most recent
        const filtered = prev.filter((f) => f.name !== file.name);
        return [newEntry, ...filtered].slice(0, 10);
      });

      return newEntry;
    },
    []
  );

  const requestFileHandle = useCallback(async (): Promise<{
    handle: FileSystemFileHandle;