<script>
  import { page } from '$app/state';
  let s = $derived(page.data.session);
</script>

{@debug s}

<h1>SvelteKit Auth Example</h1>
<div>
  {#if page.data.session}
    {#if page.data.session.user?.image}
      <img
        src={page.data.session.user.image}
        class="avatar"
        alt="User Avatar"
      />
    {/if}
    <span>
      <small>Signed in as</small><br />
      <strong>{page.data.session.user?.name ?? 'User'}</strong>
    </span>
    <!-- <div slot="submitButton" class="buttonPrimary">Sign out</div> -->
  {:else}
    <span class="notSignedInText">You are not signed in</span>
  {/if}
</div>
