<script lang="ts">
  import { beforeNavigate, afterNavigate } from '$app/navigation';
  import { page } from '$app/state';
  import AdminShell from '$lib/components/AdminShell.svelte';
  import ClientShell from '$lib/components/ClientShell.svelte';
  import Toast from '$lib/components/Toast.svelte';
  import { toast } from '$lib/toast';

  let { children } = $props();

  const isAdminRoute = $derived(page.url.pathname === '/admin' || page.url.pathname.startsWith('/admin/'));
  const isPrintableRoute = $derived(page.url.pathname.startsWith('/mix-calculator/') && page.url.pathname.endsWith('/print'));

  let navToastId: string | null = null;
  let navTimer: ReturnType<typeof setTimeout> | null = null;

  beforeNavigate(() => {
    navTimer = setTimeout(() => {
      navToastId = toast.loading('Loading…');
      navTimer = null;
    }, 150);
  });

  afterNavigate(() => {
    if (navTimer !== null) {
      clearTimeout(navTimer);
      navTimer = null;
    }
    if (navToastId) {
      toast.dismiss(navToastId);
      navToastId = null;
    }
  });
</script>

{#if isPrintableRoute}
  {@render children()}
{:else if isAdminRoute}
  <AdminShell>
    {@render children()}
  </AdminShell>
{:else}
  <ClientShell>
    {@render children()}
  </ClientShell>
{/if}

<Toast />
