fix: reset password form errors are now being shown

NIAEFEUP · Jan 26, 2025 · 64cd1f8 · 64cd1f8
1 parent 4155333
commit 64cd1f8
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 6 deletions.
diff --git a/website/app/controllers/authentication_controller.ts b/website/app/controllers/authentication_controller.ts
@@ -85,10 +85,15 @@ export default class AuthenticationController {
     return response.redirect().toRoute('page:auth.forgot-password.sent')
   }
 
-  async callbackForForgotPassword({ request, inertia }: HttpContext) {
+  async callbackForForgotPassword({ request, response, session }: HttpContext) {
     const { email } = await request.validateUsing(emailVerificationCallbackValidator)
 
-    return inertia.render('auth/forgot-password/reset', { email })
+    session.flash('forgot-password-email', email)
+    return response.redirect().toRoute('pages:auth.forgot-password.change')
+  }
+
+  async showForgotPasswordPage({ inertia, session }: HttpContext) {
+    return inertia.render('auth/forgot-password/reset', { email: session.flashMessages.get('forgot-password-email') })
   }
 
   async changePassword({ request, response }: HttpContext) {

diff --git a/website/inertia/pages/auth/forgot-password/index.tsx b/website/inertia/pages/auth/forgot-password/index.tsx
@@ -13,7 +13,6 @@ export default function ForgotPasswor() {
 
   const { data, setData, errors, post } = useForm({
     email: '',
-    password: '',
   })
 
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {

diff --git a/website/inertia/pages/auth/forgot-password/reset.tsx b/website/inertia/pages/auth/forgot-password/reset.tsx
@@ -12,7 +12,7 @@ export default function ForgotPasswor() {
   const page = usePage()
   const oauthError = useError('oauth')
 
-  const { data, setData, post } = useForm({
+  const { data, setData, errors, post } = useForm({
     email: String(page.props.email),
     password: '',
     password_confirmation: '',
@@ -58,6 +58,7 @@ export default function ForgotPasswor() {
                     onChange={(e) => setData('password_confirmation', e.target.value)}
                     required
                   />
+                  {errors.password && <p className="text-sm text-red-600">{errors.password}</p>}
                 </div>
                 <div className="flex flex-col gap-4   ">
                   <Button type="submit" className="w-full bg-enei-blue">
@@ -66,7 +67,6 @@ export default function ForgotPasswor() {
                 </div>
               </div>
             </form>
-            {oauthError && <p className="text-sm text-red-600 text-center mt-4">{oauthError}</p>}
           </CardContent>
         </Card>
       </CardLayout>

diff --git a/website/inertia/pages/auth/forgot-password/success.tsx b/website/inertia/pages/auth/forgot-password/success.tsx
@@ -6,7 +6,7 @@ import CardLayout from '~/layouts/card'
 
 export default function EmailVerification() {
   return (
-    <BaseLayout title="E-mail confirmado">
+    <BaseLayout title="Palavra-passe alterada">
       <CardLayout>
         <Card>
           <CardHeader>

diff --git a/website/start/routes.ts b/website/start/routes.ts
@@ -68,6 +68,10 @@ router
       .as('actions:auth.forgot-password.callback')
       .middleware([middleware.verifyUrlSignature(), middleware.automaticSubmit()])
 
+    router
+      .get('/password/forgot/reset', [AuthenticationController, 'showForgotPasswordPage'])
+      .as('pages:auth.forgot-password.change')
+
     router
       .post('/password/forgot/reset', [AuthenticationController, 'changePassword'])
       .as('actions:auth.forgot-password.change')