FIX: knowledge will not render a paginator when count is greater than 30 (#7596)

### What problem does this PR solve?

as https://github.com/infiniflow/ragflow/issues/7538
and https://github.com/infiniflow/ragflow/pull/7550

### Type of change

- [x] Bug Fix (non-breaking change which fixes an issue)

web/src/pages/knowledge/index.tsx

@@ -50,7 +50,7 @@ const KnowledgeList = () => {
   }, [data?.pages]);
 
   return (
-    <Flex className={styles.knowledge} vertical flex={1} id="scrollableDiv">
+    <Flex className={styles.knowledge} vertical flex={1}>
       <div className={styles.topWrapper}>
         <div>
           <span className={styles.title}>
@@ -79,13 +79,24 @@ const KnowledgeList = () => {
         </Space>
       </div>
       <Spin spinning={loading}>
+        <div
+          id="scrollableDiv"
+          style={{
+            height: 'calc(100vh - 250px)',
+            overflow: 'auto',
+            padding: '0 16px',
+          }}
+        >
           <InfiniteScroll
             dataLength={nextList?.length ?? 0}
             next={fetchNextPage}
             hasMore={hasNextPage}
             loader={<Skeleton avatar paragraph={{ rows: 1 }} active />}
-          endMessage={!!total && <Divider plain>{t('noMoreData')} 🤐</Divider>}
+            endMessage={
+              !!total && <Divider plain>{t('noMoreData')} 🤐</Divider>
+            }
             scrollableTarget="scrollableDiv"
+            scrollThreshold="200px"
           >
             <Flex
               gap={'large'}
@@ -106,6 +117,7 @@ const KnowledgeList = () => {
               )}
             </Flex>
           </InfiniteScroll>
+        </div>
       </Spin>
       <KnowledgeCreatingModal
         loading={creatingLoading}