frontend/src/App.svelte

<script>
  import "toastify-js/src/toastify.css";
  import "gridjs/dist/theme/mermaid.css";
  import { Route, router } from "tinro";
  router.subscribe((routeInfo) => {
    window.scrollTo(0, 0);
  });
  if (config.prefersHashRouting) {
    if (config.prefersHashRouting === true) {
      router.useHashNavigation();
    }
  }
  import localForage from "localforage";
  import { addMessages, init, getLocaleFromNavigator } from "svelte-i18n";
  import en from "./locales/en.json";
  import de from "./locales/de.json";
  addMessages("en", en);
  addMessages("de", de);
  init({
    fallbackLocale: "en",
    initialLocale: getLocaleFromNavigator(),
  });
  localForage.config({
    name: "lfk_admin",
    version: 1.0,
    storeName: "lfk_admin",
    description: "LfK! admin dashbaord",
  });
  window.onunhandledrejection = (event) => {
    if (event.reason.toString() == "Error: Unauthorized") {
      console.log("Found 1");
      localForage.clear();
      location.replace("/");
    }
  };
  //
  import Login from "./components/auth/Login.svelte";
  import Dashboard from "./components/dashboard/Dashboard.svelte";
  import store from "./store.js";
  import ForgotPassword from "./components/auth/ForgotPassword.svelte";
  import MainDashContent from "./components/dashboard/MainDashContent.svelte";
  import Users from "./components/users/Users.svelte";
  import About from "./components/general/About.svelte";
  import Settings from "./components/settings/Settings.svelte";
  import Transition from "./components/base/Transition.svelte";
  import Orgs from "./components/orgs/Orgs.svelte";
  import Runners from "./components/runners/Runners.svelte";
  import Footer from "./components/general/Footer.svelte";
  import TracksOverview from "./components/tracks/TracksOverview.svelte";
  import OrgDetail from "./components/orgs/OrgDetail.svelte";
  import Teams from "./components/teams/Teams.svelte";
  import { OpenAPI } from "@odit/lfk-client-js";
  import UserDetail from "./components/users/UserDetail.svelte";
  OpenAPI.BASE = config.baseurl;
  import TeamDetail from "./components/teams/TeamDetail.svelte";
  import UserPermissions from "./components/users/UserPermissions.svelte";
  import GroupPermissions from "./components/groups/GroupPermissions.svelte";
  import RunnerDetail from "./components/runners/RunnerDetail.svelte";
  import Imprint from "./components/general/Imprint.svelte";
  import Privacy from "./components/general/Privacy.svelte";
  import ResetPassword from "./components/auth/ResetPassword.svelte";
  import Contacts from "./components/contacts/Contacts.svelte";
  import ContactDetail from "./components/contacts/ContactDetail.svelte";
  import Donors from "./components/donors/Donors.svelte";
  import Groups from "./components/groups/Groups.svelte";
  import DonorDetail from "./components/donors/DonorDetail.svelte";
  import Donations from "./components/donations/Donations.svelte";
  import DonationDetail from "./components/donations/DonationDetail.svelte";
  import GroupDetail from "./components/groups/GroupDetail.svelte";
  import ScanStations from "./components/scanstations/ScanStations.svelte";
  import ScanStationDetail from "./components/scanstations/ScanStationDetail.svelte";
  import Scans from "./components/scans/Scans.svelte";
  import ScanDetail from "./components/scans/ScanDetail.svelte";
  import Cards from "./components/cards/Cards.svelte";
	import StatsClients from "./components/statsclients/StatsClients.svelte";
	import StatsClientDetail from "./components/statsclients/StatsClientDetail.svelte";
  store.init();
</script>

<Route>
  {#if $router.path === '/forgot_password'}
    <Route path="/forgot_password">
      <ForgotPassword />
    </Route>
  {:else if $router.path.includes('/reset')}
    <Route path="/reset/:resetkey" let:params>
      <ResetPassword {params} />
    </Route>
  {:else if $router.path === '/about'}
    <Route path="/about">
      <About />
    </Route>
  {:else if $router.path === '/imprint'}
    <Route path="/imprint">
      <Imprint />
    </Route>
  {:else if $router.path === '/privacy'}
    <Route path="/privacy">
      <Privacy />
    </Route>
  {:else if $store.isLoggedIn}
    <Dashboard>
      <Transition>
        <Route path="/">
          <MainDashContent />
        </Route>
        <Route path="/users/*">
          <Route path="/">
            <Users />
          </Route>
          <Route path="/:userid/*" let:params>
            <Route path="/">
              <UserDetail {params} />
            </Route>
            <Route path="/permissions/">
              <UserPermissions {params} />
            </Route>
          </Route>
        </Route>
        <Route path="/groups/*">
          <Route path="/">
            <Groups />
          </Route>
          <Route path="/:groupid/*" let:params>
            <Route path="/">
              <GroupDetail {params} />
            </Route>
            <Route path="/permissions/">
              <GroupPermissions {params} />
            </Route>
          </Route>
        </Route>
        <Route path="/tracks/*">
          <Route path="/">
            <TracksOverview />
          </Route>
          <Route path="/:trackid" let:params />
        </Route>
        <Route path="/runners/*">
          <Route path="/">
            <Runners />
          </Route>
          <Route path="/:runnerid" let:params>
            <RunnerDetail {params} />
          </Route>
        </Route>
        <Route path="/teams/*">
          <Route path="/">
            <Teams />
          </Route>
          <Route path="/:teamid" let:params>
            <TeamDetail {params} />
          </Route>
        </Route>
        <Route path="/contacts/*">
          <Route path="/">
            <Contacts />
          </Route>
          <Route path="/:contact" let:params>
            <ContactDetail {params} />
          </Route>
        </Route>
        <Route path="/orgs/*">
          <Route path="/">
            <Orgs />
          </Route>
          <Route path="/:orgid" let:params>
            <OrgDetail {params} />
          </Route>
        </Route>
        <Route path="/donors/*">
          <Route path="/">
            <Donors />
          </Route>
          <Route path="/:donorid" let:params>
            <DonorDetail {params} />
          </Route>
        </Route>
        <Route path="/donations/*">
          <Route path="/">
            <Donations />
          </Route>
          <Route path="/:donationid" let:params>
            <DonationDetail {params} />
          </Route>
        </Route>
        <Route path="/cards/*">
          <Route path="/">
            <Cards />
          </Route>
          <!-- <Route path="/:scanid" let:params>
            <ScanDetail {params} />
          </Route> -->
        </Route>
        <Route path="/scans/*">
          <Route path="/">
            <Scans />
          </Route>
          <Route path="/:scanid" let:params>
            <ScanDetail {params} />
          </Route>
        </Route>
        <Route path="/scanstations/*">
          <Route path="/">
            <ScanStations />
          </Route>
          <Route path="/:stationid" let:params>
            <ScanStationDetail {params} />
          </Route>
        </Route>
        <Route path="/statsclients/*">
          <Route path="/">
            <StatsClients />
          </Route>
          <Route path="/:clientid" let:params>
            <StatsClientDetail {params} />
          </Route>
        </Route>
        <Route path="/about">
          <About />
        </Route>
        <Route path="/settings">
          <Settings />
        </Route>
      </Transition>
      <Footer />
    </Dashboard>
  {:else}
    <Login />
  {/if}
</Route>