From b1918dae5ecc4270266dcbcfad493f265d5f907a Mon Sep 17 00:00:00 2001
From: crazywoola <100913391+crazywoola@users.noreply.github.com>
Date: Sat, 7 Sep 2024 17:53:39 +0800
Subject: [PATCH] fix: knowledge input (#8065)

---
 web/app/components/datasets/documents/index.tsx | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/web/app/components/datasets/documents/index.tsx b/web/app/components/datasets/documents/index.tsx
index 32c045eccd..590828830d 100644
--- a/web/app/components/datasets/documents/index.tsx
+++ b/web/app/components/datasets/documents/index.tsx
@@ -4,8 +4,9 @@ import React, { useMemo, useState } from 'react'
 import useSWR from 'swr'
 import { useTranslation } from 'react-i18next'
 import { useRouter } from 'next/navigation'
-import { debounce, groupBy, omit } from 'lodash-es'
+import { groupBy, omit } from 'lodash-es'
 import { PlusIcon } from '@heroicons/react/24/solid'
+import { useDebounce } from 'ahooks'
 import List from './list'
 import s from './style.module.css'
 import Loading from '@/app/components/base/loading'
@@ -87,9 +88,11 @@ const Documents: FC<IDocumentsProps> = ({ datasetId }) => {
   const isDataSourceFile = dataset?.data_source_type === DataSourceType.FILE
   const embeddingAvailable = !!dataset?.embedding_available
 
+  const debouncedSearchValue = useDebounce(searchValue, { wait: 500 })
+
   const query = useMemo(() => {
-    return { page: currPage + 1, limit, keyword: searchValue, fetch: isDataSourceNotion ? true : '' }
-  }, [searchValue, currPage, isDataSourceNotion])
+    return { page: currPage + 1, limit, keyword: debouncedSearchValue, fetch: isDataSourceNotion ? true : '' }
+  }, [currPage, debouncedSearchValue, isDataSourceNotion])
 
   const { data: documentsRes, error, mutate } = useSWR(
     {
@@ -204,7 +207,7 @@ const Documents: FC<IDocumentsProps> = ({ datasetId }) => {
             showLeftIcon
             wrapperClassName='!w-[200px]'
             className='!h-8 !text-[13px]'
-            onChange={debounce(e => setSearchValue(e.target.value), 500)}
+            onChange={e => setSearchValue(e.target.value)}
             value={searchValue}
           />
           <div className='flex gap-2 justify-center items-center !h-8'>