import { READER_TRANSLATIONS } from '../../hooks/useBibleReader.js';

// Every Bible the app can read in — used for a plan's own translation.
export default function TranslationSelect({ value, onChange, className = '' }) {
  return (
    <select value={value} onChange={(e) => onChange(e.target.value)}
      className={`rounded-lg border border-[var(--r-line)] bg-[var(--r-bg)] px-2 py-1 text-sm text-[var(--r-text)] ${className}`}>
      {READER_TRANSLATIONS.map((t) => <option key={t.id} value={t.id}>{t.id} · {t.name}</option>)}
    </select>
  );
}