import { Modal, Space, Typography } from 'antd';
import useRichI18n from '@/hooks/useRichI18n';
import { $t } from '@/utils/i18n';
import usePopMeta from '../usePopMeta';

const { Text, Link } = Typography;

export default (props: {
  visible: boolean;
  popType: string;
  setVisible: (visible: boolean) => void;
}) => {
  const { visible, popType, setVisible } = props;
  const { popInfo = {} } = usePopMeta(popType);
  const { richFormat } = useRichI18n();
  return (
    <Modal
      title={popInfo.title}
      open={visible}
      footer={[
        <Space key="footer-space" className="justify-between w-100">
          <Link href={popInfo.pdfUrl} target="_blank">
            {$t('pages.config.pop.viewPdf')}
          </Link>
          <Link href={popInfo?.tips?.url} target="_blank">
            {popInfo?.tips?.name}
          </Link>
        </Space>,
      ]}
      onCancel={() => setVisible(false)}
    >
      <Space direction="vertical">
        {popInfo?.content?.map((item: string, index: number) => (
          <Text key={item}>
            <span>{index + 1}. </span>
            {richFormat(item)}
          </Text>
        ))}
      </Space>
    </Modal>
  );
};