This repository has no description
fix route
author
damedotblog
date
(Feb 28, 2025, 6:43 PM -0500)
commit
34a2e337
34a2e3371691deb9bf59a6087b86ed4554647b8d
parent
525ca681
525ca681ac71770ebd5aac129062e20b3a8cd69d
+58
-5
+58
-5
src/components/Admin/AdminRoute.js
+58
-5
src/components/Admin/AdminRoute.js
···
1
1
// src/components/Admin/AdminRoute.jsx
2
2
import React, { useState, useEffect } from 'react';
3
-
import { Navigate } from 'react-router-dom';
4
3
import { supabase } from '../../lib/supabase';
5
4
import AdminPanel from './AdminPanel';
6
5
7
-
// This component protects the admin route by checking authentication
8
6
const AdminRoute = () => {
9
7
const [isAuthenticated, setIsAuthenticated] = useState(null);
10
8
const [isLoading, setIsLoading] = useState(true);
9
+
const [email, setEmail] = useState('');
10
+
const [password, setPassword] = useState('');
11
+
const [authError, setAuthError] = useState(null);
11
12
12
13
useEffect(() => {
13
14
const checkAuth = async () => {
···
36
37
};
37
38
}, []);
38
39
40
+
const handleLogin = async (e) => {
41
+
e.preventDefault();
42
+
setIsLoading(true);
43
+
setAuthError(null);
44
+
45
+
try {
46
+
const { data, error } = await supabase.auth.signInWithPassword({
47
+
email,
48
+
password
49
+
});
50
+
51
+
if (error) throw error;
52
+
53
+
setIsAuthenticated(true);
54
+
} catch (error) {
55
+
console.error('Error logging in:', error);
56
+
setAuthError(error.message);
57
+
} finally {
58
+
setIsLoading(false);
59
+
}
60
+
};
61
+
39
62
if (isLoading) {
40
63
return (
41
64
<div className="admin-loading">
···
45
68
);
46
69
}
47
70
48
-
// If not authenticated, redirect to home page
49
-
if (isAuthenticated === false) {
50
-
return <Navigate to="/" replace />;
71
+
// If not authenticated, show login form
72
+
if (!isAuthenticated) {
73
+
return (
74
+
<div className="admin-login-container">
75
+
<div className="admin-login-card">
76
+
<h2>Admin Login</h2>
77
+
{authError && <div className="auth-error">{authError}</div>}
78
+
<form onSubmit={handleLogin}>
79
+
<div className="form-group">
80
+
<label htmlFor="email">Email</label>
81
+
<input
82
+
type="email"
83
+
id="email"
84
+
value={email}
85
+
onChange={(e) => setEmail(e.target.value)}
86
+
required
87
+
/>
88
+
</div>
89
+
<div className="form-group">
90
+
<label htmlFor="password">Password</label>
91
+
<input
92
+
type="password"
93
+
id="password"
94
+
value={password}
95
+
onChange={(e) => setPassword(e.target.value)}
96
+
required
97
+
/>
98
+
</div>
99
+
<button type="submit" className="login-button">Login</button>
100
+
</form>
101
+
</div>
102
+
</div>
103
+
);
51
104
}
52
105
53
106
// If authenticated, render the admin panel