Implement user authentication and account pages
Adds AuthContext with Orval API integration, user login/logout/register flows, and account settings page. Refactors navigation and layouts to use authentication context. Introduces new account-related pages (Login, Register, Logout, AccountSettings), updates PrivateRoute to use AuthContext, and improves error handling in Downloader. Removes obsolete context example and adds comprehensive usage documentation for AuthContext.
This commit is contained in:
@@ -1,22 +1,28 @@
|
||||
import { Navigate, Outlet, useLocation } from "react-router-dom";
|
||||
|
||||
function getCookie(name: string): string | null {
|
||||
const nameEQ = name + "=";
|
||||
const ca = document.cookie.split(";").map((c) => c.trim());
|
||||
for (const c of ca) {
|
||||
if (c.indexOf(nameEQ) === 0) return decodeURIComponent(c.substring(nameEQ.length));
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
const ACCESS_COOKIE = "access_token";
|
||||
import { useAuth } from "@/context/AuthContext";
|
||||
import { FaSpinner } from "react-icons/fa";
|
||||
|
||||
export default function PrivateRoute() {
|
||||
const location = useLocation();
|
||||
const isLoggedIn = !!getCookie(ACCESS_COOKIE);
|
||||
const { isAuthenticated, isLoading } = useAuth();
|
||||
|
||||
if (!isLoggedIn) {
|
||||
// Zobraz loading během načítání uživatele
|
||||
if (isLoading) {
|
||||
return (
|
||||
<div className="min-h-screen flex items-center justify-center bg-gray-50">
|
||||
<div className="text-center">
|
||||
<FaSpinner className="text-blue-500 text-5xl mx-auto mb-4 animate-spin" />
|
||||
<p className="text-gray-600">Načítání...</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
// Pokud není přihlášen, redirect na login (ulož původní cestu)
|
||||
if (!isAuthenticated) {
|
||||
return <Navigate to="/login" replace state={{ from: location }} />;
|
||||
}
|
||||
|
||||
// Uživatel je přihlášen, renderuj chráněný obsah
|
||||
return <Outlet />;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user