Fix: Optimized the test results page layout and internationalization #3221 (#9974)

### What problem does this PR solve?

Fix: Optimized the test results page layout and internationalization

- Added an empty data component for when test results are empty
- Optimized internationalization support for the paging component
- Updated the layout and style of the test results page
- Added a tooltip for when test results are empty

### Type of change

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

web/src/pages/dataset/dataset/parsing-status-cell.tsx

@@ -67,7 +67,7 @@ export function ParsingStatusCell({
 
   return (
     <section className="flex gap-8 items-center">
-      <div className="w-fit flex items-center justify-between">
+      <div className="w-[100px] text-ellipsis overflow-hidden flex items-center justify-between">
         <DropdownMenu>
           <DropdownMenuTrigger asChild>
             <Button variant={'transparent'} className="border-none" size={'sm'}>

web/src/pages/dataset/testing/index.tsx

@@ -25,7 +25,7 @@ export default function RetrievalTesting() {
       <section className="flex justify-between items-center">
         <TopTitle
           title={t('knowledgeDetails.retrievalTesting')}
-          description={t('knowledgeDetails.retrievalTestingDescription')}
+          description={t('knowledgeDetails.testingDescription')}
         ></TopTitle>
         {/* <Button>Save as Preset</Button> */}
       </section>
@@ -51,6 +51,7 @@ export default function RetrievalTesting() {
           <TestingResult
             data={data}
             page={page}
+            loading={loading}
             pageSize={pageSize}
             filterValue={filterValue}
             handleFilterSubmit={handleFilterSubmit}
@@ -68,6 +69,7 @@ export default function RetrievalTesting() {
             <TestingResult
               data={data}
               page={page}
+              loading={loading}
               pageSize={pageSize}
               filterValue={filterValue}
               handleFilterSubmit={handleFilterSubmit}
@@ -83,6 +85,7 @@ export default function RetrievalTesting() {
             <TestingResult
               data={data}
               page={page}
+              loading={loading}
               pageSize={pageSize}
               filterValue={filterValue}
               handleFilterSubmit={handleFilterSubmit}

web/src/pages/dataset/testing/testing-result.tsx

@@ -1,3 +1,4 @@
+import Empty from '@/components/empty/empty';
 import { FormContainer } from '@/components/form-container';
 import { FilterButton } from '@/components/list-filter-bar';
 import { FilterPopover } from '@/components/list-filter-bar/filter-popover';
@@ -38,6 +39,7 @@ type TestingResultProps = Pick<
   | 'page'
   | 'pageSize'
   | 'onPaginationChange'
+  | 'loading'
 >;
 
 export function TestingResult({
@@ -45,6 +47,7 @@ export function TestingResult({
   handleFilterSubmit,
   page,
   pageSize,
+  loading,
   onPaginationChange,
   data,
 }: TestingResultProps) {
@@ -77,20 +80,42 @@ export function TestingResult({
           <FilterButton></FilterButton>
         </FilterPopover>
       </div>
-      <section className="flex flex-col gap-5 overflow-auto h-[calc(100vh-241px)] scrollbar-thin mb-5">
-        {data.chunks?.map((x) => (
-          <FormContainer key={x.chunk_id} className="px-5 py-2.5">
-            <ChunkTitle item={x}></ChunkTitle>
-            <p className="!mt-2.5"> {x.content_with_weight}</p>
-          </FormContainer>
-        ))}
-      </section>
-      <RAGFlowPagination
-        total={data.total}
-        onChange={onPaginationChange}
-        current={page}
-        pageSize={pageSize}
-      ></RAGFlowPagination>
+      {data.chunks?.length > 0 && !loading && (
+        <>
+          <section className="flex flex-col gap-5 overflow-auto h-[calc(100vh-241px)] scrollbar-thin mb-5">
+            {data.chunks?.map((x) => (
+              <FormContainer key={x.chunk_id} className="px-5 py-2.5">
+                <ChunkTitle item={x}></ChunkTitle>
+                <p className="!mt-2.5"> {x.content_with_weight}</p>
+              </FormContainer>
+            ))}
+          </section>
+          <RAGFlowPagination
+            total={data.total}
+            onChange={onPaginationChange}
+            current={page}
+            pageSize={pageSize}
+          ></RAGFlowPagination>
+        </>
+      )}
+      {!data.chunks?.length && !loading && (
+        <div className="flex justify-center items-center w-full h-[calc(100vh-241px)]">
+          <div>
+            <Empty>
+              {data.isRuned && (
+                <div className="text-text-secondary">
+                  {t('knowledgeDetails.noTestResultsForRuned')}
+                </div>
+              )}
+              {!data.isRuned && (
+                <div className="text-text-secondary">
+                  {t('knowledgeDetails.noTestResultsForNotRuned')}
+                </div>
+              )}
+            </Empty>
+          </div>
+        </div>
+      )}
     </div>
   );
 }

web/src/pages/next-search/search-view.tsx

@@ -262,7 +262,7 @@ export default function SearchingView({
           </div>
 
           {total > 0 && (
-            <div className="mt-8 px-8 pb-8">
+            <div className="mt-8 px-8 pb-8 text-base">
               <RAGFlowPagination
                 current={pagination.current}
                 pageSize={pagination.pageSize}