Sync .kiro/ from master — v2.2.0 release batch
New specs: archer-template-library, ccp-metrics-view-restructure, compliance-list-stale-after-sidebar-edit, compliance-metric-estimated-resolution-date, compliance-remediation-display-fix, flexible-jira-ticket-creation, forecast-burndown-chart, granite-loader-export, ivanti-queue-clear-completed-fix, multi-item-jira-ticket, queue-collapsible-sections, vendor-issue-type-dropdown New steering: archer-template-gen.md Updated: migration-registration-check hook, remediation-plan-history spec, gitlab-workflow, tech, versioning steering files
This commit is contained in:
85
.kiro/specs/queue-collapsible-sections/requirements.md
Normal file
85
.kiro/specs/queue-collapsible-sections/requirements.md
Normal file
@@ -0,0 +1,85 @@
|
||||
# Requirements Document
|
||||
|
||||
## Introduction
|
||||
|
||||
The IvantiTodoQueuePage currently displays all pending queue items in a flat table. This feature introduces collapsible sections that group items using a hybrid layout: an "Inventory" section at the top containing CARD, GRANITE, and DECOM workflow type items, followed by vendor-grouped sections for FP and Archer items. Each section header is clickable to collapse or expand its contents, allowing users to focus on relevant groups while maintaining full cross-section selection and existing page functionality.
|
||||
|
||||
## Glossary
|
||||
|
||||
- **Queue_Page**: The IvantiTodoQueuePage React component located at `frontend/src/components/pages/IvantiTodoQueuePage.js`
|
||||
- **Section**: A collapsible group of queue items sharing a common grouping criterion (either Inventory type or vendor name)
|
||||
- **Section_Header**: The clickable row that displays the section label, item count, and collapse/expand toggle
|
||||
- **Inventory_Section**: The top-level section containing items with workflow_type of CARD, GRANITE, or DECOM
|
||||
- **Vendor_Section**: A section grouping FP and Archer workflow type items by their vendor field
|
||||
- **Collapse_State**: A per-section boolean indicating whether the section body is hidden (collapsed) or visible (expanded)
|
||||
- **Visible_Items**: Queue items with status "pending" that are displayed in the main list
|
||||
|
||||
## Requirements
|
||||
|
||||
### Requirement 1: Hybrid Grouping Layout
|
||||
|
||||
**User Story:** As a queue operator, I want items grouped into logical sections (Inventory at top, then vendor groups), so that I can quickly locate items by their workflow category.
|
||||
|
||||
#### Acceptance Criteria
|
||||
|
||||
1. THE Queue_Page SHALL group Visible_Items into an Inventory_Section containing all items where workflow_type is CARD, GRANITE, or DECOM.
|
||||
2. THE Queue_Page SHALL group remaining Visible_Items (workflow_type FP or Archer) into Vendor_Sections keyed by the item vendor field.
|
||||
3. THE Queue_Page SHALL display the Inventory_Section before all Vendor_Sections.
|
||||
4. THE Queue_Page SHALL sort Vendor_Sections alphabetically by vendor name.
|
||||
5. WHEN a Visible_Item has no vendor value, THE Queue_Page SHALL place the item in a Vendor_Section labeled "Unknown".
|
||||
6. WHEN the Inventory_Section contains zero items, THE Queue_Page SHALL omit the Inventory_Section from the layout.
|
||||
7. WHEN a vendor has zero pending items, THE Queue_Page SHALL omit that Vendor_Section from the layout.
|
||||
|
||||
### Requirement 2: Collapsible Section Headers
|
||||
|
||||
**User Story:** As a queue operator, I want to collapse sections I am not working on, so that I can reduce visual clutter and focus on relevant items.
|
||||
|
||||
#### Acceptance Criteria
|
||||
|
||||
1. THE Queue_Page SHALL render a Section_Header for each displayed Section.
|
||||
2. WHEN a user clicks a Section_Header, THE Queue_Page SHALL toggle the Collapse_State of that Section.
|
||||
3. WHILE a Section is in expanded Collapse_State, THE Queue_Page SHALL display all items belonging to that Section.
|
||||
4. WHILE a Section is in collapsed Collapse_State, THE Queue_Page SHALL hide all items belonging to that Section.
|
||||
5. WHILE a Section is in collapsed Collapse_State, THE Section_Header SHALL remain visible with the section label and item count.
|
||||
6. THE Section_Header SHALL display a directional chevron icon indicating the current Collapse_State (down for expanded, right for collapsed).
|
||||
7. THE Queue_Page SHALL initialize all Sections in expanded Collapse_State on page load.
|
||||
|
||||
### Requirement 3: Section Header Display
|
||||
|
||||
**User Story:** As a queue operator, I want section headers to show the group name and item count, so that I can assess workload distribution at a glance.
|
||||
|
||||
#### Acceptance Criteria
|
||||
|
||||
1. THE Section_Header for the Inventory_Section SHALL display the label "Inventory" with the total count of items in that section.
|
||||
2. THE Section_Header for each Vendor_Section SHALL display the vendor name with the total count of items in that section.
|
||||
3. THE Section_Header SHALL use a monospace font, uppercase text, and styling consistent with the dark theme tactical intelligence aesthetic.
|
||||
4. THE Section_Header SHALL use a distinct accent color for the Inventory_Section (green) and a neutral color for Vendor_Sections.
|
||||
5. THE Section_Header SHALL display a bottom border to visually separate the header from section content.
|
||||
|
||||
### Requirement 4: Cross-Section Selection Preservation
|
||||
|
||||
**User Story:** As a queue operator, I want to select items across multiple sections without losing selections when collapsing sections, so that I can create consolidated Jira tickets from items in different groups.
|
||||
|
||||
#### Acceptance Criteria
|
||||
|
||||
1. WHILE selection mode is active, THE Queue_Page SHALL allow selecting items from any combination of Sections.
|
||||
2. WHEN a Section is collapsed, THE Queue_Page SHALL preserve the selected state of items within that collapsed Section.
|
||||
3. WHEN a Section is expanded after being collapsed, THE Queue_Page SHALL display the previously selected items as still selected.
|
||||
4. THE selection count indicator SHALL reflect the total count of selected items across all Sections regardless of Collapse_State.
|
||||
5. THE Select All checkbox SHALL toggle selection for all Visible_Items across all Sections regardless of Collapse_State.
|
||||
6. THE floating action bar SHALL operate on all selected items across all Sections regardless of Collapse_State.
|
||||
|
||||
### Requirement 5: Visual and Interaction Consistency
|
||||
|
||||
**User Story:** As a queue operator, I want the collapsible sections to match the existing page aesthetic and not break existing functionality, so that the experience remains cohesive.
|
||||
|
||||
#### Acceptance Criteria
|
||||
|
||||
1. THE Queue_Page SHALL use inline styles consistent with the existing STYLES constant and dark theme tactical intelligence aesthetic.
|
||||
2. THE Queue_Page SHALL use lucide-react icons for the collapse/expand chevron indicators.
|
||||
3. THE Section_Header SHALL provide a pointer cursor to indicate clickability.
|
||||
4. WHEN items are grouped into Sections, THE ticket link badges SHALL continue to display on items that have associated Jira tickets.
|
||||
5. WHEN items are grouped into Sections, THE consolidation modal SHALL continue to function with the selected items.
|
||||
6. WHEN items are grouped into Sections, THE floating action bar SHALL continue to appear when one or more items are selected.
|
||||
7. THE Queue_Page SHALL continue to display the completed items count at the bottom of the page.
|
||||
8. IF the queue contains zero Visible_Items, THEN THE Queue_Page SHALL display the existing empty state without any Section_Headers.
|
||||
Reference in New Issue
Block a user