/**
 * Protected Route Component
 * Ensures only authenticated users can access protected content
 * 
 * © 2025 Netwerk Digitaal Erfgoed & TextPast. All rights reserved.
 */

import React from 'react';
import { Navigate, useLocation } from 'react-router-dom';
import { useAuth } from '../contexts/AuthContext';
import { LoadingScreen } from './LoadingScreen';

interface ProtectedRouteProps {
  children: React.ReactNode;
}

export const ProtectedRoute: React.FC<ProtectedRouteProps> = ({ children }) => {
  const { isAuthenticated, isLoading } = useAuth();
  const location = useLocation();

  // Show circular progress meter while checking auth status
  if (isLoading) {
    return (
      <LoadingScreen 
        message="Verifying authentication..." 
        size="large"
        fullscreen
      />
    );
  }

  // Redirect to login if not authenticated
  if (!isAuthenticated) {
    return <Navigate to="/login" state={{ from: location }} replace />;
  }

  return <>{children}</>;
};

export default ProtectedRoute;