import { useEffect, useState } from 'react';

type UseI18nLanguagesProps = {
  apiUrl: string;
  endpoint?: string;
  mapper?: (response: any) => any;
};
function useI18nLanguages({
  apiUrl,
  endpoint = '/languages/load',
  mapper = ({ data }) => ({ data })
}: UseI18nLanguagesProps) {
  const [data, setData] = useState({ loading: true, languages: null });
  useEffect(() => {
    const headers = new Headers();
    headers.append('Accept', 'application/json');
    headers.append('Content-Type', 'application/json');
    fetch(`${apiUrl}${endpoint}`, { headers })
      .then((response) => response.json())
      .then((response) => setData({ loading: false, ...mapper(response) }));
  }, [apiUrl, endpoint, mapper]);

  return data;
}

export { useI18nLanguages };