"use client";

import { Button } from "@/components/ui/button";
import {
  Dialog,
  DialogContent,
  DialogDescription,
  DialogHeader,
  DialogTitle,
} from "@/components/ui/dialog";
import {
  ExportLanguageOption,
  type ExportLanguage,
} from "@/components/public/export-language";

export function ExportLanguageDialog({
  open,
  onOpenChange,
  onSelect,
}: {
  open: boolean;
  onOpenChange: (open: boolean) => void;
  onSelect: (language: ExportLanguage) => void;
}) {
  return (
    <Dialog open={open} onOpenChange={onOpenChange}>
      <DialogContent>
        <DialogHeader>
          <DialogTitle>เลือกภาษาในภาพ</DialogTitle>
          <DialogDescription>What language do you want?</DialogDescription>
        </DialogHeader>
        <div className="flex gap-2">
          <Button
            type="button"
            variant="secondary"
            className="flex-1"
            onClick={() => onSelect("th")}
          >
            <ExportLanguageOption language="th" />
          </Button>
          <Button
            type="button"
            variant="secondary"
            className="flex-1"
            onClick={() => onSelect("en")}
          >
            <ExportLanguageOption language="en" />
          </Button>
        </div>
      </DialogContent>
    </Dialog>
  );
}