import { useEffect } from "react";
import { useNavigate } from "react-router-dom";
import { useAuth } from "@/lib/auth-context";
import { toast } from "@/lib/custom-toast";
import { Button } from "@/components/ui/button";

const Index = () => {
  const navigate = useNavigate();
  const { isAuthenticated } = useAuth();

  const testToast = () => {
    toast.success("This toast should appear at bottom-right!");
  };

  useEffect(() => {
    // Redirect to the landing page
    try {
      navigate("/", { replace: true });
    } catch (error) {
      console.error("Navigation failed:", error);
      // Fallback for Capacitor
      window.location.href = "/";
    }
  }, [navigate]);

  // Return a loading indicator while redirecting
  return (
    <div className="h-full flex flex-col items-center justify-center">
      <div className="animate-pulse text-primary font-medium mb-4">Redirecting...</div>
      <Button onClick={testToast} variant="default">Test Bottom-Right Toast</Button>
    </div>
  );
};

export default Index;