initial commit

2025-09-01 22:12:29 +02:00
parent b1873f9c1d
commit 02a54f61c0
5598 changed files with 903558 additions and 0 deletions
--- a/client/src/components/Login.jsx
+++ b/client/src/components/Login.jsx
@@ -0,0 +1,136 @@
+import React, { useState } from 'react';
+import { signInWithEmailAndPassword, signInWithPopup } from 'firebase/auth';
+import { auth, googleProvider } from '../firebaseConfig';
+
+const Login = () => {
+    const [email, setEmail] = useState('');
+    const [password, setPassword] = useState('');
+    const [error, setError] = useState('');
+    const [loading, setLoading] = useState(false);
+
+    const handleEmailLogin = async (e) => {
+        e.preventDefault();
+        setLoading(true);
+        setError('');
+
+        try {
+            await signInWithEmailAndPassword(auth, email, password);
+        } catch (err) {
+            setError(err.message);
+        } finally {
+            setLoading(false);
+        }
+    };
+
+    const handleGoogleLogin = async () => {
+        setLoading(true);
+        setError('');
+
+        try {
+            await signInWithPopup(auth, googleProvider);
+        } catch (err) {
+            setError(err.message);
+        } finally {
+            setLoading(false);
+        }
+    };
+
+    return (
+        <div style={{ maxWidth: '400px', margin: '100px auto', padding: '20px' }}>
+            <h2>Login to DZTPS</h2>
+            
+            {error && (
+                <div style={{ 
+                    color: 'red', 
+                    marginBottom: '10px', 
+                    padding: '10px', 
+                    border: '1px solid red', 
+                    borderRadius: '4px',
+                    backgroundColor: '#ffe6e6'
+                }}>
+                    {error}
+                </div>
+            )}
+
+            <form onSubmit={handleEmailLogin}>
+                <div style={{ marginBottom: '15px' }}>
+                    <label htmlFor="email">Email:</label>
+                    <input
+                        type="email"
+                        id="email"
+                        value={email}
+                        onChange={(e) => setEmail(e.target.value)}
+                        required
+                        disabled={loading}
+                        style={{ 
+                            width: '100%', 
+                            padding: '8px', 
+                            marginTop: '5px',
+                            border: '1px solid #ccc',
+                            borderRadius: '4px'
+                        }}
+                    />
+                </div>
+
+                <div style={{ marginBottom: '15px' }}>
+                    <label htmlFor="password">Password:</label>
+                    <input
+                        type="password"
+                        id="password"
+                        value={password}
+                        onChange={(e) => setPassword(e.target.value)}
+                        required
+                        disabled={loading}
+                        style={{ 
+                            width: '100%', 
+                            padding: '8px', 
+                            marginTop: '5px',
+                            border: '1px solid #ccc',
+                            borderRadius: '4px'
+                        }}
+                    />
+                </div>
+
+                <button 
+                    type="submit" 
+                    disabled={loading}
+                    style={{ 
+                        width: '100%', 
+                        padding: '10px', 
+                        backgroundColor: '#007bff', 
+                        color: 'white', 
+                        border: 'none', 
+                        borderRadius: '4px',
+                        cursor: loading ? 'not-allowed' : 'pointer',
+                        opacity: loading ? 0.6 : 1
+                    }}
+                >
+                    {loading ? 'Signing in...' : 'Sign in with Email'}
+                </button>
+            </form>
+
+            <div style={{ margin: '20px 0', textAlign: 'center' }}>
+                <span>OR</span>
+            </div>
+
+            <button 
+                onClick={handleGoogleLogin}
+                disabled={loading}
+                style={{ 
+                    width: '100%', 
+                    padding: '10px', 
+                    backgroundColor: '#db4437', 
+                    color: 'white', 
+                    border: 'none', 
+                    borderRadius: '4px',
+                    cursor: loading ? 'not-allowed' : 'pointer',
+                    opacity: loading ? 0.6 : 1
+                }}
+            >
+                {loading ? 'Signing in...' : 'Sign in with Google'}
+            </button>
+        </div>
+    );
+};
+
+export default Login;