Enhance authentication flow: add success message to LoginForm, pre-fill email from SignupForm, and redirect with message after registration

Author: LadyKerr

planventure-api/instance/planventure.db

@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useState, useEffect } from 'react';
 import { useNavigate, useLocation } from 'react-router-dom';
 import { 
   Box, 
@@ -29,6 +29,21 @@ const LoginForm = () => {
     password: ''
   });
 
+  // Add state for success message
+  const [successMessage, setSuccessMessage] = useState(
+    location.state?.message || ''
+  );
+
+  // Pre-fill email if coming from signup
+  useEffect(() => {
+    if (location.state?.email) {
+      setFormData(prev => ({
+        ...prev,
+        email: location.state.email
+      }));
+    }
+  }, [location.state]);
+
   const validateEmail = (email) => {
     const re = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
     if (!email) return 'Email is required';
@@ -112,6 +127,12 @@ const LoginForm = () => {
         Login to Planventure
       </Typography>
 
+      {successMessage && (
+        <Alert severity="success" sx={{ mb: 2 }}>
+          {successMessage}
+        </Alert>
+      )}
+
       {error && (
         <Alert severity="error" sx={{ mb: 2 }}>
           {error}

planventure-client/src/components/auth/LoginForm.jsx

@@ -92,15 +92,21 @@ const SignupForm = () => {
         password: formData.password
       };
 
-      const data = await api.auth.register(userData);
+      const response = await api.auth.register(userData);
+      console.log('Signup response:', response); // Debug log
 
-      if(data.accessToken) {
-        setIsAuthenticated(true);
-        navigate('/dashboard', { replace: true });
-      }
+      // Don't check for accessToken, just redirect after successful registration
+      navigate('/login', { 
+        replace: true,
+        state: { 
+          message: 'Registration successful! Please log in.',
+          email: formData.email
+        }
+      });
 
     } catch (err) {
-      setError(err.message);
+      console.error('Signup error:', err); // Debug log
+      setError(err.message || 'Registration failed. Please try again.');
     } finally {
       setIsLoading(false);
     }

planventure-client/src/components/auth/SignupForm.jsx

@@ -1,3 +1,4 @@
+import { useNavigate } from 'react-router-dom';
 import { Box, Typography, Grid, Paper, Button } from '@mui/material';
 import { Add as AddIcon } from '@mui/icons-material';
 import TripList from '../components/trips/TripList';
@@ -6,6 +7,7 @@ import travelingSvg from '../assets/undraw_traveling_yhxq.svg';
 
 const Dashboard = () => {
   const { user } = useAuth();
+const navigate = useNavigate();
 
   const WelcomeMessage = () => (
     <Box