42 lines
1.2 KiB
TypeScript
42 lines
1.2 KiB
TypeScript
"use client";
|
||
|
||
// ============================================================================
|
||
// Protected Route Component
|
||
// ============================================================================
|
||
|
||
import React, { useEffect } from "react";
|
||
import { useRouter } from "next/navigation";
|
||
import { useAuth } from "./auth-provider";
|
||
|
||
interface ProtectedRouteProps {
|
||
children: React.ReactNode;
|
||
}
|
||
|
||
export const ProtectedRoute: React.FC<ProtectedRouteProps> = ({ children }) => {
|
||
const { user, loading } = useAuth();
|
||
const router = useRouter();
|
||
|
||
useEffect(() => {
|
||
if (!loading && !user) {
|
||
router.push("/login");
|
||
}
|
||
}, [user, loading, router]);
|
||
|
||
if (loading) {
|
||
return (
|
||
<div className="flex items-center justify-center min-h-screen">
|
||
<div className="text-center">
|
||
<div className="inline-block h-8 w-8 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]" />
|
||
<p className="mt-4 text-sm text-muted-foreground">Загрузка...</p>
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
if (!user) {
|
||
return null;
|
||
}
|
||
|
||
return <>{children}</>;
|
||
};
|