mirror of
https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz
synced 2025-07-29 16:02:11 +08:00
feat: remove pagination for single-page lists
This commit is contained in:
parent
2fb5b16840
commit
580198ca7a
@ -20,6 +20,7 @@ import { ResizeTableProps } from './types';
|
|||||||
function ResizeTable({
|
function ResizeTable({
|
||||||
columns,
|
columns,
|
||||||
onDragColumn,
|
onDragColumn,
|
||||||
|
pagination,
|
||||||
...restProps
|
...restProps
|
||||||
}: ResizeTableProps): JSX.Element {
|
}: ResizeTableProps): JSX.Element {
|
||||||
const [columnsData, setColumns] = useState<ColumnsType>([]);
|
const [columnsData, setColumns] = useState<ColumnsType>([]);
|
||||||
@ -63,8 +64,10 @@ function ResizeTable({
|
|||||||
...restProps,
|
...restProps,
|
||||||
components: { header: { cell: ResizableHeader } },
|
components: { header: { cell: ResizableHeader } },
|
||||||
columns: mergedColumns,
|
columns: mergedColumns,
|
||||||
|
hideOnSinglePage: true,
|
||||||
|
pagination: { ...pagination, hideOnSinglePage: true },
|
||||||
}),
|
}),
|
||||||
[mergedColumns, restProps],
|
[mergedColumns, pagination, restProps],
|
||||||
);
|
);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
@ -423,6 +423,7 @@ function AllErrors(): JSX.Element {
|
|||||||
current: getUpdatedOffset / 10 + 1,
|
current: getUpdatedOffset / 10 + 1,
|
||||||
position: ['bottomLeft'],
|
position: ['bottomLeft'],
|
||||||
total: errorCountResponse.data?.payload || 0,
|
total: errorCountResponse.data?.payload || 0,
|
||||||
|
hideOnSinglePage: true,
|
||||||
}}
|
}}
|
||||||
onChange={onChangeHandler}
|
onChange={onChangeHandler}
|
||||||
/>
|
/>
|
||||||
|
@ -389,6 +389,7 @@ function ListAlert({ allAlertRules, refetch }: ListAlertProps): JSX.Element {
|
|||||||
onChange={handleChange}
|
onChange={handleChange}
|
||||||
pagination={{
|
pagination={{
|
||||||
defaultCurrent: Number(paginationParam) || 1,
|
defaultCurrent: Number(paginationParam) || 1,
|
||||||
|
hideOnSinglePage: true,
|
||||||
}}
|
}}
|
||||||
facingIssueBtn={{
|
facingIssueBtn={{
|
||||||
attributes: {
|
attributes: {
|
||||||
|
@ -609,6 +609,16 @@ function DashboardsList(): JSX.Element {
|
|||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const paginationConfig = data.length > 20 && {
|
||||||
|
pageSize: 20,
|
||||||
|
showTotal: showPaginationItem,
|
||||||
|
showSizeChanger: false,
|
||||||
|
onChange: (page: any): void => handlePageSizeUpdate(page),
|
||||||
|
current: Number(sortOrder.pagination),
|
||||||
|
defaultCurrent: Number(sortOrder.pagination) || 1,
|
||||||
|
hideOnSinglePage: true,
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="dashboards-list-container">
|
<div className="dashboards-list-container">
|
||||||
<div className="dashboards-list-view-content">
|
<div className="dashboards-list-view-content">
|
||||||
@ -822,16 +832,7 @@ function DashboardsList(): JSX.Element {
|
|||||||
showSorterTooltip
|
showSorterTooltip
|
||||||
loading={isDashboardListLoading || isFilteringDashboards}
|
loading={isDashboardListLoading || isFilteringDashboards}
|
||||||
showHeader={false}
|
showHeader={false}
|
||||||
pagination={
|
pagination={paginationConfig}
|
||||||
data.length > 20 && {
|
|
||||||
pageSize: 20,
|
|
||||||
showTotal: showPaginationItem,
|
|
||||||
showSizeChanger: false,
|
|
||||||
onChange: (page): void => handlePageSizeUpdate(page),
|
|
||||||
current: Number(sortOrder.pagination),
|
|
||||||
defaultCurrent: Number(sortOrder.pagination) || 1,
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/>
|
/>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
@ -1,3 +1,4 @@
|
|||||||
export const historyPagination = {
|
export const historyPagination = {
|
||||||
defaultPageSize: 5,
|
defaultPageSize: 5,
|
||||||
|
hideOnSinglePage: true,
|
||||||
};
|
};
|
||||||
|
@ -334,6 +334,11 @@ export function PlannedDowntimeList({
|
|||||||
}
|
}
|
||||||
}, [downtimeSchedules.error, downtimeSchedules.isError, notifications]);
|
}, [downtimeSchedules.error, downtimeSchedules.isError, notifications]);
|
||||||
|
|
||||||
|
const paginationConfig = {
|
||||||
|
pageSize: 5,
|
||||||
|
showSizeChanger: false,
|
||||||
|
hideOnSinglePage: true,
|
||||||
|
};
|
||||||
return (
|
return (
|
||||||
<Table<DowntimeSchedulesTableData>
|
<Table<DowntimeSchedulesTableData>
|
||||||
columns={columns}
|
columns={columns}
|
||||||
@ -342,7 +347,7 @@ export function PlannedDowntimeList({
|
|||||||
dataSource={tableData || []}
|
dataSource={tableData || []}
|
||||||
loading={downtimeSchedules.isLoading || downtimeSchedules.isFetching}
|
loading={downtimeSchedules.isLoading || downtimeSchedules.isFetching}
|
||||||
showHeader={false}
|
showHeader={false}
|
||||||
pagination={{ pageSize: 5, showSizeChanger: false }}
|
pagination={paginationConfig}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -79,6 +79,12 @@ function ServiceMetricTable({
|
|||||||
}
|
}
|
||||||
}, [services, licenseData, isFetching, isCloudUserVal]);
|
}, [services, licenseData, isFetching, isCloudUserVal]);
|
||||||
|
|
||||||
|
const paginationConfig = {
|
||||||
|
defaultPageSize: 10,
|
||||||
|
showTotal: (total: number, range: number[]): string =>
|
||||||
|
`${range[0]}-${range[1]} of ${total} items`,
|
||||||
|
hideOnSinglePage: true,
|
||||||
|
};
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
{RPS > MAX_RPS_LIMIT && (
|
{RPS > MAX_RPS_LIMIT && (
|
||||||
@ -92,11 +98,7 @@ function ServiceMetricTable({
|
|||||||
<ResourceAttributesFilter />
|
<ResourceAttributesFilter />
|
||||||
|
|
||||||
<ResizeTable
|
<ResizeTable
|
||||||
pagination={{
|
pagination={paginationConfig}
|
||||||
defaultPageSize: 10,
|
|
||||||
showTotal: (total: number, range: number[]): string =>
|
|
||||||
`${range[0]}-${range[1]} of ${total} items`,
|
|
||||||
}}
|
|
||||||
columns={tableColumns}
|
columns={tableColumns}
|
||||||
loading={isLoading}
|
loading={isLoading}
|
||||||
dataSource={services}
|
dataSource={services}
|
||||||
|
@ -36,6 +36,12 @@ function ServiceTraceTable({
|
|||||||
}
|
}
|
||||||
}, [services, licenseData, isFetching, isCloudUserVal]);
|
}, [services, licenseData, isFetching, isCloudUserVal]);
|
||||||
|
|
||||||
|
const paginationConfig = {
|
||||||
|
defaultPageSize: 10,
|
||||||
|
showTotal: (total: number, range: number[]): string =>
|
||||||
|
`${range[0]}-${range[1]} of ${total} items`,
|
||||||
|
hideOnSinglePage: true,
|
||||||
|
};
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
{RPS > MAX_RPS_LIMIT && (
|
{RPS > MAX_RPS_LIMIT && (
|
||||||
@ -49,11 +55,7 @@ function ServiceTraceTable({
|
|||||||
<ResourceAttributesFilter />
|
<ResourceAttributesFilter />
|
||||||
|
|
||||||
<ResizeTable
|
<ResizeTable
|
||||||
pagination={{
|
pagination={paginationConfig}
|
||||||
defaultPageSize: 10,
|
|
||||||
showTotal: (total: number, range: number[]): string =>
|
|
||||||
`${range[0]}-${range[1]} of ${total} items`,
|
|
||||||
}}
|
|
||||||
columns={tableColumns}
|
columns={tableColumns}
|
||||||
loading={loading}
|
loading={loading}
|
||||||
dataSource={services}
|
dataSource={services}
|
||||||
|
@ -215,6 +215,7 @@ function TraceTable(): JSX.Element {
|
|||||||
responsive: true,
|
responsive: true,
|
||||||
position: ['bottomLeft'],
|
position: ['bottomLeft'],
|
||||||
total: totalCount,
|
total: totalCount,
|
||||||
|
hideOnSinglePage: true,
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
|
@ -46,6 +46,8 @@ function DataCollected(props: DataCollectedProps): JSX.Element {
|
|||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
|
const paginationConfig = { pageSize: 20, hideOnSinglePage: true };
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="integration-data-collected">
|
<div className="integration-data-collected">
|
||||||
<div className="logs-section">
|
<div className="logs-section">
|
||||||
@ -59,7 +61,7 @@ function DataCollected(props: DataCollectedProps): JSX.Element {
|
|||||||
index % 2 === 0 ? 'table-row-dark' : ''
|
index % 2 === 0 ? 'table-row-dark' : ''
|
||||||
}
|
}
|
||||||
dataSource={logsData}
|
dataSource={logsData}
|
||||||
pagination={{ pageSize: 20 }}
|
pagination={paginationConfig}
|
||||||
className="logs-section-table"
|
className="logs-section-table"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@ -74,7 +76,7 @@ function DataCollected(props: DataCollectedProps): JSX.Element {
|
|||||||
index % 2 === 0 ? 'table-row-dark' : ''
|
index % 2 === 0 ? 'table-row-dark' : ''
|
||||||
}
|
}
|
||||||
dataSource={metricsData}
|
dataSource={metricsData}
|
||||||
pagination={{ pageSize: 20 }}
|
pagination={paginationConfig}
|
||||||
className="metrics-section-table"
|
className="metrics-section-table"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
@ -277,6 +277,8 @@ function SaveView(): JSX.Element {
|
|||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
|
const paginationConfig = { pageSize: 5, hideOnSinglePage: true };
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="save-view-container">
|
<div className="save-view-container">
|
||||||
<div className="save-view-content">
|
<div className="save-view-content">
|
||||||
@ -303,7 +305,7 @@ function SaveView(): JSX.Element {
|
|||||||
dataSource={dataSource}
|
dataSource={dataSource}
|
||||||
loading={isLoading || isRefetching}
|
loading={isLoading || isRefetching}
|
||||||
showHeader={false}
|
showHeader={false}
|
||||||
pagination={{ pageSize: 5 }}
|
pagination={paginationConfig}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user