[Customer Portal][FE][WEB] Refactor Dashboard Stats and Simplify Items Page by Removing Resolved Items - #611
Conversation
Increase query staleTime from 0 to 5 minutes in useGetProjectFeatures to reduce excessive refetching and improve performance. Also expose actionRequiredCount in useGetProjectCasesStats mapping so the dashboard can consume the action-required metric.
Expose a new optional `actionRequiredCount` numeric field on the ProjectCasesStats type to track the number of cases requiring action. This augments existing stats alongside total/active/outstanding counts.
Add an optional `actionRequiredCount` field to ChangeRequestStatsResponse in changeRequests.ts. This adds support for tracking the number of change requests that require action, enabling UI and analytics to surface action-required metrics.
Replace manual state-based counting with aggregated API fields and tighten data gating. The diff removes unused imports, adds awaitingProjectContext checks to case/engagement/CR hooks, and switches calculations to use actionRequiredCount, outstandingCount, and resolvedCount from the stats responses instead of filtering state/severity arrays. Average response time remains derived from combined cases. Updated memo dependencies and loading/error logic to reflect the new sources. This simplifies client-side logic and respects project-permission and context readiness before fetching or showing stats.
Remove the resolved-items sub-section and all associated logic for the outstanding-interactions mode. This deletes the resolved case status ID computation, all resolved queries (cases, SR, SRA, engagements, CR), resolved-derived values, and the resolvedSections array. Also updates the accordion's initial expandedSections to drop resolved-* IDs and moves/adjusts isOutstandingMode usage. Simplifies the dashboard by no longer fetching or rendering resolved sub-sections.
Expose the API's actionRequiredCount in the returned project change request stats object by mapping raw?.actionRequiredCount into the result. This ensures the dashboard can access and display the action-required metric which was previously omitted.
📝 WalkthroughWalkthroughThe PR introduces Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
Suggested labels
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
apps/customer-portal/webapp/src/features/dashboard/pages/DashboardItemsPage.tsx (1)
619-628:⚠️ Potential issue | 🟡 MinorOutstanding mode silently shows a blank page when no items exist.
The empty-state guard now excludes
isOutstandingMode, so when a user lands onoutstanding-interactionswith zero outstanding cases/SR/SRA/eng/CR,visibleSectionsis[]and nothing is rendered (no message, no skeletons, no error). The other two modes (action-required,closed-last-30d) still render "No items found.", creating inconsistent UX. If the empty state was suppressed because outstanding mode shouldn't be reachable with zero items, that invariant isn't enforced anywhere — users navigating directly via URL or after items resolve in another tab will see an empty page.💡 Either drop the special case or render an outstanding-specific empty state
- {!isPageLoading && - !isPageError && - !isOutstandingMode && - visibleSections.length === 0 && ( + {!isPageLoading && + !isPageError && + visibleSections.length === 0 && ( <Box sx={{ textAlign: "center", py: 8 }}> <Typography variant="body1" color="text.secondary"> - No items found. + {isOutstandingMode + ? "No outstanding items." + : "No items found."} </Typography> </Box> )}🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/customer-portal/webapp/src/features/dashboard/pages/DashboardItemsPage.tsx` around lines 619 - 628, The page currently suppresses the empty-state UI when isOutstandingMode is true which leads to a blank screen if visibleSections is empty; update the DashboardItemsPage render logic so that when visibleSections.length === 0 you still render an appropriate empty state for outstanding mode (either remove the isOutstandingMode exclusion so the existing "No items found." box shows, or add an outstanding-specific empty state UI/message/skeleton when isOutstandingMode is true). Locate the conditional that checks isPageLoading, isPageError, isOutstandingMode and visibleSections.length and modify it to handle the outstanding case (reference: DashboardItemsPage component and the isOutstandingMode/visibleSections symbols) to ensure users navigating to outstanding-interactions always see an informative empty state.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Outside diff comments:
In
`@apps/customer-portal/webapp/src/features/dashboard/pages/DashboardItemsPage.tsx`:
- Around line 619-628: The page currently suppresses the empty-state UI when
isOutstandingMode is true which leads to a blank screen if visibleSections is
empty; update the DashboardItemsPage render logic so that when
visibleSections.length === 0 you still render an appropriate empty state for
outstanding mode (either remove the isOutstandingMode exclusion so the existing
"No items found." box shows, or add an outstanding-specific empty state
UI/message/skeleton when isOutstandingMode is true). Locate the conditional that
checks isPageLoading, isPageError, isOutstandingMode and visibleSections.length
and modify it to handle the outstanding case (reference: DashboardItemsPage
component and the isOutstandingMode/visibleSections symbols) to ensure users
navigating to outstanding-interactions always see an informative empty state.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: 3fa2e1ec-e122-4669-88fb-96f9ecaa725b
📒 Files selected for processing (7)
apps/customer-portal/webapp/src/api/useGetProjectFeatures.tsapps/customer-portal/webapp/src/features/dashboard/api/useGetProjectCasesStats.tsapps/customer-portal/webapp/src/features/dashboard/api/useGetProjectChangeRequestsStats.tsapps/customer-portal/webapp/src/features/dashboard/pages/DashboardItemsPage.tsxapps/customer-portal/webapp/src/features/dashboard/pages/DashboardPage.tsxapps/customer-portal/webapp/src/features/operations/types/changeRequests.tsapps/customer-portal/webapp/src/features/support/types/cases.ts
Description
This pull request refactors and simplifies the dashboard statistics and items pages in the customer portal, primarily by removing the "resolved items" feature from the dashboard items page and improving how "action required" and "outstanding" counts are calculated and displayed. It also introduces new fields to API response types and adjusts query enabling logic for better permission and context checks.
Dashboard statistics and query improvements:
actionRequiredCount,outstandingCount, andresolvedCountfields from the cases and change request stats APIs, simplifying the logic and improving accuracy. [1] [2]API and type updates:
actionRequiredCountfield to bothProjectCasesStatsandChangeRequestStatsResponsetypes, and updated the corresponding API hooks to populate this field. [1] [2] [3] [4]Dashboard items page simplification:
Other improvements:
staleTimefor project features API calls from 0 to 5 minutes to reduce unnecessary refetching.Summary by CodeRabbit
Release Notes