stufflog3/frontend/src/routes/__layout.svelte

<script lang="ts" context="module">
  import type { Load } from "@sveltejs/kit/types/internal";
  import { Auth, Amplify } from "aws-amplify";
  import backgroundImage from "$lib/assets/background.jpg";

  Amplify.configure({
    Auth: {
      region: import.meta.env.VITE_STUFFLOG3_AWS_POOL_REGION,
      userPoolId: import.meta.env.VITE_STUFFLOG3_AWS_POOL_ID,
      userPoolWebClientId: import.meta.env.VITE_STUFFLOG3_AWS_POOL_PUBLIC_CLIENT_ID,
    },
    ssr: false,
  });
  
  export const load: Load = async({ url }) => {
    let idToken: string | null = null;

    try {
      const sess = await Auth.currentSession();
      idToken = sess?.getIdToken()?.getJwtToken();
    } catch(err) {
      console.warn(err);
    }

    if (idToken == null && !url.pathname.startsWith("/login")) {
      return { status: 302, redirect: "/login" };
    }

    return { props: {}, stuff: { idToken } };
	}

  export const ssr = false;
</script>

<script lang="ts">
  import { page } from "$app/stores";
  
  import Background from "$lib/components/layout/Background.svelte"
  import TimeContext from "$lib/components/contexts/TimeContext.svelte";
  import ModalContext from "$lib/components/contexts/ModalContext.svelte";

  let opacity = 0.175;
  
  $: opacity = $page.url.pathname === "/" ? 0.3 : 0.2;

  export const ssr = false;
</script>

<ModalContext>
  <TimeContext>
    <Background src={backgroundImage} initialOrientation="landscape" opacity={opacity} />
    <slot></slot>
  </TimeContext>
</ModalContext>