veza/apps/web/src/components/views/file-manager-view/useFileManagerView.ts
senke bc7eabdbbe refactor(views): extract FileManagerView into file-manager-view module
- Add file-manager-view/ with useFileManagerView, Header, Toolbar, Table, Grid,
  Empty, Skeleton; types and mockFiles
- Layout primitives (min-h-layout-page-sm), no arbitrary values
- Stories: Default, Loading, Empty
- Re-export from FileManagerView.tsx

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-05 21:45:01 +01:00

80 lines
2.2 KiB
TypeScript

import { useState, useMemo } from 'react';
import { useToast } from '@/components/feedback/ToastProvider';
import type { FileNode } from './types';
import { MOCK_FILES } from './mockFiles';
export interface UseFileManagerViewOptions {
filesOverride?: FileNode[];
isLoading?: boolean;
}
export function useFileManagerView(options: UseFileManagerViewOptions = {}) {
const { filesOverride, isLoading = false } = options;
const { addToast } = useToast();
const [viewMode, setViewMode] = useState<'list' | 'grid'>('list');
const [searchQuery, setSearchQuery] = useState('');
const [selectedFiles, setSelectedFiles] = useState<string[]>([]);
const [currentFolder, setCurrentFolder] = useState('Root');
const [selectedFileId, setSelectedFileId] = useState<string | null>(null);
const [showMetadataModal, setShowMetadataModal] = useState(false);
const [showWatermarkModal, setShowWatermarkModal] = useState(false);
const files = filesOverride ?? MOCK_FILES;
const filteredFiles = useMemo(
() =>
files.filter((f) =>
f.name.toLowerCase().includes(searchQuery.toLowerCase()),
),
[files, searchQuery],
);
const handleFileClick = (file: FileNode) => {
if (file.type === 'folder') {
setCurrentFolder(file.name);
addToast(`Navigated to ${file.name}`, 'info');
} else {
setSelectedFileId(file.id);
}
};
const toggleSelection = (id: string) => {
setSelectedFiles((prev) =>
prev.includes(id) ? prev.filter((fid) => fid !== id) : [...prev, id],
);
};
const selectAll = () => {
if (selectedFiles.length === files.length) setSelectedFiles([]);
else setSelectedFiles(files.map((f) => f.id));
};
const handleBulkAction = (action: string) => {
addToast(`${action} ${selectedFiles.length} files`, 'success');
setSelectedFiles([]);
};
return {
viewMode,
setViewMode,
searchQuery,
setSearchQuery,
selectedFiles,
currentFolder,
setCurrentFolder,
selectedFileId,
setSelectedFileId,
showMetadataModal,
setShowMetadataModal,
showWatermarkModal,
setShowWatermarkModal,
files,
filteredFiles,
handleFileClick,
toggleSelection,
selectAll,
handleBulkAction,
isLoading,
};
}