<script lang="ts">
  import Header from './components/Header.svelte';
  import Welkom from './pages/Welkom.svelte';
  import Bekijken from './pages/Bekijken.svelte';
  import { onMount } from 'svelte';
  import { base, initializeBase } from './stores/basestore';
  import { fetchIsUserLoggedIn } from './stores/authstore';
  import { Route, Router } from 'svelte-routing';
  import { PATHS } from './config/paths';

  initializeBase();

  onMount(async () => {
    await fetchIsUserLoggedIn();
  });
</script>

<div class="container">
  <Header/>
  <Router>
    <Route component={Welkom} path="{$base}{PATHS.WELKOM}" />
    <Route component={Bekijken} path="{$base}{PATHS.BEKIJKEN}" />
  </Router>
</div>

<style>
  div.container {
    width: 740px;
  }
</style>
