Implementation:Infiniflow Ragflow DatasetOverviewTable Component

Knowledge Sources	Infiniflow_Ragflow
Domains	Frontend, Dataset
Last Updated	2026-02-12 06:00 GMT

Overview

Concrete overview table component with column definitions and sorting provided by the RAGFlow frontend.

Description

The FileLogsTable component renders a paginated, sortable data table for file logs and dataset logs using `@tanstack/react-table`. It exports two column-definition factory functions (`getFileLogsTableColumns` and `getDatasetLogsTableColumns`) that build columns for ID, file name, source, pipeline, start date, task type, status, and operations. The table switches columns based on the active log tab and includes a process log modal for viewing details.

Usage

Import as the default export and pass data, pagination state, and the active tab. Also import the column factory functions when custom column configurations are needed.

Code Reference

Source Location

• Repository: Infiniflow_Ragflow
• File: web/src/pages/dataset/dataset-overview/overview-table.tsx
• Lines: 1-484

Signature

export const getFileLogsTableColumns = (
  t: TFunction<'translation', string>,
  showLog: (row: Row<IFileLogItem & DocumentLog>, active: LogTabs) => void,
  kowledgeId: string,
  navigateToDataflowResult: (props: NavigateToDataflowResultProps) => () => void,
  dataSourceInfo: IDataSourceInfoMap,
) => ColumnDef<IFileLogItem & DocumentLog>[];

export const getDatasetLogsTableColumns = (
  t: TFunction<'translation', string>,
  showLog: (row: Row<IFileLogItem & DocumentLog>, active: LogTabs) => void,
) => ColumnDef<IFileLogItem & DocumentLog>[];

const FileLogsTable: FC<FileLogsTableProps> = ({ data, pagination, setPagination, active }) => { ... }
export default FileLogsTable;

Import

import FileLogsTable, { getFileLogsTableColumns, getDatasetLogsTableColumns } from '@/pages/dataset/dataset-overview/overview-table';

I/O Contract

Inputs

Name	Type	Required	Description
data	(IFileLogItem & DocumentLog)[]	Yes	Array of log records to display
pagination	{ current: number; pageSize: number; total: number }	Yes	Current pagination state
setPagination	(params: { page: number; pageSize: number }) => void	Yes	Callback to update pagination
active	LogTabs	No	Active tab (FILE_LOGS or DATASET_LOGS), defaults to FILE_LOGS

Outputs

Name	Type	Description
JSX.Element	React.ReactElement	Renders sortable table with pagination and process log modal

Usage Examples

import FileLogsTable from '@/pages/dataset/dataset-overview/overview-table';

<FileLogsTable
  data={tableList}
  pagination={pagination}
  setPagination={handlePaginationChange}
  pageCount={10}
  active={LogTabs.FILE_LOGS}
/>

Related Pages

• Environment:Infiniflow_Ragflow_Frontend_Node_Environment