Files
backnotprop__plannotator/packages/ui/utils/fileBrowser.ts
Michael Ramos b675e8677c feat: markdown file browser sidebar tab (#378)
* feat: markdown file browser sidebar tab (#367)

Add a Files sidebar tab that lets users browse and annotate markdown
files from their project. The project root is shown automatically —
no configuration needed. Users can add extra directories in Settings.

- Server: new /api/reference/files endpoint scans directories for .md
  files with broad exclusion list (node_modules, .git, dist, etc.)
- Server: projectRoot sent in /api/plan response (plan + annotate)
- UI: FileBrowser component with per-directory collapsible sections
- UI: useFileBrowser hook manages multi-directory tree state
- UI: Files tab in sidebar (collapsed + expanded), between Versions
  and Vault
- UI: Settings integration tab for additional directories
- Wired into linked doc system for annotation support

Closes #367

For provenance purposes, this commit was AI assisted.

* fix: simplify file browser - compute activeDirPath, fix re-fetch bug, dedupe settings logic

- Compute activeDirPath from activeFile + dirs instead of storing as
  separate state (removes state setter hack that abused setDirs as a
  read accessor)
- Fix auto-fetch not detecting directory changes: compare loaded paths
  against configured dirs instead of checking dirs.length === 0
- Extract addDirectory() helper in Settings to eliminate copy-pasted
  trim-validate-add-clear logic
- Remove "what" comments that described obvious code

For provenance purposes, this commit was AI assisted.

* fix: file browser prefix match, settings reactivity, and vault→files routing

- Add trailing slash to activeDirPath startsWith check to prevent prefix collisions
- Spread uiPrefs in handleFileBrowserChange so React sees a new reference on each settings edit
- Clear vaultBrowser.activeFile when opening a file browser doc to prevent misrouted links

For provenance purposes, this commit was AI assisted.
2026-03-23 15:47:58 -07:00

41 lines
1.1 KiB
TypeScript

/**
* File Browser Settings
*
* Manages settings for the markdown file browser sidebar tab.
* Users add directories to browse; settings persist via cookies.
*/
import { storage } from './storage';
const STORAGE_KEY_ENABLED = 'plannotator-filebrowser-enabled';
const STORAGE_KEY_DIRS = 'plannotator-filebrowser-dirs';
export interface FileBrowserSettings {
enabled: boolean;
directories: string[];
}
export function getFileBrowserSettings(): FileBrowserSettings {
const dirsRaw = storage.getItem(STORAGE_KEY_DIRS);
let directories: string[] = [];
if (dirsRaw) {
try {
directories = JSON.parse(dirsRaw);
} catch { /* ignore corrupt cookie */ }
}
return {
enabled: storage.getItem(STORAGE_KEY_ENABLED) === 'true',
directories,
};
}
export function saveFileBrowserSettings(settings: FileBrowserSettings): void {
storage.setItem(STORAGE_KEY_ENABLED, String(settings.enabled));
storage.setItem(STORAGE_KEY_DIRS, JSON.stringify(settings.directories));
}
export function isFileBrowserEnabled(): boolean {
const settings = getFileBrowserSettings();
return settings.enabled && settings.directories.length > 0;
}