✨ feat: support pplx search grounding (lobehub#6331)

Author: arvinxx

locales/en-US/components.json

@@ -111,8 +111,8 @@
     }
   },
   "Thinking": {
-    "thinking": "Deep in thought...",
-    "thought": "Deeply thought (took {{duration}} seconds)",
-    "thoughtWithDuration": "Deeply thought"
+    "thinking": "Deep Thinking...",
+    "thought": "Deeply Thought (in {{duration}} seconds)",
+    "thoughtWithDuration": "Deeply Thought"
   }
 }

package.json

@@ -129,7 +129,7 @@
     "@lobehub/chat-plugins-gateway": "^1.9.0",
     "@lobehub/icons": "^1.73.1",
     "@lobehub/tts": "^1.28.0",
-    "@lobehub/ui": "^1.164.15",
+    "@lobehub/ui": "^1.165.0",
     "@neondatabase/serverless": "^0.10.4",
     "@next/third-parties": "^15.1.4",
     "@react-spring/web": "^9.7.5",

src/components/ModelSelect/index.tsx

@@ -2,7 +2,14 @@ import { IconAvatarProps, ModelIcon, ProviderIcon } from '@lobehub/icons';
 import { Avatar, Icon, Tooltip } from '@lobehub/ui';
 import { Typography } from 'antd';
 import { createStyles } from 'antd-style';
-import { Infinity, AtomIcon, LucideEye, LucidePaperclip, ToyBrick } from 'lucide-react';
+import {
+  Infinity,
+  AtomIcon,
+  LucideEye,
+  LucideGlobe,
+  LucidePaperclip,
+  ToyBrick,
+} from 'lucide-react';
 import numeral from 'numeral';
 import { rgba } from 'polished';
 import { FC, memo } from 'react';
@@ -14,7 +21,7 @@ import { AiProviderSourceType } from '@/types/aiProvider';
 import { ChatModelCard } from '@/types/llm';
 import { formatTokenNumber } from '@/utils/format';
 
