<script lang="ts">
  // The Mini App launch failed to authenticate after its silent retries (e.g. the backend was
  // briefly down during a deploy). Inside a Mini App (Telegram or VK) there is no web login to fall
  // back to, so this terminal screen offers a manual Retry that re-runs the launch (app.svelte
  // retryMiniAppBoot).
  import { retryMiniAppBoot } from '../lib/app.svelte';
  import { t } from '../lib/i18n/index.svelte';

  let retrying = $state(false);
  async function retry(): Promise<void> {
    if (retrying) return;
    retrying = true;
    try {
      await retryMiniAppBoot();
    } finally {
      retrying = false;
    }
  }
</script>

<div class="boot">
  <div class="card">
    <h1>{t('boot.errorTitle')}</h1>
    <p class="msg">{t('boot.errorBody')}</p>
    <button class="retry" onclick={retry} disabled={retrying}>{t('common.retry')}</button>
  </div>
</div>

<style>
  .boot {
    height: 100%;
    display: grid;
    place-items: center;
    padding: 24px;
    background: var(--bg);
  }
  .card {
    max-width: 28rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    text-align: center;
    color: var(--text);
  }
  h1 {
    margin: 0;
    font-size: 1.25rem;
  }
  .msg {
    margin: 0;
    color: var(--text-muted);
  }
  .retry {
    padding: 9px 16px;
    border: 1px solid var(--accent);
    background: var(--accent);
    color: var(--accent-text);
    border-radius: var(--radius-sm);
  }
  .retry:disabled {
    opacity: 0.5;
  }
</style>
