From 4e78b50b2d3a7486cc7b8dc55e5a4e26cf0bce0f Mon Sep 17 00:00:00 2001
From: Pylogmon <pylogmon@outlook.com>
Date: Sun, 23 Jun 2024 18:34:14 +0800
Subject: [PATCH] feat: support multiple instance for translate service

---
 src/hooks/useConfig.jsx                       |  7 +--
 src/services/translate/alibaba/Config.jsx     | 29 ++++++++--
 src/services/translate/alibaba/index.jsx      |  8 +--
 src/services/translate/baidu/Config.jsx       | 29 ++++++++--
 src/services/translate/baidu/index.jsx        |  8 +--
 src/services/translate/baidu_field/Config.jsx | 30 +++++++++--
 src/services/translate/baidu_field/index.jsx  |  8 +--
 src/services/translate/caiyun/Config.jsx      | 29 ++++++++--
 src/services/translate/caiyun/index.jsx       |  8 +--
 src/services/translate/chatglm/Config.jsx     | 29 ++++++++--
 src/services/translate/chatglm/index.jsx      |  7 +--
 src/services/translate/deepl/Config.jsx       | 29 ++++++++--
 src/services/translate/deepl/index.jsx        | 11 ++--
 src/services/translate/geminipro/Config.jsx   | 29 ++++++++--
 src/services/translate/geminipro/index.jsx    |  7 +--
 src/services/translate/google/Config.jsx      | 29 ++++++++--
 src/services/translate/google/index.jsx       |  8 +--
 src/services/translate/niutrans/Config.jsx    | 29 ++++++++--
 src/services/translate/niutrans/index.jsx     |  9 +---
 src/services/translate/ollama/Config.jsx      | 34 +++++++++---
 src/services/translate/ollama/index.jsx       |  7 +--
 src/services/translate/openai/Config.jsx      | 54 +++++++++----------
 src/services/translate/tencent/Config.jsx     | 33 +++++++++---
 src/services/translate/tencent/index.jsx      |  8 +--
 src/services/translate/transmart/Config.jsx   | 29 ++++++++--
 src/services/translate/transmart/index.jsx    |  8 +--
 src/services/translate/volcengine/Config.jsx  | 29 ++++++++--
 src/services/translate/volcengine/index.jsx   |  8 +--
 src/services/translate/youdao/Config.jsx      | 29 ++++++++--
 src/services/translate/youdao/index.jsx       |  8 +--
 .../pages/Service/PluginConfig/index.jsx      | 29 ++++++++--
 31 files changed, 427 insertions(+), 192 deletions(-)

diff --git a/src/hooks/useConfig.jsx b/src/hooks/useConfig.jsx
index 1f1f31125a..5559507ff2 100644
--- a/src/hooks/useConfig.jsx
+++ b/src/hooks/useConfig.jsx
@@ -13,7 +13,8 @@ export const useConfig = (key, defaultValue, options = {}) => {
         debounce((v) => {
             store.set(key, v);
             store.save();
-            emit(`${key}_changed`, v);
+            let eventKey = key.replaceAll('.', '_').replaceAll('@', ':');
+            emit(`${eventKey}_changed`, v);
         }),
         []
     );
