callback.astro

---
import Layout from '../components/Layout.astro';
---

<Layout title="Signing in…">
  <h1>Signing in…</h1>
  <p id="status" class="muted">Completing sign-in with Cognito.</p>
  <p id="error" class="error" hidden></p>
  <a id="retry" class="button" href="/" hidden>Back to sign in</a>
</Layout>

<script>
  import { completeSignIn, CallbackError, TokenExchangeError } from '../lib/auth';
  import { loadAuthConfig, ConfigError } from '../lib/config';
  import { storeSession } from '../lib/session';

  const statusEl = document.getElementById('status') as HTMLParagraphElement;
  const errorEl = document.getElementById('error') as HTMLParagraphElement;
  const retryEl = document.getElementById('retry') as HTMLAnchorElement;

  function fail(message: string): void {
    statusEl.hidden = true;
    errorEl.textContent = message;
    errorEl.hidden = false;
    retryEl.hidden = false;
  }

  (async () => {
    try {
      const config = loadAuthConfig();
      const tokens = await completeSignIn(config, window.location.href);
      storeSession(tokens);
      window.location.assign('/dashboard');
    } catch (error) {
      if (error instanceof ConfigError) {
        fail(`This deployment isn't configured yet: ${error.message}`);
      } else if (error instanceof CallbackError || error instanceof TokenExchangeError) {
        fail(error.message);
      } else {
        fail(error instanceof Error ? error.message : 'Sign-in failed.');
      }
    }
  })();
</script>