Files
TasGrid/src/App.tsx
T

63 lines
2.6 KiB
TypeScript

import { type Component, createSignal, Show, onMount, onCleanup, lazy, Suspense } from 'solid-js';
import { Layout } from './components/Layout';
import { CriticalView } from './views/CriticalView';
import { AuthCallback } from './components/Auth';
import { pb } from './lib/pocketbase';
import { initStore } from './store';
// const CriticalView = lazy(() => import('./views/CriticalView').then(m => ({ default: m.CriticalView })));
const UrgencyView = lazy(() => import('./views/UrgencyView').then(m => ({ default: m.UrgencyView })));
const PriorityView = lazy(() => import('./views/PriorityView').then(m => ({ default: m.PriorityView })));
const MatrixView = lazy(() => import('./views/MatrixView').then(m => ({ default: m.MatrixView })));
const SettingsView = lazy(() => import('./views/SettingsView').then(m => ({ default: m.SettingsView })));
const App: Component = () => {
// Basic routing state
const [currentView, setCurrentView] = createSignal("critical");
const [isAuthenticated, setIsAuthenticated] = createSignal(pb.authStore.isValid);
onMount(() => {
const removeListener = pb.authStore.onChange((token) => {
setIsAuthenticated(!!token);
if (token) {
initStore();
}
}, true);
onCleanup(() => removeListener());
// Background preload of other views when idle
const idleCallback = (window as any).requestIdleCallback || ((cb: any) => setTimeout(cb, 1000));
idleCallback(() => {
// CriticalView is now static
import('./views/UrgencyView');
import('./views/PriorityView');
import('./views/MatrixView');
import('./views/SettingsView');
// Remove splash screen after high priority work is done
const splash = document.getElementById('splash');
if (splash) {
splash.style.opacity = '0';
setTimeout(() => splash.remove(), 500);
}
});
});
return (
<Show when={isAuthenticated()} fallback={<AuthCallback onSuccess={() => { }} />}>
<Layout currentView={currentView()} setView={setCurrentView}>
<Suspense fallback={<div class="flex items-center justify-center h-full"><div class="animate-spin rounded-full h-8 w-8 border-b-2 border-primary"></div></div>}>
<Show when={currentView() === "critical"}><CriticalView /></Show>
<Show when={currentView() === "urgency"}><UrgencyView /></Show>
<Show when={currentView() === "priority"}><PriorityView /></Show>
<Show when={currentView() === "matrix"}><MatrixView /></Show>
<Show when={currentView() === "settings"}><SettingsView /></Show>
</Suspense>
</Layout>
</Show>
);
};
export default App;