How gkalian/amuzing-file-browser works
Amuzing File Browser is a local-first web file manager: users browse and organize a configured directory, upload or download files, and preview images. The React app coordinates navigation, listing, selection, settings, and upload interactions; its API client connects those actions to an Express server. The server exposes filesystem, configuration, health, and public-media routes, with root-constrained path handling and host-based access rules. README capabilities are included where the tree supports them; several client hooks and server route implementations were not sampled, so their internal wiring is shown only at the documented/API boundary.
Main entry points: App.tsx App coordinator · paths.ts Root path mapping · app.ts Express app · fsRoutes.ts Filesystem routes
Components 28
Browser interface
- Client mount
src/client/main.tsx - App coordinator
src/client/App.tsx - Browser panes
src/client/components/browser/FileBrowserPane.tsx - File table
src/client/components/filetable/FileTable.tsx - Action modals
src/client/components/ModalLayout.tsx - Upload queue
src/client/components/upload/UploadQueue.tsx
Client workflows
- Listing model
src/client/hooks/browser/useListingModel.ts - Selection
src/client/hooks/selection/useSelection.ts - Filesystem actions
src/client/hooks/data/useFsActions.ts - Upload workflow
src/client/hooks/uploads/useUploads.ts - Settings state
src/client/hooks/ui/useSettings.ts - API client
src/client/services/apiClient.ts
Server API
- Express app
src/server/app.ts - Host access gate
src/server/middleware/hostGate.ts - Filesystem routes
src/server/routes/fsRoutes.ts - List and stat
src/server/routes/fs/listRoutes.ts - Image preview
src/server/routes/fs/previewRoutes.ts - Filesystem mutations
src/server/routes/fs/mutationRoutes.ts - Download routes
src/server/routes/fs/downloadRoutes.ts - Config routes
src/server/routes/configRoutes.ts - Public media files
src/server/routes/files.ts - Multipart upload
src/server/app.ts
Filesystem access
- Root and symlink safety
src/server/lib/fsSafe.ts - Root path mapping
src/server/paths.ts - Served files
- Persisted settings
src/server/lib/settings.ts
Other components
- User
- Web browser
Connections 42
- User → Web browser: uses
- Web browser → Client mount: loads app
- Client mount → App coordinator: mounts
- App coordinator → Browser panes: renders
- App coordinator → Listing model: builds listing
- App coordinator → Selection: manages selection
- App coordinator → Filesystem actions: invokes actions
- App coordinator → Upload workflow: coordinates uploads
- App coordinator → Settings state: loads settings
- App coordinator → Action modals: renders
- App coordinator → Upload queue: renders progress
- Browser panes → File table: displays items
- Listing model → API client: loads listings
- Filesystem actions → API client: calls filesystem API
- Upload workflow → API client: sends uploads
- Settings state → API client: loads and saves config
- API client → Express app: HTTP requests
- Express app → Host access gate: checks host
- Express app → Filesystem routes: registers routes
- Express app → Config routes: registers routes
- Express app → Multipart upload: handles uploads
- Express app → Public media files: registers route
- Filesystem routes → List and stat: registers
- Filesystem routes → Image preview: registers
- Filesystem routes → Filesystem mutations: registers
- Filesystem routes → Download routes: registers
- List and stat → Root path mapping: resolves paths
- List and stat → Root and symlink safety: checks symlinks
- List and stat → Served files: reads metadata
- Image preview → Root path mapping: resolves paths
- Image preview → Served files: streams image
- Filesystem mutations → Root path mapping: resolves paths
- Filesystem mutations → Root and symlink safety: checks paths
- Filesystem mutations → Served files: changes entries
- Download routes → Root path mapping: resolves paths
- Download routes → Served files: streams file
- Multipart upload → Served files: writes uploaded files
- Multipart upload → Root path mapping: maps saved paths
- Public media files → Root path mapping: resolves paths
- Public media files → Served files: serves files
- Config routes → Persisted settings: reads and writes
- Root path mapping → Served files: constrains access