feat: set width of chunk text to 100% and add Skeleton to Preview of document and remove react-pdf (#94)

* feat: remove react-pdf

* feat: add Skeleton to Preview of document

* feat: set width of chunk text to 100%

web/.umirc.ts

@@ -1,16 +1,6 @@
-import path from 'path';
 import { defineConfig } from 'umi';
 import routes from './src/routes';
 
-const cMapsDir = path.join(
-  path.dirname(require.resolve('pdfjs-dist/package.json')),
-  'cmaps',
-);
-const standardFontsDir = path.join(
-  path.dirname(require.resolve('pdfjs-dist/package.json')),
-  'standard_fonts',
-);
-
 export default defineConfig({
   outputPath: 'dist',
   // alias: { '@': './src' },
@@ -38,11 +28,4 @@ export default defineConfig({
       // pathRewrite: { '^/v1': '/v1' },
     },
   },
-  copy: [
-    { from: cMapsDir, to: 'cmaps/' },
-    { from: standardFontsDir, to: 'standard_fonts/' },
-  ],
-  chainWebpack(memo, args) {
-    console.info(memo);
-  },
 });

web/package-lock.json

@@ -23,7 +23,6 @@
         "react-i18next": "^14.0.0",
         "react-infinite-scroll-component": "^6.1.0",
         "react-markdown": "^9.0.1",
-        "react-pdf": "^7.7.1",
         "react-pdf-highlighter": "^6.1.0",
         "react-string-replace": "^1.1.1",
         "umi": "^4.0.90",
@@ -2101,109 +2100,6 @@
       "resolved": "https://registry.npmmirror.com/react-is/-/react-is-16.13.1.tgz",
       "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
     },
-    "node_modules/@mapbox/node-pre-gyp": {
-      "version": "1.0.11",
-      "resolved": "https://registry.npmmirror.com/@mapbox/node-pre-gyp/-/node-pre-gyp-1.0.11.tgz",
-      "integrity": "sha512-Yhlar6v9WQgUp/He7BdgzOz8lqMQ8sU+jkCq7Wx8Myc5YFJLbEe7lgui/V7G1qB1DJykHSGwreceSaD60Y0PUQ==",
-      "optional": true,
-      "dependencies": {
-        "detect-libc": "^2.0.0",
-        "https-proxy-agent": "^5.0.0",
-        "make-dir": "^3.1.0",
-        "node-fetch": "^2.6.7",
-        "nopt": "^5.0.0",
-        "npmlog": "^5.0.1",
-        "rimraf": "^3.0.2",
-        "semver": "^7.3.5",
-        "tar": "^6.1.11"
-      },
-      "bin": {
-        "node-pre-gyp": "bin/node-pre-gyp"
-      }
-    },
-    "node_modules/@mapbox/node-pre-gyp/node_modules/detect-libc": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmmirror.com/detect-libc/-/detect-libc-2.0.2.tgz",
-      "integrity": "sha512-UX6sGumvvqSaXgdKGUsgZWqcUyIXZ/vZTrlRT/iobiKhGL0zL4d3osHj3uqllWJK+i+sixDS/3COVEOFbupFyw==",
-      "optional": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/@mapbox/node-pre-gyp/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmmirror.com/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "optional": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/@mapbox/node-pre-gyp/node_modules/make-dir": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmmirror.com/make-dir/-/make-dir-3.1.0.tgz",
-      "integrity": "sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==",
-      "optional": true,
-      "dependencies": {
-        "semver": "^6.0.0"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/@mapbox/node-pre-gyp/node_modules/make-dir/node_modules/semver": {
-      "version": "6.3.1",
-      "resolved": "https://registry.npmmirror.com/semver/-/semver-6.3.1.tgz",
-      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
-      "optional": true,
-      "bin": {
-        "semver": "bin/semver.js"
-      }
-    },
-    "node_modules/@mapbox/node-pre-gyp/node_modules/node-fetch": {
-      "version": "2.7.0",
-      "resolved": "https://registry.npmmirror.com/node-fetch/-/node-fetch-2.7.0.tgz",
-      "integrity": "sha512-c4FRfUm/dbcWZ7U+1Wq0AwCyFL+3nt2bEw05wfxSz+DWpWsitgmSgYmy2dQdWyKC1694ELPqMs/YzUSNozLt8A==",
-      "optional": true,
-      "dependencies": {
-        "whatwg-url": "^5.0.0"
-      },
-      "engines": {
-        "node": "4.x || >=6.0.0"
-      },
-      "peerDependencies": {
-        "encoding": "^0.1.0"
-      },
-      "peerDependenciesMeta": {
-        "encoding": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@mapbox/node-pre-gyp/node_modules/semver": {
-      "version": "7.6.0",
-      "resolved": "https://registry.npmmirror.com/semver/-/semver-7.6.0.tgz",
-      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
-      "optional": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
-      "bin": {
-        "semver": "bin/semver.js"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/@mapbox/node-pre-gyp/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmmirror.com/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "optional": true
-    },
     "node_modules/@mrmlnc/readdir-enhanced": {
       "version": "2.2.1",
       "resolved": "https://registry.npmmirror.com/@mrmlnc/readdir-enhanced/-/readdir-enhanced-2.2.1.tgz",
@@ -4688,12 +4584,6 @@
       "integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==",
       "peer": true
     },
-    "node_modules/abbrev": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmmirror.com/abbrev/-/abbrev-1.1.1.tgz",
-      "integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==",
-      "optional": true
-    },
     "node_modules/acorn": {
       "version": "8.11.3",
       "resolved": "https://registry.npmmirror.com/acorn/-/acorn-8.11.3.tgz",
@@ -4740,18 +4630,6 @@
         "node": ">= 10.0.0"
       }
     },
-    "node_modules/agent-base": {
-      "version": "6.0.2",
-      "resolved": "https://registry.npmmirror.com/agent-base/-/agent-base-6.0.2.tgz",
-      "integrity": "sha512-RZNwNclF7+MS/8bDg70amg32dyeZGZxiDuQmZxKLAlQjr3jGyLx+4Kkk58UO7D2QdgFIQCovuSuZESne6RG6XQ==",
-      "optional": true,
-      "dependencies": {
-        "debug": "4"
-      },
-      "engines": {
-        "node": ">= 6.0.0"
-      }
-    },
     "node_modules/aggregate-error": {
       "version": "3.1.0",
       "resolved": "https://registry.npmmirror.com/aggregate-error/-/aggregate-error-3.1.0.tgz",
@@ -4914,25 +4792,6 @@
         "node": ">= 8"
       }
     },
