From 8ad7339448bdc5b6d5090a2f1144d0ba5d5920c3 Mon Sep 17 00:00:00 2001
From: chanx <1243304602@qq.com>
Date: Mon, 9 Feb 2026 19:53:24 +0800
Subject: [PATCH] Fix: Add authentication validation to the document API
 interface for embedded pages. (#13078)

### What problem does this PR solve?

Fix: Add authentication validation to the document API interface for
embedded pages and modify the document display styles.

### Type of change

- [x] Bug Fix (non-breaking change which fixes an issue)
---
 .../document-preview/image-preview.tsx        | 16 +++++-----
 web/src/components/document-preview/index.tsx |  1 +
 .../document-preview/pdf-preview.tsx          |  8 ++++-
 .../reference-document-list.tsx               | 31 ++++++++++++++++---
 web/src/hooks/use-document-request.ts         | 10 ++++--
 .../document-preview-modal/index.tsx          |  5 ++-
 web/src/routes.tsx                            |  1 -
 web/src/utils/api.ts                          |  2 +-
 8 files changed, 54 insertions(+), 20 deletions(-)

diff --git a/web/src/components/document-preview/image-preview.tsx b/web/src/components/document-preview/image-preview.tsx
index 3b922f58c2..484d716e33 100644
--- a/web/src/components/document-preview/image-preview.tsx
+++ b/web/src/components/document-preview/image-preview.tsx
@@ -51,7 +51,7 @@ export const ImagePreviewer: React.FC<ImagePreviewerProps> = ({
   return (
     <div
       className={classNames(
-        'relative w-full h-full p-4 bg-background-paper border border-border-normal rounded-md image-previewer',
+        'relative w-full h-full p-4 bg-background-paper border border-border-normal rounded-md image-previewer max-h-[80vh] overflow-auto',
         className,
       )}
     >
@@ -62,14 +62,12 @@ export const ImagePreviewer: React.FC<ImagePreviewerProps> = ({
       )}
 
       {!isLoading && imageSrc && (
-        <div className="max-h-[80vh] overflow-auto p-2">
-          <img
-            src={imageSrc}
-            alt={'image'}
-            className="w-full h-auto max-w-full object-contain"
-            onLoad={() => URL.revokeObjectURL(imageSrc!)}
-          />
-        </div>
+        <img
+          src={imageSrc}
+          alt={'image'}
+          className="w-full h-auto max-w-full object-contain"
+          onLoad={() => URL.revokeObjectURL(imageSrc!)}
+        />
       )}
     </div>
   );
diff --git a/web/src/components/document-preview/index.tsx b/web/src/components/document-preview/index.tsx
index 334cae4511..62a9078c43 100644
--- a/web/src/components/document-preview/index.tsx
+++ b/web/src/components/document-preview/index.tsx
@@ -27,6 +27,7 @@ const Preview = ({
       {fileType === 'pdf' && highlights && setWidthAndHeight && (
         <section>
           <PdfPreviewer
+            className={className}
             highlights={highlights}
             setWidthAndHeight={setWidthAndHeight}
             url={url}
diff --git a/web/src/components/document-preview/pdf-preview.tsx b/web/src/components/document-preview/pdf-preview.tsx
index 57eaa5016f..5fc9377c57 100644
--- a/web/src/components/document-preview/pdf-preview.tsx
+++ b/web/src/components/document-preview/pdf-preview.tsx
@@ -52,9 +52,15 @@ const PdfPreview = ({
   const resetHash = () => {};
 
   useEffect(() => {
+    let timer = null;
     if (state?.length && state?.length > 0) {
-      ref?.current(state[0]);
+      timer = setTimeout(() => {
+        ref?.current(state[0]);
+      }, 100);
     }
+    return () => {
+      if (timer) clearTimeout(timer);
+    };
   }, [state]);
 
   const httpHeaders = {
diff --git a/web/src/components/next-message-item/reference-document-list.tsx b/web/src/components/next-message-item/reference-document-list.tsx
index 65a4a613bc..cf1cff06f8 100644
--- a/web/src/components/next-message-item/reference-document-list.tsx
+++ b/web/src/components/next-message-item/reference-document-list.tsx
@@ -1,17 +1,27 @@
 import { Card, CardContent } from '@/components/ui/card';
+import { useSetModalState } from '@/hooks/common-hooks';
 import { Docagg } from '@/interfaces/database/chat';
+import PdfDrawer from '@/pages/next-search/document-preview-modal';
 import { middleEllipsis } from '@/utils/common-util';
+import { useState } from 'react';
 import FileIcon from '../file-icon';
-import NewDocumentLink from '../new-document-link';
 
 export function ReferenceDocumentList({ list }: { list: Docagg[] }) {
+  const { visible, showModal, hideModal } = useSetModalState();
+  const [selectedDocument, setSelectedDocument] = useState<Docagg>();
   return (
     <section className="flex gap-3 flex-wrap">
       {list.map((item) => (
         <Card key={item.doc_id}>
-          <CardContent className="p-2 space-x-2">
+          <CardContent
+            className="flex items-center p-2 space-x-2 cursor-pointer"
+            onClick={() => {
+              setSelectedDocument(item);
+              showModal();
+            }}
+          >
             <FileIcon id={item.doc_id} name={item.doc_name}></FileIcon>
-            <NewDocumentLink
+            {/* <NewDocumentLink
               documentId={item.doc_id}
               documentName={item.doc_name}
               prefix="document"
@@ -19,10 +29,23 @@ export function ReferenceDocumentList({ list }: { list: Docagg[] }) {
               className="text-text-sub-title-invert"
             >
               {middleEllipsis(item.doc_name)}
-            </NewDocumentLink>
+            </NewDocumentLink> */}
+            <div className="text-text-sub-title-invert">
+              {middleEllipsis(item.doc_name)}
+            </div>
           </CardContent>
         </Card>
       ))}
+      {visible && selectedDocument && (
+        <PdfDrawer
+          visible={visible}
+          hideModal={hideModal}
+          documentId={selectedDocument.doc_id}
+          chunk={{
+            document_name: selectedDocument.doc_name,
+          }}
+        ></PdfDrawer>
+      )}
     </section>
   );
 }
diff --git a/web/src/hooks/use-document-request.ts b/web/src/hooks/use-document-request.ts
index 22fd1dc5bd..9075e50b10 100644
--- a/web/src/hooks/use-document-request.ts
+++ b/web/src/hooks/use-document-request.ts
@@ -16,7 +16,8 @@ import {
 import i18n from '@/locales/config';
 import { EMPTY_METADATA_FIELD } from '@/pages/dataset/dataset/use-select-filters';
 import kbService, { listDocument } from '@/services/knowledge-service';
-import api, { api_host } from '@/utils/api';
+import api, { api_host, ExternalApi } from '@/utils/api';
+import { getSearchValue } from '@/utils/common-util';
 import { buildChunkHighlights } from '@/utils/document-util';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
 import { useDebounce } from 'ahooks';
@@ -464,11 +465,14 @@ export const useCreateDocument = () => {
 };
 
 export const useGetDocumentUrl = (documentId?: string) => {
+  const auth = getSearchValue('auth');
   const getDocumentUrl = useCallback(
     (id?: string) => {
-      return `${api_host}/document/get/${documentId || id}`;
+      return auth
+        ? `${ExternalApi}/v1/documents/${documentId || id}`
+        : `${api_host}/document/get/${documentId || id}`;
     },
-    [documentId],
+    [documentId, auth],
   );
 
   return getDocumentUrl;
diff --git a/web/src/pages/next-search/document-preview-modal/index.tsx b/web/src/pages/next-search/document-preview-modal/index.tsx
index 00da5a8d7a..a4ac31e6c6 100644
--- a/web/src/pages/next-search/document-preview-modal/index.tsx
+++ b/web/src/pages/next-search/document-preview-modal/index.tsx
@@ -8,6 +8,7 @@ import {
 import { IModalProps } from '@/interfaces/common';
 import { IReferenceChunk } from '@/interfaces/database/chat';
 import { IChunk } from '@/interfaces/database/knowledge';
+import { cn } from '@/lib/utils';
 import { useEffect, useState } from 'react';
 
 interface IProps extends IModalProps<any> {
@@ -54,7 +55,9 @@ const PdfDrawer = ({
       showfooter={false}
     >
       <DocumentPreview
-        className={'!h-[calc(100dvh-300px)] overflow-auto'}
+        className={cn(
+          '!h-[calc(100dvh-300px)] overflow-auto border-none padding-0 max-h-full',
+        )}
         fileType={fileType}
         highlights={highlights}
         setWidthAndHeight={setWidthAndHeight}
diff --git a/web/src/routes.tsx b/web/src/routes.tsx
index ce564f66e5..5e57a2109b 100644
--- a/web/src/routes.tsx
+++ b/web/src/routes.tsx
@@ -92,7 +92,6 @@ const withLazyRoute = (
     LazyComponent.name ||
     'Component'
   })`;
-  Wrapped.whyDidYouRender = false;
   return process.env.NODE_ENV === 'development' ? LazyComponent : memo(Wrapped);
 };
 
diff --git a/web/src/utils/api.ts b/web/src/utils/api.ts
index ea76e1148d..bd9bb103b1 100644
--- a/web/src/utils/api.ts
+++ b/web/src/utils/api.ts
@@ -1,7 +1,7 @@
 let api_host = `/v1`;
 const ExternalApi = `/api`;
 
-export { api_host };
+export { ExternalApi, api_host };
 
 export default {
   // user