feat: add web search switch button

Signed-off-by: Bob Du <i@bobdu.cc>

Author: BobDu

service/src/routes/room.ts

@@ -9,6 +9,7 @@ import {
   renameChatRoom,
   updateRoomChatModel,
   updateRoomPrompt,
+  updateRoomSearchEnabled,
   updateRoomUsingContext,
 } from '../storage/mongo'
 
@@ -27,6 +28,7 @@ router.get('/chatrooms', auth, async (req, res) => {
         prompt: r.prompt,
         usingContext: r.usingContext === undefined ? true : r.usingContext,
         chatModel: r.chatModel,
+        searchEnabled: !!r.searchEnabled,
       })
     })
     res.send({ status: 'Success', message: null, data: result })
@@ -135,6 +137,22 @@ router.post('/room-chatmodel', auth, async (req, res) => {
   }
 })
 
+router.post('/room-search-enabled', auth, async (req, res) => {
+  try {
+    const userId = req.headers.userId as string
+    const { searchEnabled, roomId } = req.body as { searchEnabled: boolean; roomId: number }
+    const success = await updateRoomSearchEnabled(userId, roomId, searchEnabled)
+    if (success)
+      res.send({ status: 'Success', message: 'Saved successfully', data: null })
+    else
+      res.send({ status: 'Fail', message: 'Saved Failed', data: null })
+  }
+  catch (error) {
+    console.error(error)
+    res.send({ status: 'Fail', message: 'Update error', data: null })
+  }
+})
+
 router.post('/room-context', auth, async (req, res) => {
   try {
     const userId = req.headers.userId as string

service/src/storage/model.ts

@@ -81,17 +81,16 @@ export class ChatRoom {
   prompt: string
   usingContext: boolean
   status: Status = Status.Normal
-  // only access token used
-  accountId?: string
   chatModel: string
-  constructor(userId: string, title: string, roomId: number, chatModel: string) {
+  searchEnabled: boolean
+  constructor(userId: string, title: string, roomId: number, chatModel: string, searchEnabled: boolean) {
     this.userId = userId
     this.title = title
     this.prompt = undefined
     this.roomId = roomId
     this.usingContext = true
-    this.accountId = null
     this.chatModel = chatModel
+    this.searchEnabled = searchEnabled
   }
 }
 

service/src/storage/mongo.ts

@@ -127,7 +127,7 @@ export async function insertChatUsage(userId: ObjectId,
 }
 
 export async function createChatRoom(userId: string, title: string, roomId: number, chatModel: string) {
-  const room = new ChatRoom(userId, title, roomId, chatModel)
+  const room = new ChatRoom(userId, title, roomId, chatModel, false)
   await roomCol.insertOne(room)
   return room
 }
@@ -182,6 +182,17 @@ export async function updateRoomChatModel(userId: string, roomId: number, chatMo
   return result.modifiedCount > 0
 }
 
+export async function updateRoomSearchEnabled(userId: string, roomId: number, searchEnabled: boolean) {
+  const query = { userId, roomId }
+  const update = {
+    $set: {
+      searchEnabled,
+    },
+  }
+  const result = await roomCol.updateOne(query, update)
+  return result.modifiedCount > 0
+}
+
 export async function getChatRooms(userId: string) {
   const cursor = roomCol.find({ userId, status: { $ne: Status.Deleted } })
   const rooms = []

src/api/index.ts

@@ -271,6 +271,13 @@ export function fetchUpdateChatRoomUsingContext<T = any>(using: boolean, roomId:
   })
 }
 
+export function fetchUpdateChatRoomSearchEnabled<T = any>(searchEnabled: boolean, roomId: number) {
+  return post<T>({
+    url: '/room-search-enabled',
+    data: { searchEnabled, roomId },
+  })
+}
+
 export function fetchDeleteChatRoom<T = any>(roomId: number) {
   return post<T>({
     url: '/room-delete',

src/locales/en-US.ts

@@ -55,10 +55,16 @@ export default {
     usingContext: 'Context Mode',
     turnOnContext: 'In the current mode, sending messages will carry previous chat records.',
     turnOffContext: 'In the current mode, sending messages will not carry previous chat records.',
+    turnOnSearch: 'Web search has been enabled for this chat.',
+    turnOffSearch: 'Web search has been disabled for this chat.',
     clickTurnOnContext: 'Click to enable sending messages will carry previous chat records.',
     clickTurnOffContext: 'Click to disable sending messages will carry previous chat records.',
+    clickTurnOnSearch: 'Click to enable web search for this chat.',
+    clickTurnOffSearch: 'Click to disable web search for this chat.',
     showOnContext: 'Include context',
     showOffContext: 'Not include context',
+    searchEnabled: 'Search enabled',
+    searchDisabled: 'Search disabled',
     deleteMessage: 'Delete Message',
     deleteMessageConfirm: 'Are you sure to delete this message?',
     deleteHistoryConfirm: 'Are you sure to clear this history?',

src/locales/zh-CN.ts

@@ -55,10 +55,16 @@ export default {
     usingContext: '上下文模式',
     turnOnContext: '当前模式下, 发送消息会携带之前的聊天记录',
     turnOffContext: '当前模式下, 发送消息不会携带之前的聊天记录',
+    turnOnSearch: '已开启网络搜索功能',
+    turnOffSearch: '已关闭网络搜索功能',
     clickTurnOnContext: '点击开启包含上下文',
     clickTurnOffContext: '点击停止包含上下文',
+    clickTurnOnSearch: '点击开启网络搜索功能',
+    clickTurnOffSearch: '点击关闭网络搜索功能',
     showOnContext: '包含上下文',
     showOffContext: '不含上下文',
+    searchEnabled: '搜索已开启',
+    searchDisabled: '搜索已关闭',
     deleteMessage: '删除消息',
     deleteMessageConfirm: '是否删除此消息?',
     deleteHistoryConfirm: '确定删除此记录?',

src/store/modules/chat/index.ts

@@ -11,6 +11,7 @@ import {
   fetchGetChatRooms,
   fetchRenameChatRoom,
   fetchUpdateChatRoomChatModel,
+  fetchUpdateChatRoomSearchEnabled,
   fetchUpdateChatRoomUsingContext,
   fetchUpdateUserChatModel,
 } from '@/api'
@@ -115,6 +116,15 @@ export const useChatStore = defineStore('chat-store', {
       await fetchUpdateUserChatModel(chatModel)
     },
 
+    async setChatSearchEnabled(searchEnabled: boolean, roomId: number) {
+      const index = this.history.findIndex(item => item.uuid === this.active)
+      if (index !== -1) {
+        this.history[index].searchEnabled = searchEnabled
+        await fetchUpdateChatRoomSearchEnabled(searchEnabled, roomId)
+        this.recordState()
+      }
+    },
+
     async addHistory(history: Chat.History, chatData: Chat.Chat[] = []) {
       await fetchCreateChatRoom(history.title, history.uuid, history.chatModel)
       this.history.unshift(history)

src/typings/chat.d.ts

@@ -29,6 +29,7 @@ declare namespace Chat {
     prompt?: string
     usingContext: boolean
     chatModel?: string
+    searchEnabled?: boolean
   }
 
   interface ChatState {

src/views/chat/components/Header/index.vue

@@ -7,12 +7,14 @@ import IconPrompt from '@/icons/Prompt.vue'
 interface Props {
   usingContext: boolean
   showPrompt: boolean
+  searchEnabled?: boolean
 }
 
 interface Emit {
   (ev: 'export'): void
   (ev: 'toggleUsingContext'): void
   (ev: 'toggleShowPrompt'): void
+  (ev: 'toggleSearchEnabled'): void
 }
 
 defineProps<Props>()
@@ -43,6 +45,10 @@ function toggleUsingContext() {
   emit('toggleUsingContext')
 }
 
+function toggleSearchEnabled() {
+  emit('toggleSearchEnabled')
+}
+
 function handleShowPrompt() {
   emit('toggleShowPrompt')
 }
@@ -80,6 +86,12 @@ function handleShowPrompt() {
           </span>
           <span style="margin-left:.25em">{{ usingContext ? $t('chat.showOnContext') : $t('chat.showOffContext') }}</span>
         </HoverButton>
+        <HoverButton :class="{ 'text-[#4b9e5f]': searchEnabled, 'text-[#a8071a]': !searchEnabled }" @click="toggleSearchEnabled">
+          <span class="text-xl">
+            <SvgIcon icon="mdi:web" />
+          </span>
+          <span style="margin-left:.25em">{{ searchEnabled ? $t('chat.searchEnabled') : $t('chat.searchDisabled') }}</span>
+        </HoverButton>
         <HoverButton @click="handleExport">
           <span class="text-xl text-[#4f555e] dark:text-white">
             <SvgIcon icon="ri:download-2-line" />

src/views/chat/index.vue

@@ -552,6 +552,19 @@ async function handleScroll(event: any) {
   prevScrollTop = scrollTop
 }
 
+async function handleToggleSearchEnabled() {
+  if (!currentChatHistory.value)
+    return
+
+  const searchEnabled = currentChatHistory.value.searchEnabled ?? false
+  currentChatHistory.value.searchEnabled = !searchEnabled
+  await chatStore.setChatSearchEnabled(!searchEnabled, +uuid)
+  if (currentChatHistory.value.searchEnabled)
+    ms.success(t('chat.turnOnSearch'))
+  else
+    ms.warning(t('chat.turnOffSearch'))
+}
+
 async function handleToggleUsingContext() {
   if (!currentChatHistory.value)
     return
@@ -662,7 +675,10 @@ onUnmounted(() => {
       v-if="isMobile"
       :using-context="usingContext"
       :show-prompt="showPrompt"
-      @export="handleExport" @toggle-using-context="handleToggleUsingContext"
+      :search-enabled="currentChatHistory?.searchEnabled"
+      @export="handleExport"
+      @toggle-using-context="handleToggleUsingContext"
+      @toggle-search-enabled="handleToggleSearchEnabled"
       @toggle-show-prompt="showPrompt = true"
     />
     <main class="flex-1 overflow-hidden">
@@ -767,7 +783,6 @@ onUnmounted(() => {
               <span class="text-xl">
                 <SvgIcon icon="ri:chat-history-line" />
               </span>
-              <!-- <span style="margin-left:.25em">{{ usingContext ? '包含上下文' : '不含上下文' }}</span> -->
             </HoverButton>
             <NSelect
               style="width: 250px"
@@ -776,6 +791,11 @@ onUnmounted(() => {
               :disabled="!!authStore.session?.auth && !authStore.token && !authStore.session?.authProxyEnabled"
               @update-value="(val) => handleSyncChatModel(val)"
             />
+            <HoverButton v-if="!isMobile" :tooltip="currentChatHistory?.searchEnabled ? $t('chat.clickTurnOffSearch') : $t('chat.clickTurnOnSearch')" :class="{ 'text-[#4b9e5f]': currentChatHistory?.searchEnabled, 'text-[#a8071a]': !currentChatHistory?.searchEnabled }" @click="handleToggleSearchEnabled">
+              <span class="text-xl">
+                <SvgIcon icon="mdi:web" />
+              </span>
+            </HoverButton>
             <NSlider v-model:value="userStore.userInfo.advanced.maxContextCount" :max="100" :min="0" :step="1" style="width: 88px" :format-tooltip="formatTooltip" @update:value="() => { userStore.updateSetting(false) }" />
           </div>
           <div class="flex items-center justify-between space-x-2">