chore: server-and-serverless template

apps/app/src/pages/SignupPage.tsx

@@ -0,0 +1,61 @@
+import { Anchor } from '@pikku/mantine/core'
+import { Link, useNavigate } from '@tanstack/react-router'
+import { useState, type FormEvent } from 'react'
+import type { I18nString } from '@pikku/react'
+import { m } from '@/i18n/messages'
+import { useLocale } from '@/i18n/config'
+import { AuthCard } from '@/components/AuthCard'
+import { EMAIL_IN_USE, registerWithPassword } from '@/lib/auth'
+
+export function SignupPage() {
+  useLocale()
+  const navigate = useNavigate()
+  const [email, setEmail] = useState('')
+  const [password, setPassword] = useState('')
+  const [busy, setBusy] = useState(false)
+  const [error, setError] = useState<I18nString | null>(null)
+
+  const handleSubmit = async (event: FormEvent<HTMLFormElement>) => {
+    event.preventDefault()
+    setBusy(true)
+    setError(null)
+
+    try {
+      await registerWithPassword(email, password, { redirectPath: '/app' })
+      await navigate({ to: '/app' })
+    } catch (err) {
+      setError(
+        err instanceof Error && err.message === EMAIL_IN_USE
+          ? m.auth__signup__email_in_use()
+          : m.auth__signup__error(),
+      )
+    } finally {
+      setBusy(false)
+    }
+  }
+
+  return (
+    <AuthCard
+      title={m.auth__signup__title()}
+      description={m.auth__signup__description()}
+      cta={m.auth__signup__cta()}
+      email={email}
+      password={password}
+      passwordAutoComplete="new-password"
+      busy={busy}
+      message={null}
+      error={error}
+      onEmailChange={setEmail}
+      onPasswordChange={setPassword}
+      onSubmit={handleSubmit}
+      footer={
+        <>
+          {m.auth__signup__footer_prompt()}{' '}
+          <Anchor component={Link} to="/login">
+            {m.auth__signup__footer_action()}
+          </Anchor>
+        </>
+      }
+    />
+  )
+}