this repo has no description
1<script lang="ts">
2 import { _ } from '../../lib/i18n'
3
4 interface Props {
5 email: string
6 token: string
7 loading: boolean
8 error: string | null
9 onTokenChange: (token: string) => void
10 onSubmit: (e: Event) => void
11 onResend: () => void
12 }
13
14 let {
15 email,
16 token,
17 loading,
18 error,
19 onTokenChange,
20 onSubmit,
21 onResend,
22 }: Props = $props()
23</script>
24
25<div class="step-content">
26 <h2>{$_('migration.inbound.emailVerify.title')}</h2>
27 <p>{@html $_('migration.inbound.emailVerify.desc', { values: { email: `<strong>${email}</strong>` } })}</p>
28
29 <div class="info-box">
30 <p>
31 {$_('migration.inbound.emailVerify.hint')}
32 </p>
33 </div>
34
35 {#if error}
36 <div class="message error">
37 {error}
38 </div>
39 {/if}
40
41 <form onsubmit={onSubmit}>
42 <div class="field">
43 <label for="email-verify-token">{$_('migration.inbound.emailVerify.tokenLabel')}</label>
44 <input
45 id="email-verify-token"
46 type="text"
47 placeholder={$_('migration.inbound.emailVerify.tokenPlaceholder')}
48 value={token}
49 oninput={(e) => onTokenChange((e.target as HTMLInputElement).value)}
50 disabled={loading}
51 required
52 />
53 </div>
54
55 <div class="button-row">
56 <button type="button" class="ghost" onclick={onResend} disabled={loading}>
57 {$_('migration.inbound.emailVerify.resend')}
58 </button>
59 <button type="submit" disabled={loading || !token}>
60 {loading ? $_('common.verifying') : $_('common.verify')}
61 </button>
62 </div>
63 </form>
64</div>