import { useCallback } from 'react';
import { useTranslation } from 'react-i18next';
import { useUIStore } from '../stores/ui.store';
import { type SupportedLanguage } from '../locales';

/**
 * Hook for managing language switching with proper synchronization
 * between i18n and UI store
 */
export function useLanguageSwitcher() {
  const { i18n } = useTranslation();
  const { language: uiLanguage, setLanguage: setUILanguage } = useUIStore();

  const changeLanguage = useCallback(async (newLanguage: SupportedLanguage) => {
    try {
      // Only change i18n language - let the i18n event handler update UI store
      await i18n.changeLanguage(newLanguage);
    } catch (error) {
      console.error('Failed to change language:', error);
    }
  }, [i18n]);

  const isChanging = i18n.isLanguageChangingTo !== false;

  return {
    currentLanguage: i18n.language as SupportedLanguage,
    changeLanguage,
    isChanging,
  };
}