From ffb3fc4bf5b10acfc531b54bd50fa6fe1474d973 Mon Sep 17 00:00:00 2001 From: balibabu Date: Thu, 8 Aug 2024 17:52:45 +0800 Subject: [PATCH] feat: Add component BaiduFanyi #1739 (#1874) ### What problem does this PR solve? feat: Add component BaiduFanyi #1739 ### Type of change - [x] New Feature (non-breaking change which adds functionality) --- web/src/assets/svg/baidu-fanyi.svg | 6 ++ web/src/locales/en.ts | 55 +++++++++++++++ web/src/locales/zh-traditional.ts | 55 +++++++++++++++ web/src/locales/zh.ts | 55 +++++++++++++++ web/src/pages/flow/baidu-fanyi-form/index.tsx | 70 +++++++++++++++++++ web/src/pages/flow/constant.tsx | 61 ++++++++++++++++ web/src/pages/flow/flow-drawer/index.tsx | 2 + web/src/pages/flow/flow-sider/index.less | 2 + web/src/pages/flow/hooks.ts | 2 + 9 files changed, 308 insertions(+) create mode 100644 web/src/assets/svg/baidu-fanyi.svg create mode 100644 web/src/pages/flow/baidu-fanyi-form/index.tsx diff --git a/web/src/assets/svg/baidu-fanyi.svg b/web/src/assets/svg/baidu-fanyi.svg new file mode 100644 index 000000000..d2a34f6e9 --- /dev/null +++ b/web/src/assets/svg/baidu-fanyi.svg @@ -0,0 +1,6 @@ + + + \ No newline at end of file diff --git a/web/src/locales/en.ts b/web/src/locales/en.ts index 33f641cb9..93d5002a8 100644 --- a/web/src/locales/en.ts +++ b/web/src/locales/en.ts @@ -670,6 +670,61 @@ The above is the content you need to summarize.`, gitHub: 'GitHub', githubDescription: 'This component is used to search the repository from https://github.com/. Top N specifies the number of search results to be adjusted.', + baiduFanyi: 'BaiduFanyi', + baiduFanyiDescription: + 'This component is used to get translations from https://fanyi.baidu.com/. Typically, it provides a more specialized translation result', + appid: 'App id', + secretKey: 'Secret key', + domain: 'Domain', + transType: 'Translation type', + baiduSecretKeyOptions: { + translate: 'General translation', + fieldtranslate: 'Field translation', + }, + baiduDomainOptions: { + it: 'Information technology', + finance: 'Financial and economics', + machinery: 'Machinery manufacturing', + senimed: 'Biomedicine', + novel: 'Online literature', + academic: 'Academic paper', + aerospace: 'Aerospace', + wiki: 'Humanities and social sciences', + news: 'News and information', + law: 'Laws and regulations', + contract: 'Contract', + }, + baiduSourceLangOptions: { + auto: 'Auto detect', + zh: 'Chinese', + en: 'English', + yue: 'Cantonese', + wyw: 'Classical Chinese', + jp: 'Japanese', + kor: 'Korean', + fra: 'French', + spa: 'Spanish', + th: 'Thai', + ara: 'Arabic', + ru: 'Russian', + pt: 'Portuguese', + de: 'German', + it: 'Italian', + el: 'Greek', + nl: 'Dutch', + pl: 'Polish', + bul: 'Bulgarian', + est: 'Estonian', + dan: 'Danish', + fin: 'Finnish', + cs: 'Czech', + rom: 'Romanian', + slo: 'Slovenian', + swe: 'Swedish', + hu: 'Hungarian', + cht: 'Traditional Chinese', + vie: 'Vietnamese', + }, }, footer: { profile: 'All rights reserved @ React', diff --git a/web/src/locales/zh-traditional.ts b/web/src/locales/zh-traditional.ts index 4efdbf6ad..2096a8dea 100644 --- a/web/src/locales/zh-traditional.ts +++ b/web/src/locales/zh-traditional.ts @@ -628,6 +628,61 @@ export default { gitHub: 'GitHub', gitHubDescription: '此元件用於從 https://github.com/ 搜尋儲存庫。 Top N 指定要調整的搜尋結果的數量。', + baiduFanyi: '百度翻譯', + baiduFanyiDescription: + '此組件用於從https://fanyi.baidu.com/取得翻譯。通常，它提供更專業的翻譯結果', + appid: 'App id', + secretKey: '秘鑰', + domain: '領域', + transType: '翻譯類型', + baiduSecretKeyOptions: { + translate: '一般翻譯', + fieldtranslate: '領域翻譯', + }, + baiduDomainOptions: { + it: '資訊科技領域', + finance: '金融財經領域', + machinery: '機械製造領域', + senimed: '生物醫藥領域', + novel: '網路文學領域', + academic: '學術論文領域', + aerospace: '航空航太領域', + wiki: '人文社科領域', + news: '新聞資訊領域', + law: '法律法規領域', + contract: '合約領域', + }, + baiduSourceLangOptions: { + auto: '自動偵測', + zh: '中文', + en: '英語', + yue: '粵語', + wyw: '文言文', + jp: '日文', + kor: '韓文', + fra: '法文', + spa: '西班牙文', + th: '泰語', + ara: '阿拉伯語', + ru: '俄文', + pt: '葡萄牙語', + de: '德語', + it: '義大利語', + el: '希臘文', + nl: '荷蘭語', + pl: '波蘭語', + bul: '保加利亞語', + est: '愛沙尼亞語', + dan: '丹麥語', + fin: '芬蘭語', + cs: '捷克語', + rom: '羅馬尼亞語', + slo: '斯洛維尼亞語', + swe: '瑞典語', + hu: '匈牙利語', + cht: '繁體中文', + vie: '越南語', + }, }, footer: { profile: '“保留所有權利 @ react”', diff --git a/web/src/locales/zh.ts b/web/src/locales/zh.ts index 87f3eca33..dfdc378ea 100644 --- a/web/src/locales/zh.ts +++ b/web/src/locales/zh.ts @@ -646,6 +646,61 @@ export default { gitHub: 'GitHub', githubDescription: '该组件用于从 https://github.com/ 搜索仓库。Top N 指定需要调整的搜索结果数量。', + baiduFanyi: '百度翻译', + baiduFanyiDescription: + '该组件用于从 https://fanyi.baidu.com/ 获取翻译。通常，它提供更专业的翻译结果', + appid: 'App id', + secretKey: '秘钥', + domain: '领域', + transType: '翻译类型', + baiduSecretKeyOptions: { + translate: '通用翻译', + fieldtranslate: '领域翻译', + }, + baiduDomainOptions: { + it: '信息技术领域', + finance: '金融财经领域', + machinery: '机械制造领域', + senimed: '生物医药领域', + novel: '网络文学领域', + academic: '学术论文领域', + aerospace: '航空航天领域', + wiki: '人文社科领域', + news: '新闻资讯领域', + law: '法律法规领域', + contract: '合同领域', + }, + baiduSourceLangOptions: { + auto: '自动检测', + zh: '中文', + en: '英语', + yue: '粤语', + wyw: '文言文', + jp: '日语', + kor: '韩语', + fra: '法语', + spa: '西班牙语', + th: '泰语', + ara: '阿拉伯语', + ru: '俄语', + pt: '葡萄牙语', + de: '德语', + it: '意大利语', + el: '希腊语', + nl: '荷兰语', + pl: '波兰语', + bul: '保加利亚语', + est: '爱沙尼亚语', + dan: '丹麦语', + fin: '芬兰语', + cs: '捷克语', + rom: '罗马尼亚语', + slo: '斯洛文尼亚语', + swe: '瑞典语', + hu: '匈牙利语', + cht: '繁体中文', + vie: '越南语', + }, }, footer: { profile: 'All rights reserved @ React', diff --git a/web/src/pages/flow/baidu-fanyi-form/index.tsx b/web/src/pages/flow/baidu-fanyi-form/index.tsx new file mode 100644 index 000000000..2148c0bc8 --- /dev/null +++ b/web/src/pages/flow/baidu-fanyi-form/index.tsx @@ -0,0 +1,70 @@ +import { useTranslate } from '@/hooks/common-hooks'; +import { Form, Input, Select } from 'antd'; +import { useMemo } from 'react'; +import { + BaiduFanyiDomainOptions, + BaiduFanyiSourceLangOptions, +} from '../constant'; +import { IOperatorForm } from '../interface'; + +const BaiduFanyiForm = ({ onValuesChange, form }: IOperatorForm) => { + const { t } = useTranslate('flow'); + const options = useMemo(() => { + return ['translate', 'fieldtranslate'].map((x) => ({ + value: x, + label: t(`baiduSecretKeyOptions.${x}`), + })); + }, [t]); + + const baiduFanyiOptions = useMemo(() => { + return BaiduFanyiDomainOptions.map((x) => ({ + value: x, + label: t(`baiduDomainOptions.${x}`), + })); + }, [t]); + + const baiduFanyiSourceLangOptions = useMemo(() => { + return BaiduFanyiSourceLangOptions.map((x) => ({ + value: x, + label: t(`baiduSourceLangOptions.${x}`), + })); + }, [t]); + + return ( +
+ + + + + + + + + + + {({ getFieldValue }) => + getFieldValue('trans_type') === 'fieldtranslate' && ( + + + + ) + } + + + + + + + +
+ ); +}; + +export default BaiduFanyiForm; diff --git a/web/src/pages/flow/constant.tsx b/web/src/pages/flow/constant.tsx index 316578e7e..53e0c1eef 100644 --- a/web/src/pages/flow/constant.tsx +++ b/web/src/pages/flow/constant.tsx @@ -1,4 +1,5 @@ import { ReactComponent as ArXivIcon } from '@/assets/svg/arxiv.svg'; +import { ReactComponent as baiduFanyiIcon } from '@/assets/svg/baidu-fanyi.svg'; import { ReactComponent as BaiduIcon } from '@/assets/svg/baidu.svg'; import { ReactComponent as BingIcon } from '@/assets/svg/bing.svg'; import { ReactComponent as DeepLIcon } from '@/assets/svg/deepl.svg'; @@ -50,6 +51,7 @@ export enum Operator { GoogleScholar = 'GoogleScholar', DeepL = 'DeepL', GitHub = 'GitHub', + BaiduFanyi = 'BaiduFanyi', } export const operatorIconMap = { @@ -72,6 +74,7 @@ export const operatorIconMap = { [Operator.GoogleScholar]: GoogleScholarIcon, [Operator.DeepL]: DeepLIcon, [Operator.GitHub]: GithubIcon, + [Operator.BaiduFanyi]: baiduFanyiIcon, }; export const operatorMap = { @@ -157,6 +160,7 @@ export const operatorMap = { [Operator.GoogleScholar]: {}, [Operator.DeepL]: {}, [Operator.GitHub]: {}, + [Operator.BaiduFanyi]: {}, }; export const componentMenuList = [ @@ -214,6 +218,9 @@ export const componentMenuList = [ { name: Operator.GitHub, }, + { + name: Operator.BaiduFanyi, + }, ]; export const initialRetrievalValues = { @@ -327,6 +334,12 @@ export const initialGithubValues = { top_n: 5, }; +export const initialBaiduFanyiValues = { + appid: 'xxx', + secret_key: 'xxx', + trans_type: 'translate', +}; + export const CategorizeAnchorPointPositions = [ { top: 1, right: 34 }, { top: 8, right: 18 }, @@ -393,6 +406,7 @@ export const RestrictedUpstreamMap = { [Operator.GoogleScholar]: [Operator.Begin, Operator.Retrieval], [Operator.DeepL]: [Operator.Begin, Operator.Retrieval], [Operator.GitHub]: [Operator.Begin, Operator.Retrieval], + [Operator.BaiduFanyi]: [Operator.Begin, Operator.Retrieval], }; export const NodeMap = { @@ -415,6 +429,7 @@ export const NodeMap = { [Operator.GoogleScholar]: 'ragNode', [Operator.DeepL]: 'ragNode', [Operator.GitHub]: 'ragNode', + [Operator.BaiduFanyi]: 'ragNode', }; export const LanguageOptions = [ @@ -2452,3 +2467,49 @@ export const DeepLTargetLangOptions = [ { label: 'Ukrainian', value: 'UK' }, { label: 'Chinese (simplified)', value: 'ZH' }, ]; + +export const BaiduFanyiDomainOptions = [ + 'it', + 'finance', + 'machinery', + 'senimed', + 'novel', + 'academic', + 'aerospace', + 'wiki', + 'news', + 'law', + 'contract', +]; + +export const BaiduFanyiSourceLangOptions = [ + 'auto', + 'zh', + 'en', + 'yue', + 'wyw', + 'jp', + 'kor', + 'fra', + 'spa', + 'th', + 'ara', + 'ru', + 'pt', + 'de', + 'it', + 'el', + 'nl', + 'pl', + 'bul', + 'est', + 'dan', + 'fin', + 'cs', + 'rom', + 'slo', + 'swe', + 'hu', + 'cht', + 'vie', +]; diff --git a/web/src/pages/flow/flow-drawer/index.tsx b/web/src/pages/flow/flow-drawer/index.tsx index db74b9081..766d23da2 100644 --- a/web/src/pages/flow/flow-drawer/index.tsx +++ b/web/src/pages/flow/flow-drawer/index.tsx @@ -5,6 +5,7 @@ import { useEffect } from 'react'; import { Node } from 'reactflow'; import AnswerForm from '../answer-form'; import ArXivForm from '../arxiv-form'; +import BaiduFanyiForm from '../baidu-fanyi-form'; import BaiduForm from '../baidu-form'; import BeginForm from '../begin-form'; import BingForm from '../bing-form'; @@ -52,6 +53,7 @@ const FormMap = { [Operator.GoogleScholar]: GoogleScholarForm, [Operator.DeepL]: DeepLForm, [Operator.GitHub]: GithubForm, + [Operator.BaiduFanyi]: BaiduFanyiForm, }; const EmptyContent = () =>
empty
; diff --git a/web/src/pages/flow/flow-sider/index.less b/web/src/pages/flow/flow-sider/index.less index fcc738224..52d09a15c 100644 --- a/web/src/pages/flow/flow-sider/index.less +++ b/web/src/pages/flow/flow-sider/index.less @@ -11,4 +11,6 @@ .siderContent { padding: 10px 4px; + overflow: auto; + height: calc(100vh - 80px); } diff --git a/web/src/pages/flow/hooks.ts b/web/src/pages/flow/hooks.ts index 0f67f740d..204cfc000 100644 --- a/web/src/pages/flow/hooks.ts +++ b/web/src/pages/flow/hooks.ts @@ -31,6 +31,7 @@ import { Operator, RestrictedUpstreamMap, initialArXivValues, + initialBaiduFanyiValues, initialBaiduValues, initialBeginValues, initialBingValues, @@ -103,6 +104,7 @@ export const useInitializeOperatorParams = () => { [Operator.GoogleScholar]: initialGoogleScholarValues, [Operator.DeepL]: initialDeepLValues, [Operator.GitHub]: initialGithubValues, + [Operator.BaiduFanyi]: initialBaiduFanyiValues, }; }, [llmId]);