since3-portal/modules/shared/ui/components/terms-dialog.tsx

"use client";

import { useState } from "react";
import { acceptTerms } from "../../actions/acceptTerms";
import { useRouter } from "next/navigation";
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter } from "@/components/ui/dialog";
import { Button } from "@/components/ui/button";


export function TermsDialog() {
    const [open, setOpen] = useState(true);
    const [pending, setPending] = useState(false);
    const [error, setError] = useState<string | null>(null);
    const router = useRouter();

    async function handleAccept() {
        setPending(true);
        setError(null);

        try {
            const result = await acceptTerms();

            if (result && "success" in result) {
                setOpen(false);
                router.refresh();
            } else {
                setError(result?.error ?? "Zustimmung konnte nicht gespeichert werden.");
            }
        } catch {
            setError("Zustimmung konnte nicht gespeichert werden. Bitte erneut versuchen.");
        } finally {
            setPending(false);
        }
    }

    return (
        <Dialog open={open} onOpenChange={() => {}}>
            <DialogContent showCloseButton={false}>
                <DialogHeader>
                    <DialogTitle>Nutzungsbedingungen</DialogTitle>
                    <DialogDescription>
                        Bitte lies unsere{" "}
                        <a href="/terms" target="_blank" rel="noopener noreferrer">
                            Nutzungsbedingungen
                        </a>{" "}
                        und akzeptiere sie, um fortzufahren.
                    </DialogDescription>
                </DialogHeader>
                {error && <p className="text-sm text-destructive">{error}</p>}
                <DialogFooter>
                    <Button onClick={handleAccept} disabled={pending}>
                        {pending ? "..." : "Akzeptieren"}
                    </Button>
                </DialogFooter>
            </DialogContent>
        </Dialog>
    )
}