Protected Routes

"use client";

import { LockKeyhole } from "lucide-react";
import { useAuth } from "@authingo/react";

type ProtectedRouteProps = {
  children: React.ReactNode;
  fallback: React.ReactNode;
};

export function ProtectedRoute({ children, fallback }: ProtectedRouteProps) {
  const { user, isLoading } = useAuth();

  if (isLoading) {
    return (
      <section className="route-card compact">
        <LockKeyhole size={22} />
        <div>
          <p className="eyebrow">Checking Session</p>
          <h1>Verifying access</h1>
        </div>
      </section>
    );
  }

  if (!user) {
    return fallback;
  }

  return <>{children}</>;
}