<script lang="ts">
  import { onMount } from "svelte";
  import { api, UnauthenticatedError } from "./lib/api.js";
  import { me, authChecked } from "./lib/stores.js";
  import type { MeResponse } from "./lib/types.js";
  import LoginView from "./lib/LoginView.svelte";
  import BrowserShell from "./lib/BrowserShell.svelte";
  import Toasts from "./lib/Toasts.svelte";

  onMount(async () => {
    try {
      me.set(await api<MeResponse>("/database/api/me"));
    } catch (e) {
      if (!(e instanceof UnauthenticatedError)) console.error(e);
      me.set(null);
    } finally {
      authChecked.set(true);
    }
  });
</script>

{#if !$authChecked}
  <div class="flex h-full items-center justify-center text-ink-3">加载中…</div>
{:else if $me}
  <BrowserShell />
{:else}
  <LoginView />
{/if}

<Toasts />
