[Stack Monitoring] Beats instance view pagination (#113284)

* Beats instance view pagination

* Fix beats listing sorting

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
Mat Schaffer 2021-09-30 14:04:57 +09:00 committed by GitHub
parent 9c00debcd5
commit 685a550806
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 25 additions and 6 deletions

View file

@ -98,10 +98,22 @@ export function useTable(storageKey: string) {
const [query, setQuery] = useState('');
const onTableChange = () => {
// we are already updating the state in fetchMoreData. We would need to check in react
// if both methods are needed or we can clean one of them
// For now I just keep it so existing react components don't break
const onTableChange = ({ page, sort }: { page: Page; sort: Sorting['sort'] }) => {
setPagination({
...pagination,
...{
initialPageSize: page.size,
pageSize: page.size,
initialPageIndex: page.index,
pageIndex: page.index,
pageSizeOptions: PAGE_SIZE_OPTIONS,
},
});
setSorting(cleanSortingData({ sort }));
setLocalStorageData(storage, {
page,
sort,
});
};
const getPaginationRouteOptions = useCallback(() => {

View file

@ -29,7 +29,7 @@ export const BeatsInstancesPage: React.FC<ComponentProps> = ({ clusters }) => {
const globalState = useContext(GlobalStateContext);
const { services } = useKibana<{ data: any }>();
const { generate: generateBreadcrumbs } = useContext(BreadcrumbContainer.Context);
const { getPaginationTableProps } = useTable('beats.instances');
const { updateTotalItemCount, getPaginationTableProps } = useTable('beats.instances');
const clusterUuid = globalState.cluster_uuid;
const ccs = globalState.ccs;
const cluster = find(clusters, {
@ -66,7 +66,14 @@ export const BeatsInstancesPage: React.FC<ComponentProps> = ({ clusters }) => {
});
setData(response);
}, [ccs, clusterUuid, services.data?.query.timefilter.timefilter, services.http]);
updateTotalItemCount(response.stats.total);
}, [
ccs,
clusterUuid,
services.data?.query.timefilter.timefilter,
services.http,
updateTotalItemCount,
]);
return (
<BeatsTemplate