Fix: Improve some functional issues with the data source. #10703 (#11081)

### What problem does this PR solve?

Fix: Improve some functional issues with the data source. #10703

### Type of change

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

web/src/pages/dataset/dataset-overview/interface.ts

@@ -49,7 +49,7 @@ export interface IFileLogItem {
   process_duration: number;
   progress: number;
   progress_msg: string;
-  source_from: string;
+  source_type: string;
   status: string;
   task_type: string;
   tenant_id: string;

web/src/pages/dataset/dataset-overview/overview-table.tsx

@@ -11,11 +11,18 @@ import {
   TableHeader,
   TableRow,
 } from '@/components/ui/table';
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger,
+} from '@/components/ui/tooltip';
 import { RunningStatusMap } from '@/constants/knowledge';
 import { useTranslate } from '@/hooks/common-hooks';
 import { useNavigatePage } from '@/hooks/logic-hooks/navigate-hooks';
+import { cn } from '@/lib/utils';
 import { PipelineResultSearchParams } from '@/pages/dataflow-result/constant';
 import { NavigateToDataflowResultProps } from '@/pages/dataflow-result/interface';
+import { DataSourceInfo } from '@/pages/user-setting/data-source/contant';
 import { formatDate, formatSecondsToHumanReadable } from '@/utils/date';
 import {
   ColumnDef,
@@ -77,25 +84,34 @@ export const getFileLogsTableColumns = (
     {
       accessorKey: 'fileName',
       header: t('fileName'),
+      meta: { cellClassName: 'max-w-[20vw]' },
       cell: ({ row }) => (
-        <div
-          className="flex items-center gap-2 text-text-primary"
-          // onClick={navigateToDataflowResult(
-          //   row.original.id,
-          //   row.original.kb_id,
-          // )}
-        >
-          <FileIcon name={row.original.document_name}></FileIcon>
-          {row.original.document_name}
-        </div>
+        <Tooltip>
+          <TooltipTrigger asChild>
+            <div className="flex gap-2 cursor-pointer">
+              <FileIcon name={row.original.document_name}></FileIcon>
+              <span className={cn('truncate')}>
+                {row.original.document_name}
+              </span>
+            </div>
+          </TooltipTrigger>
+          <TooltipContent>
+            <p>{row.original.document_name}</p>
+          </TooltipContent>
+        </Tooltip>
       ),
     },
     {
       accessorKey: 'source_from',
       header: t('source'),
+      meta: { cellClassName: 'max-w-[10vw]' },
       cell: ({ row }) => (
         <div className="text-text-primary">
-          {row.original.source_from || t('localUpload')}
+          {row.original.source_type
+            ? DataSourceInfo[
+                row.original.source_type as keyof typeof DataSourceInfo
+              ].icon
+            : t('localUpload')}
         </div>
       ),
     },

web/src/pages/dataset/dataset-setting/components/added-source-card.tsx

@@ -66,7 +66,7 @@ export const AddedSourceCard = (props: IAddedSourceCardProps) => {
               <div
                 key={item.id}
                 className={cn(
-                  'flex flex-row items-center justify-between rounded-md bg-bg-input px-2 py-1 cursor-pointer',
+                  'flex flex-row items-center justify-between rounded-md bg-bg-card px-2 py-1 cursor-pointer',
                   // { hidden: item.name.indexOf(filterString) <= -1 },
                 )}
                 onClick={() => {

web/src/pages/dataset/dataset-setting/components/link-data-source.tsx

@@ -2,6 +2,7 @@ import { Button } from '@/components/ui/button';
 import { Modal } from '@/components/ui/modal/modal';
 import { useNavigatePage } from '@/hooks/logic-hooks/navigate-hooks';
 import { IConnector } from '@/interfaces/database/knowledge';
+import { delSourceModal } from '@/pages/user-setting/data-source/component/delete-source-modal';
 import { DataSourceInfo } from '@/pages/user-setting/data-source/contant';
 import { IDataSourceBase } from '@/pages/user-setting/data-source/interface';
 import { Link, Settings, Unlink } from 'lucide-react';
@@ -26,7 +27,7 @@ interface DataSourceItemProps extends IDataSourceNodeProps {
 
 const DataSourceItem = (props: DataSourceItemProps) => {
   const { t } = useTranslation();
-  const { id, name, icon, openLinkModalFunc, unbindFunc } = props;
+  const { id, name, icon, unbindFunc } = props;
 
   const { navigateToDataSourceDetail } = useNavigatePage();
   const toDetail = (id: string) => {
@@ -71,7 +72,7 @@ const DataSourceItem = (props: DataSourceItemProps) => {
   return (
     <div className="flex items-center justify-between gap-1 px-2 rounded-md border ">
       <div className="flex items-center gap-1">
-        {icon}
+        <div className="w-6 h-6 flex-shrink-0">{icon}</div>
         <div>{name}</div>
       </div>
       <div className="flex gap-1 items-center">
@@ -94,7 +95,12 @@ const DataSourceItem = (props: DataSourceItemProps) => {
             variant={'transparent'}
             className="border-none"
             onClick={() => {
-              openUnlinkModal();
+              // openUnlinkModal();
+              delSourceModal({
+                data: props,
+                type: 'unlink',
+                onOk: (data) => unbindFunc?.(data as DataSourceItemProps),
+              });
             }}
           >
             <Unlink />

web/src/pages/dataset/dataset-setting/hooks.ts

@@ -61,6 +61,7 @@ export const useFetchKnowledgeConfigurationOnMount = (
         'parser_id',
         'language',
         'parser_config',
+        'connectors',
         'pagerank',
         'avatar',
       ]),

web/src/pages/dataset/dataset-setting/index.tsx

@@ -248,7 +248,7 @@ export default function DatasetSettings() {
                   />
                 )}
 
-                <Divider />
+                {/* <Divider /> */}
                 {parseType === 1 && <ChunkMethodForm />}
 
                 {/* <LinkDataPipeline

web/src/pages/dataset/dataset/use-dataset-table-columns.tsx

@@ -11,6 +11,7 @@ import { useNavigatePage } from '@/hooks/logic-hooks/navigate-hooks';
 import { useSetDocumentStatus } from '@/hooks/use-document-request';
 import { IDocumentInfo } from '@/interfaces/database/document';
 import { cn } from '@/lib/utils';
+import { DataSourceInfo } from '@/pages/user-setting/data-source/contant';
 import { formatDate } from '@/utils/date';
 import { ColumnDef } from '@tanstack/table-core';
 import { ArrowUpDown } from 'lucide-react';
@@ -120,6 +121,19 @@ export function useDatasetTableColumns({
         </div>
       ),
     },
+    {
+      accessorKey: 'source_from',
+      header: t('source'),
+      cell: ({ row }) => (
+        <div className="text-text-primary">
+          {row.original.source_type
+            ? DataSourceInfo[
+                row.original.source_type as keyof typeof DataSourceInfo
+              ]?.icon || t('localUpload')
+            : t('localUpload')}
+        </div>
+      ),
+    },
     {
       accessorKey: 'status',
       header: t('enabled'),