import React from 'react';
import { Language } from '../types';
import { Globe } from 'lucide-react';

interface Props {
  lang: Language;
  setLang: (lang: Language) => void;
}

const LanguageToggle: React.FC<Props> = ({ lang, setLang }) => {
  return (
    <button
      onClick={() => setLang(lang === 'en' ? 'zh' : 'en')}
      className="flex items-center gap-2 px-4 py-2 rounded-full bg-slate-100 hover:bg-slate-200 transition-colors text-slate-700 font-medium"
      aria-label="Toggle Language"
    >
      <Globe size={18} />
      <span>{lang === 'en' ? '中文' : 'English'}</span>
    </button>
  );
};

export default LanguageToggle;