feat(frontend): add header, filter bar, and sorting store for files page

- sorting.ts: per-section sort store (sort field + order) persisted to localStorage
- dsl.ts: build/parse DSL filter strings ({t=uuid,&,|,!,...})
- Header.svelte: sort dropdown, asc/desc toggle, filter toggle button
- FilterBar.svelte: tag token picker with operator buttons, search, apply/reset
- files/+page.svelte: wired header + filter bar, resets pagination on sort/filter change
- vite-mock-plugin.ts: added 5 mock tags for filter bar development

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-04-05 12:47:18 +03:00
parent e72d4822e9
commit 27d8215a0a
6 changed files with 544 additions and 6 deletions
+44
View File
@@ -0,0 +1,44 @@
import { writable } from 'svelte/store';
import { browser } from '$app/environment';
export type FileSortField = 'content_datetime' | 'created' | 'original_name' | 'mime';
export type TagSortField = 'name' | 'color' | 'category_name' | 'created';
export type SortOrder = 'asc' | 'desc';
export interface SortState<F extends string> {
sort: F;
order: SortOrder;
}
function makeSortStore<F extends string>(key: string, defaults: SortState<F>) {
const stored = browser ? localStorage.getItem(key) : null;
const initial: SortState<F> = stored ? (JSON.parse(stored) as SortState<F>) : defaults;
const store = writable<SortState<F>>(initial);
store.subscribe((v) => {
if (browser) localStorage.setItem(key, JSON.stringify(v));
});
return {
subscribe: store.subscribe,
setSort(sort: F) {
store.update((s) => ({ ...s, sort }));
},
setOrder(order: SortOrder) {
store.update((s) => ({ ...s, order }));
},
toggleOrder() {
store.update((s) => ({ ...s, order: s.order === 'asc' ? 'desc' : 'asc' }));
},
};
}
export const fileSorting = makeSortStore<FileSortField>('sort:files', {
sort: 'created',
order: 'desc',
});
export const tagSorting = makeSortStore<TagSortField>('sort:tags', {
sort: 'created',
order: 'desc',
});