-    "node_modules/aproba": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmmirror.com/aproba/-/aproba-2.0.0.tgz",
-      "integrity": "sha512-lYe4Gx7QT+MKGbDsA+Z+he/Wtef0BiwDOlK/XkBrdfsh9J/jPPXbX0tE9x9cl27Tmu5gg3QUbUrQYa/y+KOHPQ==",
-      "optional": true
-    },
-    "node_modules/are-we-there-yet": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmmirror.com/are-we-there-yet/-/are-we-there-yet-2.0.0.tgz",
-      "integrity": "sha512-Ci/qENmwHnsYo9xKIcUJN5LeDKdJ6R1Z1j9V/J5wyq8nh/mYPEpIKJbBZXtZjG04HiK7zV/p6Vs9952MrMeUIw==",
-      "optional": true,
-      "dependencies": {
-        "delegates": "^1.0.0",
-        "readable-stream": "^3.6.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/argparse": {
       "version": "1.0.10",
       "resolved": "https://registry.npmmirror.com/argparse/-/argparse-1.0.10.tgz",
@@ -5766,21 +5625,6 @@
       "resolved": "https://registry.npmmirror.com/caniuse-lite/-/caniuse-lite-1.0.30001574.tgz",
       "integrity": "sha512-BtYEK4r/iHt/txm81KBudCUcTy7t+s9emrIaHqjYurQ10x71zJ5VQ9x1dYPcz/b+pKSp4y/v1xSI67A+LzpNyg=="
     },
-    "node_modules/canvas": {
-      "version": "2.11.2",
-      "resolved": "https://registry.npmmirror.com/canvas/-/canvas-2.11.2.tgz",
-      "integrity": "sha512-ItanGBMrmRV7Py2Z+Xhs7cT+FNt5K0vPL4p9EZ/UX/Mu7hFbkxSjKF2KVtPwX7UYWp7dRKnrTvReflgrItJbdw==",
-      "hasInstallScript": true,
-      "optional": true,
-      "dependencies": {
-        "@mapbox/node-pre-gyp": "^1.0.0",
-        "nan": "^2.17.0",
-        "simple-get": "^3.0.3"
-      },
-      "engines": {
-        "node": ">=6"
-      }
-    },
     "node_modules/ccount": {
       "version": "2.0.1",
       "resolved": "https://registry.npmmirror.com/ccount/-/ccount-2.0.1.tgz",
@@ -5839,15 +5683,6 @@
         "fsevents": "~2.3.2"
       }
     },
-    "node_modules/chownr": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmmirror.com/chownr/-/chownr-2.0.0.tgz",
-      "integrity": "sha512-bIomtDF5KGpdogkLd9VspvFzk9KfpyyGlS8YFVZl7TGPBHL5snIOnxeshwVgPteQ9b4Eydl+pVbIyE1DcvCWgQ==",
-      "optional": true,
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/chrome-trace-event": {
       "version": "1.0.3",
       "resolved": "https://registry.npmmirror.com/chrome-trace-event/-/chrome-trace-event-1.0.3.tgz",
@@ -5978,14 +5813,6 @@
         "node": ">=12"
       }
     },
-    "node_modules/clsx": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmmirror.com/clsx/-/clsx-2.1.0.tgz",
-      "integrity": "sha512-m3iNNWpd9rl3jvvcBnu70ylMdrXt8Vlq4HYadnU5fwcOtvkSQWPmj7amUcDT2qYI7risszBjI5AUIUox9D16pg==",
-      "engines": {
-        "node": ">=6"
-      }
-    },
     "node_modules/coa": {
       "version": "2.0.2",
       "resolved": "https://registry.npmmirror.com/coa/-/coa-2.0.2.tgz",
@@ -6026,15 +5853,6 @@
       "resolved": "https://registry.npmmirror.com/color-name/-/color-name-1.1.3.tgz",
       "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw=="
     },
-    "node_modules/color-support": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmmirror.com/color-support/-/color-support-1.1.3.tgz",
-      "integrity": "sha512-qiBjkpbMLO/HL68y+lh4q0/O1MZFj2RX6X/KmMa3+gJD3z+WwI1ZzDHysvqHGS3mP6mznPckpXmw1nI9cJjyRg==",
-      "optional": true,
-      "bin": {
-        "color-support": "bin.js"
-      }
-    },
     "node_modules/colord": {
       "version": "2.9.3",
       "resolved": "https://registry.npmmirror.com/colord/-/colord-2.9.3.tgz",
@@ -6091,12 +5909,6 @@
       "resolved": "https://registry.npmmirror.com/console-browserify/-/console-browserify-1.2.0.tgz",
       "integrity": "sha512-ZMkYO/LkF17QvCPqM0gxw8yUzigAOZOSWSHg91FH6orS7vcEj5dVZTidN2fQ14yBSdg97RqhSNwLUXInd52OTA=="
     },
-    "node_modules/console-control-strings": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmmirror.com/console-control-strings/-/console-control-strings-1.1.0.tgz",
-      "integrity": "sha512-ty/fTekppD2fIwRvnZAVdeOiGd1c7YXEixbgJTNzqcxJWKQnjJ/V1bNEEE6hygpM3WjwHFUVK6HTjWSzV4a8sQ==",
-      "optional": true
-    },
     "node_modules/constants-browserify": {
       "version": "1.0.0",
       "resolved": "https://registry.npmmirror.com/constants-browserify/-/constants-browserify-1.0.0.tgz",
@@ -6890,18 +6702,6 @@
         "node": ">=0.10"
       }
     },
-    "node_modules/decompress-response": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmmirror.com/decompress-response/-/decompress-response-4.2.1.tgz",
-      "integrity": "sha512-jOSne2qbyE+/r8G1VU+G/82LBs2Fs4LAsTiLSHOCOMZQl2OKZ6i8i4IyHemTe+/yIXOtTcRQMzPcgyhoFlqPkw==",
-      "optional": true,
-      "dependencies": {
-        "mimic-response": "^2.0.0"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/deep-is": {
       "version": "0.1.4",
       "resolved": "https://registry.npmmirror.com/deep-is/-/deep-is-0.1.4.tgz",
@@ -7078,12 +6878,6 @@
         "node": ">=0.4.0"
       }
     },
