@lobehub/chat 1.81.2 → 1.81.4

package/src/store/chat/slices/builtinTool/actions/localFile.ts

@@ -0,0 +1,129 @@
+import {
+  ListLocalFileParams,
+  LocalReadFileParams,
+  LocalReadFilesParams,
+  LocalSearchFilesParams,
+} from '@lobechat/electron-client-ipc';
+import { StateCreator } from 'zustand/vanilla';
+
+import { localFileService } from '@/services/electron/localFileService';
+import { ChatStore } from '@/store/chat/store';
+import {
+  LocalFileListState,
+  LocalFileSearchState,
+  LocalReadFileState,
+  LocalReadFilesState,
+} from '@/tools/local-files/type';
+
+export interface LocalFileAction {
+  listLocalFiles: (id: string, params: ListLocalFileParams) => Promise<boolean>;
+  reSearchLocalFiles: (id: string, params: LocalSearchFilesParams) => Promise<boolean>;
+  readLocalFile: (id: string, params: LocalReadFileParams) => Promise<boolean>;
+  readLocalFiles: (id: string, params: LocalReadFilesParams) => Promise<boolean>;
+  searchLocalFiles: (id: string, params: LocalSearchFilesParams) => Promise<boolean>;
+  toggleLocalFileLoading: (id: string, loading: boolean) => void;
+}
+
+export const localFileSlice: StateCreator<
+  ChatStore,
+  [['zustand/devtools', never]],
+  [],
+  LocalFileAction
+> = (set, get) => ({
+  listLocalFiles: async (id, params) => {
+    get().toggleLocalFileLoading(id, true);
+    try {
+      const data = await localFileService.listLocalFiles(params);
+      console.log(data);
+      await get().updatePluginState(id, { listResults: data } as LocalFileListState);
+      await get().internal_updateMessageContent(id, JSON.stringify(data));
+    } catch (error) {
+      console.error('Error listing local files:', error);
+      await get().internal_updateMessagePluginError(id, {
+        body: error,
+        message: (error as Error).message,
+        type: 'PluginServerError',
+      });
+    }
+    get().toggleLocalFileLoading(id, false);
+
+    return true;
+  },
+
+  reSearchLocalFiles: async (id, params) => {
+    get().toggleLocalFileLoading(id, true);
+
+    await get().updatePluginArguments(id, params);
+
+    return get().searchLocalFiles(id, params);
+  },
+
+  readLocalFile: async (id, params) => {
+    get().toggleLocalFileLoading(id, true);
+
+    try {
+      const result = await localFileService.readLocalFile(params);
+
+      await get().updatePluginState(id, { fileContent: result } as LocalReadFileState);
+      await get().internal_updateMessageContent(id, JSON.stringify(result));
+    } catch (error) {
+      console.error('Error reading local file:', error);
+      await get().internal_updateMessagePluginError(id, {
+        body: error,
+        message: (error as Error).message,
+        type: 'PluginServerError',
+      });
+    }
+    get().toggleLocalFileLoading(id, false);
+    return true;
+  },
+
+  readLocalFiles: async (id, params) => {
+    get().toggleLocalFileLoading(id, true);
+
+    try {
+      const results = await localFileService.readLocalFiles(params);
+      await get().updatePluginState(id, { filesContent: results } as LocalReadFilesState);
+      await get().internal_updateMessageContent(id, JSON.stringify(results));
+    } catch (error) {
+      console.error('Error reading local files:', error);
+      await get().internal_updateMessagePluginError(id, {
+        body: error,
+        message: (error as Error).message,
+        type: 'PluginServerError',
+      });
+    }
+    get().toggleLocalFileLoading(id, false);
+
+    return true;
+  },
+
+  searchLocalFiles: async (id, params) => {
+    get().toggleLocalFileLoading(id, true);
+    try {
+      const data = await localFileService.searchLocalFiles(params);
+      await get().updatePluginState(id, { searchResults: data } as LocalFileSearchState);
+      await get().internal_updateMessageContent(id, JSON.stringify(data));
+    } catch (error) {
+      console.error('Error searching local files:', error);
+      await get().internal_updateMessagePluginError(id, {
+        body: error,
+        message: (error as Error).message,
+        type: 'PluginServerError',
+      });
+    }
+    get().toggleLocalFileLoading(id, false);
+
+    return true;
+  },
+  toggleLocalFileLoading: (id, loading) => {
+    // Assuming a loading state structure similar to searchLoading
+    set(
+      (state) => ({
+        localFileLoading: { ...state.localFileLoading, [id]: loading },
+      }),
+      false,
+      `toggleLocalFileLoading/${loading ? 'start' : 'end'}`,
+    );
+  },
+});

