This repository has no description
fix route
author
damedotblog
date
(Apr 22, 2025, 2:43 PM -0400)
commit
86fc4db1
86fc4db1fb260deb9948c15ef3a7d970eb71d798
parent
4f64dafc
4f64dafc8ed8c973a1bc24924660b2bde08cb11f
+39
-8
+9
-1
src/App.jsx
+9
-1
src/App.jsx
···
23
23
import LoginCallback from './components/Login/LoginCallback';
24
24
import Verifier from './components/Verifier/Verifier';
25
25
import { AuthProvider } from './contexts/AuthContext';
26
+
import ProtectedRoute from './components/ProtectedRoute';
26
27
import "./App.css";
27
28
28
29
const App = () => {
···
51
52
<Route path="/definitions" element={<Definitions />} />
52
53
<Route path="/leaderboard" element={<Leaderboard />} />
53
54
<Route path="/resources" element={<Resources />} />
54
-
<Route path="/verifier" element={<Verifier />} />
55
+
<Route
56
+
path="/verifier"
57
+
element={
58
+
<ProtectedRoute>
59
+
<Verifier />
60
+
</ProtectedRoute>
61
+
}
62
+
/>
55
63
<Route path="/shortcut" element={<Shortcut />} />
56
64
<Route path="/zen" element={<ZenPage />} />
57
65
<Route path="/methodology" element={<ScoringMethodology />} />
+3
-4
src/components/Login/Login.css
+3
-4
src/components/Login/Login.css
+3
-3
src/components/Login/Login.js
+3
-3
src/components/Login/Login.js
···
41
41
<div className="home-page">
42
42
<div className="home-content">
43
43
<h1>Login to cred.blue</h1>
44
-
<p>Enter your Bluesky or ATProto handle (e.g., yourname.bsky.social)</p>
44
+
<p>Enter your Bluesky or ATProto handle</p>
45
45
<form onSubmit={handleSubmit} className="login-form">
46
46
<input
47
47
type="text"
48
48
value={handle}
49
49
onChange={handleInputChange}
50
-
placeholder="yourname.bsky.social (optional)"
50
+
placeholder="username.bsky.social"
51
51
aria-label="Bluesky Handle (optional)"
52
52
className="login-input-field"
53
53
disabled={loading}
···
59
59
disabled={loading}
60
60
className="login-submit-button"
61
61
>
62
-
{loading ? 'Processing...' : 'Login'}
62
+
{loading ? 'Processing...' : 'Login with Bluesky'}
63
63
</button>
64
64
</form>
65
65
<p className="login-privacy-note">
+24
src/components/ProtectedRoute.jsx
+24
src/components/ProtectedRoute.jsx
···
1
+
import React from 'react';
2
+
import { Navigate, useLocation } from 'react-router-dom';
3
+
import { useAuth } from '../contexts/AuthContext';
4
+
5
+
const ProtectedRoute = ({ children }) => {
6
+
const { isAuthenticated, authLoading } = useAuth(); // Assuming 'authLoading' is the correct name from context
7
+
const location = useLocation();
8
+
9
+
if (authLoading) {
10
+
// Optional: Display a loading indicator while checking auth status
11
+
return <div>Loading authentication status...</div>;
12
+
}
13
+
14
+
if (!isAuthenticated) {
15
+
// User not logged in, redirect to login page
16
+
// Preserve the original intended location in the state
17
+
return <Navigate to={`/login?returnUrl=${location.pathname}${location.search}`} replace />;
18
+
}
19
+
20
+
// User is authenticated, render the child component
21
+
return children;
22
+
};
23
+
24
+
export default ProtectedRoute;