Files
llink/js/src/App.tsx
T
2026-04-13 10:29:10 -07:00

92 lines
2.6 KiB
TypeScript

import { useEffect } from "react";
import { HashRouter, Routes, Route, useNavigate } from "react-router-dom";
import { TooltipProvider } from "@/components/ui/tooltip";
import { useAuthStore } from "@/stores/auth-store";
import { LoginPage } from "@/features/auth/login-page";
import {
QueryClient,
QueryClientProvider,
} from '@tanstack/react-query'
import SettingsPage from "@/features/settings-page";
import AudioVideoSettingsPage from "@/features/settings/audio-video-settings-page";
import NetworkSelector from "@/features/network-selector";
import NetworkRoot from "@/features/network-root";
import ParticleViewResolver from "@/features/particles/particle-view-resolver";
import Layout from "@/features/layout";
import NetworkSettingsPage from "@/features/network-settings";
import { Toaster } from "@/components/ui/sonner";
import { PusherProvider } from "@/lib/pusher-provider";
const queryClient = new QueryClient();
const App = () => {
const status = useAuthStore((s) => s.status);
const restoreSession = useAuthStore((s) => s.restoreSession);
useEffect(() => {
restoreSession();
}, [restoreSession]);
if (status === "idle" || status === "restoring") {
return (
<div className="flex min-h-screen items-center justify-center">
<p className="text-muted-foreground text-sm">Loading...</p>
</div>
);
}
if (status !== "authenticated") {
return <LoginPage />;
}
return (
<PusherProvider>
<AuthenticatedApp />
</PusherProvider>
);
};
function AutoplayNavigationListener() {
const navigate = useNavigate();
useEffect(() => {
return window.electronAutoplay.onNavigate((data) => {
navigate(`/${data.networkId}/${data.streamId}`);
});
}, [navigate]);
return null;
}
function AuthenticatedApp() {
return (
<HashRouter>
<AutoplayNavigationListener />
<Routes>
<Route path="settings" element={<SettingsPage />} />
<Route path="settings/audio-video" element={<AudioVideoSettingsPage />} />
<Route path="/">
<Route index element={<Layout><NetworkSelector /></Layout>} />
<Route path=":networkId">
<Route index element={<Layout><NetworkRoot /></Layout>} />
<Route path="settings" element={<NetworkSettingsPage />} />
<Route path="*" element={<ParticleViewResolver />} />
</Route>
</Route>
</Routes>
</HashRouter>
);
}
const AppWithProviders = () => (
<TooltipProvider>
<QueryClientProvider client={queryClient}>
<App />
<Toaster />
</QueryClientProvider>
</TooltipProvider>
);
export default AppWithProviders;