You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Convert Authentications Table pagination from "Load More" to numbered pagination.
How this works: Say we want to fetch results 90-100. We use the terms aggregation and query for 100 results. Then on the FE server, we splice the results and grab 90-100. Because of this implementation, the risk with numbered pagination is a that huge computation to get the last page. Therefore, I prevent the user from being able to go forward more than 5 pages initially, and after that only one page at a time. That math is done in /public/components/paginated_table/helpers.ts, under fakePossibleCount
Once this has passed code review, I plan on implementing this paging on all other tables. Speak now on implementation details or forever hold your peace!!
Checklist
Use strikethroughs to remove checklist items you don't feel are applicable to this PR.
Hey, @stephmilovic. From a design perspective, I have two suggested changes I wish to make:
Currently the alignment of the pagination numbers and arrows appears to be somewhat center aligned. Ideally, I'd like to see these right aligned with the page contents. Assuming you're using EuiFlexGroup to layout the pagination, it should be as simple as setting the EuiFlexItem container for the pagination number to have a prop of grow={false}.
The solution of only showing the first five pages of table data makes sense given the current technical limitations, but it may cause the user to inadvertently think that there are only five pages of data in total (when in fact there may be many more). I think a possible remedy to this would be to include the standard pagination ellipsis after the number 5 page, in situations where the number of pages actually exceeds five. Doing so will at the very least indicate to the user that there are more than five pages, even if they can't quickly navigate to them. For example:
FrankHassanabad
changed the title
[SIEM] - Authentications Table, Numbered Pagination
[SIEM] Changes authentications table from load more to paginated
Jul 30, 2019
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Convert Authentications Table pagination from "Load More" to numbered pagination.
How this works: Say we want to fetch results 90-100. We use the terms aggregation and query for 100 results. Then on the FE server, we splice the results and grab 90-100. Because of this implementation, the risk with numbered pagination is a that huge computation to get the last page. Therefore, I prevent the user from being able to go forward more than 5 pages initially, and after that only one page at a time. That math is done in
/public/components/paginated_table/helpers.ts
, under fakePossibleCountOnce this has passed code review, I plan on implementing this paging on all other tables. Speak now on implementation details or forever hold your peace!!
Checklist
Use
strikethroughsto remove checklist items you don't feel are applicable to this PR.This was checked for cross-browser compatibility, including a check against IE11Any text added follows EUI's writing guidelines, uses sentence case text and includes i18n supportDocumentation was added for features that require explanation or tutorialsThis was checked for keyboard-only and screenreader accessibilityFor maintainers
This was checked for breaking API changes and was labeled appropriatelyThis includes a feature addition or change that requires a release note and was labeled appropriately