@lobehub/chat 1.81.9 → 1.82.1

package/locales/zh-CN/electron.json

@@ -17,16 +17,52 @@
     "statusDisconnected": "未连接",
     "urlRequired": "请输入服务器地址"
   },
+  "sync": {
+    "continue": "继续",
+    "inCloud": "当前使用云端同步",
+    "inLocalStorage": "当前使用本地存储",
+    "isIniting": "正在初始化...",
+    "lobehubCloud": {
+      "description": "官方提供的云版本",
+      "title": "LobeHub Cloud"
+    },
+    "local": {
+      "description": "使用本地数据库，完全离线可用",
+      "title": "本地数据库"
+    },
+    "mode": {
+      "cloudSync": "云端同步",
+      "localStorage": "本地存储",
+      "title": "选择你的连接模式",
+      "useSelfHosted": "使用自托管实例？"
+    },
+    "selfHosted": {
+      "description": "自行部署的社区版本",
+      "title": "自托管实例"
+    }
+  },
   "updater": {
+    "checkingUpdate": "检查新版本",
+    "checkingUpdateDesc": "正在获取版本信息...",
+    "downloadNewVersion": "下载新版本",
     "downloadingUpdate": "正在下载更新",
     "downloadingUpdateDesc": "更新正在下载中，请稍候...",
+    "installLater": "下次启动时更新",
+    "isLatestVersion": "当前已是最新版本",
+    "isLatestVersionDesc": "非常棒，使用的版本 {{version}} 已是最前沿的版本。",
     "later": "稍后更新",
     "newVersionAvailable": "新版本可用",
     "newVersionAvailableDesc": "发现新版本 {{version}}，是否立即下载？",
-    "restartAndInstall": "重启并安装",
+    "restartAndInstall": "安装更新并重启",
     "updateError": "更新错误",
     "updateReady": "更新已就绪",
-    "updateReadyDesc": "Lobe Chat {{version}} 已下载完成，重启应用后即可完成安装。",
+    "updateReadyDesc": "新版本 {{version}} 已下载完成，重启应用后即可完成安装。",
     "upgradeNow": "立即更新"
+  },
+  "waitingOAuth": {
+    "cancel": "取消",
+    "description": "浏览器已打开授权页面，请在浏览器中完成授权",
+    "helpText": "如果浏览器没有自动打开，请点击取消后重新尝试",
+    "title": "等待授权连接"
   }
 }

package/locales/zh-CN/plugin.json

@@ -35,8 +35,8 @@
         "label": "标识符"
       },
       "mode": {
-        "local": "可视化配置",
-        "local-tooltip": "暂时不支持可视化配置",
+        "mcp": "MCP 插件",
+        "mcpExp": "实验性",
         "url": "在线链接"
       },
       "name": {
@@ -45,6 +45,42 @@
         "placeholder": "搜索引擎"
       }
     },
