@rudderjs/auth 0.2.0 → 0.2.1

package/{pages/react/forgot-password/+Page.tsx → views/react/ForgotPassword.tsx}

@@ -1,7 +1,20 @@
 import '@/index.css'
 import { useState } from 'react'
 
-export default function ForgotPasswordPage() {
+// URL this view is served at — see Login.tsx for rationale.
+export const route = '/forgot-password'
+
+export interface ForgotPasswordProps {
+  submitUrl?:       string
+  loginUrl?:        string
+  resetPasswordUrl?: string
+}
+
+export default function ForgotPassword(props: ForgotPasswordProps) {
+  const submitUrl       = props.submitUrl       ?? '/api/auth/request-password-reset'
+  const loginUrl        = props.loginUrl        ?? '/login'
+  const resetPasswordUrl = props.resetPasswordUrl ?? '/reset-password'
+
   const [email, setEmail]     = useState('')
   const [error, setError]     = useState('')
   const [success, setSuccess] = useState('')
@@ -13,10 +26,10 @@ export default function ForgotPasswordPage() {
     setSuccess('')
     setLoading(true)
     try {
-      const res = await fetch('/api/auth/request-password-reset', {
+      const res = await fetch(submitUrl, {
         method:  'POST',
         headers: { 'Content-Type': 'application/json' },
-        body:    JSON.stringify({ email, redirectTo: '/reset-password' }),
+        body:    JSON.stringify({ email, redirectTo: resetPasswordUrl }),
       })
       if (res.ok) {
         setSuccess('If an account exists with that email, a password reset link has been sent.')
@@ -55,7 +68,7 @@ export default function ForgotPasswordPage() {
           </button>
           <p className="text-center text-sm text-gray-500">
             Remember your password?{' '}
-            <a href="/login" className="underline hover:text-black">Sign in</a>
+            <a href={loginUrl} className="underline hover:text-black">Sign in</a>
           </p>
         </form>
       </div>

package/{pages/react/login/+Page.tsx → views/react/Login.tsx}

@@ -2,7 +2,25 @@ import '@/index.css'
 import { useState } from 'react'
 import { navigate } from 'vike/client/router'
 
-export default function LoginPage() {
+// URL this view is served at — MUST match the controller route registered
+// by registerAuthRoutes() in the consumer project. If you override
+// `opts.paths.login` when calling registerAuthRoutes, update this too so
+// Vike's client router can SPA-navigate here instead of full-reloading.
+export const route = '/login'
+
+export interface LoginProps {
+  submitUrl?:        string
+  registerUrl?:      string
+  forgotPasswordUrl?: string
+  homeUrl?:          string
+}
+
+export default function Login(props: LoginProps) {
+  const submitUrl         = props.submitUrl         ?? '/api/auth/sign-in/email'
+  const registerUrl       = props.registerUrl       ?? '/register'
+  const forgotPasswordUrl = props.forgotPasswordUrl ?? '/forgot-password'
+  const homeUrl           = props.homeUrl           ?? '/'
+
   const [email, setEmail]       = useState('')
   const [password, setPassword] = useState('')
   const [error, setError]       = useState('')
@@ -12,7 +30,7 @@ export default function LoginPage() {
     e.preventDefault()
     setError('')
     setLoading(true)
-    const res = await fetch('/api/auth/sign-in/email', {
+    const res = await fetch(submitUrl, {
       method:  'POST',
       headers: { 'Content-Type': 'application/json' },
       body:    JSON.stringify({ email, password }),
@@ -20,7 +38,7 @@ export default function LoginPage() {
     if (res.ok) {
       const params = new URLSearchParams(window.location.search)
       const redirect = params.get('redirect')
-      await navigate(redirect && redirect.startsWith('/') ? redirect : '/')
+      await navigate(redirect && redirect.startsWith('/') ? redirect : homeUrl)
     } else {
       const body = await res.json().catch(() => ({})) as { message?: string }
       setError(body.message ?? 'Invalid email or password.')
@@ -59,10 +77,10 @@ export default function LoginPage() {
             className="w-full rounded-md bg-black px-4 py-2 text-sm font-medium text-white hover:bg-black/90 disabled:opacity-50">
             {loading ? 'Signing in…' : 'Sign in'}
           </button>
-          <p className="text-center text-sm text-gray-500">
-            Don't have an account?{' '}
-            <a href="/register" className="underline hover:text-black">Register</a>
-          </p>
+          <div className="flex items-center justify-between text-sm text-gray-500">
+            <a href={forgotPasswordUrl} className="underline hover:text-black">Forgot password?</a>
+            <a href={registerUrl} className="underline hover:text-black">Register</a>
+          </div>
         </form>
       </div>
     </div>

package/{pages/react/register/+Page.tsx → views/react/Register.tsx}

@@ -2,7 +2,20 @@ import '@/index.css'
 import { useState } from 'react'
 import { navigate } from 'vike/client/router'
 
-export default function RegisterPage() {
+// URL this view is served at — see Login.tsx for rationale.
+export const route = '/register'
+
+export interface RegisterProps {
+  submitUrl?: string
+  loginUrl?:  string
+  homeUrl?:   string
+}
+
+export default function Register(props: RegisterProps) {
+  const submitUrl = props.submitUrl ?? '/api/auth/sign-up/email'
+  const loginUrl  = props.loginUrl  ?? '/login'
+  const homeUrl   = props.homeUrl   ?? '/'
+
   const [name, setName]         = useState('')
   const [email, setEmail]       = useState('')
   const [password, setPassword] = useState('')
@@ -13,13 +26,13 @@ export default function RegisterPage() {
     e.preventDefault()
     setError('')
     setLoading(true)
-    const res = await fetch('/api/auth/sign-up/email', {
+    const res = await fetch(submitUrl, {
       method:  'POST',
       headers: { 'Content-Type': 'application/json' },
       body:    JSON.stringify({ name, email, password }),
     })
     if (res.ok) {
-      await navigate('/')
+      await navigate(homeUrl)
     } else {
       const body = await res.json().catch(() => ({})) as { message?: string }
       setError(body.message ?? 'Could not create account. Please try again.')
@@ -69,7 +82,7 @@ export default function RegisterPage() {
           </button>
           <p className="text-center text-sm text-gray-500">
             Already have an account?{' '}
-            <a href="/login" className="underline hover:text-black">Sign in</a>
+            <a href={loginUrl} className="underline hover:text-black">Sign in</a>
           </p>
         </form>
       </div>

package/{pages/react/reset-password/+Page.tsx → views/react/ResetPassword.tsx}

@@ -1,18 +1,33 @@
 import '@/index.css'
 import { useState, useEffect } from 'react'
 
-export default function ResetPasswordPage() {
+// URL this view is served at — see Login.tsx for rationale.
+export const route = '/reset-password'
+
+export interface ResetPasswordProps {
+  submitUrl?:        string
+  loginUrl?:         string
+  forgotPasswordUrl?: string
+}
+
+export default function ResetPassword(props: ResetPasswordProps) {
+  const submitUrl        = props.submitUrl        ?? '/api/auth/reset-password'
+  const loginUrl         = props.loginUrl         ?? '/login'
+  const forgotPasswordUrl = props.forgotPasswordUrl ?? '/forgot-password'
+
   const [password, setPassword]       = useState('')
   const [confirmPassword, setConfirm] = useState('')
   const [error, setError]             = useState('')
   const [success, setSuccess]         = useState('')
   const [loading, setLoading]         = useState(false)
   const [token, setToken]             = useState<string | null>(null)
+  const [email, setEmail]             = useState<string | null>(null)
   const [mounted, setMounted]         = useState(false)
 
   useEffect(() => {
     const params = new URLSearchParams(window.location.search)
     setToken(params.get('token'))
+    setEmail(params.get('email'))
     setMounted(true)
   }, [])
 
@@ -28,10 +43,10 @@ export default function ResetPasswordPage() {
 
     setLoading(true)
     try {
-      const res = await fetch('/api/auth/reset-password', {
+      const res = await fetch(submitUrl, {
         method:  'POST',
         headers: { 'Content-Type': 'application/json' },
-        body:    JSON.stringify({ token, newPassword: password }),
+        body:    JSON.stringify({ token, email, newPassword: password }),
       })
       if (res.ok) {
         setSuccess('Your password has been reset successfully.')
@@ -60,7 +75,7 @@ export default function ResetPasswordPage() {
           <div className="space-y-4 rounded-lg border p-6 shadow-sm">
             <p className="rounded-md bg-red-50 px-3 py-2 text-sm text-red-600">Missing reset token.</p>
             <p className="text-center text-sm text-gray-500">
-              <a href="/forgot-password" className="underline hover:text-black">Request a new reset link</a>
+              <a href={forgotPasswordUrl} className="underline hover:text-black">Request a new reset link</a>
             </p>
           </div>
         </div>
@@ -81,7 +96,7 @@ export default function ResetPasswordPage() {
             <div className="space-y-2">
               <p className="rounded-md bg-green-50 px-3 py-2 text-sm text-green-600">{success}</p>
               <p className="text-center text-sm text-gray-500">
-                <a href="/login" className="underline hover:text-black">Sign in</a>
+                <a href={loginUrl} className="underline hover:text-black">Sign in</a>
               </p>
             </div>
           )}

package/pages/react/login/+guard.ts

@@ -1,15 +0,0 @@
-import { redirect } from 'vike/abort'
-import type { GuardAsync } from 'vike/types'
-import type { BetterAuthInstance } from '@rudderjs/auth'
-
-export const guard: GuardAsync = async (pageContext): ReturnType<GuardAsync> => {
-  // import.meta.env.SSR is a Vite compile-time constant — tree-shaken from client bundle
-  if (!import.meta.env.SSR) return
-  const { app } = await import('@rudderjs/core')
-  const auth    = app().make<BetterAuthInstance>('auth')
-  const session = await auth.api.getSession({
-    headers: new Headers(pageContext.headers ?? {}),
-  })
-  // Already logged in — redirect to home
-  if (session?.user) throw redirect('/')
-}

package/pages/react/register/+guard.ts

@@ -1,15 +0,0 @@
-import { redirect } from 'vike/abort'
-import type { GuardAsync } from 'vike/types'
-import type { BetterAuthInstance } from '@rudderjs/auth'
-
-export const guard: GuardAsync = async (pageContext): ReturnType<GuardAsync> => {
-  // import.meta.env.SSR is a Vite compile-time constant — tree-shaken from client bundle
-  if (!import.meta.env.SSR) return
-  const { app } = await import('@rudderjs/core')
-  const auth    = app().make<BetterAuthInstance>('auth')
-  const session = await auth.api.getSession({
-    headers: new Headers(pageContext.headers ?? {}),
-  })
-  // Already registered and logged in — redirect to home
-  if (session?.user) throw redirect('/')
-}

package/pages/solid/forgot-password/+Page.tsx

@@ -1,62 +0,0 @@
-import '@/index.css'
-import { createSignal } from 'solid-js'
-
-export default function ForgotPasswordPage() {
-  const [email, setEmail]     = createSignal('')
-  const [error, setError]     = createSignal('')
-  const [success, setSuccess] = createSignal('')
-  const [loading, setLoading] = createSignal(false)
-
-  async function handleSubmit(e: Event) {
-    e.preventDefault()
-    setError('')
-    setSuccess('')
-    setLoading(true)
-    try {
-      const res = await fetch('/api/auth/request-password-reset', {
-        method:  'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body:    JSON.stringify({ email: email(), redirectTo: '/reset-password' }),
-      })
-      if (res.ok) {
-        setSuccess('If an account exists with that email, a password reset link has been sent.')
-      } else {
-        const body = await res.json().catch(() => ({})) as { message?: string }
-        setError(body.message ?? 'Something went wrong. Please try again.')
-      }
-    } catch {
-      setError('Something went wrong. Please try again.')
-    }
-    setLoading(false)
-  }
-
-  return (
-    <div class="flex min-h-svh items-center justify-center p-4">
-      <div class="w-full max-w-sm space-y-6">
-        <div class="text-center">
-          <h1 class="text-2xl font-bold">Forgot password</h1>
-          <p class="text-sm text-gray-500 mt-1">Enter your email to receive a reset link</p>
-        </div>
-        <form onSubmit={handleSubmit} class="space-y-4 rounded-lg border p-6 shadow-sm">
-          {error() && <p class="rounded-md bg-red-50 px-3 py-2 text-sm text-red-600">{error()}</p>}
-          {success() && <p class="rounded-md bg-green-50 px-3 py-2 text-sm text-green-600">{success()}</p>}
-          <div>
-            <label class="block text-sm font-medium mb-1" for="email">Email</label>
-            <input id="email" type="email" placeholder="you@example.com"
-              value={email()} onInput={e => setEmail(e.currentTarget.value)}
-              required autocomplete="email"
-              class="w-full rounded-md border px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-black" />
-          </div>
-          <button type="submit" disabled={loading()}
-            class="w-full rounded-md bg-black px-4 py-2 text-sm font-medium text-white hover:bg-black/90 disabled:opacity-50">
-            {loading() ? 'Sending...' : 'Send reset link'}
-          </button>
-          <p class="text-center text-sm text-gray-500">
-            Remember your password?{' '}
-            <a href="/login" class="underline hover:text-black">Sign in</a>
-          </p>
-        </form>
-      </div>
-    </div>
-  )
-}

package/pages/solid/login/+Page.tsx

@@ -1,66 +0,0 @@
-import '@/index.css'
-import { createSignal } from 'solid-js'
-import { navigate } from 'vike/client/router'
-
-export default function LoginPage() {
-  const [email, setEmail]       = createSignal('')
-  const [password, setPassword] = createSignal('')
-  const [error, setError]       = createSignal('')
-  const [loading, setLoading]   = createSignal(false)
-
-  async function handleSubmit(e: Event) {
-    e.preventDefault()
-    setError('')
-    setLoading(true)
-    const res = await fetch('/api/auth/sign-in/email', {
-      method:  'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body:    JSON.stringify({ email: email(), password: password() }),
-    })
-    if (res.ok) {
-      const params = new URLSearchParams(window.location.search)
-      const redirect = params.get('redirect')
-      await navigate(redirect && redirect.startsWith('/') ? redirect : '/')
-    } else {
-      const body = await res.json().catch(() => ({})) as { message?: string }
-      setError(body.message ?? 'Invalid email or password.')
-    }
-    setLoading(false)
-  }
-
-  return (
-    <div class="flex min-h-svh items-center justify-center p-4">
-      <div class="w-full max-w-sm space-y-6">
-        <div class="text-center">
-          <h1 class="text-2xl font-bold">Welcome back</h1>
-          <p class="text-sm text-gray-500 mt-1">Sign in to your account</p>
-        </div>
-        <form onSubmit={handleSubmit} class="space-y-4 rounded-lg border p-6 shadow-sm">
-          {error() && <p class="rounded-md bg-red-50 px-3 py-2 text-sm text-red-600">{error()}</p>}
-          <div>
-            <label class="block text-sm font-medium mb-1" for="email">Email</label>
-            <input id="email" type="email" placeholder="you@example.com"
-              value={email()} onInput={e => setEmail(e.currentTarget.value)}
-              required autocomplete="email"
-              class="w-full rounded-md border px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-black" />
-          </div>
-          <div>
-            <label class="block text-sm font-medium mb-1" for="password">Password</label>
-            <input id="password" type="password" placeholder="••••••••"
-              value={password()} onInput={e => setPassword(e.currentTarget.value)}
-              required autocomplete="current-password"
-              class="w-full rounded-md border px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-black" />
-          </div>
-          <button type="submit" disabled={loading()}
-            class="w-full rounded-md bg-black px-4 py-2 text-sm font-medium text-white hover:bg-black/90 disabled:opacity-50">
-            {loading() ? 'Signing in…' : 'Sign in'}
-          </button>
-          <p class="text-center text-sm text-gray-500">
-            Don't have an account?{' '}
-            <a href="/register" class="underline hover:text-black">Register</a>
-          </p>
-        </form>
-      </div>
-    </div>
-  )
-}

package/pages/solid/login/+guard.ts

@@ -1,15 +0,0 @@
-import { redirect } from 'vike/abort'
-import type { GuardAsync } from 'vike/types'
-import type { BetterAuthInstance } from '@rudderjs/auth'
-
-export const guard: GuardAsync = async (pageContext): ReturnType<GuardAsync> => {
-  // import.meta.env.SSR is a Vite compile-time constant — tree-shaken from client bundle
-  if (!import.meta.env.SSR) return
-  const { app } = await import('@rudderjs/core')
-  const auth    = app().make<BetterAuthInstance>('auth')
-  const session = await auth.api.getSession({
-    headers: new Headers(pageContext.headers ?? {}),
-  })
-  // Already logged in — redirect to home
-  if (session?.user) throw redirect('/')
-}

package/pages/solid/register/+Page.tsx

@@ -1,72 +0,0 @@
-import '@/index.css'
-import { createSignal } from 'solid-js'
-import { navigate } from 'vike/client/router'
-
-export default function RegisterPage() {
-  const [name, setName]         = createSignal('')
-  const [email, setEmail]       = createSignal('')
-  const [password, setPassword] = createSignal('')
-  const [error, setError]       = createSignal('')
-  const [loading, setLoading]   = createSignal(false)
-
-  async function handleSubmit(e: Event) {
-    e.preventDefault()
-    setError('')
-    setLoading(true)
-    const res = await fetch('/api/auth/sign-up/email', {
-      method:  'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body:    JSON.stringify({ name: name(), email: email(), password: password() }),
-    })
-    if (res.ok) {
-      await navigate('/')
-    } else {
-      const body = await res.json().catch(() => ({})) as { message?: string }
-      setError(body.message ?? 'Could not create account. Please try again.')
-    }
-    setLoading(false)
-  }
-
-  return (
-    <div class="flex min-h-svh items-center justify-center p-4">
-      <div class="w-full max-w-sm space-y-6">
-        <div class="text-center">
-          <h1 class="text-2xl font-bold">Create an account</h1>
-          <p class="text-sm text-gray-500 mt-1">Get started in seconds</p>
-        </div>
-        <form onSubmit={handleSubmit} class="space-y-4 rounded-lg border p-6 shadow-sm">
-          {error() && <p class="rounded-md bg-red-50 px-3 py-2 text-sm text-red-600">{error()}</p>}
-          <div>
-            <label class="block text-sm font-medium mb-1" for="name">Name</label>
-            <input id="name" type="text" placeholder="Alice Smith"
-              value={name()} onInput={e => setName(e.currentTarget.value)}
-              required autocomplete="name"
-              class="w-full rounded-md border px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-black" />
-          </div>
-          <div>
-            <label class="block text-sm font-medium mb-1" for="email">Email</label>
-            <input id="email" type="email" placeholder="you@example.com"
-              value={email()} onInput={e => setEmail(e.currentTarget.value)}
-              required autocomplete="email"
-              class="w-full rounded-md border px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-black" />
-          </div>
-          <div>
-            <label class="block text-sm font-medium mb-1" for="password">Password</label>
-            <input id="password" type="password" placeholder="••••••••"
-              value={password()} onInput={e => setPassword(e.currentTarget.value)}
-              required autocomplete="new-password" minLength={8}
-              class="w-full rounded-md border px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-black" />
-          </div>
-          <button type="submit" disabled={loading()}
-            class="w-full rounded-md bg-black px-4 py-2 text-sm font-medium text-white hover:bg-black/90 disabled:opacity-50">
-            {loading() ? 'Creating account…' : 'Create account'}
-          </button>
-          <p class="text-center text-sm text-gray-500">
-            Already have an account?{' '}
-            <a href="/login" class="underline hover:text-black">Sign in</a>
-          </p>
-        </form>
-      </div>
-    </div>
-  )
-}

package/pages/solid/register/+guard.ts

@@ -1,15 +0,0 @@
-import { redirect } from 'vike/abort'
-import type { GuardAsync } from 'vike/types'
-import type { BetterAuthInstance } from '@rudderjs/auth'
-
-export const guard: GuardAsync = async (pageContext): ReturnType<GuardAsync> => {
-  // import.meta.env.SSR is a Vite compile-time constant — tree-shaken from client bundle
-  if (!import.meta.env.SSR) return
-  const { app } = await import('@rudderjs/core')
-  const auth    = app().make<BetterAuthInstance>('auth')
-  const session = await auth.api.getSession({
-    headers: new Headers(pageContext.headers ?? {}),
-  })
-  // Already registered and logged in — redirect to home
-  if (session?.user) throw redirect('/')
-}

package/pages/solid/reset-password/+Page.tsx

@@ -1,94 +0,0 @@
-import '@/index.css'
-import { createSignal, Show } from 'solid-js'
-
-export default function ResetPasswordPage() {
-  const [password, setPassword]       = createSignal('')
-  const [confirmPassword, setConfirm] = createSignal('')
-  const [error, setError]             = createSignal('')
-  const [success, setSuccess]         = createSignal('')
-  const [loading, setLoading]         = createSignal(false)
-
-  const params = new URLSearchParams(window.location.search)
-  const token  = params.get('token')
-
-  async function handleSubmit(e: Event) {
-    e.preventDefault()
-    setError('')
-    setSuccess('')
-
-    if (password() !== confirmPassword()) {
-      setError('Passwords do not match.')
-      return
-    }
-
-    setLoading(true)
-    try {
-      const res = await fetch('/api/auth/reset-password', {
-        method:  'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body:    JSON.stringify({ token, newPassword: password() }),
-      })
-      if (res.ok) {
-        setSuccess('Your password has been reset successfully.')
-      } else {
-        const body = await res.json().catch(() => ({})) as { message?: string }
-        setError(body.message ?? 'Invalid or expired token.')
-      }
-    } catch {
-      setError('Something went wrong. Please try again.')
-    }
-    setLoading(false)
-  }
-
-  return (
-    <div class="flex min-h-svh items-center justify-center p-4">
-      <div class="w-full max-w-sm space-y-6">
-        <Show when={token} fallback={
-          <div class="space-y-4 rounded-lg border p-6 shadow-sm">
-            <p class="rounded-md bg-red-50 px-3 py-2 text-sm text-red-600">Missing reset token.</p>
-            <p class="text-center text-sm text-gray-500">
-              <a href="/forgot-password" class="underline hover:text-black">Request a new reset link</a>
-            </p>
-          </div>
-        }>
-          <div class="text-center">
-            <h1 class="text-2xl font-bold">Reset password</h1>
-            <p class="text-sm text-gray-500 mt-1">Enter your new password</p>
-          </div>
-          <form onSubmit={handleSubmit} class="space-y-4 rounded-lg border p-6 shadow-sm">
-            {error() && <p class="rounded-md bg-red-50 px-3 py-2 text-sm text-red-600">{error()}</p>}
-            <Show when={success()} fallback={
-              <>
-                <div>
-                  <label class="block text-sm font-medium mb-1" for="password">New password</label>
-                  <input id="password" type="password" placeholder="••••••••"
-                    value={password()} onInput={e => setPassword(e.currentTarget.value)}
-                    required minLength={8} autocomplete="new-password"
-                    class="w-full rounded-md border px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-black" />
-                </div>
-                <div>
-                  <label class="block text-sm font-medium mb-1" for="confirm-password">Confirm password</label>
-                  <input id="confirm-password" type="password" placeholder="••••••••"
-                    value={confirmPassword()} onInput={e => setConfirm(e.currentTarget.value)}
-                    required minLength={8} autocomplete="new-password"
-                    class="w-full rounded-md border px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-black" />
-                </div>
-                <button type="submit" disabled={loading()}
-                  class="w-full rounded-md bg-black px-4 py-2 text-sm font-medium text-white hover:bg-black/90 disabled:opacity-50">
-                  {loading() ? 'Resetting...' : 'Reset password'}
-                </button>
-              </>
-            }>
-              <div class="space-y-2">
-                <p class="rounded-md bg-green-50 px-3 py-2 text-sm text-green-600">{success()}</p>
-                <p class="text-center text-sm text-gray-500">
-                  <a href="/login" class="underline hover:text-black">Sign in</a>
-                </p>
-              </div>
-            </Show>
-          </form>
-        </Show>
-      </div>
-    </div>
-  )
-}

package/pages/vue/forgot-password/+Page.vue

@@ -1,60 +0,0 @@
-<script setup lang="ts">
-import '@/index.css'
-import { ref } from 'vue'
-
-const email   = ref('')
-const error   = ref('')
-const success = ref('')
-const loading = ref(false)
-
-async function handleSubmit() {
-  error.value   = ''
-  success.value = ''
-  loading.value = true
-  try {
-    const res = await fetch('/api/auth/request-password-reset', {
-      method:  'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body:    JSON.stringify({ email: email.value, redirectTo: '/reset-password' }),
-    })
-    if (res.ok) {
-      success.value = 'If an account exists with that email, a password reset link has been sent.'
-    } else {
-      const body = await res.json().catch(() => ({})) as { message?: string }
-      error.value = body.message ?? 'Something went wrong. Please try again.'
-    }
-  } catch {
-    error.value = 'Something went wrong. Please try again.'
-  }
-  loading.value = false
-}
-</script>
-
-<template>
-  <div class="flex min-h-svh items-center justify-center p-4">
-    <div class="w-full max-w-sm space-y-6">
-      <div class="text-center">
-        <h1 class="text-2xl font-bold">Forgot password</h1>
-        <p class="text-sm text-gray-500 mt-1">Enter your email to receive a reset link</p>
-      </div>
-      <form @submit.prevent="handleSubmit" class="space-y-4 rounded-lg border p-6 shadow-sm">
-        <p v-if="error" class="rounded-md bg-red-50 px-3 py-2 text-sm text-red-600">{{ error }}</p>
-        <p v-if="success" class="rounded-md bg-green-50 px-3 py-2 text-sm text-green-600">{{ success }}</p>
-        <div>
-          <label class="block text-sm font-medium mb-1" for="email">Email</label>
-          <input id="email" v-model="email" type="email" placeholder="you@example.com"
-            required autocomplete="email"
-            class="w-full rounded-md border px-3 py-2 text-sm outline-none focus:ring-2 focus:ring-black" />
-        </div>
-        <button type="submit" :disabled="loading"
-          class="w-full rounded-md bg-black px-4 py-2 text-sm font-medium text-white hover:bg-black/90 disabled:opacity-50">
-          {{ loading ? 'Sending...' : 'Send reset link' }}
-        </button>
-        <p class="text-center text-sm text-gray-500">
-          Remember your password?
-          <a href="/login" class="underline hover:text-black">Sign in</a>
-        </p>
-      </form>
-    </div>
-  </div>
-</template>