'use client' import { useMemo, useState } from 'react' import { useTranslation } from 'react-i18next' import { useContext } from 'use-context-selector' import { RiAddCircleFill, RiArrowRightUpLine, RiBookOpenLine, } from '@remixicon/react' import MCPModal from './modal' import I18n from '@/context/i18n' import { getLanguage } from '@/i18n/language' import { useAppContext } from '@/context/app-context' import { useCreateMCP } from '@/service/use-tools' import type { ToolWithProvider } from '@/app/components/workflow/types' type Props = { handleCreate: (provider: ToolWithProvider) => void } const NewMCPCard = ({ handleCreate }: Props) => { const { t } = useTranslation() const { locale } = useContext(I18n) const language = getLanguage(locale) const { isCurrentWorkspaceManager } = useAppContext() const { mutateAsync: createMCP } = useCreateMCP() const create = async (info: any) => { const provider = await createMCP(info) handleCreate(provider) } const linkUrl = useMemo(() => { // TODO help link if (language.startsWith('zh_')) return 'https://docs.dify.ai/zh-hans/guides/tools/integrate-tool/mcp' return 'https://docs.dify.ai/en/guides/tools/integrate-tool/mcp' }, [language]) const [showModal, setShowModal] = useState(false) return ( <> {isCurrentWorkspaceManager && (