+    "mcp": {
+      "args": {
+        "label": "命令参数",
+        "desc": "传递给 STDIO 命令的参数列表，一般在这里输入 MCP 服务器名称",
+        "placeholder": "例如：mcp-hello-world"
+      },
+      "command": {
+        "label": "命令"
+      },
+      "endpoint": {
+        "desc": "输入你的 MCP Streamable HTTP Server 的地址",
+        "label": "MCP Endpoint URL"
+      },
+      "identifier": {
+        "desc": "为你的 MCP 插件指定一个名称，需要使用英文字符",
+        "invalid": "只能输入英文字符、数字 、- 和_ 这两个符号",
+        "label": "MCP 插件名称",
+        "placeholder": "例如：my-mcp-plugin"
+      },
+      "type": {
+        "desc": "选择 MCP 插件的通信方式，网页版只支持 Streamable HTTP",
+        "httpFeature1": "兼容网页版与桌面端",
+        "httpFeature2": "连接远程 MCP 服务端, 无需额外安装配置",
+        "httpShortDesc": "基于流式 HTTP 的通信协议",
+        "label": "MCP 插件类型",
+        "stdioFeature1": "更低的通信延迟, 适合本地执行",
+        "stdioFeature2": "通过系统标准输入输出通信，需在本地安装运行 MCP 服务端",
+        "stdioNotAvailable": "STDIO 模式仅在桌面版可用",
+        "stdioShortDesc": "基于标准输入输出的通信协议",
+        "title": "MCP 插件类型"
+      },
+      "url": {
+        "desc": "输入你的 MCP Server Streamable HTTP 地址，不会以 /sse 结尾",
+        "label": "Streamable HTTP Endpoint URL"
+      }
+    },
     "meta": {
       "author": {
         "desc": "插件的作者",

package/locales/zh-TW/electron.json

@@ -17,16 +17,52 @@
     "statusDisconnected": "未連接",
     "urlRequired": "請輸入伺服器地址"
   },
+  "sync": {
+    "continue": "繼續",
+    "inCloud": "當前使用雲端同步",
+    "inLocalStorage": "當前使用本地儲存",
+    "isIniting": "正在初始化...",
+    "lobehubCloud": {
+      "description": "官方提供的雲版本",
+      "title": "LobeHub Cloud"
+    },
+    "local": {
+      "description": "使用本地資料庫，完全離線可用",
+      "title": "本地資料庫"
+    },
+    "mode": {
+      "cloudSync": "雲端同步",
+      "localStorage": "本地儲存",
+      "title": "選擇你的連接模式",
+      "useSelfHosted": "使用自托管實例？"
+    },
+    "selfHosted": {
+      "description": "自行部署的社區版本",
+      "title": "自托管實例"
+    }
+  },
   "updater": {
+    "checkingUpdate": "檢查新版本",
+    "checkingUpdateDesc": "正在獲取版本資訊...",
+    "downloadNewVersion": "下載新版本",
     "downloadingUpdate": "正在下載更新",
     "downloadingUpdateDesc": "更新正在下載中，請稍候...",
+    "installLater": "下次啟動時更新",
+    "isLatestVersion": "當前已是最新版本",
+    "isLatestVersionDesc": "非常棒，使用的版本 {{version}} 已是最前沿的版本。",
     "later": "稍後更新",
     "newVersionAvailable": "新版本可用",
     "newVersionAvailableDesc": "發現新版本 {{version}}，是否立即下載？",
-    "restartAndInstall": "重啟並安裝",
+    "restartAndInstall": "安裝更新並重啟",
     "updateError": "更新錯誤",
     "updateReady": "更新已就緒",
-    "updateReadyDesc": "Lobe Chat {{version}} 已下載完成，重啟應用後即可完成安裝。",
+    "updateReadyDesc": "新版本 {{version}} 已下載完成，重啟應用後即可完成安裝。",
     "upgradeNow": "立即更新"
+  },
+  "waitingOAuth": {
+    "cancel": "取消",
+    "description": "瀏覽器已打開授權頁面，請在瀏覽器中完成授權",
+    "helpText": "如果瀏覽器沒有自動打開，請點擊取消後重新嘗試",
+    "title": "等待授權連接"
   }
 }

package/locales/zh-TW/plugin.json

@@ -35,8 +35,8 @@
         "label": "識別碼"
       },
       "mode": {
-        "local": "視覺設定",
-        "local-tooltip": "目前不支援視覺設定",
+        "mcp": "MCP 插件",
+        "mcpExp": "實驗性",
         "url": "線上連結"
       },
       "name": {
@@ -45,6 +45,37 @@
         "placeholder": "搜尋引擎"
       }
     },
