-
Notifications
You must be signed in to change notification settings - Fork 161
Grid Paging Specification
Danail Marinov edited this page Jul 3, 2019
·
20 revisions
- Revision History
- Overview
- User Stories
- Functionality
- ARIA support
- Assumptions and Limitations
- Test Scenarios
- References
Version | User | Date | Notes |
---|---|---|---|
0.1 | Danail Marinov | July 3, 2019 | Initial draft |
- Stefan Ivanov | Date:
- Simeon Simeonoff | Date:
- Konstantin Dinev | Date:
The Grid Paging Component is used to:
- inform the user on which Grid page he is currently on
- allow navigation to the previous/next and first/last pages of the Grid content
- to inform the user how many records are being displayed per page and to let him select number of records to be displayed per page
- As an end user:
- I want to see how many records are currently being displayed per page
- I want to be able to select the number of records displayed per page
- I want to see on which Grid page I am currently on
- I want to know what is the total number of pages according to the number of records displayed
- I want to be able to navigate to the first/last Grid page through a button icon
- I want to be able to navigate to the next/previous Grid page through a button icon
- As a developer:
- I want to be able to set the number of records shown per page
- I want to be able to set Grid Paging display density
- I want to be able to enable/disable Pager buttons and Dropdown
- I want to be able to apply theme on the Paging according to the Grid theme
The Grid Paging is attached to the Grid bottom and
Zeplin file: zpl://project?pid=5ce53acf5f66941e1fafe414 https://zpl.io/V0LY9Xm
Comfortable
Cozy
Compact
Specify only if applicable
Assumptions | Limitation Notes |
---|---|
- Clicking 'Ascending' - sorts the grid properly, clicking 'Descending' - sorts the grid correctly and deselects 'Descending' button.
- After opening filter dialog on a sorted column, the correct button should be toggled.
- Clicking 'Move left/right' should correctly move the column.
- Clicking 'Pin/Unpin' column should correctly pin/unpin the column.
- Clicking 'Hide column' should hide the column.
- After entering value in first input, the grid shouldn't be filtered, 'And' operator should be selected and clear button should become inactive.
- If two values with And operator are entered, there shouldn’t be a selection in the list.
- If two values with Or operator are entered and one of them has operator different from ‘equals’, there shouldn’t be a selection in the list.
- If two values with Or operator are entered and they are in the list below, they should be selected.
- Changing And/Or operator should reflect in the selection of the list.
- Changing operator should reflect in the selection of the list.
- If three or more values are selected and we enter a new one in the input, the selection should be cleared and the grid should be filtered.
- Deselecting all values and then selecting two should populate the inputs.
- Selecting ‘all filters’ item should clear the filter.
- When dialog is closed and the filter has been changed the filter icon should be updated.
- Selecting 'Contains', 'Does not contain', etc, from the menu should open another filter dialog and populates the correct operator.
- Applying filter through API should correctly update filter dialog.
- Clearing filter through API clears UI too.