refactor(opensidian): consolidate state, eliminate duplication, and reorganize by concern

[braden-w]

Opensidian's single createFsState() factory was doing too much—creating the workspace infrastructure, managing UI reactive state, and proxying infra internals through its return object. Meanwhile, dialog components were instantiated per tree node (300+ instances for 100 files), tree traversal logic was duplicated across components, and path lookups were O(n) scans.

This PR splits the architecture into two clean layers, eliminates the duplication, and reorganizes files by concern.

Workspace vs. UI state separation

createFsState() previously owned both workspace creation (Yjs, extensions, filesystem) and Svelte reactive state (active file, open tabs, dialogs, focus). Now they're separate modules:

state/
  workspace.ts        ← Pure TypeScript. Creates workspace + filesystem. No Svelte.
  fs-state.svelte.ts  ← Svelte runes only. Imports workspace, owns UI state.

// workspace.ts — infrastructure, zero Svelte dependencies
export const ws = createWorkspace({
  id: 'opensidian',
  tables: { files: filesTable },
})
  .withExtension('persistence', indexeddbPersistence)
  .withWorkspaceExtension('sqliteIndex', createSqliteIndex());

export const fs = createYjsFileSystem(ws.tables.files, ws.documents.files.content);

// fs-state.svelte.ts — imports workspace, owns only reactive state
import { fs, ws } from '$lib/workspace';

function createFsState() {
  let version = $state(0);
  let activeFileId = $state<FileId | null>(null);
  // ... UI state only, no workspace creation
}

Components that need raw infra (Toolbar for sample data, ContentEditor for document handles) import workspace.ts directly instead of reaching through fsState.fs or fsState.documents.

Dialog consolidation

Before: 3 dialogs (Create, Rename, Delete) instantiated in both FileTreeItem and Toolbar—7 duplicate $state(false) declarations, 7 duplicate helper functions, and N×3 dialog instances (one set per tree node).

After: Dialog state lives in fsState, dialogs render once in AppShell, and context menu handlers are one-liners:

<!-- Before: FileTreeItem.svelte (101 lines) -->
<script>
  let createDialogOpen = $state(false);           // ← duplicated in Toolbar
  let createDialogMode = $state<'file' | 'folder'>('file');  // ← duplicated
  let renameDialogOpen = $state(false);           // ← duplicated
  let deleteDialogOpen = $state(false);           // ← duplicated

  function selectAndOpenCreate(mode) { ... }      // ← duplicated
  function selectAndOpenRename() { ... }          // ← duplicated
  function selectAndOpenDelete() { ... }          // ← duplicated
</script>
<CreateDialog bind:open={createDialogOpen} mode={createDialogMode} />
<RenameDialog bind:open={renameDialogOpen} />
<DeleteConfirmation bind:open={deleteDialogOpen} />

<!-- After: FileTreeItem.svelte (84 lines) -->
<ContextMenu.Item onclick={() => {
  fsState.actions.selectFile(id);
  fsState.actions.openCreate('file');
}}>
  New File
</ContextMenu.Item>

withErrorToast helper

Five actions had identical try/catch/toast.error/console.error blocks. Now they use a shared zone-3 helper:

// Before (repeated 5 times):
async createFile(parentId, name) {
  try {
    await fs.writeFile(path, '');
    toast.success(`Created ${path}`);
  } catch (err) {
    toast.error(err instanceof Error ? err.message : 'Failed to create file');
    console.error(err);
  }
}

// After:
async createFile(parentId, name) {
  await withErrorToast(async () => {
    await fs.writeFile(path, '');
    toast.success(`Created ${path}`);
  }, 'Failed to create file');
}

walkTree<T> generic traversal

FileTree and CommandPalette both had 15-20 line recursive tree walks with the same getChildIds→getRow→null-check→recurse pattern. Now they use a shared method:

// FileTree: 15 lines → 4
const visibleIds = $derived.by(() => {
  return fsState.walkTree<FileId>((id, row) => ({
    collect: id,
    descend: row.type === 'folder' && fsState.expandedIds.has(id),
  }));
});

// CommandPalette: 20 lines → 8
const allFiles = $derived.by(() => {
  if (!open) return [];
  return fsState.walkTree<FileEntry>((id, row) => {
    if (row.type === 'file') {
      const fullPath = fsState.getPathForId(id) ?? '';
      const lastSlash = fullPath.lastIndexOf('/');
      const parentDir = lastSlash > 0 ? fullPath.slice(1, lastSlash) : '';
      return { collect: { id, name: row.name, parentDir }, descend: false };
    }
    return { descend: true };
  });
});

O(1) path lookups

getPathForId(id) and selectedPath were iterating all paths linearly. Added a reverse idToPath map to createFileSystemIndex in @epicenter/filesystem:

// Before — O(n) per lookup:
for (const p of fs.index.allPaths()) {
  if (fs.index.getIdByPath(p) === id) return p;
}

// After — O(1):
return fs.index.getPathById(id) ?? null;

File reorganization

src/lib/
├── workspace.ts                        ← NEW: pure infra
├── state/
│   └── fs-state.svelte.ts              ← moved from fs/
├── utils/
│   └── file-icons.ts                   ← moved from fs/
└── components/
    ├── AppShell.svelte                 ← renders dialogs once
    ├── Toolbar.svelte
    ├── CommandPalette.svelte
    ├── tree/
    │   ├── FileTree.svelte
    │   └── FileTreeItem.svelte
    ├── editor/
    │   ├── ContentPanel.svelte
    │   ├── ContentEditor.svelte
    │   ├── CodeMirrorEditor.svelte
    │   ├── TabBar.svelte
    │   └── PathBreadcrumb.svelte
    └── dialogs/
        ├── CreateDialog.svelte
        ├── RenameDialog.svelte
        └── DeleteConfirmation.svelte

[github-actions]

Thank you for your contribution! Before we can merge this PR, we need you to sign our Contributor License Agreement. This is a one-time requirement—it lets us offer commercial licenses for the sync server while you retain full copyright on your code.

To sign, please comment on this PR with:

I have read the CLA Document and I hereby sign the CLA

---

I have read the CLA Document and I hereby sign the CLA

---

_{You can retrigger this bot by commenting recheck in this Pull Request. Posted by the CLA Assistant Lite bot.}