+    "mcp": {
+      "args": {
+        "desc": "傳遞給 STDIO 命令的參數列表",
+        "label": "命令參數",
+        "placeholder": "例如：--port 8080 --debug",
+        "tooltip": "輸入參數後按回車或使用逗號/空格分隔"
+      },
+      "command": {
+        "desc": "用於啟動 MCP STDIO 插件的可執行文件或腳本",
+        "label": "命令",
+        "placeholder": "例如：python main.py 或 /path/to/executable"
+      },
+      "endpoint": {
+        "desc": "輸入你的 MCP Streamable HTTP Server 的地址",
+        "label": "MCP Endpoint URL"
+      },
+      "identifier": {
+        "desc": "為你的 MCP 插件指定一個名稱，需要使用英文字符",
+        "invalid": "只能輸入英文字符、數字、- 和_ 這兩個符號",
+        "label": "MCP 插件名稱",
+        "placeholder": "例如：my-mcp-plugin"
+      },
+      "type": {
+        "desc": "選擇 MCP 插件的通信方式，網頁版只支持 Streamable HTTP",
+        "label": "MCP 插件類型"
+      },
+      "url": {
+        "desc": "輸入你的 MCP Server Streamable HTTP 地址，結尾不會有 /sse",
+        "label": "HTTP Endpoint URL"
+      }
+    },
     "meta": {
       "author": {
         "desc": "外掛的作者",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "1.81.9",
+  "version": "1.82.1",
   "description": "Lobe Chat - an open-source, high-performance chatbot framework that supports speech synthesis, multimodal, and extensible Function Call plugin system. Supports one-click free deployment of your private ChatGPT/LLM web application.",
   "keywords": [
     "framework",

package/packages/electron-client-ipc/src/events/update.ts

@@ -9,12 +9,12 @@ export interface AutoUpdateDispatchEvents {
 }
 
 export interface AutoUpdateBroadcastEvents {
-  updateAvailable: (info: UpdateInfo) => void;
-  updateCheckStart: () => void;
+  manualUpdateAvailable: (info: UpdateInfo) => void;
+  manualUpdateCheckStart: () => void;
+  manualUpdateNotAvailable: (info: UpdateInfo) => void;
   updateDownloadProgress: (progress: ProgressInfo) => void;
   updateDownloadStart: () => void;
   updateDownloaded: (info: UpdateInfo) => void;
   updateError: (message: string) => void;
-  updateNotAvailable: (info: UpdateInfo) => void;
   updateWillInstallLater: () => void;
 }

package/src/app/[variants]/(main)/_layout/Desktop/ElectronTitlebar/Connection/Mode.tsx

@@ -0,0 +1,222 @@
+import { Input } from '@lobehub/ui';
+import { LobeHub } from '@lobehub/ui/brand';
+import { Button } from 'antd';
+import { createStyles } from 'antd-style';
+import { ComputerIcon, Server } from 'lucide-react';
+import { memo, useCallback, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Center, Flexbox } from 'react-layout-kit';
+
+import { useElectronStore } from '@/store/electron';
+
+import { AccessOption, Option } from './Option';
+
+const useStyles = createStyles(({ token, css }) => {
+  return {
+    cardGroup: css`
+      width: 400px; /* Increased width */
+    `,
+    container: css`
+      overflow-y: auto;
+
+      width: 100%;
+      height: 100%;
+      padding-block: 0 40px;
+      padding-inline: 24px; /* Increased top padding */
+    `,
+    continueButton: css`
+      width: 100%;
+      margin-block-start: 40px;
+    `,
+    groupTitle: css`
+      padding-inline-start: 4px; /* Align with card padding */
+      font-size: 16px;
+      font-weight: 500;
+      color: ${token.colorTextSecondary};
+    `,
+    header: css`
+      text-align: center;
+    `,
+    inputError: css`
+      margin-block-start: 8px;
+      font-size: 12px;
+      color: ${token.colorError};
+    `,
+    modal: css`
+      .ant-drawer-close {
+        position: absolute;
+        inset-block-start: 8px;
+        inset-inline-end: 0;
+      }
+    `,
+    selfHostedInput: css`
+      margin-block-start: 12px;
+    `,
+    selfHostedText: css`
+      cursor: pointer;
+      font-size: 14px;
+      color: ${token.colorTextTertiary};
+
+      :hover {
+        color: ${token.colorTextSecondary};
+      }
+    `,
+    title: css`
+      margin-block: 16px 48px; /* Increased Spacing below title */
+      font-size: 24px; /* Increased font size */
+      font-weight: 600;
+      color: ${token.colorTextHeading};
+    `,
+  };
+});
+
+interface ConnectionModeProps {
+  setIsOpen: (open: boolean) => void;
+  setWaiting: (waiting: boolean) => void;
+}
+
+const ConnectionMode = memo<ConnectionModeProps>(({ setIsOpen, setWaiting }) => {
+  const { styles } = useStyles();
+  const { t } = useTranslation(['electron', 'common']);
+  const [selectedOption, setSelectedOption] = useState<AccessOption>();
+  const [selfHostedUrl, setSelfHostedUrl] = useState('');
+  const [urlError, setUrlError] = useState<string | undefined>();
+
+  const connect = useElectronStore((s) => s.connectRemoteServer);
+  const disconnect = useElectronStore((s) => s.disconnectRemoteServer);
+
+  const validateUrl = useCallback((url: string) => {
+    if (!url) {
+      return t('remoteServer.urlRequired');
+    }
+    try {
+      new URL(url);
+      if (!url.startsWith('http://') && !url.startsWith('https://')) {
+        throw new Error('Invalid protocol');
+      }
+      return undefined;
+    } catch {
+      return t('remoteServer.invalidUrl');
+    }
+  }, []);
+
+  const handleSelectOption = (option: AccessOption) => {
+    setSelectedOption(option);
+    if (option !== 'self-hosted') {
+      setUrlError(undefined);
+    } else {
+      setUrlError(validateUrl(selfHostedUrl));
+    }
+  };
+
+  const handleContinue = async () => {
+    if (selectedOption === 'self-hosted') {
+      const error = validateUrl(selfHostedUrl);
+      setUrlError(error);
+      if (error) {
+        return;
+      }
+    }
+
+    if (selectedOption === 'local') {
+      await disconnect();
+      setIsOpen(false);
+      return;
+    }
+
+    // try to connect
+    setWaiting(true);
+    await connect(
+      selectedOption === 'self-hosted'
+        ? { isSelfHosted: true, serverUrl: selfHostedUrl }
+        : { isSelfHosted: false },
+    );
+  };
+
+  return (
+    <Center className={styles.container}>
+      <Flexbox align={'center'} gap={0}>
+        <h1 className={styles.title}>{t('sync.mode.title')}</h1>
+      </Flexbox>
+
+      <Flexbox className={styles.cardGroup} gap={24}>
+        <Flexbox gap={16}>
+          <Flexbox align="center" horizontal justify="space-between">
+            <div className={styles.groupTitle}>{t('sync.mode.cloudSync')}</div>
+            <div
+              className={styles.selfHostedText}
+              onClick={() => handleSelectOption('self-hosted')}
+            >
+              {t('sync.mode.useSelfHosted')}
+            </div>
+          </Flexbox>
+          <Option
+            description={t('sync.lobehubCloud.description')}
+            icon={LobeHub}
+            isSelected={selectedOption === 'cloud'}
+            label={t('sync.lobehubCloud.title')}
+            onClick={handleSelectOption}
+            value="cloud"
+          />
+          {selectedOption === 'self-hosted' && (
+            <Option
+              description={t('sync.selfHosted.description')}
+              icon={Server}
+              isSelected={selectedOption === 'self-hosted'}
+              label={t('sync.selfHosted.title')}
+              onClick={handleSelectOption}
+              value="self-hosted"
+            >
+              {selectedOption === 'self-hosted' && (
+                <>
+                  <Input
+                    autoFocus
+                    className={styles.selfHostedInput}
+                    onChange={(e) => {
+                      const newUrl = e.target.value;
+                      setSelfHostedUrl(newUrl);
+                      setUrlError(validateUrl(newUrl));
+                    }}
+                    onClick={(e) => e.stopPropagation()}
+                    placeholder="https://your-lobechat.com"
+                    status={urlError ? 'error' : undefined}
+                    value={selfHostedUrl}
+                  />
+                  {urlError && <div className={styles.inputError}>{urlError}</div>}
+                </>
+              )}
+            </Option>
+          )}
+        </Flexbox>
+        <Flexbox>
+          <div className={styles.groupTitle} style={{ marginBottom: 12 }}>
+            {t('sync.mode.localStorage')}
+          </div>
+          <Option
+            description={t('sync.local.description')}
+            icon={ComputerIcon}
+            isSelected={selectedOption === 'local'}
+            label={t('sync.local.title')}
+            onClick={handleSelectOption}
+            value="local"
+          />
+        </Flexbox>
+      </Flexbox>
+
+      <Button
+        className={styles.continueButton}
+        disabled={
+          !selectedOption || (selectedOption === 'self-hosted' && (!!urlError || !selfHostedUrl))
+        }
+        onClick={handleContinue}
+        size="large"
+        style={{ maxWidth: 400 }}
+        type="primary"
+      >
+        {selectedOption === 'local' ? t('save', { ns: 'common' }) : t('sync.continue')}
+      </Button>
+    </Center>
+  );
+});
+
+export default ConnectionMode;

package/src/app/[variants]/(main)/_layout/Desktop/ElectronTitlebar/Connection/Option.tsx

@@ -0,0 +1,104 @@
+import { CheckCircleFilled } from '@ant-design/icons';
+import { createStyles } from 'antd-style';
+import { ComponentType, ReactNode } from 'react';
+import { Center, Flexbox } from 'react-layout-kit';
+
+const useStyles = createStyles(({ token, css }) => ({
+  checked: css`
+    position: relative;
+    border: 1px solid ${token.colorPrimary};
+  `,
+  description: css`
+    margin-block-start: 4px; /* Adjust spacing */
+    font-size: 13px; /* Slightly larger description */
+    color: ${token.colorTextSecondary};
+  `,
+  iconWrapper: css`
+    margin-block-start: 2px;
+    padding: 0;
+    color: ${token.colorTextSecondary};
+
+    svg {
+      display: block;
+      font-size: 24px; /* Increased icon size */
+      stroke-width: 2; /* Ensure lucide icons look bolder */
+    }
+  `,
+  label: css`
+    font-size: 16px;
+    font-weight: 600; /* Bolder label */
+    color: ${token.colorText};
+  `,
+  optionCard: css`
+    cursor: pointer;
+
+    width: 100%;
+    padding: 16px;
+    border: 1px solid ${token.colorBorderSecondary}; /* Use secondary border */
+    border-radius: ${token.borderRadiusLG}px;
+
+    color: ${token.colorText};
+
+    background-color: ${token.colorBgContainer};
+
+    transition: all 0.2s ${token.motionEaseInOut};
+
+    :hover {
+      border-color: ${token.colorPrimary};
+    }
+  `,
+  optionInner: css`
+    display: flex;
+    gap: 16px;
+    align-items: flex-start;
+    justify-content: space-between;
+  `,
+}));
+
+// 定义选项类型
+export type AccessOption = 'cloud' | 'self-hosted' | 'local';
+
+export interface OptionProps {
+  children?: ReactNode;
+  description: string;
+  icon: ComponentType<any>;
+  isSelected: boolean;
+  label: string;
+  onClick: (value: AccessOption) => void;
+  value: AccessOption; // For self-hosted input
+}
+
+export const Option = ({
+  description,
+  icon: PrefixIcon,
+  label,
+  value,
+  isSelected,
+  onClick,
+  children,
+}: OptionProps) => {
+  const { styles, cx } = useStyles();
+
+  return (
+    <Flexbox
+      className={cx(styles.optionCard, isSelected && styles.checked)}
+      direction="vertical"
+      key={value}
+      onClick={() => onClick(value)}
+    >
+      <div className={styles.optionInner}>
+        <Flexbox gap={16} horizontal>
+          <Center className={styles.iconWrapper}>
+            <PrefixIcon />
+          </Center>
+          <Flexbox gap={8}>
+            <div className={styles.label}>{label}</div>
+            <div className={styles.description}>{description}</div>
+          </Flexbox>
+        </Flexbox>
+        {isSelected && <CheckCircleFilled style={{ fontSize: 16 }} />}
+      </div>
+      {children}
+    </Flexbox>
+  );
+};

package/src/app/[variants]/(main)/_layout/Desktop/ElectronTitlebar/Connection/Sync.tsx

@@ -0,0 +1,42 @@
+import { ActionIcon } from '@lobehub/ui';
+import { Loader, Wifi, WifiOffIcon } from 'lucide-react';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import { useElectronStore } from '@/store/electron';
+import { electronSyncSelectors } from '@/store/electron/selectors';
+
+interface SyncProps {
+  onClick: () => void;
+}
+const Sync = memo<SyncProps>(({ onClick }) => {
+  const { t } = useTranslation('electron');
+
+  const [isIniting, isSyncActive, useRemoteServerConfig] = useElectronStore((s) => [
+    !s.isInitRemoteServerConfig,
+    electronSyncSelectors.isSyncActive(s),
+    s.useRemoteServerConfig,
+  ]);
+
+  // 使用useSWR获取远程服务器配置
+  useRemoteServerConfig();
+
+  return (
+    <ActionIcon
+      icon={isIniting ? Loader : isSyncActive ? Wifi : WifiOffIcon}
+      loading={isIniting}
+      onClick={onClick}
+      placement={'bottomRight'}
+      size="small"
+      title={
+        isIniting
+          ? t('sync.isIniting')
+          : isSyncActive
+            ? t('sync.inCloud')
+            : t('sync.inLocalStorage')
+      }
+    />
+  );
+});
+
+export default Sync;