"use client";

import { Suspense, useEffect, useState } from "react";
import { useSearchParams, useRouter } from "next/navigation";
import Link from "next/link";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { AnimatedSection } from "@/components/animated-section";
import { SiteFooter } from "@/components/site-footer";
import { SiteBreadcrumbs } from "@/components/site-breadcrumbs";

function getCheckoutErrorMessage(errorCode: string | null): string {
  switch (errorCode) {
    case "payment_cancelled":
      return "پرداخت ناموفق بود یا توسط شما لغو شد.";
    case "payment_not_verified":
      return "پرداخت در درگاه تأیید نشد.";
    case "payment_not_found":
      return "اطلاعات پرداخت پیدا نشد.";
    case "invalid_gateway_response":
      return "پاسخ نامعتبر از درگاه دریافت شد.";
    case "payment_processing_error":
      return "در نهایی‌سازی پرداخت خطایی رخ داد.";
    default:
      return "";
  }
}

function CheckoutPageContent() {
  const searchParams = useSearchParams();
  const router = useRouter();
  const readingId = searchParams.get("readingId");
  const paymentError = searchParams.get("error");
  const debugEnabled = process.env.NEXT_PUBLIC_PAYMENT_FLOW_DEBUG === "true";
  const [couponCode, setCouponCode] = useState("");
  const [loading, setLoading] = useState(false);
  const [isGenerating, setIsGenerating] = useState(false);
  const [error, setError] = useState("");

  useEffect(() => {
    if (!readingId) router.replace("/reading");
  }, [readingId, router]);

  useEffect(() => {
    setError(getCheckoutErrorMessage(paymentError));
  }, [paymentError]);

  useEffect(() => {
    if (!debugEnabled) return;
    const params = Object.fromEntries(searchParams.entries());
    console.groupCollapsed("[CheckoutDebug] Checkout page loaded");
    console.log("params", params);
    console.log("readingId", readingId);
    console.log("error", paymentError);
    console.groupEnd();
  }, [debugEnabled, paymentError, readingId, searchParams]);

  async function handlePay() {
    if (!readingId) return;
    setError("");
    setLoading(true);
    setIsGenerating(false);
    try {
      if (debugEnabled) {
        console.groupCollapsed("[CheckoutDebug] Creating payment");
        console.log("readingId", readingId);
        console.log("couponCode", couponCode.trim() || null);
        console.groupEnd();
      }
      const createRes = await fetch("/api/checkout/create", {
        method: "POST",
        headers: { "Content-Type": "application/json" },
        body: JSON.stringify({
          readingId,
          couponCode: couponCode.trim() || undefined,
        }),
      });
      const createData = await createRes.json();
      if (debugEnabled) {
        console.groupCollapsed("[CheckoutDebug] Create response");
        console.log("status", createRes.status);
        console.log("ok", createRes.ok);
        console.log("data", createData);
        console.groupEnd();
      }
      if (!createRes.ok) {
        setError(createData.error ?? "خطا در ایجاد پرداخت");
        setLoading(false);
        return;
      }
      if (createData.redirectUrl) {
        if (debugEnabled) {
          console.groupCollapsed("[CheckoutDebug] Redirecting to gateway");
          console.log("redirectUrl", createData.redirectUrl);
          console.log("debug", createData.debug);
          console.groupEnd();
        }
        window.location.assign(createData.redirectUrl);
        return;
      }
      setIsGenerating(true);
      const confirmRes = await fetch("/api/checkout/confirm", {
        method: "POST",
        headers: { "Content-Type": "application/json" },
        body: JSON.stringify({ paymentIntentId: createData.paymentIntentId }),
      });
      const confirmData = await confirmRes.json();
      if (debugEnabled) {
        console.groupCollapsed("[CheckoutDebug] Confirm response");
        console.log("status", confirmRes.status);
        console.log("ok", confirmRes.ok);
        console.log("data", confirmData);
        console.groupEnd();
      }
      if (!confirmRes.ok) {
        setError(confirmData.error ?? "خطا در تأیید پرداخت");
        setIsGenerating(false);
        setLoading(false);
        return;
      }
      const targetReadingId = confirmData.readingId ?? readingId;
      if (debugEnabled) {
        const resultUrl = new URL(`/reading/result/${targetReadingId}`, window.location.origin);
        resultUrl.searchParams.set("paymentDebug", "1");
        if (confirmData.debug?.provider) resultUrl.searchParams.set("provider", confirmData.debug.provider);
        if (typeof confirmData.debug?.sandbox === "boolean") {
          resultUrl.searchParams.set("mode", confirmData.debug.sandbox ? "sandbox" : "production");
        }
        if (confirmData.paymentIntentId ?? createData.paymentIntentId) {
          resultUrl.searchParams.set(
            "authority",
            String(confirmData.paymentIntentId ?? createData.paymentIntentId)
          );
        }
        if (confirmData.debug?.stage) resultUrl.searchParams.set("stage", confirmData.debug.stage);
        if (confirmData.debug?.finalize?.flow) {
          resultUrl.searchParams.set("flow", confirmData.debug.finalize.flow);
        }
        if (typeof confirmData.debug?.finalize?.useAiReadings === "boolean") {
          resultUrl.searchParams.set(
            "useAi",
            confirmData.debug.finalize.useAiReadings ? "true" : "false"
          );
        }
        router.push(resultUrl.pathname + resultUrl.search);
        return;
      }
      router.push(`/reading/result/${targetReadingId}`);
    } catch (caughtError) {
      if (debugEnabled) {
        console.error("[CheckoutDebug] Unexpected checkout error", caughtError);
      }
      setError("خطایی رخ داد");
      setIsGenerating(false);
      setLoading(false);
    }
  }

  if (!readingId) return null;

  return (
    <div className="min-h-screen flex flex-col">
    <SiteBreadcrumbs />
    <div className="container mx-auto px-4 py-12 max-w-md flex-1">
      <AnimatedSection>
      <Card>
        <CardHeader>
          <CardTitle>پرداخت</CardTitle>
          <p className="text-sm text-muted-foreground">
            پس از انتقال به درگاه، پرداخت را تکمیل می‌کنید و به سایت بازگردانده می‌شوید.
          </p>
        </CardHeader>
        <CardContent className="space-y-4">
          <div>
            <label className="text-sm font-medium mb-2 block">کد تخفیف (اختیاری)</label>
            <Input
              value={couponCode}
              onChange={(e) => setCouponCode(e.target.value)}
              placeholder="کد تخفیف"
            />
          </div>
          {error && (
            <p className="text-sm text-destructive" role="alert">
              {error}
            </p>
          )}
          {loading && isGenerating && (
            <div className="rounded-lg border bg-muted/40 p-4">
              <div className="flex items-center justify-center gap-3 text-sm text-foreground">
                <span className="size-5 rounded-full border-2 border-primary/25 border-t-primary animate-spin" />
                <span>در حال آماده سازی</span>
              </div>
            </div>
          )}
          <Button
            className="w-full"
            onClick={handlePay}
            disabled={loading}
          >
            {loading ? (isGenerating ? "در حال آماده سازی..." : "در حال انتقال به درگاه...") : "پرداخت و مشاهده نتیجه"}
          </Button>
        </CardContent>
      </Card>
      </AnimatedSection>
      <AnimatedSection delay={0.15}>
        <p className="text-center mt-6">
          <Link href="/reading" className="text-sm underline text-muted-foreground">
            بازگشت به انتخاب فال
          </Link>
        </p>
      </AnimatedSection>
    </div>
    <SiteFooter />
    </div>
  );
}
export default function CheckoutPage() {
  return (
    <Suspense fallback={null}>
      <CheckoutPageContent />
    </Suspense>
  );
}