refactor: code review improvements — fix bugs, extract shared utilities, add README

- Fix reactivity bug: use SvelteMap instead of Map in sessions store
- Fix theme listener memory leak: guard against double-init, return cleanup function
- Fix transport singleton ignoring different endpoints
- Fix form/button type mismatch in MessageInput
- Add safer retry validation in chat page
- Extract shared utilities: date formatting, session config check, result source config
- Extract shared components: Backdrop, PageHeader
- Extract orchestration composable from chat page (310→85 lines of script)
- Consolidate AuditTimeline switch functions into config record
- Move sample data to dedicated module
- Add dark mode support for LineageTree SVG colors
- Memoize leaf count computation in LineageTree
- Update README with usage guide and project structure

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
shahondin1624
2026-03-12 13:48:06 +01:00
parent bb0eebff1b
commit 38f5f31b92
26 changed files with 753 additions and 579 deletions

View File

@@ -5,6 +5,9 @@ const STORAGE_KEY = 'llm-multiverse-theme';
function createThemeStore() {
let mode: ThemeMode = $state('system');
let resolvedDark = $state(false);
let initialized = false;
let mediaQuery: MediaQueryList | null = null;
let mediaListener: ((e: MediaQueryListEvent) => void) | null = null;
function applyTheme(isDark: boolean) {
if (typeof document === 'undefined') return;
@@ -27,8 +30,10 @@ function createThemeStore() {
return window.matchMedia('(prefers-color-scheme: dark)').matches;
}
function init() {
function init(): (() => void) | undefined {
if (typeof window === 'undefined') return;
if (initialized) return;
initialized = true;
// Load saved preference
const saved = localStorage.getItem(STORAGE_KEY) as ThemeMode | null;
@@ -39,18 +44,26 @@ function createThemeStore() {
}
// Listen for system preference changes
const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
mediaQuery.addEventListener('change', (e) => {
mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
mediaListener = (e: MediaQueryListEvent) => {
if (mode === 'system') {
resolvedDark = e.matches;
applyTheme(resolvedDark);
}
});
};
mediaQuery.addEventListener('change', mediaListener);
// Apply initial theme
resolvedDark =
mode === 'dark' ? true : mode === 'light' ? false : getSystemPreference();
applyTheme(resolvedDark);
return () => {
if (mediaQuery && mediaListener) {
mediaQuery.removeEventListener('change', mediaListener);
}
initialized = false;
};
}
function setMode(newMode: ThemeMode) {