-    "node_modules/delegates": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmmirror.com/delegates/-/delegates-1.0.0.tgz",
-      "integrity": "sha512-bd2L678uiWATM6m5Z1VzNCErI3jiGzt6HGY8OVICs40JQq/HALfbyNJmp0UDakEY4pMMaN0Ly5om/B1VI/+xfQ==",
-      "optional": true
-    },
     "node_modules/dequal": {
       "version": "2.0.3",
       "resolved": "https://registry.npmmirror.com/dequal/-/dequal-2.0.3.tgz",
@@ -8918,36 +8712,6 @@
         "node": ">=12"
       }
     },
-    "node_modules/fs-minipass": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmmirror.com/fs-minipass/-/fs-minipass-2.1.0.tgz",
-      "integrity": "sha512-V/JgOLFCS+R6Vcq0slCuaeWEdNC3ouDlJMNIsacH2VtALiu9mV4LPrHc5cDl8k5aw6J8jwgWWpiTo5RYhmIzvg==",
-      "optional": true,
-      "dependencies": {
-        "minipass": "^3.0.0"
-      },
-      "engines": {
-        "node": ">= 8"
-      }
-    },
-    "node_modules/fs-minipass/node_modules/minipass": {
-      "version": "3.3.6",
-      "resolved": "https://registry.npmmirror.com/minipass/-/minipass-3.3.6.tgz",
-      "integrity": "sha512-DxiNidxSEK+tHG6zOIklvNOwm3hvCrbUrdtzY74U6HKTJxvIDfOUL5W5P2Ghd3DTkhhKPYGqeNUIh5qcM4YBfw==",
-      "optional": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/fs-minipass/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmmirror.com/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "optional": true
-    },
     "node_modules/fs-monkey": {
       "version": "1.0.5",
       "resolved": "https://registry.npmmirror.com/fs-monkey/-/fs-monkey-1.0.5.tgz",
@@ -8995,26 +8759,6 @@
       "resolved": "https://registry.npmmirror.com/functions-have-names/-/functions-have-names-1.2.3.tgz",
       "integrity": "sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ=="
     },
-    "node_modules/gauge": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmmirror.com/gauge/-/gauge-3.0.2.tgz",
-      "integrity": "sha512-+5J6MS/5XksCuXq++uFRsnUd7Ovu1XenbeuIuNRJxYWjgQbPuFhT14lAvsWfqfAmnwluf1OwMjz39HjfLPci0Q==",
-      "optional": true,
-      "dependencies": {
-        "aproba": "^1.0.3 || ^2.0.0",
-        "color-support": "^1.1.2",
-        "console-control-strings": "^1.0.0",
-        "has-unicode": "^2.0.1",
-        "object-assign": "^4.1.1",
-        "signal-exit": "^3.0.0",
-        "string-width": "^4.2.3",
-        "strip-ansi": "^6.0.1",
-        "wide-align": "^1.1.2"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/gensync": {
       "version": "1.0.0-beta.2",
       "resolved": "https://registry.npmmirror.com/gensync/-/gensync-1.0.0-beta.2.tgz",
@@ -9341,12 +9085,6 @@
         "node": ">= 0.4"
       }
     },
-    "node_modules/has-unicode": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmmirror.com/has-unicode/-/has-unicode-2.0.1.tgz",
-      "integrity": "sha512-8Rf9Y83NBReMnx0gFzA8JImQACstCYWUplepDa9xprwwtmgEZUF0h/i5xSA625zB/I37EtrswSST6OXxwaaIJQ==",
-      "optional": true
-    },
     "node_modules/has-value": {
       "version": "1.0.0",
       "resolved": "https://registry.npmmirror.com/has-value/-/has-value-1.0.0.tgz",
@@ -9687,19 +9425,6 @@
       "resolved": "https://registry.npmmirror.com/https-browserify/-/https-browserify-1.0.0.tgz",
       "integrity": "sha512-J+FkSdyD+0mA0N+81tMotaRMfSL9SGi+xpD3T6YApKsc3bGSXJlfXri3VyFOeYkfLRQisDk1W+jIFFKBeUBbBg=="
     },
-    "node_modules/https-proxy-agent": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmmirror.com/https-proxy-agent/-/https-proxy-agent-5.0.1.tgz",
-      "integrity": "sha512-dFcAjpTQFgoLMzC2VwU+C/CbS7uRL0lWmxDITmqm7C+7F0Odmj6s9l6alZc6AELXhrnggM2CeWSXHGOdX2YtwA==",
-      "optional": true,
-      "dependencies": {
-        "agent-base": "6",
-        "debug": "4"
-      },
-      "engines": {
-        "node": ">= 6"
-      }
-    },
     "node_modules/human-signals": {
       "version": "2.1.0",
       "resolved": "https://registry.npmmirror.com/human-signals/-/human-signals-2.1.0.tgz",
@@ -11302,11 +11027,6 @@
         "yallist": "^3.0.2"
       }
     },
-    "node_modules/make-cancellable-promise": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmmirror.com/make-cancellable-promise/-/make-cancellable-promise-1.3.2.tgz",
-      "integrity": "sha512-GCXh3bq/WuMbS+Ky4JBPW1hYTOU+znU+Q5m9Pu+pI8EoUqIHk9+tviOKC6/qhHh8C4/As3tzJ69IF32kdz85ww=="
-    },
     "node_modules/make-dir": {
       "version": "2.1.0",
       "resolved": "https://registry.npmmirror.com/make-dir/-/make-dir-2.1.0.tgz",
@@ -11329,11 +11049,6 @@
         "semver": "bin/semver"
       }
     },
