Something went wrong. Try again.
Client side atproto account migrator in your web browser, along with services for backups and adversarial migrations. pdsmoover.com
pds atproto migrations moo cow
Something went wrong. Try again.
2.8 kB · 73 lines
Svelte
at oauth
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374<script lang="ts"> import {isAuthFactorError} from '$lib/moover'; import Button from '$lib/components/ui/Button.svelte'; import ErrorMessage from '$lib/components/ui/ErrorMessage.svelte'; import HandleTypeaheadField from '$lib/components/ui/HandleTypeaheadField.svelte'; import InputField from '$lib/components/ui/InputField.svelte';
interface Props { /** * Signs in to the account's PDS with a password. Throw to surface the message here; a thrown * 2FA-required error reveals the 2FA field. */ onLogin: (handle: string, password: string, twoFactorCode: string | null) => Promise<void>; /** Sentence shown above the fields, e.g. what an app password is or where to make one. */ helpText?: string; /** Password field label. */ passwordLabel?: string; /** Submit button label. */ submitLabel?: string; }
let { onLogin, helpText = '', passwordLabel = 'App password', submitLabel = 'Sign in', }: Props = $props();
let handle = $state(''); let password = $state(''); let twoFactorCode = $state(''); let needsTwoFactor = $state(false); let busy = $state(false); let errorMessage: string | null = $state(null);
async function handleSubmit(event: SubmitEvent) { event.preventDefault(); busy = true; errorMessage = null; try { await onLogin(handle, password, needsTwoFactor ? twoFactorCode || null : null); } catch (error) { if (isAuthFactorError(error)) { needsTwoFactor = true; errorMessage = 'This account needs the 2FA code that was emailed to you. Enter it below.'; } else { errorMessage = error instanceof Error ? error.message : 'Could not sign in'; } } finally { busy = false; } }</script>
<form onsubmit={handleSubmit}> {#if helpText} <p class="text-left">{helpText}</p> {/if} <HandleTypeaheadField id="password-signin-handle" label="Current handle (or DID)" placeholder="alice.bsky.social" required autocomplete="username" bind:value={handle}/> <InputField id="password-signin-password" label={passwordLabel} type="password" autocomplete="current-password" required bind:value={password}/> {#if needsTwoFactor} <InputField id="password-signin-2fa" label="2FA from the email sent" autocomplete="one-time-code" bind:value={twoFactorCode}/> {/if} {#if errorMessage} <ErrorMessage>{errorMessage}</ErrorMessage> {/if} <div class="mb-3.75 text-left"> <Button type="submit" {busy}>{submitLabel}</Button> </div></form>