import { GET } from "@/utils/get";
import { SurveyInterface } from "./_components/survey-interface";
import { Card, CardContent } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import { Lock } from "lucide-react";
import { getTranslations } from "next-intl/server";

export default async function SurveyIdPage({ params }: { params: Promise<{ id: string }> }) {
    const t = await getTranslations();
    const { id } = await params;
    
    // We pass context: "dashboard" so that if the user has a token in cookies, GET will append it
    const surveyData = await GET({ url: `/reviews-public/pass/${id}`, context: "dashboard" }) as any;
    
    if (!surveyData) {
        return (
            <div className="min-h-screen flex items-center justify-center bg-gray-50 flex-1">
                <Card className="max-w-md w-full p-6 text-center shadow-lg border-t-4 border-t-red-500">
                    <CardContent className="flex flex-col items-center gap-4 pt-4">
                        <h2 className="text-xl font-bold">حدث خطأ</h2>
                        <p className="text-gray-600">لا يمكن تحميل هذا الاستبيان في الوقت الحالي.</p>
                        <Button onClick={() => window.location.href = '/surveys'} variant="outline">
                            العودة للاستبيانات
                        </Button>
                    </CardContent>
                </Card>
            </div>
        );
    }

    if (surveyData.success === false && surveyData.need_auth === true) {
        return (
            <section className="min-h-screen flex flex-col items-center justify-center p-4 bg-gray-50 flex-1">
                <Card className="max-w-md w-full pt-8 shadow-xl border-t-4 border-t-purple-600">
                    <CardContent className="flex flex-col items-center text-center gap-4">
                        <div className="size-16 rounded-full bg-purple-100 flex items-center justify-center">
                            <Lock className="size-8 text-purple-600" />
                        </div>
                        <h2 className="text-xl font-bold mt-2">تسجيل الدخول مطلوب</h2>
                        <p className="text-gray-600">
                            عذراً، هذا الاستبيان يتطلب تسجيل الدخول.
                        </p>
                       
                        
                        <Button asChild className="mt-4 bg-purple-600 hover:bg-purple-700 w-full" size="lg">
                            <a href={surveyData.backend_login_url || "/login"} target="_blank" rel="noopener noreferrer">
                                تسجيل الدخول الآن
                            </a>
                        </Button>
                        <Button asChild variant="ghost" className="w-full text-purple-600 hover:text-purple-700">
                            <a href="/surveys">العودة للاستبيانات</a>
                        </Button>
                    </CardContent>
                </Card>
            </section>
        )
    }

    return (
        <SurveyInterface surveyData={surveyData} />
    );
}