first commit

2026-04-01 21:51:49 +02:00
commit 27aff5611b
151 changed files with 10858 additions and 0 deletions
@@ -0,0 +1,131 @@
+import React, { useState, useContext } from 'react';
+import { useNavigate, Link } from 'react-router-dom';
+import { AuthContext } from '../../context/AuthContext';
+import './Login.css';
+
+const Login = () => {
+  const [formData, setFormData] = useState({
+    email: '',
+    password: ''
+  });
+  const [errors, setErrors] = useState({});
+  const [isLoading, setIsLoading] = useState(false);
+  const { login } = useContext(AuthContext);
+  const navigate = useNavigate();
+
+  const handleChange = (e) => {
+    const { name, value } = e.target;
+    setFormData(prev => ({
+      ...prev,
+      [name]: value
+    }));
+    
+    // Clear error when user starts typing
+    if (errors[name]) {
+      setErrors(prev => ({
+        ...prev,
+        [name]: ''
+      }));
+    }
+  };
+
+  const validateForm = () => {
+    const newErrors = {};
+    
+    if (!formData.email.trim()) {
+      newErrors.email = 'Email is required';
+    } else if (!/\S+@\S+\.\S+/.test(formData.email)) {
+      newErrors.email = 'Email is invalid';
+    }
+    
+    if (!formData.password) {
+      newErrors.password = 'Password is required';
+    } else if (formData.password.length < 6) {
+      newErrors.password = 'Password must be at least 6 characters';
+    }
+    
+    setErrors(newErrors);
+    return Object.keys(newErrors).length === 0;
+  };
+
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    
+    if (validateForm()) {
+      setIsLoading(true);
+      
+      // Simulate API call
+      try {
+        await new Promise(resolve => setTimeout(resolve, 1000));
+        
+        // Mock successful login
+        const mockUser = {
+          id: 1,
+          name: 'John Doe',
+          email: formData.email
+        };
+        
+        login(mockUser);
+        setIsLoading(false);
+        navigate('/');
+      } catch (error) {
+        setIsLoading(false);
+        setErrors({ submit: 'Invalid email or password' });
+      }
+    }
+  };
+
+  return (
+    <div className="auth-page">
+      <div className="container">
+        <div className="auth-form">
+          <h1 className="auth-title">Login to Your Account</h1>
+          
+          <form onSubmit={handleSubmit}>
+            <div className="form-group">
+              <label htmlFor="email">Email Address</label>
+              <input
+                type="email"
+                id="email"
+                name="email"
+                value={formData.email}
+                onChange={handleChange}
+                className={errors.email ? 'error' : ''}
+              />
+              {errors.email && <span className="error-message">{errors.email}</span>}
+            </div>
+            
+            <div className="form-group">
+              <label htmlFor="password">Password</label>
+              <input
+                type="password"
+                id="password"
+                name="password"
+                value={formData.password}
+                onChange={handleChange}
+                className={errors.password ? 'error' : ''}
+              />
+              {errors.password && <span className="error-message">{errors.password}</span>}
+            </div>
+            
+            {errors.submit && <div className="submit-error">{errors.submit}</div>}
+            
+            <button 
+              type="submit" 
+              className="submit-btn"
+              disabled={isLoading}
+            >
+              {isLoading ? 'Signing In...' : 'Sign In'}
+            </button>
+          </form>
+          
+          <div className="auth-links">
+            <p>Don't have an account? <Link to="/register">Register here</Link></p>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default Login;