Add sorting and filtering toolbar to Risks management#1426
Add sorting and filtering toolbar to Risks management#1426PraveenKum11 wants to merge 6 commits into
Conversation
- Introduced sorting functionality for risk items with a new SortButton component. - Added ColumnsDropdown for managing visible columns in the Kanban view. - Enhanced RisksProvider to manage sorting state and integrate with useRisksData. - Updated context and types to support sorting and user details. - Refactored useRisksData to include sorting in data fetching logic.
There was a problem hiding this comment.
Pull request overview
This PR adds a dedicated toolbar to the Project → Risks tab to support filtering and sorting of Risk records (and a column-visibility toggle for the Kanban view), wiring those controls into the risks data-fetching hook and shared risks context.
Changes:
- Extend
useRisksDatato accept filter + sort state, build Frappe filters, and apply server-side ordering. - Introduce new toolbar UI (quick filters, advanced filter popover, sort popover, and Kanban columns toggle) and integrate it into the risks header.
- Plumb new state through the risks provider/context and adjust the Kanban view’s item-sync logic.
Reviewed changes
Copilot reviewed 10 out of 10 changed files in this pull request and generated 7 comments.
Show a summary per file
| File | Description |
|---|---|
| frontend/packages/app/src/pages/project-details/tabs/risks/useRisksData.ts | Builds Frappe filters from toolbar state, applies orderBy, and enriches risks with owner details (also exposes owner map for filter options). |
| frontend/packages/app/src/pages/project-details/tabs/risks/types.ts | Adds a RiskSort type for the new sorting state. |
| frontend/packages/app/src/pages/project-details/tabs/risks/context.ts | Extends context state/actions to include sort state and owner-detail lookup. |
| frontend/packages/app/src/pages/project-details/tabs/risks/provider.tsx | Stores sort in provider state and passes filter/sort into useRisksData. |
| frontend/packages/app/src/pages/project-details/tabs/risks/header.tsx | Renders the new toolbar beneath the Risks header. |
| frontend/packages/app/src/pages/project-details/tabs/risks/toolbar/toolbar.tsx | New toolbar: quick filters, advanced filter popover, sort button, and conditional Kanban columns dropdown. |
| frontend/packages/app/src/pages/project-details/tabs/risks/toolbar/sortButton.tsx | New sort popover UI and interactions. |
| frontend/packages/app/src/pages/project-details/tabs/risks/toolbar/columnsDropdown.tsx | New Kanban column visibility multiselect. |
| frontend/packages/app/src/pages/project-details/tabs/risks/kanban/kanbanView.tsx | Changes how Kanban items state syncs from fetched data. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Design Implementation
PS: Haven't looked at the code yet I will start after these are fixed. |
|
@ayushnirwal Can you please rebuild your frappe-ui-react submodule? This all was already handled, but just to be 100% sure I have updated the latest commit for frappe-ui-react. 
|
1,2,3 in my previous comment are fixed. |
1,2,3 are fixed 4 is still present |
Description
Relevant Technical Choices
NOTE: There is an issue with our kanban implementation - currently if you move an item between two columns the order is not maintained. The issue now is that when ever an item changes columns a network request is made which refreshes the data and triggers a re-render, and by default frappe sorts the item by creation date, so the most recent item jumps to top. I previously fixed this via maintaining order only on the client side - but now that we have sorting options that is no longer possible. As we were using Sets
The fix would be to implement fractional indexing via rank, which would require backend changes and change to kanban component itself. Thus it would be better if we cover it as an enhancement.
Screenshot/Screencast
Checklist
Fixes #1089
Fixes #1066
Fixes #1069