package/src/store/chat/slices/builtinTool/initialState.ts

@@ -4,11 +4,13 @@ export interface ChatToolState {
   activePageContentUrl?: string;
   dalleImageLoading: Record<string, boolean>;
   dalleImageMap: Record<string, FileItem>;
+  localFileLoading: Record<string, boolean>;
   searchLoading: Record<string, boolean>;
 }
 
 export const initialToolState: ChatToolState = {
   dalleImageLoading: {},
   dalleImageMap: {},
+  localFileLoading: {},
   searchLoading: {},
 };

package/src/store/chat/slices/builtinTool/selectors.ts

@@ -6,9 +6,11 @@ const isGeneratingDallEImage = (s: ChatStoreState) =>
   Object.values(s.dalleImageLoading).some(Boolean);
 
 const isSearXNGSearching = (id: string) => (s: ChatStoreState) => s.searchLoading[id];
+const isSearchingLocalFiles = (id: string) => (s: ChatStoreState) => s.localFileLoading[id];
 
 export const chatToolSelectors = {
   isDallEImageGenerating,
   isGeneratingDallEImage,
   isSearXNGSearching,
+  isSearchingLocalFiles,
 };

package/src/store/chat/slices/plugin/action.ts

@@ -59,7 +59,7 @@ export interface ChatPluginAction {
     params?: { threadId?: string; inPortalThread?: boolean; inSearchWorkflow?: boolean },
   ) => Promise<void>;
   updatePluginState: (id: string, value: any) => Promise<void>;
-  updatePluginArguments: <T = any>(id: string, value: T) => Promise<void>;
+  updatePluginArguments: <T = any>(id: string, value: T, replace?: boolean) => Promise<void>;
 
   internal_addToolToAssistantMessage: (id: string, tool: ChatToolPayload) => Promise<void>;
   internal_removeToolToAssistantMessage: (id: string, tool_call_id?: string) => Promise<void>;
@@ -296,7 +296,7 @@ export const chatPlugin: StateCreator<
     await refreshMessages();
   },
 