-    "node_modules/make-event-props": {
-      "version": "1.6.2",
-      "resolved": "https://registry.npmmirror.com/make-event-props/-/make-event-props-1.6.2.tgz",
-      "integrity": "sha512-iDwf7mA03WPiR8QxvcVHmVWEPfMY1RZXerDVNCRYW7dUr2ppH3J58Rwb39/WG39yTZdRSxr3x+2v22tvI0VEvA=="
-    },
     "node_modules/makeerror": {
       "version": "1.0.12",
       "resolved": "https://registry.npmmirror.com/makeerror/-/makeerror-1.0.12.tgz",
@@ -11540,19 +11255,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/merge-refs": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmmirror.com/merge-refs/-/merge-refs-1.2.2.tgz",
-      "integrity": "sha512-RwcT7GsQR3KbuLw1rRuodq4Nt547BKEBkliZ0qqsrpyNne9bGTFtsFIsIpx82huWhcl3kOlOlH4H0xkPk/DqVw==",
-      "peerDependencies": {
-        "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0"
-      },
-      "peerDependenciesMeta": {
-        "@types/react": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/merge-stream": {
       "version": "2.0.0",
       "resolved": "https://registry.npmmirror.com/merge-stream/-/merge-stream-2.0.0.tgz",
@@ -11845,15 +11547,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/mimic-response": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmmirror.com/mimic-response/-/mimic-response-2.1.0.tgz",
-      "integrity": "sha512-wXqjST+SLt7R009ySCglWBCFpjUygmCIfD790/kVbiGmUgfYGuB14PiTd5DwVxSV4NcYHjzMkoj5LjQZwTQLEA==",
-      "optional": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/min-document": {
       "version": "2.19.0",
       "resolved": "https://registry.npmmirror.com/min-document/-/min-document-2.19.0.tgz",
@@ -11922,46 +11615,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/minipass": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmmirror.com/minipass/-/minipass-5.0.0.tgz",
-      "integrity": "sha512-3FnjYuehv9k6ovOEbyOswadCDPX1piCfhV8ncmYtHOjuPwylVWsghTLo7rabjC3Rx5xD4HDx8Wm1xnMF7S5qFQ==",
-      "optional": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/minizlib": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmmirror.com/minizlib/-/minizlib-2.1.2.tgz",
-      "integrity": "sha512-bAxsR8BVfj60DWXHE3u30oHzfl4G7khkSuPW+qvpd7jFRHm7dLxOjUk1EHACJ/hxLY8phGJ0YhYHZo7jil7Qdg==",
-      "optional": true,
-      "dependencies": {
-        "minipass": "^3.0.0",
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">= 8"
-      }
-    },
-    "node_modules/minizlib/node_modules/minipass": {
-      "version": "3.3.6",
-      "resolved": "https://registry.npmmirror.com/minipass/-/minipass-3.3.6.tgz",
-      "integrity": "sha512-DxiNidxSEK+tHG6zOIklvNOwm3hvCrbUrdtzY74U6HKTJxvIDfOUL5W5P2Ghd3DTkhhKPYGqeNUIh5qcM4YBfw==",
-      "optional": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/minizlib/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmmirror.com/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "optional": true
-    },
     "node_modules/mixin-deep": {
       "version": "1.3.2",
       "resolved": "https://registry.npmmirror.com/mixin-deep/-/mixin-deep-1.3.2.tgz",
@@ -12000,12 +11653,6 @@
       "resolved": "https://registry.npmmirror.com/ms/-/ms-2.1.2.tgz",
       "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
     },
-    "node_modules/nan": {
-      "version": "2.18.0",
-      "resolved": "https://registry.npmmirror.com/nan/-/nan-2.18.0.tgz",
-      "integrity": "sha512-W7tfG7vMOGtD30sHoZSSc/JVYiyDPEyQVso/Zz+/uQd0B0L46gtC+pHha5FFMRpil6fm/AoEcRWyOVi4+E/f8w==",
-      "optional": true
-    },
     "node_modules/nanoid": {
       "version": "3.3.7",
       "resolved": "https://registry.npmmirror.com/nanoid/-/nanoid-3.3.7.tgz",
@@ -12191,21 +11838,6 @@
       "resolved": "https://registry.npmmirror.com/node-releases/-/node-releases-2.0.14.tgz",
       "integrity": "sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw=="
     },
-    "node_modules/nopt": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmmirror.com/nopt/-/nopt-5.0.0.tgz",
-      "integrity": "sha512-Tbj67rffqceeLpcRXrT7vKAN8CwfPeIBgM7E6iBkmKLV7bEMwpGgYLGv0jACUsECaa/vuxP0IjEont6umdMgtQ==",
-      "optional": true,
-      "dependencies": {
-        "abbrev": "1"
-      },
-      "bin": {
-        "nopt": "bin/nopt.js"
-      },
-      "engines": {
-        "node": ">=6"
-      }
-    },
     "node_modules/normalize-package-data": {
       "version": "3.0.3",
       "resolved": "https://registry.npmmirror.com/normalize-package-data/-/normalize-package-data-3.0.3.tgz",
@@ -12281,18 +11913,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/npmlog": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmmirror.com/npmlog/-/npmlog-5.0.1.tgz",
-      "integrity": "sha512-AqZtDUWOMKs1G/8lwylVjrdYgqA4d9nu8hc+0gzRxlDb1I10+FHBGMXs6aiQHFdCUUlqH99MUMuLfzWDNDtfxw==",
-      "optional": true,
-      "dependencies": {
-        "are-we-there-yet": "^2.0.0",
-        "console-control-strings": "^1.1.0",
-        "gauge": "^3.0.0",
-        "set-blocking": "^2.0.0"
-      }
-    },
     "node_modules/nth-check": {
       "version": "2.1.1",
       "resolved": "https://registry.npmmirror.com/nth-check/-/nth-check-2.1.1.tgz",
@@ -12825,15 +12445,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/path2d-polyfill": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmmirror.com/path2d-polyfill/-/path2d-polyfill-2.0.1.tgz",
-      "integrity": "sha512-ad/3bsalbbWhmBo0D6FZ4RNMwsLsPpL6gnvhuSaU5Vm7b06Kr5ubSltQQ0T7YKsiJQO+g22zJ4dJKNTXIyOXtA==",
-      "optional": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/pbkdf2": {
       "version": "3.1.2",
       "resolved": "https://registry.npmmirror.com/pbkdf2/-/pbkdf2-3.1.2.tgz",
@@ -12849,18 +12460,6 @@
         "node": ">=0.12"
       }
     },
