import React from "react";
import { PickerModal, SelectOption } from "@/components/PickerModal";
import { AppLanguage } from "@/lib/language-store";

interface LanguageModalProps {
  visible: boolean;
  current: AppLanguage;
  onSelect: (lang: AppLanguage) => void;
  onClose: () => void;
}

export function LanguageModal({
  visible,
  current,
  onSelect,
  onClose,
}: LanguageModalProps) {
  const languages = [
    { value: "en", label: "English" },
    { value: "am", label: "Amharic" },
  ] as { value: AppLanguage; label: string }[];

  return (
    <PickerModal visible={visible} onClose={onClose} title="Language">
      {languages.map((opt) => (
        <SelectOption
          key={opt.value}
          label={opt.label}
          value={opt.value}
          selected={current === opt.value}
          onSelect={(v) => {
            onSelect(v as AppLanguage);
            onClose();
          }}
        />
      ))}
    </PickerModal>
  );
}