-  updatePluginArguments: async (id, value) => {
+  updatePluginArguments: async (id, value, replace = false) => {
     const { refreshMessages } = get();
     const toolMessage = chatSelectors.getMessageById(id)(get());
     if (!toolMessage || !toolMessage?.tool_call_id) return;
@@ -305,7 +305,7 @@ export const chatPlugin: StateCreator<
 
     const prevArguments = toolMessage?.plugin?.arguments;
     const prevJson = safeParseJSON(prevArguments || '');
-    const nextValue = merge(prevJson || {}, value);
+    const nextValue = replace ? (value as any) : merge(prevJson || {}, value);
     if (isEqual(prevJson, nextValue)) return;
 
     // optimistic update

package/src/store/chat/store.ts

@@ -57,3 +57,5 @@ export const useChatStore = createWithEqualityFn<ChatStore>()(
   subscribeWithSelector(devtools(createStore)),
   shallow,
 );
+
+export const getChatStoreState = () => useChatStore.getState();

package/src/store/electron/actions/sync.ts

@@ -0,0 +1,117 @@
+import { RemoteServerConfig } from '@lobechat/electron-client-ipc';
+import useSWR, { SWRResponse, mutate } from 'swr';
+import type { StateCreator } from 'zustand/vanilla';
+
+import { INBOX_SESSION_ID } from '@/const/session';
+import { remoteServerService } from '@/services/electron/remoteServer';
+
+import { initialState } from '../initialState';
+import type { ElectronStore } from '../store';
+
+/**
+ * 设置操作
+ */
+export interface ElectronRemoteServerAction {
+  connectRemoteServer: (params: { isSelfHosted: boolean; serverUrl?: string }) => Promise<void>;
+  disconnectRemoteServer: () => Promise<void>;
+  refreshServerConfig: () => Promise<void>;
+  refreshUserData: () => Promise<void>;
+  useRemoteServerConfig: () => SWRResponse;
+}
+
+const REMOTE_SERVER_CONFIG_KEY = 'electron:getRemoteServerConfig';
+
+export const remoteSyncSlice: StateCreator<
+  ElectronStore,
+  [['zustand/devtools', never]],
+  [],
+  ElectronRemoteServerAction
+> = (set, get) => ({
+  connectRemoteServer: async (values) => {
+    if (!values.serverUrl) return;
+
+    set({ isConnectingServer: true });
+    try {
+      // 获取当前配置
+      const config = await remoteServerService.getRemoteServerConfig();
+
+      // 如果已经激活，需要先清除
+      if (config.active) {
+        await remoteServerService.clearRemoteServerConfig();
+      }
+
+      // 请求授权
+      const result = await remoteServerService.requestAuthorization(values.serverUrl);
+
+      if (!result.success) {
+        console.error('请求授权失败:', result.error);
+
+        set({
+          remoteServerSyncError: { message: result.error, type: 'AUTH_ERROR' },
+        });
+      }
+      // 刷新状态
+      await get().refreshServerConfig();
+    } catch (error) {
+      console.error('远程服务器配置出错:', error);
+      set({
+        remoteServerSyncError: { message: (error as Error).message, type: 'CONFIG_ERROR' },
+      });
+    } finally {
+      set({ isConnectingServer: false });
+    }
+  },
+
+  disconnectRemoteServer: async () => {
+    set({ isConnectingServer: false });
+    try {
+      await remoteServerService.clearRemoteServerConfig();
+      // 更新表单URL为空
+      set({ remoteServerConfig: initialState.remoteServerConfig });
+      // 刷新状态
+      await get().refreshServerConfig();
+    } catch (error) {
+      console.error('断开连接失败:', error);
+      set({
+        remoteServerSyncError: { message: (error as Error).message, type: 'DISCONNECT_ERROR' },
+      });
+    } finally {
+      set({ isConnectingServer: false });
+    }
+  },
+
+  refreshServerConfig: async () => {
+    await mutate(REMOTE_SERVER_CONFIG_KEY);
+  },
+
+  refreshUserData: async () => {
+    const { getSessionStoreState } = await import('@/store/session');
+    const { getChatStoreState } = await import('@/store/chat');
+    const { getUserStoreState } = await import('@/store/user');
+
+    await getSessionStoreState().refreshSessions();
+    await getChatStoreState().refreshMessages();
+    await getChatStoreState().refreshTopic();
+    await getUserStoreState().refreshUserState();
+    getSessionStoreState().switchSession(INBOX_SESSION_ID);
+  },
+
+  useRemoteServerConfig: () =>
+    useSWR<RemoteServerConfig>(
+      REMOTE_SERVER_CONFIG_KEY,
+      async () => {
+        try {
+          return await remoteServerService.getRemoteServerConfig();
+        } catch (error) {
+          console.error('获取远程服务器配置失败:', error);
+          throw error;
+        }
+      },
+      {
+        onSuccess: (data) => {
+          set({ isInitRemoteServerConfig: true, remoteServerConfig: data });
+          get().refreshUserData();
+        },
+      },
+    ),
+});

package/src/store/electron/index.ts

@@ -0,0 +1 @@
+export * from './store';

package/src/store/electron/initialState.ts

@@ -0,0 +1,18 @@
+import { RemoteServerConfig } from '@lobechat/electron-client-ipc';
+
+export type RemoteServerError = 'CONFIG_ERROR' | 'AUTH_ERROR' | 'DISCONNECT_ERROR';
+
+export interface ElectronState {
+  isConnectingServer?: boolean;
+  isInitRemoteServerConfig: boolean;
+  isSyncActive?: boolean;
+  remoteServerConfig: RemoteServerConfig;
+  remoteServerSyncError?: { message?: string; type: RemoteServerError };
+}
+
+export const initialState: ElectronState = {
+  isConnectingServer: false,
+  isInitRemoteServerConfig: false,
+  isSyncActive: false,
+  remoteServerConfig: { active: false, isSelfHosted: false },
+};

package/src/store/electron/selectors/index.ts

@@ -0,0 +1 @@
+export * from './sync';

package/src/store/electron/selectors/sync.ts

@@ -0,0 +1,9 @@
+import { ElectronState } from '../initialState';
+
+const isSyncActive = (s: ElectronState) => {
+  return s.remoteServerConfig.active;
+};
+
+export const electronSyncSelectors = {
+  isSyncActive,
+};

package/src/store/electron/store.ts

@@ -0,0 +1,29 @@
+import { shallow } from 'zustand/shallow';
+import { createWithEqualityFn } from 'zustand/traditional';
+import { StateCreator } from 'zustand/vanilla';
+
+import { createDevtools } from '../middleware/createDevtools';
+import { type ElectronRemoteServerAction, remoteSyncSlice } from './actions/sync';
+import { type ElectronState, initialState } from './initialState';
+
+//  ===============  聚合 createStoreFn ============ //
+
+export interface ElectronStore extends ElectronState, ElectronRemoteServerAction {
+  /* empty */
+}
+
+const createStore: StateCreator<ElectronStore, [['zustand/devtools', never]]> = (
+  ...parameters
+) => ({
+  ...initialState,
+  ...remoteSyncSlice(...parameters),
+});
+
+//  ===============  实装 useStore ============ //
+
+const devtools = createDevtools('electron');
+
+export const useElectronStore = createWithEqualityFn<ElectronStore>()(
+  devtools(createStore),
+  shallow,
+);

package/src/tools/index.ts

@@ -1,7 +1,9 @@
+import { isDesktop } from '@/const/version';
 import { LobeBuiltinTool } from '@/types/tool';
 
 import { ArtifactsManifest } from './artifacts';
 import { DalleManifest } from './dalle';
+import { LocalFilesManifest } from './local-files';
 import { WebBrowsingManifest } from './web-browsing';
 
 export const builtinTools: LobeBuiltinTool[] = [
@@ -15,6 +17,12 @@ export const builtinTools: LobeBuiltinTool[] = [
     manifest: DalleManifest,
     type: 'builtin',
   },
+  {
+    hidden: !isDesktop,
+    identifier: LocalFilesManifest.identifier,
+    manifest: LocalFilesManifest,
+    type: 'builtin',
+  },
   {
     hidden: true,
     identifier: WebBrowsingManifest.identifier,

package/src/tools/local-files/Render/ListFiles/Result.tsx

@@ -0,0 +1,42 @@
+import { LocalFileItem } from '@lobechat/electron-client-ipc';
+import { Skeleton } from 'antd';
+import { memo } from 'react';
+import { Flexbox } from 'react-layout-kit';
+
+import { useChatStore } from '@/store/chat';
+import { chatToolSelectors } from '@/store/chat/selectors';
+import FileItem from '@/tools/local-files/components/FileItem';
+import { ChatMessagePluginError } from '@/types/message';
+
+interface SearchFilesProps {
+  listResults?: LocalFileItem[];
+  messageId: string;
+  pluginError: ChatMessagePluginError;
+}
+
+const SearchFiles = memo<SearchFilesProps>(({ listResults = [], messageId }) => {
+  const loading = useChatStore(chatToolSelectors.isSearchingLocalFiles(messageId));
+
+  if (loading) {
+    return (
+      <Flexbox gap={4}>
+        <Skeleton.Button active block style={{ height: 16 }} />
+        <Skeleton.Button active block style={{ height: 16 }} />
+        <Skeleton.Button active block style={{ height: 16 }} />
+        <Skeleton.Button active block style={{ height: 16 }} />
+      </Flexbox>
+    );
+  }
+
+  return (
+    <Flexbox gap={2} style={{ maxHeight: 260, overflow: 'scroll' }}>
+      {listResults.map((item) => (
+        <FileItem key={item.path} {...item} showTime />
+      ))}
+    </Flexbox>
+  );
+});
+
+SearchFiles.displayName = 'SearchFiles';
+
+export default SearchFiles;

package/src/tools/local-files/Render/ListFiles/index.tsx

@@ -0,0 +1,68 @@
+import { ListLocalFileParams } from '@lobechat/electron-client-ipc';
+import { ActionIcon } from '@lobehub/ui';
+import { Typography } from 'antd';
+import { createStyles } from 'antd-style';
+import { FolderOpen } from 'lucide-react';
+import React, { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Flexbox } from 'react-layout-kit';
+
+import { localFileService } from '@/services/electron/localFileService';
+import { LocalFileListState } from '@/tools/local-files/type';
+import { ChatMessagePluginError } from '@/types/message';
+
+import SearchResult from './Result';
+
+const useStyles = createStyles(({ css, token, cx }) => ({
+  actions: cx(css`
+    cursor: pointer;
+    color: ${token.colorTextTertiary};
+    opacity: 1;
+    transition: opacity 0.2s ${token.motionEaseInOut};
+  `),
+  path: css`
+    padding-inline-start: 8px;
+    color: ${token.colorTextSecondary};
+  `,
+}));
+
+interface ListFilesProps {
+  args: ListLocalFileParams;
+  messageId: string;
+  pluginError: ChatMessagePluginError;
+  pluginState?: LocalFileListState;
+}
+
+const ListFiles = memo<ListFilesProps>(({ messageId, pluginError, args, pluginState }) => {
+  const { t } = useTranslation('tool');
+
+  const { styles } = useStyles();
+  return (
+    <>
+      <Flexbox gap={8} horizontal>
+        <Typography.Text className={styles.path} ellipsis>
+          {args.path}
+        </Typography.Text>
+        <Flexbox className={styles.actions} gap={8} horizontal style={{ marginLeft: 8 }}>
+          <ActionIcon
+            icon={FolderOpen}
+            onClick={() => {
+              localFileService.openLocalFolder({ isDirectory: true, path: args.path });
+            }}
+            size="small"
+            title={t('localFiles.openFolder')}
+          />
+        </Flexbox>
+      </Flexbox>
+      <SearchResult
+        listResults={pluginState?.listResults}
+        messageId={messageId}
+        pluginError={pluginError}
+      />
+    </>
+  );
+});
+
+ListFiles.displayName = 'ListFiles';
+
+export default ListFiles;

package/src/tools/local-files/Render/ReadLocalFile/ReadFileSkeleton.tsx

@@ -0,0 +1,50 @@
+import { Skeleton } from 'antd';
+import { createStyles } from 'antd-style';
+import React, { memo } from 'react';
+import { Flexbox } from 'react-layout-kit';
+
+const useStyles = createStyles(({ css, token }) => ({
+  container: css`
+    padding: 8px;
+    border: 1px solid ${token.colorBorderSecondary};
+    border-radius: ${token.borderRadiusLG}px;
+  `,
+  header: css`
+    margin-block-end: 4px;
+  `,
+  meta: css`
+    font-size: 12px;
+  `,
+  path: css`
+    margin-block-start: 4px;
+  `,
+}));
+
+const ReadFileSkeleton = memo(() => {
+  const { styles } = useStyles();
+
+  return (
+    <Flexbox className={styles.container}>
+      <Flexbox
+        align={'center'}
+        className={styles.header}
+        gap={24}
+        horizontal
+        justify={'space-between'}
+      >
+        <Flexbox align={'center'} flex={1} gap={8} horizontal style={{ overflow: 'hidden' }}>
+          <Skeleton.Avatar active shape="square" size={24} style={{ borderRadius: 4 }} />
+          <Skeleton.Input active size="small" style={{ flex: 1, minWidth: 100 }} />
+        </Flexbox>
+        <Flexbox align={'center'} className={styles.meta} gap={16}>
+          <Skeleton.Input active size="small" style={{ maxWidth: 40 }} />
+        </Flexbox>
+      </Flexbox>
+
+      {/* Path */}
+      <Skeleton.Input active block className={styles.path} size="small" />
+    </Flexbox>
+  );
+});
+
+export default ReadFileSkeleton;