-    "node_modules/pdfjs-dist": {
-      "version": "3.11.174",
-      "resolved": "https://registry.npmmirror.com/pdfjs-dist/-/pdfjs-dist-3.11.174.tgz",
-      "integrity": "sha512-TdTZPf1trZ8/UFu5Cx/GXB7GZM30LT+wWUNfsi6Bq8ePLnb+woNKtDymI2mxZYBpMbonNFqKmiz684DIfnd8dA==",
-      "engines": {
-        "node": ">=18"
-      },
-      "optionalDependencies": {
-        "canvas": "^2.11.2",
-        "path2d-polyfill": "^2.0.1"
-      }
-    },
     "node_modules/performance-now": {
       "version": "2.1.0",
       "resolved": "https://registry.npmmirror.com/performance-now/-/performance-now-2.1.0.tgz",
@@ -14890,32 +14489,6 @@
       "resolved": "https://registry.npmmirror.com/react-merge-refs/-/react-merge-refs-1.1.0.tgz",
       "integrity": "sha512-alTKsjEL0dKH/ru1Iyn7vliS2QRcBp9zZPGoWxUOvRGWPUYgjo+V01is7p04It6KhgrzhJGnIj9GgX8W4bZoCQ=="
     },
-    "node_modules/react-pdf": {
-      "version": "7.7.1",
-      "resolved": "https://registry.npmmirror.com/react-pdf/-/react-pdf-7.7.1.tgz",
-      "integrity": "sha512-cbbf/PuRtGcPPw+HLhMI1f6NSka8OJgg+j/yPWTe95Owf0fK6gmVY7OXpTxMeh92O3T3K3EzfE0ML0eXPGwR5g==",
-      "dependencies": {
-        "clsx": "^2.0.0",
-        "dequal": "^2.0.3",
-        "make-cancellable-promise": "^1.3.1",
-        "make-event-props": "^1.6.0",
-        "merge-refs": "^1.2.1",
-        "pdfjs-dist": "3.11.174",
-        "prop-types": "^15.6.2",
-        "tiny-invariant": "^1.0.0",
-        "warning": "^4.0.0"
-      },
-      "peerDependencies": {
-        "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0",
-        "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
-        "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
-      },
-      "peerDependenciesMeta": {
-        "@types/react": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/react-pdf-highlighter": {
       "version": "6.1.0",
       "resolved": "https://registry.npmmirror.com/react-pdf-highlighter/-/react-pdf-highlighter-6.1.0.tgz",
@@ -15522,6 +15095,7 @@
       "version": "3.0.2",
       "resolved": "https://registry.npmmirror.com/rimraf/-/rimraf-3.0.2.tgz",
       "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
+      "peer": true,
       "dependencies": {
         "glob": "^7.1.3"
       },
@@ -15714,12 +15288,6 @@
         "randombytes": "^2.1.0"
       }
     },
-    "node_modules/set-blocking": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmmirror.com/set-blocking/-/set-blocking-2.0.0.tgz",
-      "integrity": "sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==",
-      "optional": true
-    },
     "node_modules/set-function-length": {
       "version": "1.1.1",
       "resolved": "https://registry.npmmirror.com/set-function-length/-/set-function-length-1.1.1.tgz",
@@ -15859,23 +15427,6 @@
       "resolved": "https://registry.npmmirror.com/signal-exit/-/signal-exit-3.0.7.tgz",
       "integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ=="
     },
-    "node_modules/simple-concat": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmmirror.com/simple-concat/-/simple-concat-1.0.1.tgz",
-      "integrity": "sha512-cSFtAPtRhljv69IK0hTVZQ+OfE9nePi/rtJmw5UjHeVyVroEqJXP1sFztKUy1qU+xvz3u/sfYJLa947b7nAN2Q==",
-      "optional": true
-    },
-    "node_modules/simple-get": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmmirror.com/simple-get/-/simple-get-3.1.1.tgz",
-      "integrity": "sha512-CQ5LTKGfCpvE1K0n2us+kuMPbk/q0EKl82s4aheV9oXjFEz6W/Y7oQFVJuU6QG77hRT4Ghb5RURteF5vnWjupA==",
-      "optional": true,
-      "dependencies": {
-        "decompress-response": "^4.2.0",
-        "once": "^1.3.1",
-        "simple-concat": "^1.0.0"
-      }
-    },
     "node_modules/single-spa": {
       "version": "5.9.5",
       "resolved": "https://registry.npmmirror.com/single-spa/-/single-spa-5.9.5.tgz",
@@ -16912,41 +16463,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/tar": {
-      "version": "6.2.0",
-      "resolved": "https://registry.npmmirror.com/tar/-/tar-6.2.0.tgz",
-      "integrity": "sha512-/Wo7DcT0u5HUV486xg675HtjNd3BXZ6xDbzsCUZPt5iw8bTQ63bP0Raut3mvro9u+CUyq7YQd8Cx55fsZXxqLQ==",
-      "optional": true,
-      "dependencies": {
-        "chownr": "^2.0.0",
-        "fs-minipass": "^2.0.0",
-        "minipass": "^5.0.0",
-        "minizlib": "^2.1.1",
-        "mkdirp": "^1.0.3",
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/tar/node_modules/mkdirp": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmmirror.com/mkdirp/-/mkdirp-1.0.4.tgz",
-      "integrity": "sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==",
-      "optional": true,
-      "bin": {
-        "mkdirp": "bin/cmd.js"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/tar/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmmirror.com/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "optional": true
-    },
     "node_modules/terser": {
       "version": "5.26.0",
       "resolved": "https://registry.npmmirror.com/terser/-/terser-5.26.0.tgz",
@@ -17087,7 +16603,9 @@
     "node_modules/tiny-invariant": {
       "version": "1.3.1",
       "resolved": "https://registry.npmmirror.com/tiny-invariant/-/tiny-invariant-1.3.1.tgz",
-      "integrity": "sha512-AD5ih2NlSssTCwsMznbvwMZpJ1cbhkGd2uueNxzv2jDlEeZdU04JQfRnggJQ8DrcVBGjAsCKwFBbDlVNtEMlzw=="
+      "integrity": "sha512-AD5ih2NlSssTCwsMznbvwMZpJ1cbhkGd2uueNxzv2jDlEeZdU04JQfRnggJQ8DrcVBGjAsCKwFBbDlVNtEMlzw==",
+      "dev": true,
+      "peer": true
     },
     "node_modules/tiny-warning": {
       "version": "1.0.3",
@@ -17200,12 +16718,6 @@
       "resolved": "https://registry.npmmirror.com/commander/-/commander-2.20.3.tgz",
       "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ=="
     },
-    "node_modules/tr46": {
-      "version": "0.0.3",
-      "resolved": "https://registry.npmmirror.com/tr46/-/tr46-0.0.3.tgz",
-      "integrity": "sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==",
-      "optional": true
-    },
     "node_modules/trim-lines": {
       "version": "3.0.1",
       "resolved": "https://registry.npmmirror.com/trim-lines/-/trim-lines-3.0.1.tgz",
@@ -18417,12 +17929,6 @@
         "node": ">= 8"
       }
     },
-    "node_modules/webidl-conversions": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmmirror.com/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
-      "integrity": "sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ==",
-      "optional": true
-    },
     "node_modules/webpack": {
       "version": "5.89.0",
       "resolved": "https://registry.npmmirror.com/webpack/-/webpack-5.89.0.tgz",
@@ -18493,16 +17999,6 @@
       "resolved": "https://registry.npmmirror.com/whatwg-fetch/-/whatwg-fetch-3.6.20.tgz",
       "integrity": "sha512-EqhiFU6daOA8kpjOWTL0olhVOF3i7OrFzSYiGsEMB8GcXS+RrzauAERX65xMeNWVqxA6HXH2m69Z9LaKKdisfg=="
     },
-    "node_modules/whatwg-url": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmmirror.com/whatwg-url/-/whatwg-url-5.0.0.tgz",
-      "integrity": "sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==",
-      "optional": true,
-      "dependencies": {
-        "tr46": "~0.0.3",
-        "webidl-conversions": "^3.0.0"
-      }
-    },
     "node_modules/which": {
       "version": "2.0.2",
       "resolved": "https://registry.npmmirror.com/which/-/which-2.0.2.tgz",
@@ -18577,15 +18073,6 @@
         "node": ">= 0.4"
       }
     },
