65 lines
1.7 KiB
Svelte
65 lines
1.7 KiB
Svelte
<script lang="ts">
|
|
import "./layout.css";
|
|
import { ModeWatcher } from "mode-watcher";
|
|
import { onMount } from "svelte";
|
|
import { goto } from "$app/navigation";
|
|
import { base } from "$app/paths";
|
|
import { page } from "$app/state";
|
|
import favicon from "$lib/assets/favicon.svg";
|
|
import AppSidebar from "$lib/components/app-sidebar.svelte";
|
|
import BottomNav from "$lib/components/bottom-nav.svelte";
|
|
import { Toaster } from "$lib/components/ui/sonner";
|
|
import * as Tooltip from "$lib/components/ui/tooltip";
|
|
import { gateway } from "$lib/gateway.svelte";
|
|
import { session } from "$lib/session.svelte";
|
|
|
|
let { children } = $props();
|
|
|
|
const isLogin = $derived(page.url.pathname === `${base}/login`);
|
|
|
|
onMount(() => {
|
|
session.check();
|
|
});
|
|
|
|
$effect(() => {
|
|
if (!session.ready) {
|
|
return;
|
|
}
|
|
if (!(session.user || isLogin)) {
|
|
goto(`${base}/login`);
|
|
} else if (session.user && isLogin) {
|
|
goto(`${base}/`);
|
|
}
|
|
});
|
|
|
|
$effect(() => {
|
|
if (session.client) {
|
|
gateway.start();
|
|
return () => gateway.stop();
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<svelte:head><link href={favicon} rel="icon"></svelte:head>
|
|
|
|
<ModeWatcher />
|
|
<Toaster position="bottom-right" richColors />
|
|
|
|
<Tooltip.Provider delayDuration={300}>
|
|
{#if isLogin}
|
|
{@render children()}
|
|
{:else if session.ready && session.user}
|
|
<div class="flex h-dvh flex-col overflow-hidden sm:flex-row">
|
|
<AppSidebar />
|
|
<main class="flex min-w-0 flex-1 flex-col overflow-hidden">
|
|
{@render children()}
|
|
</main>
|
|
<BottomNav />
|
|
</div>
|
|
{:else if session.ready && session.error}
|
|
<div class="flex h-dvh items-center justify-center p-6 text-sm">
|
|
<p class="text-destructive">{session.error}</p>
|
|
</div>
|
|
{/if}
|
|
</Tooltip.Provider>
|