Merge branch 'fix/auth-and-api-config' into 'main'
Refactor Header and AppRouter components See merge request fjmimbre/deck-of-cards!1
This commit is contained in:
@@ -3,7 +3,9 @@ import { Link, useNavigate, useLocation } from 'react-router-dom';
|
||||
import { useAuth } from '../../context/AuthContext';
|
||||
import { FiLogIn, FiLogOut, FiEdit3, FiClock } from 'react-icons/fi';
|
||||
|
||||
function NavTab({ to, isActive, icon: Icon, children }) {
|
||||
function NavTab({ to, isActive, icon, children }) {
|
||||
const Icon = icon;
|
||||
|
||||
return (
|
||||
<Link
|
||||
to={to}
|
||||
@@ -97,7 +99,7 @@ export default function Header() {
|
||||
</Link>
|
||||
|
||||
<div className="flex items-center gap-4 whitespace-nowrap">
|
||||
{/* Misma navegación con o sin sesión: evita estilos distintos al loguearse */}
|
||||
{isAuthenticated && (
|
||||
<nav
|
||||
className="flex items-center gap-0.5 rounded-xl bg-slate-100/90 p-1"
|
||||
aria-label="Secciones principales"
|
||||
@@ -105,12 +107,11 @@ export default function Header() {
|
||||
<NavTab to="/editor" isActive={isEditorActive} icon={FiEdit3}>
|
||||
Editor
|
||||
</NavTab>
|
||||
{isAuthenticated && (
|
||||
<NavTab to="/history" isActive={isHistoryActive} icon={FiClock}>
|
||||
Historial
|
||||
</NavTab>
|
||||
)}
|
||||
</nav>
|
||||
)}
|
||||
|
||||
{isAuthenticated ? (
|
||||
<div className="relative border-l border-slate-200 pl-4">
|
||||
@@ -154,7 +155,7 @@ export default function Header() {
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<div className="border-l border-slate-200 pl-4">
|
||||
<div>
|
||||
<AccederButton isActive={isLoginActive} />
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -4,6 +4,17 @@ import DocEditor from '../pages/DocEditor';
|
||||
import Login from '../pages/Login';
|
||||
import Register from '../pages/Register';
|
||||
import History from '../pages/History';
|
||||
import { useAuth } from '../context/AuthContext';
|
||||
|
||||
function ProtectedHistoryRoute() {
|
||||
const { isAuthenticated } = useAuth();
|
||||
|
||||
if (!isAuthenticated) {
|
||||
return <Navigate to="/login" replace />;
|
||||
}
|
||||
|
||||
return <History />;
|
||||
}
|
||||
|
||||
export default function AppRouter() {
|
||||
return (
|
||||
@@ -14,7 +25,7 @@ export default function AppRouter() {
|
||||
<Route path="/editor" element={<DocEditor />} />
|
||||
<Route path="/login" element={<Login />} />
|
||||
<Route path="/register" element={<Register />} />
|
||||
<Route path="/history" element={<History />} />
|
||||
<Route path="/history" element={<ProtectedHistoryRoute />} />
|
||||
</Routes>
|
||||
</MainLayout>
|
||||
</Router>
|
||||
|
||||
Reference in New Issue
Block a user