@lobehub/chat 1.136.9 → 1.136.10

package/CHANGELOG.md

@@ -2,6 +2,31 @@
 
 # Changelog
 
+### [Version 1.136.10](https://github.com/lobehub/lobe-chat/compare/v1.136.9...v1.136.10)
+
+<sup>Released on **2025-10-11**</sup>
+
+#### 💄 Styles
+
+- **misc**: Improve search experience.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### Styles
+
+- **misc**: Improve search experience, closes [#9661](https://github.com/lobehub/lobe-chat/issues/9661) ([8624f84](https://github.com/lobehub/lobe-chat/commit/8624f84))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
 ### [Version 1.136.9](https://github.com/lobehub/lobe-chat/compare/v1.136.8...v1.136.9)
 
 <sup>Released on **2025-10-11**</sup>

package/changelog/v1.json

@@ -1,4 +1,13 @@
 [
+  {
+    "children": {
+      "improvements": [
+        "Improve search experience."
+      ]
+    },
+    "date": "2025-10-11",
+    "version": "1.136.10"
+  },
   {
     "children": {
       "improvements": [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "1.136.9",
+  "version": "1.136.10",
   "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/prompts/src/prompts/index.ts

@@ -2,4 +2,5 @@ export * from './chatMessages';
 export * from './files';
 export * from './knowledgeBaseQA';
 export * from './plugin';
+export * from './search';
 export * from './systemRole';

package/packages/prompts/src/prompts/search/crawlResults.test.ts

@@ -0,0 +1,172 @@
+import { describe, expect, it } from 'vitest';
+
+import { crawlResultsPrompt } from './crawlResults';
+
+describe('crawlResultsPrompt', () => {
+  it('should return empty XML for empty results', () => {
+    const result = crawlResultsPrompt([]);
+    expect(result).toBe('<no_crawl_results />');
+  });
+
+  it('should convert basic crawl result to compact XML format', () => {
+    const results = [
+      {
+        url: 'https://example.com',
+        title: 'Example Page',
+        content: 'Page content here',
+      },
+    ];
+
+    const xml = crawlResultsPrompt(results);
+
+    expect(xml).toEqual(`<crawlResults>
+  <page url="https://example.com" title="Example Page">Page content here</page>
+</crawlResults>`);
+  });
+
+  it('should include all optional metadata fields', () => {
+    const results = [
+      {
+        url: 'http://arxiv.org/abs/2509.09734v1',
+        title: 'MCP-AgentBench: Evaluating Real-World Language Agent Performance',
+        contentType: 'text' as const,
+        description: 'Abstract page for arXiv paper 2509.09734v1',
+        length: 10187,
+        content: 'Full paper content...',
+      },
+    ];
+
+    const xml = crawlResultsPrompt(results);
+
+    expect(xml).toEqual(`<crawlResults>
+  <page url="http://arxiv.org/abs/2509.09734v1" title="MCP-AgentBench: Evaluating Real-World Language Agent Performance" contentType="text" description="Abstract page for arXiv paper 2509.09734v1" length="10187">Full paper content...</page>
+</crawlResults>`);
+  });
+
+  it('should handle page without content', () => {
+    const results = [
+      {
+        url: 'https://example.com',
+        title: 'Empty Page',
+        contentType: 'text' as const,
+      },
+    ];
+
+    const xml = crawlResultsPrompt(results);
+
+    expect(xml).toEqual(`<crawlResults>
+  <page url="https://example.com" title="Empty Page" contentType="text" />
+</crawlResults>`);
+  });
+
+  it('should handle error items', () => {
+    const results = [
+      {
+        errorType: 'NetworkError',
+        errorMessage: 'Failed to fetch the page',
+        url: 'https://failed.com',
+      },
+    ];
+
+    const xml = crawlResultsPrompt(results);
+
+    expect(xml).toEqual(`<crawlResults>
+  <error errorType="NetworkError" errorMessage="Failed to fetch the page" url="https://failed.com" />
+</crawlResults>`);
+  });
+
+  it('should escape XML special characters in attributes', () => {
+    const results = [
+      {
+        url: 'https://example.com?foo=bar&baz=qux',
+        title: 'Title with <tags> & "quotes"',
+        description: 'Description with special chars & <html>',
+      },
+    ];
+
+    const xml = crawlResultsPrompt(results);
+
+    expect(xml).toEqual(`<crawlResults>
+  <page url="https://example.com?foo=bar&amp;baz=qux" title="Title with &lt;tags&gt; &amp; &quot;quotes&quot;" description="Description with special chars &amp; &lt;html&gt;" />
+</crawlResults>`);
+  });
+
+  it('should escape XML special characters in content', () => {
+    const results = [
+      {
+        url: 'https://example.com',
+        title: 'Test',
+        content: 'Content with <html> tags & special chars',
+      },
+    ];
+
+    const xml = crawlResultsPrompt(results);
+
+    expect(xml).toEqual(`<crawlResults>
+  <page url="https://example.com" title="Test">Content with &lt;html&gt; tags &amp; special chars</page>
+</crawlResults>`);
+  });
+
+  it('should handle multiple pages with mixed success and errors', () => {
+    const results = [
+      {
+        url: 'https://success1.com',
+        title: 'First Page',
+        content: 'First content',
+      },
+      {
+        errorType: 'TimeoutError',
+        errorMessage: 'Request timeout',
+        url: 'https://failed.com',
+      },
+      {
+        url: 'https://success2.com',
+        title: 'Second Page',
+        content: 'Second content',
+      },
+    ];
+
+    const xml = crawlResultsPrompt(results);
+
+    expect(xml).toEqual(`<crawlResults>
+  <page url="https://success1.com" title="First Page">First content</page>
+  <error errorType="TimeoutError" errorMessage="Request timeout" url="https://failed.com" />
+  <page url="https://success2.com" title="Second Page">Second content</page>
+</crawlResults>`);
+  });
+
+  it('should handle error without url', () => {
+    const results = [
+      {
+        errorType: 'UnknownError',
+        errorMessage: 'Unknown error occurred',
+      },
+    ];
+
+    const xml = crawlResultsPrompt(results);
+
+    expect(xml).toEqual(`<crawlResults>
+  <error errorType="UnknownError" errorMessage="Unknown error occurred" />
+</crawlResults>`);
+  });
+
+  it('should handle real arXiv example', () => {
+    const results = [
+      {
+        url: 'http://arxiv.org/abs/2508.01780v1',
+        title: 'LiveMCPBench: Can Agents Navigate an Ocean of MCP Tools?',
+        contentType: 'text' as const,
+        description: 'Abstract page for arXiv paper 2508.01780v1',
+        length: 10512,
+        content:
+          'With the rapid development of Model Context Protocol (MCP), the number of MCP servers has surpassed 10,000...',
+      },
+    ];
+
+    const xml = crawlResultsPrompt(results);
+
+    expect(xml).toEqual(`<crawlResults>
+  <page url="http://arxiv.org/abs/2508.01780v1" title="LiveMCPBench: Can Agents Navigate an Ocean of MCP Tools?" contentType="text" description="Abstract page for arXiv paper 2508.01780v1" length="10512">With the rapid development of Model Context Protocol (MCP), the number of MCP servers has surpassed 10,000...</page>
+</crawlResults>`);
+  });
+});

package/packages/prompts/src/prompts/search/crawlResults.ts

@@ -0,0 +1,82 @@
+import { escapeXmlAttr, escapeXmlContent } from './xmlEscape';
+
+export interface CrawlResultItem {
+  content?: string;
+  contentType?: 'text' | 'json';
+  description?: string;
+  length?: number;
+  siteName?: string;
+  title?: string;
+  url: string;
+}
+
+export interface CrawlErrorItem {
+  content?: string;
+  errorMessage: string;
+  errorType: string;
+  url?: string;
+}
+
+/**
+ * Convert crawl results array to compact XML format for token efficiency
+ * Uses attributes for metadata and element content for main text
+ *
+ * @example
+ * ```typescript
+ * const results = [
+ *   { title: "Page Title", url: "https://example.com", content: "..." }
+ * ];
+ * const xml = crawlResultsPrompt(results);
+ * // Output:
+ * // <crawlResults>
+ * //   <page title="Page Title" url="https://example.com">...</page>
+ * // </crawlResults>
+ * ```
+ */
+export const crawlResultsPrompt = (results: Array<CrawlResultItem | CrawlErrorItem>): string => {
+  if (results.length === 0) return '<no_crawl_results />';
+
+  const items = results
+    .map((item) => {
+      // Handle error items
+      if ('errorMessage' in item) {
+        const attrs: string[] = [
+          `errorType="${escapeXmlAttr(item.errorType)}"`,
+          `errorMessage="${escapeXmlAttr(item.errorMessage)}"`,
+        ];
+
+        if (item.url) {
+          attrs.push(`url="${escapeXmlAttr(item.url)}"`);
+        }
+
+        return `  <error ${attrs.join(' ')} />`;
+      }
+
+      // Handle successful crawl items
+      const attrs: string[] = [`url="${escapeXmlAttr(item.url)}"`];
+
+      if (item.title) {
+        attrs.push(`title="${escapeXmlAttr(item.title)}"`);
+      }
+
+      if (item.contentType) {
+        attrs.push(`contentType="${escapeXmlAttr(item.contentType)}"`);
+      }
+
+      if (item.description) {
+        attrs.push(`description="${escapeXmlAttr(item.description)}"`);
+      }
+
+      if (item.length !== undefined) {
+        attrs.push(`length="${item.length}"`);
+      }
+
+      const attrString = attrs.join(' ');
+      const content = item.content ? escapeXmlContent(item.content) : '';
+
+      return content ? `  <page ${attrString}>${content}</page>` : `  <page ${attrString} />`;
+    })
+    .join('\n');
+
+  return `<crawlResults>\n${items}\n</crawlResults>`;
+};

package/packages/prompts/src/prompts/search/index.ts

@@ -0,0 +1,2 @@
+export * from './crawlResults';
+export * from './searchResults';

package/packages/prompts/src/prompts/search/searchResults.test.ts

@@ -0,0 +1,138 @@
+import { describe, expect, it } from 'vitest';
+
+import { searchResultsPrompt } from './searchResults';
+
+describe('searchResultsPrompt', () => {
+  it('should return empty XML for empty results', () => {
+    const result = searchResultsPrompt([]);
+    expect(result).toBe('<searchResults />');
+  });
+
+  it('should convert basic search results to compact XML format', () => {
+    const results = [
+      {
+        title: 'Example Title',
+        url: 'https://example.com',
+      },
+    ];
+
+    const xml = searchResultsPrompt(results);
+
+    expect(xml).toEqual(`<searchResults>
+  <item title="Example Title" url="https://example.com" />
+</searchResults>`);
+  });
+
+  it('should include content as element text when present', () => {
+    const results = [
+      {
+        title: 'Research Paper',
+        url: 'http://arxiv.org/abs/2108.11510v1',
+        content: 'Deep reinforcement learning survey',
+      },
+    ];
+
+    const xml = searchResultsPrompt(results);
+
+    expect(xml).toEqual(`<searchResults>
+  <item title="Research Paper" url="http://arxiv.org/abs/2108.11510v1">Deep reinforcement learning survey</item>
+</searchResults>`);
+  });
+
+  it('should include optional fields as attributes when present', () => {
+    const results = [
+      {
+        title: 'Research Paper',
+        url: 'http://arxiv.org/abs/2108.11510v1',
+        content: 'Deep reinforcement learning survey',
+        publishedDate: '2021-08-25T23:01:48',
+        imgSrc: 'https://example.com/image.jpg',
+        thumbnail: 'https://example.com/thumb.jpg',
+      },
+    ];
+
+    const xml = searchResultsPrompt(results);
+
+    expect(xml).toEqual(`<searchResults>
+  <item title="Research Paper" url="http://arxiv.org/abs/2108.11510v1" publishedDate="2021-08-25T23:01:48" imgSrc="https://example.com/image.jpg" thumbnail="https://example.com/thumb.jpg">Deep reinforcement learning survey</item>
+</searchResults>`);
+  });
+
+  it('should omit optional fields when not present', () => {
+    const results = [
+      {
+        title: 'Simple Result',
+        url: 'https://example.com',
+      },
+    ];
+
+    const xml = searchResultsPrompt(results);
+
+    expect(xml).toEqual(`<searchResults>
+  <item title="Simple Result" url="https://example.com" />
+</searchResults>`);
+  });
+
+  it('should escape XML special characters in attributes', () => {
+    const results = [
+      {
+        title: 'Title with <tags> & "quotes"',
+        url: 'https://example.com?foo=bar&baz=qux',
+      },
+    ];
+
+    const xml = searchResultsPrompt(results);
+
+    expect(xml).toEqual(`<searchResults>
+  <item title="Title with &lt;tags&gt; &amp; &quot;quotes&quot;" url="https://example.com?foo=bar&amp;baz=qux" />
+</searchResults>`);
+  });
+
+  it('should escape XML special characters in content', () => {
+    const results = [
+      {
+        title: 'Test',
+        url: 'https://example.com',
+        content: 'Content with <html> & special chars',
+      },
+    ];
+
+    const xml = searchResultsPrompt(results);
+
+    expect(xml).toEqual(`<searchResults>
+  <item title="Test" url="https://example.com">Content with &lt;html&gt; &amp; special chars</item>
+</searchResults>`);
+  });
+
+  it('should handle multiple search results', () => {
+    const results = [
+      { title: 'First', url: 'https://first.com', content: 'First content' },
+      { title: 'Second', url: 'https://second.com', content: 'Second content' },
+      { title: 'Third', url: 'https://third.com' },
+    ];
+
+    const xml = searchResultsPrompt(results);
+
+    expect(xml).toEqual(`<searchResults>
+  <item title="First" url="https://first.com">First content</item>
+  <item title="Second" url="https://second.com">Second content</item>
+  <item title="Third" url="https://third.com" />
+</searchResults>`);
+  });
+
+  it('should create compact single-line items', () => {
+    const results = [
+      {
+        title: 'Test',
+        url: 'https://test.com',
+        content: 'Content',
+      },
+    ];
+
+    const xml = searchResultsPrompt(results);
+
+    expect(xml).toEqual(`<searchResults>
+  <item title="Test" url="https://test.com">Content</item>
+</searchResults>`);
+  });
+});

package/packages/prompts/src/prompts/search/searchResults.ts

@@ -0,0 +1,58 @@
+import { escapeXmlAttr, escapeXmlContent } from './xmlEscape';
+
+export interface SearchResultItem {
+  content?: string;
+  imgSrc?: string;
+  publishedDate?: string | null;
+  thumbnail?: string | null;
+  title: string;
+  url: string;
+}
+
+/**
+ * Convert search results array to compact XML format for token efficiency
+ * Uses attributes for title/url and element content for main text
+ *
+ * @example
+ * ```typescript
+ * const results = [
+ *   { title: "Example", url: "https://example.com", content: "..." }
+ * ];
+ * const xml = searchResultsPrompt(results);
+ * // Output:
+ * // <searchResults>
+ * //   <item title="Example" url="https://example.com">...</item>
+ * // </searchResults>
+ * ```
+ */
+export const searchResultsPrompt = (results: SearchResultItem[]): string => {
+  if (results.length === 0) return '<searchResults />';
+
+  const items = results
+    .map((item) => {
+      const attrs: string[] = [
+        `title="${escapeXmlAttr(item.title)}"`,
+        `url="${escapeXmlAttr(item.url)}"`,
+      ];
+
+      if (item.publishedDate) {
+        attrs.push(`publishedDate="${escapeXmlAttr(item.publishedDate)}"`);
+      }
+
+      if (item.imgSrc) {
+        attrs.push(`imgSrc="${escapeXmlAttr(item.imgSrc)}"`);
+      }
+
+      if (item.thumbnail) {
+        attrs.push(`thumbnail="${escapeXmlAttr(item.thumbnail)}"`);
+      }
+
+      const attrString = attrs.join(' ');
+      const content = item.content ? escapeXmlContent(item.content) : '';
+
+      return content ? `  <item ${attrString}>${content}</item>` : `  <item ${attrString} />`;
+    })
+    .join('\n');
+
+  return `<searchResults>\n${items}\n</searchResults>`;
+};

package/packages/prompts/src/prompts/search/xmlEscape.ts

@@ -0,0 +1,21 @@
+/**
+ * Escape special characters for XML attributes
+ * Includes: & " < >
+ */
+export const escapeXmlAttr = (text: string | undefined | null): string => {
+  if (!text) return '';
+  return text
+    .replaceAll('&', '&amp;')
+    .replaceAll('"', '&quot;')
+    .replaceAll('<', '&lt;')
+    .replaceAll('>', '&gt;');
+};
+
+/**
+ * Escape special characters for XML content
+ * Includes: & < >
+ */
+export const escapeXmlContent = (text: string | undefined | null): string => {
+  if (!text) return '';
+  return text.replaceAll('&', '&amp;').replaceAll('<', '&lt;').replaceAll('>', '&gt;');
+};

package/packages/types/src/tool/builtin.ts

@@ -49,3 +49,11 @@ export interface BuiltinPortalProps<Arguments = Record<string, any>, State = any
 }
 
 export type BuiltinPortal = <T = any>(props: BuiltinPortalProps<T>) => ReactNode;
+
+export interface BuiltinPlaceholderProps {
+  apiName: string;
+  args?: Record<string, any>;
+  identifier: string;
+}
+
+export type BuiltinPlaceholder = (props: BuiltinPlaceholderProps) => ReactNode;

package/packages/types/src/tool/index.ts

@@ -24,5 +24,7 @@ export interface LobeTool {
 export type LobeToolRenderType = LobePluginType | 'builtin';
 
 export * from './builtin';
+export * from './crawler';
 export * from './interpreter';
 export * from './plugin';
+export * from './search';

package/src/features/Conversation/Messages/Assistant/Tool/Inspector/BuiltinPluginTitle.tsx

@@ -33,18 +33,22 @@ interface BuiltinPluginTitleProps {
   toolCallId: string;
 }
 
-const BuiltinPluginTitle = memo<BuiltinPluginTitleProps>(({ messageId, index, apiName, title }) => {
-  const { styles } = useStyles();
-
-  const isLoading = useChatStore(chatSelectors.isInToolsCalling(messageId, index));
-
-  return (
-    <Flexbox align={'center'} className={isLoading ? styles.shinyText : ''} gap={4} horizontal>
-      <div>{title}</div>
-      <Icon icon={ChevronRight} />
-      <span className={styles.apiName}>{apiName}</span>
-    </Flexbox>
-  );
-});
+const BuiltinPluginTitle = memo<BuiltinPluginTitleProps>(
+  ({ messageId, index, apiName, title, toolCallId }) => {
+    const { styles } = useStyles();
+
+    const isLoading = useChatStore(
+      chatSelectors.isToolApiNameShining(messageId, index, toolCallId),
+    );
+
+    return (
+      <Flexbox align={'center'} className={isLoading ? styles.shinyText : ''} gap={4} horizontal>
+        <div>{title}</div>
+        <Icon icon={ChevronRight} />
+        <span className={styles.apiName}>{apiName}</span>
+      </Flexbox>
+    );
+  },
+);
 
 export default BuiltinPluginTitle;

package/src/features/Conversation/Messages/Assistant/Tool/Inspector/ToolTitle.tsx

@@ -43,14 +43,7 @@ const ToolTitle = memo<ToolTitleProps>(({ identifier, messageId, index, apiName,
   const { t } = useTranslation('plugin');
   const { styles } = useStyles();
 
-  const isLoading = useChatStore((s) => {
-    const toolMessageId = chatSelectors.getMessageByToolCallId(toolCallId)(s)?.id;
-    const isToolCallStreaming = chatSelectors.isToolCallStreaming(messageId, index)(s);
-    const isPluginApiInvoking = !toolMessageId
-      ? true
-      : chatSelectors.isPluginApiInvoking(toolMessageId)(s);
-    return isToolCallStreaming || isPluginApiInvoking;
-  });
+  const isLoading = useChatStore(chatSelectors.isToolApiNameShining(messageId, index, toolCallId));
 
   const pluginMeta = useToolStore(toolSelectors.getMetaById(identifier), isEqual);
 

package/src/features/Conversation/Messages/Assistant/Tool/Render/Arguments/index.tsx

@@ -115,22 +115,18 @@ const Arguments = memo<ArgumentsProps>(({ arguments: args = '', shine, actions }
           {actions}
         </Flexbox>
       )}
-      {args.length > 100 ? (
-        <pre style={{ padding: 8 }}>{JSON.stringify(displayArgs, null, 2)}</pre>
-      ) : (
-        Object.entries(displayArgs).map(([key, value]) => {
-          return (
-            <ObjectEntity
-              editable={false}
-              hasMinWidth={hasMinWidth}
-              key={key}
-              objectKey={key}
-              shine={shine}
-              value={value}
-            />
-          );
-        })
-      )}
+      {Object.entries(displayArgs).map(([key, value]) => {
+        return (
+          <ObjectEntity
+            editable={false}
+            hasMinWidth={hasMinWidth}
+            key={key}
+            objectKey={key}
+            shine={shine}
+            value={value}
+          />
+        );
+      })}
     </div>
   );
 });

package/src/features/Conversation/Messages/Assistant/Tool/Render/LoadingPlaceholder/index.tsx

@@ -0,0 +1,29 @@
+import { safeParseJSON } from '@lobechat/utils';
+import { memo } from 'react';
+
+import { BuiltinToolPlaceholders } from '@/tools/placeholders';
+
+import Arguments from '../Arguments';
+
+interface LoadingPlaceholderProps {
+  apiName: string;
+  identifier: string;
+  loading?: boolean;
+  requestArgs?: string;
+}
+
+const LoadingPlaceholder = memo<LoadingPlaceholderProps>(
+  ({ identifier, requestArgs, apiName, loading }) => {
+    const Render = BuiltinToolPlaceholders[identifier || ''];
+
+    if (identifier) {
+      return (
+        <Render apiName={apiName} args={safeParseJSON(requestArgs) || {}} identifier={identifier} />
+      );
+    }
+
+    return <Arguments arguments={requestArgs} shine={loading} />;
+  },
+);
+
+export default LoadingPlaceholder;