1
0
Fork 0
mirror of https://github.com/portainer/portainer.git synced 2025-08-10 00:05:24 +02:00

fix(app/edge-jobs): edge job results page crash at scale (#954)

This commit is contained in:
LP B 2025-08-04 17:10:46 +02:00 committed by GitHub
parent d306d7a983
commit a472de1919
27 changed files with 2595 additions and 107 deletions

View file

@ -1,18 +1,16 @@
import { List } from 'lucide-react';
import { useMemo } from 'react';
import { Environment } from '@/react/portainer/environments/types';
import { useEnvironmentList } from '@/react/portainer/environments/queries';
import { queryOptionsFromTableState } from '@/react/common/api/listQueryParams';
import { Datatable } from '@@/datatables';
import { useTableState } from '@@/datatables/useTableState';
import { withMeta } from '@@/datatables/extend-options/withMeta';
import { mergeOptions } from '@@/datatables/extend-options/mergeOptions';
import { EdgeJob, JobResult, LogsStatus } from '../../types';
import { EdgeJob, LogsStatus } from '../../types';
import { useJobResults } from '../../queries/jobResults/useJobResults';
import { columns } from './columns';
import { columns, sortOptions } from './columns';
import { createStore } from './datatable-store';
const tableKey = 'edge-job-results';
@ -22,8 +20,9 @@ export function ResultsDatatable({ jobId }: { jobId: EdgeJob['Id'] }) {
const tableState = useTableState(store, tableKey);
const jobResultsQuery = useJobResults(jobId, {
...queryOptionsFromTableState({ ...tableState }, sortOptions),
refetchInterval(dataset) {
const anyCollecting = dataset?.some(
const anyCollecting = dataset?.data.some(
(r) => r.LogsStatus === LogsStatus.Pending
);
@ -35,40 +34,17 @@ export function ResultsDatatable({ jobId }: { jobId: EdgeJob['Id'] }) {
},
});
const environmentIds = jobResultsQuery.data?.map(
(result) => result.EndpointId
);
const environmentsQuery = useEnvironmentList(
{ endpointIds: environmentIds },
{ enabled: !!environmentIds && !jobResultsQuery.isLoading }
);
const dataset = useMemo(
() =>
jobResultsQuery.isLoading || environmentsQuery.isLoading
? []
: associateEndpointsToResults(
jobResultsQuery.data || [],
environmentsQuery.environments
),
[
environmentsQuery.environments,
environmentsQuery.isLoading,
jobResultsQuery.data,
jobResultsQuery.isLoading,
]
);
const dataset = jobResultsQuery.data?.data || [];
return (
<Datatable
disableSelect
columns={columns}
dataset={dataset}
isLoading={jobResultsQuery.isLoading || environmentsQuery.isLoading}
title="Results"
titleIcon={List}
columns={columns}
disableSelect
dataset={dataset}
settingsManager={tableState}
isLoading={jobResultsQuery.isLoading}
extendTableOptions={mergeOptions(
withMeta({
table: 'edge-job-results',
@ -76,21 +52,11 @@ export function ResultsDatatable({ jobId }: { jobId: EdgeJob['Id'] }) {
})
)}
data-cy="edge-job-results-datatable"
isServerSidePagination
page={tableState.page}
onPageChange={tableState.setPage}
onSearchChange={() => tableState.setPage(0)}
totalCount={jobResultsQuery.data?.totalCount || 0}
/>
);
}
function associateEndpointsToResults(
results: Array<JobResult>,
environments: Array<Environment>
) {
return results.map((result) => {
const environment = environments.find(
(environment) => environment.Id === result.EndpointId
);
return {
...result,
Endpoint: environment,
};
});
}