Changes

src/components/admin/App.svelte

@@ -0,0 +1,28 @@
+<script lang="ts">
+  import type {ConditionsFailedEvent, RouteDefinition} from "svelte-spa-router";
+  import wrap from "svelte-spa-router/wrap";
+  import Router, {replace} from "svelte-spa-router";
+  import {get} from "svelte/store";
+  import {tokenStore} from "./repo/repo.js";
+
+  const routes: RouteDefinition = {
+    '/': wrap({asyncComponent: () => import('./pages/Home.svelte'), conditions: detail => get(tokenStore) != ""}),
+    '/perms': wrap({asyncComponent: () => import('./pages/Perms.svelte'), conditions: detail => get(tokenStore) != ""}),
+    '/login': wrap({asyncComponent: () => import('./pages/Login.svelte'), conditions: detail => get(tokenStore) == ""}),
+    '/event/:id': wrap({asyncComponent: () => import('./pages/Event.svelte'), conditions: detail => get(tokenStore) != ""}),
+    '/event/:id/generate': wrap({asyncComponent: () => import('./pages/Generate.svelte'), conditions: detail => get(tokenStore) != ""}),
+    '*': wrap({asyncComponent: () => import('./pages/NotFound.svelte')})
+  }
+
+  function conditionsFailed(event: ConditionsFailedEvent) {
+    if(event.detail.location === "/login") {
+      replace("/")
+    } else {
+      replace("/login")
+    }
+  }
+</script>
+
+<main class="dark:bg-gray-900 min-w-full min-h-screen text-gray-900 dark:text-gray-300">
+  <Router {routes} on:conditionsFailed={conditionsFailed} />
+</main>