-    "node_modules/wide-align": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmmirror.com/wide-align/-/wide-align-1.1.5.tgz",
-      "integrity": "sha512-eDMORYaPNZ4sQIuuYPDHdQvf4gyCF9rEEV/yPxGfwPkRodwEgiMUUXTx/dex+Me0wxx53S+NgUHaP7y3MGlDmg==",
-      "optional": true,
-      "dependencies": {
-        "string-width": "^1.0.2 || 2 || 3 || 4"
-      }
-    },
     "node_modules/wrap-ansi": {
       "version": "7.0.0",
       "resolved": "https://registry.npmmirror.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz",

web/package.json

@@ -27,7 +27,6 @@
     "react-i18next": "^14.0.0",
     "react-infinite-scroll-component": "^6.1.0",
     "react-markdown": "^9.0.1",
-    "react-pdf": "^7.7.1",
     "react-pdf-highlighter": "^6.1.0",
     "react-string-replace": "^1.1.1",
     "umi": "^4.0.90",

web/src/layouts/index.tsx

@@ -1,15 +1,14 @@
 import { Divider, Layout, theme } from 'antd';
 import React from 'react';
-import { useTranslation } from 'react-i18next';
 import { Outlet } from 'umi';
 import '../locales/config';
 import Header from './components/header';
+
 import styles from './index.less';
 
 const { Content } = Layout;
 
 const App: React.FC = () => {
-  const { t } = useTranslation();
   const {
     token: { colorBgContainer, borderRadiusLG },
   } = theme.useToken();
@@ -25,6 +24,7 @@ const App: React.FC = () => {
             background: colorBgContainer,
             borderRadius: borderRadiusLG,
             overflow: 'auto',
+            display: 'flex',
           }}
         >
           <Outlet />

web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.less

@@ -13,6 +13,9 @@
     color: red;
     font-style: normal;
   }
