import { useTranslations } from 'next-intl';
import { useCallback, useEffect, useState } from 'react';

type TranslatorFunction = ReturnType<typeof useTranslations>;
type TranslationValues = Parameters<TranslatorFunction>[1];

export const useMsg = (prefix: string) => {
  const msg = useTranslations();

  const pageMsg = useCallback(
    (
      key: string,
      values?: TranslationValues
    ): ReturnType<TranslatorFunction> => {
      return msg(`${prefix}_${key}`, values);
    },
    [msg, prefix]
  );

  return {
    pageMsg,
    msg,
  };
};

export const useMounted = () => {
  const [mounted, setMounted] = useState(false);

  useEffect(() => {
    setMounted(true);
  }, []);

  return mounted;
};