f3c4ce4e76
Tıklamada buton içeriği "Ödeme sayfasına yönlendiriliyorsun…" ile değişiyordu; dar top-up kartında metin taşıyordu. Çift gönderim zaten `disabled` ile engelleniyor. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
53 lines
1.4 KiB
TypeScript
53 lines
1.4 KiB
TypeScript
"use client";
|
||
|
||
import { useActionState, useEffect } from "react";
|
||
import { ArrowRight } from "lucide-react";
|
||
import { toast } from "sonner";
|
||
import { Button } from "@/components/ui/button";
|
||
import { olay } from "@/lib/analitik";
|
||
import { baslatOdeme, type OdemeBaslatDurum } from "../odeme-actions";
|
||
|
||
export function SatinAlForm({
|
||
urun,
|
||
label,
|
||
vurgulu = false,
|
||
}: {
|
||
urun: "paket" | "topup";
|
||
label: string;
|
||
vurgulu?: boolean;
|
||
}) {
|
||
const [state, formAction, pending] = useActionState<
|
||
OdemeBaslatDurum,
|
||
FormData
|
||
>(baslatOdeme, undefined);
|
||
|
||
useEffect(() => {
|
||
if (state?.error) toast.error(state.error);
|
||
}, [state]);
|
||
|
||
return (
|
||
<form
|
||
action={formAction}
|
||
onSubmit={() => olay("odeme_baslatildi", { urun })}
|
||
>
|
||
<input type="hidden" name="urun" value={urun} />
|
||
<Button
|
||
type="submit"
|
||
disabled={pending}
|
||
className={
|
||
vurgulu
|
||
? "h-12 w-full cursor-pointer bg-orange-500 px-8 text-white transition-colors duration-200 hover:bg-orange-600"
|
||
: "h-11 w-full cursor-pointer"
|
||
}
|
||
variant={vurgulu ? "default" : "outline"}
|
||
>
|
||
{/* Tıklamada buton içeriği değişmez (metin/spinner takası yok); dar
|
||
top-up kartında taşmaya yol açıyordu. Çift gönderim `disabled`
|
||
ile engellenir. */}
|
||
{label}
|
||
<ArrowRight className="size-4" aria-hidden />
|
||
</Button>
|
||
</form>
|
||
);
|
||
}
|