import { Icon } from '@lobehub/ui';
import { useTheme } from 'antd-style';
import {
  Gamepad2,
  ImagePlay,
  LayoutPanelTop,
  MicroscopeIcon,
  PocketKnife,
  Receipt,
  ScanSearch,
  TwitterIcon,
  Umbrella,
  Star
} from 'lucide-react';
import { useTranslation } from 'react-i18next';

import { PluginCategory } from '@/types/discover';

import { ICON_SIZE } from '../../../components/CategoryMenu';

export const useCategory = (fontsize?: number) => {
  const theme = useTheme();

  const { t } = useTranslation('discover');

  const size = fontsize ? { fontSize: fontsize } : ICON_SIZE;

  return [
    {
      icon: <Icon color="#003BFF" icon={LayoutPanelTop} size={size} />,
      key: PluginCategory.All,
      label: t('category.plugin.all'),
    },
    {
      icon: <Icon color="#FFAD01" icon={Star} size={size} />,
      key: PluginCategory.Collect,
      label: t('category.plugin.collect'),
    },
    {
      icon: <Icon color="#FF4D4D" icon={ImagePlay} size={size} />,
      key: PluginCategory.MediaGenerate,
      label: t('category.plugin.media-generate'),
    },
    {
      icon: <Icon color="#5BD941" icon={ScanSearch} size={size} />,
      key: PluginCategory.WebSearch,
      label: t('category.plugin.web-search'),
    },
    {
      icon: <Icon color="#FF34AD" icon={Receipt} size={size} />,
      key: PluginCategory.StocksFinance,
      label: t('category.plugin.stocks-finance'),
    },
    {
      icon: <Icon color="#FF9B06" icon={PocketKnife} size={size} />,
      key: PluginCategory.Tools,
      label: t('category.plugin.tools'),
    },
    {
      icon: <Icon color="#0095FF" icon={Umbrella} size={size} />,
      key: PluginCategory.LifeStyle,
      label: t('category.plugin.life-style'),
    },
    {
      icon: <Icon color="#00B0CB" icon={MicroscopeIcon} size={size} />,
      key: PluginCategory.ScienceEducation,
      label: t('category.plugin.science-education'),
    },
    {
      icon: <Icon color="#E138FF" icon={TwitterIcon} size={size} />,
      key: PluginCategory.Social,
      label: t('category.plugin.social'),
    },
    {
      icon: <Icon color="#0CD66D" icon={Gamepad2} size={size} />,
      key: PluginCategory.GamingEntertainment,
      label: t('category.plugin.gaming-entertainment'),
    },
  ];
};

export const useCategoryItem = (key?: PluginCategory, fontsize?: number) => {
  const items = useCategory(fontsize);
  if (!key) return;
  return items.find((item) => item.key === key);
};
