perf(files): resolve breadcrumbs from a name cache, not N getFolder calls

Every navigation rebuilt the breadcrumb with one `GET /api/folders/{id}` per path
segment (a depth-D folder = D requests, each no-store) purely to label the trail.

Add an id→name cache, populated wherever a name is already known:
- every listing names its children, so `cacheFolder` records them, and
- `getFolder` records the folder it fetched.

`buildCrumbs` now reads names from the cache and only fetches the ids it hasn't
seen. During normal step-by-step navigation each ancestor was named by its
parent's listing, so the breadcrumb resolves with ZERO extra requests; only a
cold deep-link fetches its unknown ancestors (still in parallel). Folder renames
update the cache immediately so the trail stays correct.

The cache is a small LRU (cap 1000 — names are tiny) and is independent of the
listing cache (names survive a listing invalidation).

Validated: 3 new unit tests (listing populates child names, getFolder records,
rename overwrites) → 46 frontend tests green; npm run check; headless render of
the real files route (list + grid) — no errors.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01M8Vb9QHmLZnEMzHz7MrFy6
This commit is contained in:
Claude
2026-06-19 16:12:20 +00:00
parent 3125c866c7
commit afbc0ba515
3 changed files with 83 additions and 12 deletions
+35 -1
View File
@@ -2,12 +2,16 @@ import { describe, it, expect, vi, beforeEach } from 'vitest';
vi.mock('$lib/api/client', () => ({ apiFetch: vi.fn(), apiJson: vi.fn() }));
import { apiFetch } from '$lib/api/client';
import { apiFetch, apiJson } from '$lib/api/client';
import type { FolderItem } from '$lib/api/types';
import {
fetchFolderListing,
getCachedFolder,
cacheFolder,
invalidateFolderCache,
getFolder,
getFolderName,
rememberFolderName,
type FolderListing
} from './folders';
@@ -106,3 +110,33 @@ describe('folder listing cache (LRU + invalidation)', () => {
expect(getCachedFolder('b')).toBeUndefined();
});
});
describe('folder name cache (breadcrumbs)', () => {
const folder = (id: string, name: string): FolderItem => ({ id, name }) as unknown as FolderItem;
it("learns its children's names from a cached listing", () => {
cacheFolder('nc-parent', {
folders: [folder('nc-a', 'Alpha'), folder('nc-b', 'Beta')],
files: [],
favoriteIds: [],
sharedIds: []
});
expect(getFolderName('nc-a')).toBe('Alpha');
expect(getFolderName('nc-b')).toBe('Beta');
expect(getFolderName('nc-unknown')).toBeUndefined();
});
it('records the name fetched by getFolder', async () => {
vi.mocked(apiJson).mockResolvedValue(folder('gf-1', 'Reports') as never);
const f = await getFolder('gf-1');
expect(f.name).toBe('Reports');
expect(getFolderName('gf-1')).toBe('Reports');
});
it('rememberFolderName overwrites a stale name (e.g. after a rename)', () => {
rememberFolderName('rn-1', 'Old');
expect(getFolderName('rn-1')).toBe('Old');
rememberFolderName('rn-1', 'New');
expect(getFolderName('rn-1')).toBe('New');
});
});