import { useTranslation } from 'react-i18next';
import { useAvailableChains } from '../../hooks/useAvailableChains.js';
import type { FormTypeProps } from '../../stores/form/types.js';
import { FormKeyHelper } from '../../stores/form/types.js';
import { useFieldValues } from '../../stores/form/useFieldValues.js';
import { SearchNotFound } from '../Search/SearchNotFound.js';

export const TokenNotFound: React.FC<FormTypeProps> = ({ formType }) => {
  const { t } = useTranslation();
  const [selectedChainId] = useFieldValues(FormKeyHelper.getChainKey(formType));
  const { getChainById } = useAvailableChains();

  return (
    <SearchNotFound
      message={t('info.message.emptyTokenList', {
        chainName: getChainById(selectedChainId)?.name,
      })}
    />
  );
};