<script>
    import { onMount } from 'svelte';
    import { routes, fallback } from '../../utils/routes.js';
    import { path } from '../../utils/stores.js';

    const navigate = (to) => {
      history.pushState({}, '', to);
      path.set(to);
    }

    window.addEventListener('popstate', () => {
      path.set(window.location.pathname);
    });

    let component;
    const unsubscribe = path.subscribe(current => {
      component = routes[current] !== undefined ? routes[current].component : fallback;
    });

    onMount(() => () => unsubscribe());

  </script>

  <svelte:component this={component} />