-const useStyles = createStyles(({ css, token }) => ({
+const useStyles = createStyles(({ css, token, isDarkMode }) => ({
   custom: css`
     width: 36px;
     height: 20px;
@@ -41,6 +48,10 @@ const useStyles = createStyles(({ css, token }) => ({
     color: ${token.geekblue};
     background: ${token.geekblue1};
   `,
+  tagCyan: css`
+    color: ${isDarkMode ? token.cyan7 : token.cyan10};
+    background: ${isDarkMode ? token.cyan1 : token.cyan2};
+  `,
   tagGreen: css`
     color: ${token.green};
     background: ${token.green1};
@@ -122,6 +133,17 @@ export const ModelInfoTags = memo<ModelInfoTagsProps>(
             </div>
           </Tooltip>
         )}
+        {model.search && (
+          <Tooltip
+            placement={placement}
+            styles={{ root: { pointerEvents: 'none' } }}
+            title={t('ModelSelect.featureTag.search')}
+          >
+            <div className={cx(styles.tag, styles.tagCyan)} style={{ cursor: 'pointer' }} title="">
+              <Icon icon={LucideGlobe} />
+            </div>
+          </Tooltip>
+        )}
         {typeof model.contextWindowTokens === 'number' && (
           <Tooltip
             placement={placement}

src/components/Thinking/index.tsx

@@ -7,6 +7,8 @@ import { CSSProperties, memo, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
 
+import { CitationItem } from '@/types/message';
+
 const useStyles = createStyles(({ css, token, isDarkMode }) => ({
   container: css`
     width: fit-content;
@@ -59,13 +61,14 @@ const useStyles = createStyles(({ css, token, isDarkMode }) => ({
 }));
 
 interface ThinkingProps {
+  citations?: CitationItem[];
   content?: string;
   duration?: number;
   style?: CSSProperties;
   thinking?: boolean;
 }
 
-const Thinking = memo<ThinkingProps>(({ content, duration, thinking, style }) => {
+const Thinking = memo<ThinkingProps>(({ content, duration, thinking, style, citations }) => {
   const { t } = useTranslation(['components', 'common']);
   const { styles, cx } = useStyles();
 
@@ -135,7 +138,9 @@ const Thinking = memo<ThinkingProps>(({ content, duration, thinking, style }) =>
             }}
           >
             {typeof content === 'string' ? (
-              <Markdown variant={'chat'}>{content}</Markdown>
+              <Markdown citations={citations} variant={'chat'}>
+                {content}
+              </Markdown>
             ) : (
               content
             )}

src/config/aiModels/jina.ts

@@ -4,19 +4,21 @@ const jinaChatModels: AIChatModelCard[] = [
   {
     abilities: {
       reasoning: true,
+      search: true,
     },
     contextWindowTokens: 1_000_000,
-    description: '深度搜索结合了网络搜索、阅读和推理，可进行全面调查。您可以将其视为一个代理，接受您的研究任务 - 它会进行广泛搜索并经过多次迭代，然后才能给出答案。这个过程涉及持续的研究、推理和从各个角度解决问题。这与直接从预训练数据生成答案的标准大模型以及依赖一次性表面搜索的传统 RAG 系统有着根本的不同。',
+    description:
+      '深度搜索结合了网络搜索、阅读和推理，可进行全面调查。您可以将其视为一个代理，接受您的研究任务 - 它会进行广泛搜索并经过多次迭代，然后才能给出答案。这个过程涉及持续的研究、推理和从各个角度解决问题。这与直接从预训练数据生成答案的标准大模型以及依赖一次性表面搜索的传统 RAG 系统有着根本的不同。',
     displayName: 'Jina DeepSearch v1',
     enabled: true,
     id: 'jina-deepsearch-v1',
     pricing: {
       input: 0.02,
-      output: 0.02
+      output: 0.02,
     },
-    type: 'chat'
-  }
-]
+    type: 'chat',
+  },
+];
 
 export const allModels = [...jinaChatModels];
 

src/config/aiModels/perplexity.ts

@@ -4,6 +4,7 @@ const perplexityChatModels: AIChatModelCard[] = [
   {
     abilities: {
       reasoning: true,
+      search: true,
     },
     contextWindowTokens: 127_072,
     description: '由 DeepSeek 推理模型提供支持的新 API 产品。',
@@ -16,6 +17,7 @@ const perplexityChatModels: AIChatModelCard[] = [
   {
     abilities: {
       reasoning: true,
+      search: true,
     },
     contextWindowTokens: 127_072,
     description: '由 DeepSeek 推理模型提供支持的新 API 产品。',
@@ -26,6 +28,9 @@ const perplexityChatModels: AIChatModelCard[] = [
     type: 'chat',
   },
   {
+    abilities: {
+      search: true,
+    },
     contextWindowTokens: 200_000,
     description: '支持搜索上下文的高级搜索产品，支持高级查询和跟进。',
     displayName: 'Sonar Pro',
@@ -34,6 +39,9 @@ const perplexityChatModels: AIChatModelCard[] = [
     type: 'chat',
   },
   {
+    abilities: {
+      search: true,
+    },
     contextWindowTokens: 127_072,
     description: '基于搜索上下文的轻量级搜索产品，比 Sonar Pro 更快、更便宜。',
     displayName: 'Sonar',

src/database/client/migrations.json

@@ -223,10 +223,7 @@
     "hash": "9646161fa041354714f823d726af27247bcd6e60fa3be5698c0d69f337a5700b"
   },
   {
-    "sql": [
-      "DROP TABLE \"user_budgets\";",
-      "\nDROP TABLE \"user_subscriptions\";"
-    ],
+    "sql": ["DROP TABLE \"user_budgets\";", "\nDROP TABLE \"user_subscriptions\";"],
     "bps": true,
     "folderMillis": 1729699958471,
     "hash": "7dad43a2a25d1aec82124a4e53f8d82f8505c3073f23606c1dc5d2a4598eacf9"
@@ -298,11 +295,18 @@
     "hash": "845a692ceabbfc3caf252a97d3e19a213bc0c433df2689900135f9cfded2cf49"
   },
   {
-    "sql": [
-      "ALTER TABLE \"messages\" ADD COLUMN \"reasoning\" jsonb;"
-    ],
+    "sql": ["ALTER TABLE \"messages\" ADD COLUMN \"reasoning\" jsonb;"],
     "bps": true,
     "folderMillis": 1737609172353,
     "hash": "2cb36ae4fcdd7b7064767e04bfbb36ae34518ff4bb1b39006f2dd394d1893868"
+  },
+  {
+    "sql": [
+      "ALTER TABLE \"messages\" ADD COLUMN \"search\" jsonb;",
+      "\nALTER TABLE \"messages\" ADD COLUMN \"metadata\" jsonb;"
+    ],
+    "bps": true,
+    "folderMillis": 1739901891891,
+    "hash": "78d8fefd8c58938d7bc3da2295a73b35ce2e8d7cb2820f8e817acdb8dd5bebb2"
   }
-]
+]

src/database/migrations/0015_add_message_search_metadata.sql

@@ -0,0 +1,2 @@
+ALTER TABLE "messages" ADD COLUMN "search" jsonb;--> statement-breakpoint
+ALTER TABLE "messages" ADD COLUMN "metadata" jsonb;