+  table {
+    width: 100%;
+  }
 
   caption {
     color: @blurBackground;

web/src/pages/add-knowledge/components/knowledge-chunk/components/document-preview/hightlights.ts

@@ -1,89 +0,0 @@
-export const testHighlights = [
-  {
-    content: {
-      text: '实验证明，由氧氯化锆锂和高镍三元正极组成的全固态锂电池展示了极为优异的性能：在12 分钟快速充电的条件下，该电池仍然成功地在室温稳定循环2000 圈以上。',
-    },
-    position: {
-      boundingRect: {
-        x1: 219.7,
-        // x1: 419.7,
-        y1: 204.3,
-        // y1: 304.3,
-        x2: 547.0,
-        // x2: 747.0,
-        y2: 264.0,
-        // y2: 364.0,
-      },
-      rects: [
-        // {
-        //   x1: 219.7,
-        //   // x1: 419.7,
-        //   y1: 204.3,
-        //   // y1: 304.3,
-        //   x2: 547.0,
-        //   // x2: 747.0,
-        //   y2: 264.0,
-        //   // y2: 364.0,
-        //   width: 849,
-        //   height: 1200,
-        // },
-      ],
-      pageNumber: 9,
-    },
-    comment: {
-      text: 'Flow or TypeScript?',
-      emoji: '🔥',
-    },
-    id: 'jsdlihdkghergjl',
-  },
-  {
-    content: {
-      text: '图2：乘联会预计6 月新能源乘用车厂商批发销量74 万辆，环比增长10%，同比增长30%。',
-    },
-    position: {
-      boundingRect: {
-        x1: 219.0,
-        x2: 546.0,
-        y1: 616.0,
-        y2: 674.7,
-      },
-      rects: [],
-      pageNumber: 6,
-    },
-    comment: {
-      text: 'Flow or TypeScript?',
-      emoji: '🔥',
-    },
-    id: 'bfdbtymkhjildbfghserrgrt',
-  },
-  {
-    content: {
-      text: '图2：乘联会预计6 月新能源乘用车厂商批发销量74 万辆，环比增长10%，同比增长30%。',
-    },
-    position: {
-      boundingRect: {
-        x1: 73.7,
-        x2: 391.7,
-        y1: 570.3,
-        y2: 676.3,
-      },
-      rects: [],
-      pageNumber: 1,
-    },
-    comment: {
-      text: '',
-      emoji: '',
-    },
-    id: 'fgnhxdvsesgmghyu',
-  },
-].map((x) => {
-  const boundingRect = x.position.boundingRect;
-  const ret: any = {
-    width: 849,
-    height: 1200,
-  };
-  Object.entries(boundingRect).forEach(([key, value]) => {
-    ret[key] = value / 0.7;
-  });
-  return { ...x, position: { ...x.position, boundingRect: ret, rects: [ret] } };
-});

web/src/pages/add-knowledge/components/knowledge-chunk/components/document-preview/index.tsx

@@ -1,59 +0,0 @@
-import { useGetKnowledgeSearchParams } from '@/hooks/knowledgeHook';
-import { api_host } from '@/utils/api';
-import { useMemo, useState } from 'react';
-import { Document, Page, pdfjs } from 'react-pdf';
-
-import 'react-pdf/dist/esm/Page/AnnotationLayer.css';
-import 'react-pdf/dist/esm/Page/TextLayer.css';
-import { useDocumentResizeObserver, useHighlightText } from './hooks';
-
-import { Spin } from 'antd';
-import { useGetSelectedChunk } from '../../hooks';
-import styles from './index.less';
-
-pdfjs.GlobalWorkerOptions.workerSrc = new URL(
-  'pdfjs-dist/build/pdf.worker.min.js',
-  import.meta.url,
-).toString();
-
-interface IProps {
-  selectedChunkId: string;
-}
-
-const DocumentPreview = ({ selectedChunkId }: IProps) => {
-  const [numPages, setNumPages] = useState<number>();
-  const { documentId } = useGetKnowledgeSearchParams();
-  const { containerWidth, setContainerRef } = useDocumentResizeObserver();
-  const selectedChunk = useGetSelectedChunk(selectedChunkId);
-  console.info(selectedChunk?.content_with_weight);
-  const textRenderer = useHighlightText(selectedChunk?.content_with_weight);
-
-  function onDocumentLoadSuccess({ numPages }: { numPages: number }): void {
-    setNumPages(numPages);
-  }
-
-  const url = useMemo(() => {
-    return `${api_host}/document/get/${documentId}`;
-  }, [documentId]);
-
-  return (
-    <div ref={setContainerRef} className={styles.documentContainer}>
-      <Document
-        file={url}
-        onLoadSuccess={onDocumentLoadSuccess}
-        loading={<Spin></Spin>}
-      >
-        {Array.from(new Array(numPages), (el, index) => (
-          <Page
-            key={`page_${index + 1}`}
-            pageNumber={index + 1}
-            width={containerWidth}
-            customTextRenderer={textRenderer}
-          />
-        ))}
-      </Document>
-    </div>
-  );
-};
-
-export default DocumentPreview;

web/src/pages/add-knowledge/components/knowledge-chunk/components/document-preview/preview.tsx

@@ -1,15 +1,14 @@
-import { Spin } from 'antd';
+import { Skeleton } from 'antd';
 import { useEffect, useRef } from 'react';
 import {
   AreaHighlight,
   Highlight,
-  NewHighlight,
+  IHighlight,
   PdfHighlighter,
   PdfLoader,
   Popup,
-  Tip,
 } from 'react-pdf-highlighter';
-import { useGetChunkHighlights, useGetSelectedChunk } from '../../hooks';
+import { useGetChunkHighlights } from '../../hooks';
 import { useGetDocumentUrl } from './hooks';
 
 import styles from './index.less';
@@ -18,8 +17,6 @@ interface IProps {
   selectedChunkId: string;
 }
 
-const getNextId = () => String(Math.random()).slice(2);
-
 const HighlightPopup = ({
   comment,
 }: {
@@ -33,70 +30,10 @@ const HighlightPopup = ({
 
 const Preview = ({ selectedChunkId }: IProps) => {
   const url = useGetDocumentUrl();
-  const selectedChunk = useGetSelectedChunk(selectedChunkId);
-
-  // const [state, setState] = useState<any>(testHighlights);
   const state = useGetChunkHighlights(selectedChunkId);
+  const ref = useRef<(highlight: IHighlight) => void>(() => {});
 
-  const ref = useRef((highlight: any) => {});
+  const resetHash = () => {};
-
-  const parseIdFromHash = () =>
-    document.location.hash.slice('#highlight-'.length);
-
-  const resetHash = () => {
-    document.location.hash = '';
-  };
-
-  const getHighlightById = (id: string) => {
-    const highlights = state;
-
-    return highlights.find((highlight: any) => highlight.id === id);
-  };
-
-  //   let scrollViewerTo = (highlight: any) => {};
-
-  let scrollToHighlightFromHash = () => {
-    const highlight = getHighlightById(parseIdFromHash());
-
-    if (highlight) {
-      ref.current(highlight);
-    }
-  };
-
-  const addHighlight = (highlight: NewHighlight) => {
-    const highlights = state;
-
-    console.log('Saving highlight', highlight);
-
-    // setState([{ ...highlight, id: getNextId() }, ...highlights]);
-  };
-
-  const updateHighlight = (
-    highlightId: string,
-    position: Object,
-    content: Object,
-  ) => {
-    console.log('Updating highlight', highlightId, position, content);
-
-    // setState(
-    //   state.map((h: any) => {
-    //     const {
-    //       id,
-    //       position: originalPosition,
-    //       content: originalContent,
-    //       ...rest
-    //     } = h;
-    //     return id === highlightId
-    //       ? {
-    //           id,
-    //           position: { ...originalPosition, ...position },
-    //           content: { ...originalContent, ...content },
-    //           ...rest,
-    //         }
-    //       : h;
-    //   }),
-    // );
-  };
 
   useEffect(() => {
     if (state.length > 0) {
@@ -106,35 +43,16 @@ const Preview = ({ selectedChunkId }: IProps) => {
 
   return (
     <div className={styles.documentContainer}>
-      <PdfLoader url={url} beforeLoad={<Spin />}>
+      <PdfLoader url={url} beforeLoad={<Skeleton active />}>
         {(pdfDocument) => (
           <PdfHighlighter
             pdfDocument={pdfDocument}
             enableAreaSelection={(event) => event.altKey}
             onScrollChange={resetHash}
-            // pdfScaleValue="page-width"
-
             scrollRef={(scrollTo) => {
-              //   scrollViewerTo = scrollTo;
               ref.current = scrollTo;
-
-              scrollToHighlightFromHash();
             }}
-            onSelectionFinished={(
+            onSelectionFinished={() => null}
-              position,
-              content,
-              hideTipAndSelection,
-              transformSelection,
-            ) => (
-              <Tip
-                onOpen={transformSelection}
-                onConfirm={(comment) => {
-                  addHighlight({ content, position, comment });
-
-                  hideTipAndSelection();
-                }}
-              />
-            )}
             highlightTransform={(
               highlight,
               index,
@@ -158,13 +76,7 @@ const Preview = ({ selectedChunkId }: IProps) => {
                 <AreaHighlight
                   isScrolledTo={isScrolledTo}
                   highlight={highlight}
-                  onChange={(boundingRect) => {
+                  onChange={() => {}}
-                    updateHighlight(
-                      highlight.id,
-                      { boundingRect: viewportToScaled(boundingRect) },
-                      { image: screenshot(boundingRect) },
-                    );
-                  }}
                 />
               );
 
@@ -172,7 +84,7 @@ const Preview = ({ selectedChunkId }: IProps) => {
                 <Popup
                   popupContent={<HighlightPopup {...highlight} />}
                   onMouseOver={(popupContent) =>
-                    setTip(highlight, (highlight: any) => popupContent)
+                    setTip(highlight, () => popupContent)
                   }
                   onMouseOut={hideTip}
                   key={index}

web/src/pages/add-knowledge/components/knowledge-file/index.tsx

@@ -288,7 +288,7 @@ const KnowledgeFile = () => {
         dataSource={data}
         loading={loading}
         pagination={pagination}
-        scroll={{ scrollToFirstRowOnChange: true, x: true, y: 'fill' }}
+        scroll={{ scrollToFirstRowOnChange: true, x: 1300, y: 'fill' }}
       />
       <CreateEPModal getKfList={getKfList} kb_id={knowledgeBaseId} />
       <SegmentSetModal

web/src/pages/add-knowledge/components/knowledge-file/parsing-status-cell/index.less

@@ -1,5 +1,17 @@
-.popover-content {
+.popoverContent {
-  width: 300px;
+  width: 40vw;
+
+  .popoverContentItem {
+    display: flex;
+    gap: 10px;
+  }
+
+  .popoverContentText {
+    white-space: pre-line;
+    .popoverContentErrorLabel {
+      color: red;
+    }
+  }
 }
 
 .operationIcon {

web/src/pages/add-knowledge/components/knowledge-file/parsing-status-cell/index.tsx

@@ -1,11 +1,11 @@
 import { ReactComponent as RefreshIcon } from '@/assets/svg/refresh.svg';
 import { ReactComponent as RunIcon } from '@/assets/svg/run.svg';
 import { IKnowledgeFile } from '@/interfaces/database/knowledge';
-import { Badge, DescriptionsProps, Flex, Popover, Space, Tag } from 'antd';
-import { RunningStatus, RunningStatusMap } from '../constant';
-
 import { CloseCircleOutlined } from '@ant-design/icons';
+import { Badge, DescriptionsProps, Flex, Popover, Space, Tag } from 'antd';
+import reactStringReplace from 'react-string-replace';
 import { useDispatch } from 'umi';
+import { RunningStatus, RunningStatusMap } from '../constant';
 import styles from './index.less';
 
 const iconMap = {
@@ -35,17 +35,27 @@ const PopoverContent = ({ record }: IProps) => {
     {
       key: 'progress_msg',
       label: 'Progress Msg',
-      children: record.progress_msg,
+      children: reactStringReplace(
+        record.progress_msg.trim(),
+        /(\[ERROR\].+\s)/g,
+        (match, i) => {
+          return (
+            <span key={i} className={styles.popoverContentErrorLabel}>
+              {match}
+            </span>
+          );
+        },
+      ),
     },
   ];
 
   return (
-    <Flex vertical className={styles['popover-content']}>
+    <Flex vertical className={styles.popoverContent}>
-      {items.map((x) => {
+      {items.map((x, idx) => {
         return (
-          <div key={x.key}>
+          <div key={x.key} className={idx < 2 ? styles.popoverContentItem : ''}>
             <b>{x.label}:</b>
-            <p>{x.children}</p>
+            <div className={styles.popoverContentText}>{x.children}</div>
           </div>
         );
       })}

web/src/pages/add-knowledge/index.less

@@ -1,6 +1,7 @@
 .container {
   display: flex;
   height: 100%;
+  width: 100%;
   .contentWrapper {
     flex: 1;
     overflow-x: auto;

web/src/pages/knowledge/index.less

@@ -1,14 +1,14 @@
 // @import '~@/less/variable.less';
 
 .knowledge {
-  padding: 48px 60px;
+  padding: 48px 0;
 }
 
 .topWrapper {
   display: flex;
   justify-content: space-between;
   align-items: flex-start;
-  padding-bottom: 72px;
+  padding: 0 60px 72px;
 
   .title {
     font-family: Inter;
@@ -41,3 +41,7 @@
     .topButton();
   }
 }
+.knowledgeCardContainer {
+  padding: 0 60px;
+  overflow: auto;
+}

web/src/pages/knowledge/index.tsx

@@ -1,21 +1,25 @@
 import { ReactComponent as FilterIcon } from '@/assets/filter.svg';
 import ModalManager from '@/components/modal-manager';
 import { PlusOutlined } from '@ant-design/icons';
-import { Button, Flex, Space } from 'antd';
+import { Button, Empty, Flex, Space } from 'antd';
 import KnowledgeCard from './knowledge-card';
 import KnowledgeCreatingModal from './knowledge-creating-modal';
 
 import { useFetchKnowledgeList } from '@/hooks/knowledgeHook';
+import { useSelectUserInfo } from '@/hooks/userSettingHook';
 import styles from './index.less';
 
 const Knowledge = () => {
-  const data = useFetchKnowledgeList();
+  const list = useFetchKnowledgeList();
+  const userInfo = useSelectUserInfo();
 
   return (
-    <div className={styles.knowledge}>
+    <Flex className={styles.knowledge} vertical flex={1}>
       <div className={styles.topWrapper}>
         <div>
-          <span className={styles.title}>Welcome back, Zing</span>
+          <span className={styles.title}>
+            Welcome back, {userInfo.nickname}
+          </span>
           <p className={styles.description}>
             Which database are we going to use today?
           </p>
@@ -46,12 +50,22 @@ const Knowledge = () => {
           </ModalManager>
         </Space>
       </div>
-      <Flex gap="large" wrap="wrap">
+      <Flex
-        {data.map((item: any) => {
+        gap="large"
+        wrap="wrap"
+        flex={1}
+        // justify="center"
+        className={styles.knowledgeCardContainer}
+      >
+        {list.length > 0 ? (
+          list.map((item: any) => {
             return <KnowledgeCard item={item} key={item.name}></KnowledgeCard>;
-        })}
+          })
+        ) : (
+          <Empty></Empty>
+        )}
+      </Flex>
     </Flex>
-    </div>
   );
 };