@@ -44,8 +45,8 @@ export const useConfig = (key, defaultValue, options = {}) => {
     // 初始化
     useEffect(() => {
         syncToState(null);
-        if (key.includes('[')) return;
-        const unlisten = listen(`${key}_changed`, (e) => {
+        const eventKey = key.replaceAll('.', '_').replaceAll('@', ':');
+        const unlisten = listen(`${eventKey}_changed`, (e) => {
             syncToState(e.payload);
         });
         return () => {
diff --git a/src/services/translate/alibaba/Config.jsx b/src/services/translate/alibaba/Config.jsx
index 953103d7e1..a34f608b3e 100644
--- a/src/services/translate/alibaba/Config.jsx
+++ b/src/services/translate/alibaba/Config.jsx
@@ -1,3 +1,4 @@
+import { INSTANCE_NAME_CONFIG_KEY } from '../../../utils/service_instance';
 import { Input, Button } from '@nextui-org/react';
 import toast, { Toaster } from 'react-hot-toast';
 import { useTranslation } from 'react-i18next';
@@ -10,10 +11,12 @@ import { translate } from './index';
 import { Language } from './index';
 
 export function Config(props) {
-    const { updateServiceList, onClose } = props;
+    const { instanceKey, updateServiceList, onClose } = props;
+    const { t } = useTranslation();
     const [config, setConfig] = useConfig(
-        'alibaba',
+        instanceKey,
         {
+            [INSTANCE_NAME_CONFIG_KEY]: t('services.translate.alibaba.title'),
             accesskey_id: '',
             accesskey_secret: '',
         },
@@ -21,7 +24,6 @@ export function Config(props) {
     );
     const [isLoading, setIsLoading] = useState(false);
 
-    const { t } = useTranslation();
     const toastStyle = useToastStyle();
 
     return (
@@ -34,7 +36,7 @@ export function Config(props) {
                         () => {
                             setIsLoading(false);
                             setConfig(config, true);
-                            updateServiceList('alibaba');
+                            updateServiceList(instanceKey);
                             onClose();
                         },
                         (e) => {
@@ -45,6 +47,25 @@ export function Config(props) {
                 }}
             >
                 <Toaster />
+                <div className='config-item'>
+                    <Input
+                        label={t('services.instance_name')}
+                        labelPlacement='outside-left'
+                        value={config[INSTANCE_NAME_CONFIG_KEY]}
+                        variant='bordered'
+                        classNames={{
+                            base: 'justify-between',
+                            label: 'text-[length:--nextui-font-size-medium]',
+                            mainWrapper: 'max-w-[50%]',
+                        }}
+                        onValueChange={(value) => {
+                            setConfig({
+                                ...config,
+                                [INSTANCE_NAME_CONFIG_KEY]: value,
+                            });
+                        }}
+                    />
+                </div>
                 <div className={'config-item'}>
                     <h3 className='my-auto'>{t('services.help')}</h3>
                     <Button
diff --git a/src/services/translate/alibaba/index.jsx b/src/services/translate/alibaba/index.jsx
index bd2ed390a1..90091b6a2d 100644
--- a/src/services/translate/alibaba/index.jsx
+++ b/src/services/translate/alibaba/index.jsx
@@ -1,17 +1,11 @@
 import { fetch } from '@tauri-apps/api/http';
-import { store } from '../../../utils/store';
 import HmacSHA1 from 'crypto-js/hmac-sha1';
 import base64 from 'crypto-js/enc-base64';
 
 export async function translate(text, from, to, options = {}) {
     const { config } = options;
 
-    let translateConfig = (await store.get('alibaba')) ?? {};
-    if (config !== undefined) {
-        translateConfig = config;
-    }
-
-    const { accesskey_id, accesskey_secret } = translateConfig;
+    const { accesskey_id, accesskey_secret } = config;
 
     function getRandomNumber() {
         const rand = Math.floor(Math.random() * 99999) + 100000;
diff --git a/src/services/translate/baidu/Config.jsx b/src/services/translate/baidu/Config.jsx
index d39b0687ac..91f1660a39 100644
--- a/src/services/translate/baidu/Config.jsx
+++ b/src/services/translate/baidu/Config.jsx
@@ -1,3 +1,4 @@
+import { INSTANCE_NAME_CONFIG_KEY } from '../../../utils/service_instance';
 import { Input, Button } from '@nextui-org/react';
 import toast, { Toaster } from 'react-hot-toast';
 import { useTranslation } from 'react-i18next';
@@ -10,10 +11,12 @@ import { translate } from './index';
 import { Language } from './index';
 
 export function Config(props) {
-    const { updateServiceList, onClose } = props;
+    const { instanceKey, updateServiceList, onClose } = props;
+    const { t } = useTranslation();
     const [config, setConfig] = useConfig(
-        'baidu',
+        instanceKey,
         {
+            [INSTANCE_NAME_CONFIG_KEY]: t('services.translate.baidu.title'),
             appid: '',
             secret: '',
         },
@@ -21,7 +24,6 @@ export function Config(props) {
     );
     const [isLoading, setIsLoading] = useState(false);
 
-    const { t } = useTranslation();
     const toastStyle = useToastStyle();
 
     return (
@@ -34,7 +36,7 @@ export function Config(props) {
                         () => {
                             setIsLoading(false);
                             setConfig(config, true);
-                            updateServiceList('baidu');
+                            updateServiceList(instanceKey);
                             onClose();
                         },
                         (e) => {
@@ -45,6 +47,25 @@ export function Config(props) {
                 }}
             >
                 <Toaster />
+                <div className='config-item'>
+                    <Input
+                        label={t('services.instance_name')}
+                        labelPlacement='outside-left'
+                        value={config[INSTANCE_NAME_CONFIG_KEY]}
+                        variant='bordered'
+                        classNames={{
+                            base: 'justify-between',
+                            label: 'text-[length:--nextui-font-size-medium]',
+                            mainWrapper: 'max-w-[50%]',
+                        }}
+                        onValueChange={(value) => {
+                            setConfig({
+                                ...config,
+                                [INSTANCE_NAME_CONFIG_KEY]: value,
+                            });
+                        }}
+                    />
+                </div>
                 <div className={'config-item'}>
                     <h3 className='my-auto'>{t('services.help')}</h3>
                     <Button
diff --git a/src/services/translate/baidu/index.jsx b/src/services/translate/baidu/index.jsx
index e243dce48d..fc451e0e47 100644
--- a/src/services/translate/baidu/index.jsx
+++ b/src/services/translate/baidu/index.jsx
@@ -1,17 +1,11 @@
 import { fetch } from '@tauri-apps/api/http';
-import { store } from '../../../utils/store';
 import { nanoid } from 'nanoid';
 import md5 from 'md5';
 
 export async function translate(text, from, to, options = {}) {
     const { config } = options;
 
-    let translateConfig = (await store.get('baidu')) ?? {};
-    if (config !== undefined) {
-        translateConfig = config;
-    }
-
-    const { appid, secret } = translateConfig;
+    const { appid, secret } = config;
 
     const url = 'https://fanyi-api.baidu.com/api/trans/vip/translate';
 
diff --git a/src/services/translate/baidu_field/Config.jsx b/src/services/translate/baidu_field/Config.jsx
index 39afe4f5d9..07eba11659 100644
--- a/src/services/translate/baidu_field/Config.jsx
+++ b/src/services/translate/baidu_field/Config.jsx
@@ -1,3 +1,4 @@
+import { INSTANCE_NAME_CONFIG_KEY } from '../../../utils/service_instance';
 import { DropdownTrigger } from '@nextui-org/react';
 import { Input, Button } from '@nextui-org/react';
 import { DropdownMenu } from '@nextui-org/react';
@@ -14,10 +15,12 @@ import { translate } from './index';
 import { Language } from './index';
 
 export function Config(props) {
-    const { updateServiceList, onClose } = props;
+    const { instanceKey, updateServiceList, onClose } = props;
+    const { t } = useTranslation();
     const [config, setConfig] = useConfig(
-        'baidu_field',
+        instanceKey,
         {
+            [INSTANCE_NAME_CONFIG_KEY]: t('services.translate.baidu_field.title'),
             appid: '',
             secret: '',
             field: 'it',
@@ -38,7 +41,7 @@ export function Config(props) {
         'law',
         'contract',
     ];
-    const { t } = useTranslation();
+
     const toastStyle = useToastStyle();
 
     return (
@@ -51,7 +54,7 @@ export function Config(props) {
                         () => {
                             setIsLoading(false);
                             setConfig(config, true);
-                            updateServiceList('baidu_field');
+                            updateServiceList(instanceKey);
                             onClose();
                         },
                         (e) => {
@@ -62,6 +65,25 @@ export function Config(props) {
                 }}
             >
                 <Toaster />
+                <div className='config-item'>
+                    <Input
+                        label={t('services.instance_name')}
+                        labelPlacement='outside-left'
+                        value={config[INSTANCE_NAME_CONFIG_KEY]}
+                        variant='bordered'
+                        classNames={{
+                            base: 'justify-between',
+                            label: 'text-[length:--nextui-font-size-medium]',
+                            mainWrapper: 'max-w-[50%]',
+                        }}
+                        onValueChange={(value) => {
+                            setConfig({
+                                ...config,
+                                [INSTANCE_NAME_CONFIG_KEY]: value,
+                            });
+                        }}
+                    />
+                </div>
                 <div className={'config-item'}>
                     <h3 className='my-auto'>{t('services.help')}</h3>
                     <Button
diff --git a/src/services/translate/baidu_field/index.jsx b/src/services/translate/baidu_field/index.jsx
index 4409557be4..10a061b56a 100644
--- a/src/services/translate/baidu_field/index.jsx
+++ b/src/services/translate/baidu_field/index.jsx
@@ -1,17 +1,11 @@
 import { fetch } from '@tauri-apps/api/http';
-import { store } from '../../../utils/store';
 import { nanoid } from 'nanoid';
 import md5 from 'md5';
 
 export async function translate(text, from, to, options = {}) {
     const { config } = options;
 
-    let translateConfig = (await store.get('baidu_field')) ?? {};
-    if (config !== undefined) {
-        translateConfig = config;
-    }
-
-    const { appid, secret, field } = translateConfig;
+    const { appid, secret, field } = config;
 
     const url = 'https://fanyi-api.baidu.com/api/trans/vip/fieldtranslate';
 
diff --git a/src/services/translate/caiyun/Config.jsx b/src/services/translate/caiyun/Config.jsx
index d6c87814ec..9f4afc0e2a 100644
--- a/src/services/translate/caiyun/Config.jsx
+++ b/src/services/translate/caiyun/Config.jsx
@@ -1,3 +1,4 @@
+import { INSTANCE_NAME_CONFIG_KEY } from '../../../utils/service_instance';
 import { Input, Button } from '@nextui-org/react';
 import toast, { Toaster } from 'react-hot-toast';
 import { useTranslation } from 'react-i18next';
@@ -10,17 +11,18 @@ import { translate } from './index';
 import { Language } from './index';
 
 export function Config(props) {
-    const { updateServiceList, onClose } = props;
+    const { instanceKey, updateServiceList, onClose } = props;
+    const { t } = useTranslation();
     const [config, setConfig] = useConfig(
-        'caiyun',
+        instanceKey,
         {
+            [INSTANCE_NAME_CONFIG_KEY]: t('services.translate.caiyun.title'),
             token: '',
         },
         { sync: false }
     );
     const [isLoading, setIsLoading] = useState(false);
 
-    const { t } = useTranslation();
     const toastStyle = useToastStyle();
 
     return (
@@ -33,7 +35,7 @@ export function Config(props) {
                         () => {
                             setIsLoading(false);
                             setConfig(config, true);
-                            updateServiceList('caiyun');
+                            updateServiceList(instanceKey);
                             onClose();
                         },
                         (e) => {
@@ -44,6 +46,25 @@ export function Config(props) {
                 }}
             >
                 <Toaster />
+                <div className='config-item'>
+                    <Input
+                        label={t('services.instance_name')}
+                        labelPlacement='outside-left'
+                        value={config[INSTANCE_NAME_CONFIG_KEY]}
+                        variant='bordered'
+                        classNames={{
+                            base: 'justify-between',
+                            label: 'text-[length:--nextui-font-size-medium]',
+                            mainWrapper: 'max-w-[50%]',
+                        }}
+                        onValueChange={(value) => {
+                            setConfig({
+                                ...config,
+                                [INSTANCE_NAME_CONFIG_KEY]: value,
+                            });
+                        }}
+                    />
+                </div>
                 <div className={'config-item'}>
                     <h3 className='my-auto'>{t('services.help')}</h3>
                     <Button
diff --git a/src/services/translate/caiyun/index.jsx b/src/services/translate/caiyun/index.jsx
index b5477476c8..21e07be52a 100644
--- a/src/services/translate/caiyun/index.jsx
+++ b/src/services/translate/caiyun/index.jsx
@@ -1,15 +1,9 @@
 import { fetch, Body } from '@tauri-apps/api/http';
-import { store } from '../../../utils/store';
 
 export async function translate(text, from, to, options = {}) {
     const { config } = options;
 
-    let translateConfig = (await store.get('caiyun')) ?? {};
-    if (config !== undefined) {
-        translateConfig = config;
-    }
-
-    const { token } = translateConfig;
+    const { token } = config;
 
     const url = 'https://api.interpreter.caiyunai.com/v1/translator';
 
diff --git a/src/services/translate/chatglm/Config.jsx b/src/services/translate/chatglm/Config.jsx
index f011c3b1c2..405e8f7d22 100644
--- a/src/services/translate/chatglm/Config.jsx
+++ b/src/services/translate/chatglm/Config.jsx
@@ -1,3 +1,4 @@
+import { INSTANCE_NAME_CONFIG_KEY } from '../../../utils/service_instance';
 import { Input, Button, Textarea } from '@nextui-org/react';
 import { DropdownTrigger } from '@nextui-org/react';
 import { MdDeleteOutline } from 'react-icons/md';
@@ -15,10 +16,12 @@ import { translate } from './index';
 import { Language } from './index';
 
 export function Config(props) {
-    const { updateServiceList, onClose } = props;
+    const { instanceKey, updateServiceList, onClose } = props;
+    const { t } = useTranslation();
     const [serviceConfig, setServiceConfig] = useConfig(
-        'chatglm',
+        instanceKey,
         {
+            [INSTANCE_NAME_CONFIG_KEY]: t('services.translate.chatglm.title'),
             model: 'chatglm_turbo',
             apiKey: '',
             promptList: [
@@ -37,7 +40,6 @@ export function Config(props) {
     );
     const [isLoading, setIsLoading] = useState(false);
 
-    const { t } = useTranslation();
     const toastStyle = useToastStyle();
 
     return (
@@ -50,7 +52,7 @@ export function Config(props) {
                         () => {
                             setIsLoading(false);
                             setServiceConfig(serviceConfig, true);
-                            updateServiceList('chatglm');
+                            updateServiceList(instanceKey);
                             onClose();
                         },
                         (e) => {
@@ -61,6 +63,25 @@ export function Config(props) {
                 }}
             >
                 <Toaster />
+                <div className='config-item'>
+                    <Input
+                        label={t('services.instance_name')}
+                        labelPlacement='outside-left'
+                        value={serviceConfig[INSTANCE_NAME_CONFIG_KEY]}
+                        variant='bordered'
+                        classNames={{
+                            base: 'justify-between',
+                            label: 'text-[length:--nextui-font-size-medium]',
+                            mainWrapper: 'max-w-[50%]',
+                        }}
+                        onValueChange={(value) => {
+                            setServiceConfig({
+                                ...serviceConfig,
+                                [INSTANCE_NAME_CONFIG_KEY]: value,
+                            });
+                        }}
+                    />
+                </div>
                 <div className='config-item'>
                     <h3 className='my-auto'>{t('services.help')}</h3>
                     <Button
diff --git a/src/services/translate/chatglm/index.jsx b/src/services/translate/chatglm/index.jsx
index 597b9a3817..22b0840482 100644
--- a/src/services/translate/chatglm/index.jsx
+++ b/src/services/translate/chatglm/index.jsx
@@ -1,15 +1,10 @@
-import { store } from '../../../utils/store';
 import { Language } from './info';
 import * as jose from 'jose';
 
 export async function translate(text, from, to, options = {}) {
     const { config, setResult, detect } = options;
 
-    let translateConfig = await store.get('chatglm');
-    if (config !== undefined) {
-        translateConfig = config;
-    }
-    let { model, apiKey, promptList } = translateConfig;
+    let { model, apiKey, promptList } = config;
 
     let [id, secret] = apiKey.split('.');
     if (id === undefined || secret === undefined) {
diff --git a/src/services/translate/deepl/Config.jsx b/src/services/translate/deepl/Config.jsx
index 56443817fe..d1f1f1e04f 100644
--- a/src/services/translate/deepl/Config.jsx
+++ b/src/services/translate/deepl/Config.jsx
@@ -1,3 +1,4 @@
+import { INSTANCE_NAME_CONFIG_KEY } from '../../../utils/service_instance';
 import { DropdownTrigger } from '@nextui-org/react';
 import { Input, Button } from '@nextui-org/react';
 import { DropdownMenu } from '@nextui-org/react';
@@ -14,10 +15,12 @@ import { translate } from './index';
 import { Language } from './index';
 
 export function Config(props) {
-    const { updateServiceList, onClose } = props;
+    const { instanceKey, updateServiceList, onClose } = props;
+    const { t } = useTranslation();
     const [deeplConfig, setDeeplConfig] = useConfig(
-        'deepl',
+        instanceKey,
         {
+            [INSTANCE_NAME_CONFIG_KEY]: t('services.translate.deepl.title'),
             type: 'free',
             authKey: '',
             customUrl: '',
@@ -26,7 +29,6 @@ export function Config(props) {
     );
     const [isLoading, setIsLoading] = useState(false);
 
-    const { t } = useTranslation();
     const toastStyle = useToastStyle();
 
     return (
@@ -39,7 +41,7 @@ export function Config(props) {
                         () => {
                             setIsLoading(false);
                             setDeeplConfig(deeplConfig, true);
-                            updateServiceList('deepl');
+                            updateServiceList(instanceKey);
                             onClose();
                         },
                         (e) => {
@@ -50,6 +52,25 @@ export function Config(props) {
                 }}
             >
                 <Toaster />
+                <div className='config-item'>
+                    <Input
+                        label={t('services.instance_name')}
+                        labelPlacement='outside-left'
+                        value={deeplConfig[INSTANCE_NAME_CONFIG_KEY]}
+                        variant='bordered'
+                        classNames={{
+                            base: 'justify-between',
+                            label: 'text-[length:--nextui-font-size-medium]',
+                            mainWrapper: 'max-w-[50%]',
+                        }}
+                        onValueChange={(value) => {
+                            setDeeplConfig({
+                                ...deeplConfig,
+                                [INSTANCE_NAME_CONFIG_KEY]: value,
+                            });
+                        }}
+                    />
+                </div>
                 <div className={`config-item ${deeplConfig.type === 'free' && 'hidden'}`}>
                     <h3 className='my-auto'>{t('services.help')}</h3>
                     <Button
diff --git a/src/services/translate/deepl/index.jsx b/src/services/translate/deepl/index.jsx
index 126406c174..b6699d2aa7 100644
--- a/src/services/translate/deepl/index.jsx
+++ b/src/services/translate/deepl/index.jsx
@@ -1,20 +1,15 @@
 import { fetch, Body } from '@tauri-apps/api/http';
-import { store } from '../../../utils/store';
 
 export async function translate(text, from, to, options = {}) {
     const { config } = options;
 
-    let translateConfig = (await store.get('deepl')) ?? {};
-    if (config !== undefined) {
-        translateConfig = config;
-    }
-    const serviceType = translateConfig['type'];
+    const serviceType = config['type'];
     if (serviceType === 'free') {
         return translate_by_free(text, from, to);
     } else if (serviceType === 'api') {
-        return translate_by_key(text, from, to, translateConfig.authKey);
+        return translate_by_key(text, from, to, config.authKey);
     } else if (serviceType === 'deeplx') {
-        return translate_by_deeplx(text, from, to, translateConfig.customUrl);
+        return translate_by_deeplx(text, from, to, config.customUrl);
     } else {
         return translate_by_free(text, from, to);
     }
diff --git a/src/services/translate/geminipro/Config.jsx b/src/services/translate/geminipro/Config.jsx
index 081673f526..4a58c7dfc8 100644
--- a/src/services/translate/geminipro/Config.jsx
+++ b/src/services/translate/geminipro/Config.jsx
@@ -1,3 +1,4 @@
+import { INSTANCE_NAME_CONFIG_KEY } from '../../../utils/service_instance';
 import { Input, Button, Switch, Textarea } from '@nextui-org/react';
 import { MdDeleteOutline } from 'react-icons/md';
 import toast, { Toaster } from 'react-hot-toast';
@@ -11,10 +12,12 @@ import { translate } from './index';
 import { Language } from './index';
 
 export function Config(props) {
-    const { updateServiceList, onClose } = props;
+    const { instanceKey, updateServiceList, onClose } = props;
+    const { t } = useTranslation();
     const [serviceConfig, setServiceConfig] = useConfig(
-        'geminipro',
+        instanceKey,
         {
+            [INSTANCE_NAME_CONFIG_KEY]: t('services.translate.geminipro.title'),
             stream: true,
             apiKey: '',
             requestPath: 'https://generativelanguage.googleapis.com/v1beta/models/gemini-pro',
@@ -65,7 +68,6 @@ export function Config(props) {
     );
     const [isLoading, setIsLoading] = useState(false);
 
-    const { t } = useTranslation();
     const toastStyle = useToastStyle();
 
     return (
@@ -78,7 +80,7 @@ export function Config(props) {
                         () => {
                             setIsLoading(false);
                             setServiceConfig(serviceConfig, true);
-                            updateServiceList('geminipro');
+                            updateServiceList(instanceKey);
                             onClose();
                         },
                         (e) => {
@@ -89,6 +91,25 @@ export function Config(props) {
                 }}
             >
                 <Toaster />
+                <div className='config-item'>
+                    <Input
+                        label={t('services.instance_name')}
+                        labelPlacement='outside-left'
+                        value={serviceConfig[INSTANCE_NAME_CONFIG_KEY]}
+                        variant='bordered'
+                        classNames={{
+                            base: 'justify-between',
+                            label: 'text-[length:--nextui-font-size-medium]',
+                            mainWrapper: 'max-w-[50%]',
+                        }}
+                        onValueChange={(value) => {
+                            setServiceConfig({
+                                ...serviceConfig,
+                                [INSTANCE_NAME_CONFIG_KEY]: value,
+                            });
+                        }}
+                    />
+                </div>
                 <div className='config-item'>
                     <h3 className='my-auto'>{t('services.help')}</h3>
                     <Button
diff --git a/src/services/translate/geminipro/index.jsx b/src/services/translate/geminipro/index.jsx
index d3b9673c08..b72e1e8e8b 100644
--- a/src/services/translate/geminipro/index.jsx
+++ b/src/services/translate/geminipro/index.jsx
@@ -1,15 +1,10 @@
 import { fetch, Body } from '@tauri-apps/api/http';
-import { store } from '../../../utils/store';
 import { Language } from './info';
 
 export async function translate(text, from, to, options = {}) {
     const { config, setResult, detect } = options;
 
-    let translateConfig = await store.get('geminipro');
-    if (config !== undefined) {
-        translateConfig = config;
-    }
-    let { apiKey, stream, promptList, requestPath } = translateConfig;
+    let { apiKey, stream, promptList, requestPath } = config;
     if (!requestPath) {
         requestPath = 'https://generativelanguage.googleapis.com/v1beta/models/gemini-pro';
     }
diff --git a/src/services/translate/google/Config.jsx b/src/services/translate/google/Config.jsx
index f4a63bc1fd..7800602def 100644
--- a/src/services/translate/google/Config.jsx
+++ b/src/services/translate/google/Config.jsx
@@ -1,3 +1,4 @@
+import { INSTANCE_NAME_CONFIG_KEY } from '../../../utils/service_instance';
 import { Input, Button } from '@nextui-org/react';
 import toast, { Toaster } from 'react-hot-toast';
 import { useTranslation } from 'react-i18next';
@@ -9,17 +10,18 @@ import { translate } from './index';
 import { Language } from './index';
 
 export function Config(props) {
-    const { updateServiceList, onClose } = props;
+    const { instanceKey, updateServiceList, onClose } = props;
+    const { t } = useTranslation();
     const [config, setConfig] = useConfig(
-        'google',
+        instanceKey,
         {
+            [INSTANCE_NAME_CONFIG_KEY]: t('services.translate.google.title'),
             custom_url: 'https://translate.google.com',
         },
         { sync: false }
     );
     const [isLoading, setIsLoading] = useState(false);
 
-    const { t } = useTranslation();
     const toastStyle = useToastStyle();
 
     return (
@@ -32,7 +34,7 @@ export function Config(props) {
                         () => {
                             setIsLoading(false);
                             setConfig(config, true);
-                            updateServiceList('google');
+                            updateServiceList(instanceKey);
                             onClose();
                         },
                         (e) => {
@@ -43,6 +45,25 @@ export function Config(props) {
                 }}
             >
                 <Toaster />
+                <div className='config-item'>
+                    <Input
+                        label={t('services.instance_name')}
+                        labelPlacement='outside-left'
+                        value={config[INSTANCE_NAME_CONFIG_KEY]}
+                        variant='bordered'
+                        classNames={{
+                            base: 'justify-between',
+                            label: 'text-[length:--nextui-font-size-medium]',
+                            mainWrapper: 'max-w-[50%]',
+                        }}
+                        onValueChange={(value) => {
+                            setConfig({
+                                ...config,
+                                [INSTANCE_NAME_CONFIG_KEY]: value,
+                            });
+                        }}
+                    />
+                </div>
                 <div className={'config-item'}>
                     <Input
                         label={t('services.translate.google.custom_url')}
diff --git a/src/services/translate/google/index.jsx b/src/services/translate/google/index.jsx
index 0c0337b075..d1fd4f4b62 100644
--- a/src/services/translate/google/index.jsx
+++ b/src/services/translate/google/index.jsx
@@ -1,15 +1,9 @@
 import { fetch } from '@tauri-apps/api/http';
-import { store } from '../../../utils/store';
 
 export async function translate(text, from, to, options = {}) {
     const { config } = options;
 
-    let translateConfig = (await store.get('google')) ?? {};
-    if (config !== undefined) {
-        translateConfig = config;
-    }
-
-    let { custom_url } = translateConfig;
+    let { custom_url } = config;
 
     if (custom_url === undefined || custom_url === '') {
         custom_url = 'https://translate.google.com';
diff --git a/src/services/translate/niutrans/Config.jsx b/src/services/translate/niutrans/Config.jsx
index 69758904a3..c8fbe3d7a3 100644
--- a/src/services/translate/niutrans/Config.jsx
+++ b/src/services/translate/niutrans/Config.jsx
@@ -1,3 +1,4 @@
+import { INSTANCE_NAME_CONFIG_KEY } from '../../../utils/service_instance';
 import { Input, Button, Switch } from '@nextui-org/react';
 import toast, { Toaster } from 'react-hot-toast';
 import { useTranslation } from 'react-i18next';
@@ -10,10 +11,12 @@ import { translate } from './index';
 import { Language } from './index';
 
 export function Config(props) {
-    const { updateServiceList, onClose } = props;
+    const { instanceKey, updateServiceList, onClose } = props;
+    const { t } = useTranslation();
     const [config, setConfig] = useConfig(
-        'niutrans',
+        instanceKey,
         {
+            [INSTANCE_NAME_CONFIG_KEY]: t('services.translate.niutrans.title'),
             https: true,
             apikey: '',
         },
@@ -21,7 +24,6 @@ export function Config(props) {
     );
     const [isLoading, setIsLoading] = useState(false);
 
-    const { t } = useTranslation();
     const toastStyle = useToastStyle();
 
     return (
@@ -34,7 +36,7 @@ export function Config(props) {
                         () => {
                             setIsLoading(false);
                             setConfig(config, true);
-                            updateServiceList('niutrans');
+                            updateServiceList(instanceKey);
                             onClose();
                         },
                         (e) => {
@@ -45,6 +47,25 @@ export function Config(props) {
                 }}
             >
                 <Toaster />
+                <div className='config-item'>
+                    <Input
+                        label={t('services.instance_name')}
+                        labelPlacement='outside-left'
+                        value={config[INSTANCE_NAME_CONFIG_KEY]}
+                        variant='bordered'
+                        classNames={{
+                            base: 'justify-between',
+                            label: 'text-[length:--nextui-font-size-medium]',
+                            mainWrapper: 'max-w-[50%]',
+                        }}
+                        onValueChange={(value) => {
+                            setConfig({
+                                ...config,
+                                [INSTANCE_NAME_CONFIG_KEY]: value,
+                            });
+                        }}
+                    />
+                </div>
                 <div className={'config-item'}>
                     <h3 className='my-auto'>{t('services.help')}</h3>
                     <Button
diff --git a/src/services/translate/niutrans/index.jsx b/src/services/translate/niutrans/index.jsx
index 25fecf59c3..cf0fd92b44 100644
--- a/src/services/translate/niutrans/index.jsx
+++ b/src/services/translate/niutrans/index.jsx
@@ -1,16 +1,9 @@
 import { fetch, Body } from '@tauri-apps/api/http';
-import { store } from '../../../utils/store';
-import { http } from '@tauri-apps/api';
 
 export async function translate(text, from, to, options = {}) {
     const { config } = options;
 
-    let translateConfig = (await store.get('niutrans')) ?? {};
-    if (config !== undefined) {
-        translateConfig = config;
-    }
-
-    const { https, apikey } = translateConfig;
+    const { https, apikey } = config;
 
     const url = `${https ? 'https' : 'http'}://api.niutrans.com/NiuTransServer/translation`;
 
diff --git a/src/services/translate/ollama/Config.jsx b/src/services/translate/ollama/Config.jsx
index 50df904850..0921baac3f 100644
--- a/src/services/translate/ollama/Config.jsx
+++ b/src/services/translate/ollama/Config.jsx
@@ -1,4 +1,5 @@
 import { Input, Button, Switch, Textarea, Card, CardBody, Link, Tooltip, Progress } from '@nextui-org/react';
+import { INSTANCE_NAME_CONFIG_KEY } from '../../../utils/service_instance';
 import { MdDeleteOutline } from 'react-icons/md';
 import toast, { Toaster } from 'react-hot-toast';
 import { useTranslation } from 'react-i18next';
@@ -12,10 +13,12 @@ import { translate } from './index';
 import { Language } from './index';
 
 export function Config(props) {
-    const { updateServiceList, onClose } = props;
+    const { instanceKey, updateServiceList, onClose } = props;
+    const { t } = useTranslation();
     const [serviceConfig, setServiceConfig] = useConfig(
-        'ollama',
+        instanceKey,
         {
+            [INSTANCE_NAME_CONFIG_KEY]: t('services.translate.ollama.title'),
             stream: true,
             model: 'gemma:2b',
             requestPath: 'http://localhost:11434',
@@ -35,7 +38,7 @@ export function Config(props) {
     const [progress, setProgress] = useState(0);
     const [pullingStatus, setPullingStatus] = useState('');
     const [installedModels, setInstalledModels] = useState(null);
-    const { t } = useTranslation();
+
     const toastStyle = useToastStyle();
 
     async function getModles() {
@@ -87,7 +90,7 @@ export function Config(props) {
                         () => {
                             setIsLoading(false);
                             setServiceConfig(serviceConfig, true);
-                            updateServiceList('ollama');
+                            updateServiceList(instanceKey);
                             onClose();
                         },
                         (e) => {
@@ -98,6 +101,25 @@ export function Config(props) {
                 }}
             >
                 <Toaster />
+                <div className='config-item'>
+                    <Input
+                        label={t('services.instance_name')}
+                        labelPlacement='outside-left'
+                        value={serviceConfig[INSTANCE_NAME_CONFIG_KEY]}
+                        variant='bordered'
+                        classNames={{
+                            base: 'justify-between',
+                            label: 'text-[length:--nextui-font-size-medium]',
+                            mainWrapper: 'max-w-[50%]',
+                        }}
+                        onValueChange={(value) => {
+                            setServiceConfig({
+                                ...serviceConfig,
+                                [INSTANCE_NAME_CONFIG_KEY]: value,
+                            });
+                        }}
+                    />
+                </div>
                 {installedModels === null && (
                     <Card
                         isBlurred
@@ -311,8 +333,8 @@ export function Config(props) {
                                             serviceConfig.promptList.length === 0
                                                 ? 'system'
                                                 : serviceConfig.promptList.length % 2 === 0
-                                                ? 'assistant'
-                                                : 'user',
+                                                  ? 'assistant'
+                                                  : 'user',
                                         content: '',
                                     },
                                 ],
diff --git a/src/services/translate/ollama/index.jsx b/src/services/translate/ollama/index.jsx
index 07293c6af0..97a6c39081 100644
--- a/src/services/translate/ollama/index.jsx
+++ b/src/services/translate/ollama/index.jsx
@@ -1,15 +1,10 @@
-import { store } from '../../../utils/store';
 import { Language } from './info';
 import { Ollama } from 'ollama/browser';
 
 export async function translate(text, from, to, options = {}) {
     const { config, setResult, detect } = options;
 
-    let translateConfig = await store.get('ollama');
-    if (config !== undefined) {
-        translateConfig = config;
-    }
-    let { stream, promptList, requestPath, model } = translateConfig;
+    let { stream, promptList, requestPath, model } = config;
 
     if (!/https?:\/\/.+/.test(requestPath)) {
         requestPath = `https://${requestPath}`;
diff --git a/src/services/translate/openai/Config.jsx b/src/services/translate/openai/Config.jsx
index d88710060a..8df1468441 100644
--- a/src/services/translate/openai/Config.jsx
+++ b/src/services/translate/openai/Config.jsx
@@ -16,18 +16,19 @@ import { Language } from './index';
 import { INSTANCE_NAME_CONFIG_KEY } from '../../../utils/service_instance';
 
 export const defaultRequestArguments = JSON.stringify({
-    temperature: 0,
-    top_p: 1,
-    frequency_penalty: 1,
-    presence_penalty: 1,
-})
+    temperature: 0.1,
+    top_p: 0.99,
+    frequency_penalty: 0,
+    presence_penalty: 0,
+});
 
 export function Config(props) {
     const { instanceKey, updateServiceList, onClose } = props;
+    const { t } = useTranslation();
     const [openaiConfig, setOpenaiConfig] = useConfig(
         instanceKey,
         {
-            [INSTANCE_NAME_CONFIG_KEY]: 'OpenAI',
+            [INSTANCE_NAME_CONFIG_KEY]: t('services.translate.openai.title'),
             service: 'openai',
             requestPath: 'https://api.openai.com/v1/chat/completions',
             model: 'gpt-3.5-turbo',
@@ -41,7 +42,7 @@ export function Config(props) {
                 },
                 { role: 'user', content: `Translate into $to:\n"""\n$text\n"""` },
             ],
-            requestArguments: defaultRequestArguments
+            requestArguments: defaultRequestArguments,
         },
         { sync: false }
     );
@@ -60,17 +61,16 @@ export function Config(props) {
                 ],
             });
         }
-        if(openaiConfig.requestArguments === undefined) {
+        if (openaiConfig.requestArguments === undefined) {
             setOpenaiConfig({
                 ...openaiConfig,
-                requestArguments: defaultRequestArguments
-            })
+                requestArguments: defaultRequestArguments,
+            });
         }
     }
 
     const [isLoading, setIsLoading] = useState(false);
 
-    const { t } = useTranslation();
     const toastStyle = useToastStyle();
 
     return (
@@ -310,8 +310,8 @@ export function Config(props) {
                                             openaiConfig.promptList.length === 0
                                                 ? 'system'
                                                 : openaiConfig.promptList.length % 2 === 0
-                                                    ? 'assistant'
-                                                    : 'user',
+                                                  ? 'assistant'
+                                                  : 'user',
                                         content: '',
                                     },
                                 ],
@@ -324,20 +324,20 @@ export function Config(props) {
                 <br />
 
                 <h3 className='my-auto'>Request Arguments</h3>
-                    <div className='config-item'>
-                        <Textarea
-                            label=''
-                            labelPlacement='outside'
-                            variant='faded'
-                            value={openaiConfig['requestArguments']}
-                            placeholder={`Input API Request Arguments`}
-                            onValueChange={(value) => {
-                                setOpenaiConfig({
-                                    ...openaiConfig,
-                                    requestArguments: value,
-                                });
-                            }}
-                        />
+                <div className='config-item'>
+                    <Textarea
+                        label=''
+                        labelPlacement='outside'
+                        variant='faded'
+                        value={openaiConfig['requestArguments']}
+                        placeholder={`Input API Request Arguments`}
+                        onValueChange={(value) => {
+                            setOpenaiConfig({
+                                ...openaiConfig,
+                                requestArguments: value,
+                            });
+                        }}
+                    />
                 </div>
                 <br />
                 <Button
diff --git a/src/services/translate/tencent/Config.jsx b/src/services/translate/tencent/Config.jsx
index 7f0b1214a5..c0679cc893 100644
--- a/src/services/translate/tencent/Config.jsx
+++ b/src/services/translate/tencent/Config.jsx
@@ -1,3 +1,4 @@
+import { INSTANCE_NAME_CONFIG_KEY } from '../../../utils/service_instance';
 import { Input, Button } from '@nextui-org/react';
 import toast, { Toaster } from 'react-hot-toast';
 import { useTranslation } from 'react-i18next';
@@ -10,18 +11,15 @@ import { translate } from './index';
 import { Language } from './index';
 
 export function Config(props) {
-    const { updateServiceList, onClose } = props;
+    const { instanceKey, updateServiceList, onClose } = props;
+    const { t } = useTranslation();
     const [config, setConfig] = useConfig(
-        'tencent',
-        {
-            secret_id: '',
-            secret_key: '',
-        },
+        instanceKey,
+        { [INSTANCE_NAME_CONFIG_KEY]: t('services.translate.tencent.title'), secret_id: '', secret_key: '' },
         { sync: false }
     );
     const [isLoading, setIsLoading] = useState(false);
 
-    const { t } = useTranslation();
     const toastStyle = useToastStyle();
 
     return (
@@ -34,7 +32,7 @@ export function Config(props) {
                         () => {
                             setIsLoading(false);
                             setConfig(config, true);
-                            updateServiceList('tencent');
+                            updateServiceList(instanceKey);
                             onClose();
                         },
                         (e) => {
@@ -45,6 +43,25 @@ export function Config(props) {
                 }}
             >
                 <Toaster />
+                <div className='config-item'>
+                    <Input
+                        label={t('services.instance_name')}
+                        labelPlacement='outside-left'
+                        value={config[INSTANCE_NAME_CONFIG_KEY]}
+                        variant='bordered'
+                        classNames={{
+                            base: 'justify-between',
+                            label: 'text-[length:--nextui-font-size-medium]',
+                            mainWrapper: 'max-w-[50%]',
+                        }}
+                        onValueChange={(value) => {
+                            setConfig({
+                                ...config,
+                                [INSTANCE_NAME_CONFIG_KEY]: value,
+                            });
+                        }}
+                    />
+                </div>
                 <div className={'config-item'}>
                     <h3 className='my-auto'>{t('services.help')}</h3>
                     <Button
diff --git a/src/services/translate/tencent/index.jsx b/src/services/translate/tencent/index.jsx
index 32bbeceb61..2a325ddd9d 100644
--- a/src/services/translate/tencent/index.jsx
+++ b/src/services/translate/tencent/index.jsx
@@ -1,5 +1,4 @@
 import { fetch } from '@tauri-apps/api/http';
-import { store } from '../../../utils/store';
 import hmacSHA256 from 'crypto-js/hmac-sha256';
 import hashSHA256 from 'crypto-js/sha256';
 import hex from 'crypto-js/enc-hex';
@@ -7,12 +6,7 @@ import hex from 'crypto-js/enc-hex';
 export async function translate(text, from, to, options = {}) {
     const { config } = options;
 
-    let translateConfig = (await store.get('tencent')) ?? {};
-    if (config !== undefined) {
-        translateConfig = config;
-    }
-
-    const { secret_id, secret_key } = translateConfig;
+    const { secret_id, secret_key } = config;
 
     function sha256(message, secret = '') {
         return hmacSHA256(message, secret);
diff --git a/src/services/translate/transmart/Config.jsx b/src/services/translate/transmart/Config.jsx
index 9db41a6d55..ad2cccad4c 100644
--- a/src/services/translate/transmart/Config.jsx
+++ b/src/services/translate/transmart/Config.jsx
@@ -1,3 +1,4 @@
+import { INSTANCE_NAME_CONFIG_KEY } from '../../../utils/service_instance';
 import { Input, Button } from '@nextui-org/react';
 import toast, { Toaster } from 'react-hot-toast';
 import { useTranslation } from 'react-i18next';
@@ -10,10 +11,12 @@ import { translate } from './index';
 import { Language } from './index';
 
 export function Config(props) {
-    const { updateServiceList, onClose } = props;
+    const { instanceKey, updateServiceList, onClose } = props;
+    const { t } = useTranslation();
     const [config, setConfig] = useConfig(
-        'transmart',
+        instanceKey,
         {
+            [INSTANCE_NAME_CONFIG_KEY]: t('services.translate.transmart.title'),
             username: '',
             token: '',
         },
@@ -21,7 +24,6 @@ export function Config(props) {
     );
     const [isLoading, setIsLoading] = useState(false);
 
-    const { t } = useTranslation();
     const toastStyle = useToastStyle();
 
     return (
@@ -34,7 +36,7 @@ export function Config(props) {
                         () => {
                             setIsLoading(false);
                             setConfig(config, true);
-                            updateServiceList('transmart');
+                            updateServiceList(instanceKey);
                             onClose();
                         },
                         (e) => {
@@ -45,6 +47,25 @@ export function Config(props) {
                 }}
             >
                 <Toaster />
+                <div className='config-item'>
+                    <Input
+                        label={t('services.instance_name')}
+                        labelPlacement='outside-left'
+                        value={config[INSTANCE_NAME_CONFIG_KEY]}
+                        variant='bordered'
+                        classNames={{
+                            base: 'justify-between',
+                            label: 'text-[length:--nextui-font-size-medium]',
+                            mainWrapper: 'max-w-[50%]',
+                        }}
+                        onValueChange={(value) => {
+                            setConfig({
+                                ...config,
+                                [INSTANCE_NAME_CONFIG_KEY]: value,
+                            });
+                        }}
+                    />
+                </div>
                 <div className={'config-item'}>
                     <h3 className='my-auto'>{t('services.help')}</h3>
                     <Button
diff --git a/src/services/translate/transmart/index.jsx b/src/services/translate/transmart/index.jsx
index eee827d985..52fb544cb6 100644
--- a/src/services/translate/transmart/index.jsx
+++ b/src/services/translate/transmart/index.jsx
@@ -1,15 +1,9 @@
 import { fetch, Body } from '@tauri-apps/api/http';
-import { store } from '../../../utils/store';
 
 export async function translate(text, from, to, options = {}) {
     const { config } = options;
 
-    let translateConfig = (await store.get('transmart')) ?? {};
-    if (config !== undefined) {
-        translateConfig = config;
-    }
-    const user = translateConfig['username'];
-    const token = translateConfig['token'];
+    const { username: user, token } = config;
 
     let header = {};
     if (user !== '' && token !== '') {
diff --git a/src/services/translate/volcengine/Config.jsx b/src/services/translate/volcengine/Config.jsx
index 7ddafd207d..ab1146492d 100644
--- a/src/services/translate/volcengine/Config.jsx
+++ b/src/services/translate/volcengine/Config.jsx
@@ -1,3 +1,4 @@
+import { INSTANCE_NAME_CONFIG_KEY } from '../../../utils/service_instance';
 import { Input, Button } from '@nextui-org/react';
 import toast, { Toaster } from 'react-hot-toast';
 import { useTranslation } from 'react-i18next';
@@ -10,10 +11,12 @@ import { translate } from './index';
 import { Language } from './index';
 
 export function Config(props) {
-    const { updateServiceList, onClose } = props;
+    const { instanceKey, updateServiceList, onClose } = props;
+    const { t } = useTranslation();
     const [config, setConfig] = useConfig(
-        'volcengine',
+        instanceKey,
         {
+            [INSTANCE_NAME_CONFIG_KEY]: t('services.translate.volcengine.title'),
             appid: '',
             secret: '',
         },
@@ -21,7 +24,6 @@ export function Config(props) {
     );
     const [isLoading, setIsLoading] = useState(false);
 
-    const { t } = useTranslation();
     const toastStyle = useToastStyle();
 
     return (
@@ -34,7 +36,7 @@ export function Config(props) {
                         (v) => {
                             setIsLoading(false);
                             setConfig(config, true);
-                            updateServiceList('volcengine');
+                            updateServiceList(instanceKey);
                             onClose();
                         },
                         (e) => {
@@ -45,6 +47,25 @@ export function Config(props) {
                 }}
             >
                 <Toaster />
+                <div className='config-item'>
+                    <Input
+                        label={t('services.instance_name')}
+                        labelPlacement='outside-left'
+                        value={config[INSTANCE_NAME_CONFIG_KEY]}
+                        variant='bordered'
+                        classNames={{
+                            base: 'justify-between',
+                            label: 'text-[length:--nextui-font-size-medium]',
+                            mainWrapper: 'max-w-[50%]',
+                        }}
+                        onValueChange={(value) => {
+                            setConfig({
+                                ...config,
+                                [INSTANCE_NAME_CONFIG_KEY]: value,
+                            });
+                        }}
+                    />
+                </div>
                 <div className={'config-item'}>
                     <h3 className='my-auto'>{t('services.help')}</h3>
                     <Button
diff --git a/src/services/translate/volcengine/index.jsx b/src/services/translate/volcengine/index.jsx
index 312a3f03aa..4e0cd8e28d 100644
--- a/src/services/translate/volcengine/index.jsx
+++ b/src/services/translate/volcengine/index.jsx
@@ -1,16 +1,10 @@
 import { fetch } from '@tauri-apps/api/http';
-import { store } from '../../../utils/store';
 import CryptoJS from 'crypto-js';
 
 export async function translate(text, from, to, options = {}) {
     const { config } = options;
 
-    let translateConfig = (await store.get('volcengine')) ?? {};
-    if (config !== undefined) {
-        translateConfig = config;
-    }
-
-    const { appid, secret } = translateConfig;
+    const { appid, secret } = config;
 
     const serviceVersion = '2020-06-01';
     const schema = 'https';
diff --git a/src/services/translate/youdao/Config.jsx b/src/services/translate/youdao/Config.jsx
index 8bf2519da9..a31a749b19 100644
--- a/src/services/translate/youdao/Config.jsx
+++ b/src/services/translate/youdao/Config.jsx
@@ -1,3 +1,4 @@
+import { INSTANCE_NAME_CONFIG_KEY } from '../../../utils/service_instance';
 import { Input, Button } from '@nextui-org/react';
 import toast, { Toaster } from 'react-hot-toast';
 import { useTranslation } from 'react-i18next';
@@ -10,10 +11,12 @@ import { translate } from './index';
 import { Language } from './index';
 
 export function Config(props) {
-    const { updateServiceList, onClose } = props;
+    const { instanceKey, updateServiceList, onClose } = props;
+    const { t } = useTranslation();
     const [config, setConfig] = useConfig(
-        'youdao',
+        instanceKey,
         {
+            [INSTANCE_NAME_CONFIG_KEY]: t('services.translate.youdao.title'),
             appkey: '',
             key: '',
         },
@@ -21,7 +24,6 @@ export function Config(props) {
     );
     const [isLoading, setIsLoading] = useState(false);
 
-    const { t } = useTranslation();
     const toastStyle = useToastStyle();
 
     return (
@@ -34,7 +36,7 @@ export function Config(props) {
                         () => {
                             setIsLoading(false);
                             setConfig(config, true);
-                            updateServiceList('youdao');
+                            updateServiceList(instanceKey);
                             onClose();
                         },
                         (e) => {
@@ -45,6 +47,25 @@ export function Config(props) {
                 }}
             >
                 <Toaster />
+                <div className='config-item'>
+                    <Input
+                        label={t('services.instance_name')}
+                        labelPlacement='outside-left'
+                        value={config[INSTANCE_NAME_CONFIG_KEY]}
+                        variant='bordered'
+                        classNames={{
+                            base: 'justify-between',
+                            label: 'text-[length:--nextui-font-size-medium]',
+                            mainWrapper: 'max-w-[50%]',
+                        }}
+                        onValueChange={(value) => {
+                            setConfig({
+                                ...config,
+                                [INSTANCE_NAME_CONFIG_KEY]: value,
+                            });
+                        }}
+                    />
+                </div>
                 <div className={'config-item'}>
                     <h3 className='my-auto'>{t('services.help')}</h3>
                     <Button
diff --git a/src/services/translate/youdao/index.jsx b/src/services/translate/youdao/index.jsx
index 745dfdfdbb..76e077efe8 100644
--- a/src/services/translate/youdao/index.jsx
+++ b/src/services/translate/youdao/index.jsx
@@ -1,5 +1,4 @@
 import { fetch } from '@tauri-apps/api/http';
-import { store } from '../../../utils/store';
 import CryptoJS from 'crypto-js';
 import { nanoid } from 'nanoid';
 
@@ -7,12 +6,7 @@ export async function translate(text, from, to, options = {}) {
     text = text.trim();
     const { config } = options;
 
-    let translateConfig = (await store.get('youdao')) ?? {};
-    if (config !== undefined) {
-        translateConfig = config;
-    }
-
-    const { appkey, key } = translateConfig;
+    const { appkey, key } = config;
 
     const url = 'https://openapi.youdao.com/api';
     const curtime = String(Math.round(new Date().getTime() / 1000));
diff --git a/src/window/Config/pages/Service/PluginConfig/index.jsx b/src/window/Config/pages/Service/PluginConfig/index.jsx
index 7618599b33..28b9215c3e 100644
--- a/src/window/Config/pages/Service/PluginConfig/index.jsx
+++ b/src/window/Config/pages/Service/PluginConfig/index.jsx
@@ -1,3 +1,4 @@
+import { INSTANCE_NAME_CONFIG_KEY } from '../../../../../utils/service_instance';
 import { Button, Input } from '@nextui-org/react';
 import { DropdownTrigger } from '@nextui-org/react';
 import { DropdownMenu } from '@nextui-org/react';
@@ -10,8 +11,8 @@ import React from 'react';
 import { useConfig } from '../../../../../hooks';
 
 export function PluginConfig(props) {
-    const { updateServiceList, onClose, name, pluginList } = props;
-    const [pluginConfig, setPluginConfig] = useConfig(name, {}, { sync: false });
+    const { instanceKey, updateServiceList, onClose, name, pluginList } = props;
+    const [pluginConfig, setPluginConfig] = useConfig(instanceKey, {}, { sync: false });
     const { t } = useTranslation();
 
     return (
@@ -26,6 +27,28 @@ export function PluginConfig(props) {
                     {t('config.service.homepage')}
                 </Button>
             </div>
+            {pluginConfig && (
+                <div className='config-item'>
+                    <Input
+                        label={t('services.instance_name')}
+                        labelPlacement='outside-left'
+                        value={pluginConfig[INSTANCE_NAME_CONFIG_KEY] ?? pluginList[name].display}
+                        variant='bordered'
+                        classNames={{
+                            base: 'justify-between',
+                            label: 'text-[length:--nextui-font-size-medium]',
+                            mainWrapper: 'max-w-[50%]',
+                        }}
+                        onValueChange={(value) => {
+                            setPluginConfig({
+                                ...pluginConfig,
+                                [INSTANCE_NAME_CONFIG_KEY]: value,
+                            });
+                        }}
+                    />
+                </div>
+            )}
+
             {pluginList[name].needs.length === 0 ? (
                 <div>{t('services.no_need')}</div>
             ) : (
@@ -113,7 +136,7 @@ export function PluginConfig(props) {
                     color='primary'
                     onPress={() => {
                         setPluginConfig(pluginConfig, true);
-                        updateServiceList(name);
+                        updateServiceList(instanceKey);
                         onClose();
                     }}
                 >