import { useEffect, useState } from "react";
import { LogoAnimation } from "@/components/portal/LogoAnimation";

/**
 * Shows the logo loading animation on initial app boot,
 * with a solid white background.
 */
export function InitialLoader() {
  const [visible, setVisible] = useState(true);

  useEffect(() => {
    const t = window.setTimeout(() => setVisible(false), 2500);
    return () => window.clearTimeout(t);
  }, []);

  if (!visible) return null;
  return (
    <div className="fixed inset-0 z-[9999] bg-white">
      <LogoAnimation duration={2500} />
    </div>
  );
}
