Skip to content

[Customer Portal][FE][WEB] Refactor Dashboard Stats and Simplify Items Page by Removing Resolved Items - #611

Merged
v15a1 merged 6 commits into
wso2-open-operations:mainfrom
dileepapeiris:feat-bug-fix-v16
Apr 25, 2026
Merged

v15a1 merged 6 commits into
wso2-open-operations:mainfrom
dileepapeiris:feat-bug-fix-v16

Conversation

@dileepapeiris

@dileepapeiris dileepapeiris commented Apr 25, 2026 •

Copy link
Copy Markdown
Contributor

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:

  • Refactored the calculation of dashboard statistics to use new actionRequiredCount, outstandingCount, and resolvedCount fields from the cases and change request stats APIs, simplifying the logic and improving accuracy. [1] [2]
  • Updated query enabling conditions throughout the dashboard to check both project context and user permissions before fetching stats, preventing unnecessary API calls. [1] [2] [3]

API and type updates:

  • Added the actionRequiredCount field to both ProjectCasesStats and ChangeRequestStatsResponse types, and updated the corresponding API hooks to populate this field. [1] [2] [3] [4]

Dashboard items page simplification:

  • Removed all code related to displaying "resolved" items (cases, service requests, security reports, engagements, and change requests) in the dashboard items page, including queries, derived values, and UI sections. The page now focuses only on active/outstanding items. [1] [2] [3] [4] [5]

Other improvements:

  • Increased the cache staleTime for project features API calls from 0 to 5 minutes to reduce unnecessary refetching.
  • Cleaned up unused imports and streamlined code in the dashboard files.

Summary by CodeRabbit

Release Notes

  • New Features
    • Dashboard now displays action-required counts for cases and change requests, providing quick visibility into items needing immediate attention.
    • Outstanding items view streamlined; resolved items no longer displayed in this focused view.

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.
@dileepapeiris dileepapeiris self-assigned this Apr 25, 2026
@coderabbitai

coderabbitai Bot commented Apr 25, 2026 •

Copy link
Copy Markdown
Contributor
📝 Walkthrough

Walkthrough

The PR introduces actionRequiredCount field to case and change-request statistics, adjusts React Query caching for features, simplifies dashboard item page by removing resolved items tracking, and refactors dashboard stats computation from state-based calculations to precomputed aggregate fields with conditional CR stats inclusion.

Changes

Cohort / File(s) Summary
Type Definitions
apps/customer-portal/webapp/src/features/support/types/cases.ts, apps/customer-portal/webapp/src/features/operations/types/changeRequests.ts
Added optional actionRequiredCount?: number field to ProjectCasesStats and ChangeRequestStatsResponse types.
Stats Hooks
apps/customer-portal/webapp/src/api/useGetProjectFeatures.ts, apps/customer-portal/webapp/src/features/dashboard/api/useGetProjectCasesStats.ts, apps/customer-portal/webapp/src/features/dashboard/api/useGetProjectChangeRequestsStats.ts
Updated response transformation to map actionRequiredCount from backend payload; adjusted React Query staleTime for features query from 0 to 5 * 60 * 1000 for improved caching freshness.
Dashboard Refactoring
apps/customer-portal/webapp/src/features/dashboard/pages/DashboardPage.tsx, apps/customer-portal/webapp/src/features/dashboard/pages/DashboardItemsPage.tsx
DashboardItemsPage removes resolved items dataset logic, accordion state simplification, and eliminated related API query hooks. DashboardPage shifts stats computation from state-based aggregation to precomputed aggregate fields, gates SR/engagement/CR queries by permissions and context, and conditionally includes CR stats in totals.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

Suggested labels

Type/Improvement, Type/Task, App/Customer Portal, Area/Frontend, Platform/Web

Suggested reviewers

  • Rashmika998
  • v15a1

Poem

🐰 With stats now fresher, cached with care,
Action counts bubble through the air,
Dashboards lean on precomputed might,
Resolved items fade from sight,
The portal shines, refactored right! ✨

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Description check ⚠️ Warning The PR description is comprehensive and covers Purpose, Goals, and Approach sections well; however, required sections like Release note, Documentation, User stories, and others from the template are missing or incomplete. Add or complete the missing template sections: Release note, Documentation, User stories, Training, Certification, Marketing, Automation tests, Security checks, and Test environment details.
✅ Passed checks (4 passed)
Check name Status Explanation
Title check ✅ Passed The pull request title accurately summarizes the main changes: refactoring dashboard stats and removing resolved items from the items page.
Docstring Coverage ✅ Passed Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

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.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@dileepapeiris dileepapeiris added Type/Improvement Marks enhancements or improvements to existing features Type/Task General task that does not fit into other categories Type/UX Refers to user experience-related tasks or issues App/Customer Portal Area/Frontend Platform/Web labels Apr 25, 2026

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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 | 🟡 Minor

Outstanding mode silently shows a blank page when no items exist.

The empty-state guard now excludes isOutstandingMode, so when a user lands on outstanding-interactions with zero outstanding cases/SR/SRA/eng/CR, visibleSections is [] 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

📥 Commits

Reviewing files that changed from the base of the PR and between 6779a1a and 8d7ef94.

📒 Files selected for processing (7)
  • apps/customer-portal/webapp/src/api/useGetProjectFeatures.ts
  • apps/customer-portal/webapp/src/features/dashboard/api/useGetProjectCasesStats.ts
  • apps/customer-portal/webapp/src/features/dashboard/api/useGetProjectChangeRequestsStats.ts
  • apps/customer-portal/webapp/src/features/dashboard/pages/DashboardItemsPage.tsx
  • apps/customer-portal/webapp/src/features/dashboard/pages/DashboardPage.tsx
  • apps/customer-portal/webapp/src/features/operations/types/changeRequests.ts
  • apps/customer-portal/webapp/src/features/support/types/cases.ts

@v15a1
v15a1 merged commit 86776fa into wso2-open-operations:main Apr 25, 2026
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

App/Customer Portal Area/Frontend Platform/Web Type/Improvement Marks enhancements or improvements to existing features Type/Task General task that does not fit into other categories Type/UX Refers to user experience-related tasks or issues

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants