[CSM Portal] Cases list & dashboard: human IDs, pagination, BE-aligned columns/fields - #867
Conversation
…otals
Case identifiers
- Stop substituting the UUID primary key for a missing human id. The case
mappers fell back to `id` when `number`/`wso2Id` were absent, leaking the
raw UUID into the detail headline and the "WSO2 case ID" field.
- Make caseNumber and wso2CaseId optional on the case row type; render the
UUID nowhere. Add caseIdLabel() ("WSO2 id / CS number", dropping whichever
is absent) and use it for the recent-views label.
- Case list now shows BOTH ids as the row headline, and case search matches
the WSO2 id too. Detail header/details-tab guard missing ids (show "—").
Dashboard "Cases by severity and state"
- Replace the up-to-500-case client-side sample with exact counts: one
count-only search per cell (limit 1, read the `total` attribute). Removes
the truncation warning.
- Drop the Closed column; the matrix tracks active work only.
|
Warning Review limit reached
More reviews will be available in 45 minutes and 57 seconds. Learn how PR review limits work. Your organization has used up its prepaid credits, and credit purchases are no longer available. Enable the review add-on in the billing tab to keep reviews running — you're only billed for reviews past your plan's rate limits ($0.25/file). ⌛ How to resolve this issue?After more reviews become available, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available. Please see our Fair Usage Limits Policy for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (13)
📝 WalkthroughWalkthroughThe PR realigns CSM portal backend type field names ( ChangesCSM Portal — Server-side pagination, exact matrix counts, and backend type realignment
Sequence Diagram(s)sequenceDiagram
actor User
participant CsmCasesPage
participant useGetCsmCases
participant BackendAPI
User->>CsmCasesPage: change filter / search / page
CsmCasesPage->>CsmCasesPage: debounce search, reset page to 0
CsmCasesPage->>useGetCsmCases: filters, page, rowsPerPage
useGetCsmCases->>BackendAPI: POST /cases/search {pagination:{offset, limit}, sortBy:updated_at desc, searchQuery?}
BackendAPI-->>useGetCsmCases: {cases[], total, limit, offset, hasMore}
useGetCsmCases-->>CsmCasesPage: CsmCasesListResponse
CsmCasesPage->>CsmCasesPage: compute rangeStart/rangeEnd from total + page
CsmCasesPage->>User: render CasesList + TablePagination
Estimated code review effort🎯 4 (Complex) | ⏱️ ~60 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 |
…real field names Align FE types with the actual /cases/search payload - Rename wso2Id -> internalId, createdAt -> createdOn, updatedAt -> updatedOn on the case view/search types and their mappers. The previous names never matched the backend, so the WSO2 case id and timestamps were silently empty. Server-side pagination + page size (mirrors the projects/accounts pages) - The list fetched only the first 50 rows and never surfaced the rest. It now pages via the backend's pagination/total/limit/offset/hasMore, with a TablePagination footer (10 / 20 / 50 per page; 50 is the backend max). Push supported filters server-side - search -> searchQuery (debounced), alongside severity/state/project; results sorted by updated_at desc. Assignee / SLA / product have no backend support and are disabled in live (product can't map name -> deployed-product id). Mock mode still filters + sorts + slices the seeded set client-side. Columns reflect what the backend returns - Drop Assignee and SLA (no backend data); add Product. Now: Case (ids + subject) | Customer | Product | Severity | State | Updated.
Long subjects were cramped sharing one cell with the case ids (and the customer column ate horizontal space). Restructure the row: - Case ids move to their own narrow column (WSO2 internal id over CS number). - Subject gets its own wide column with the project as context beneath. - Drop the Customer column to free the space. Columns: Case ID | Subject | Product | Severity | State | Updated.
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@apps/csm-portal/webapp/src/features/csm-cases/pages/CsmCasesPage.tsx`:
- Around line 155-166: The pagination can display an empty out-of-range page
when the total count decreases (from filter changes or backend updates) while
the current page index remains beyond the last valid page. Add a useEffect hook
that monitors the total value and recalculates the maximum valid page index
based on the current rowsPerPage. When total changes, clamp the page state to
ensure it does not exceed the calculated maximum valid page index, preventing
empty table displays with misleading range information. The effect should
trigger whenever total or rowsPerPage changes and update the page state if
necessary.
In `@apps/csm-portal/webapp/src/features/csm-cases/utils/casesClientFilter.ts`:
- Around line 37-45: The SLA status filters are matching closed cases because
they only check minutesToBreach values without verifying the case is active. In
the casesClientFilter.ts file, add a check to exclude closed cases before
evaluating the "breached" and "at_risk" SLA filter conditions. Determine how
closed cases are identified in the case object c (likely through a status
property or boolean flag) and add this condition early in the SLA filter logic
so closed cases return false and do not match any SLA status filters.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: 965024a2-9ec2-4a68-945a-de363af3858a
📒 Files selected for processing (13)
apps/csm-portal/webapp/src/api/backend/types.tsapps/csm-portal/webapp/src/features/csm-cases/api/mocks/casesMocks.tsapps/csm-portal/webapp/src/features/csm-cases/api/useGetCsmCaseDetail.tsapps/csm-portal/webapp/src/features/csm-cases/api/useGetCsmCases.tsapps/csm-portal/webapp/src/features/csm-cases/components/CasesFilterBar.tsxapps/csm-portal/webapp/src/features/csm-cases/components/CasesList.tsxapps/csm-portal/webapp/src/features/csm-cases/pages/CsmCaseDetailPage.tsxapps/csm-portal/webapp/src/features/csm-cases/pages/CsmCasesPage.tsxapps/csm-portal/webapp/src/features/csm-cases/types/csmCases.tsapps/csm-portal/webapp/src/features/csm-cases/utils/caseIdentity.tsapps/csm-portal/webapp/src/features/csm-cases/utils/casesClientFilter.tsapps/csm-portal/webapp/src/features/csm-dashboard/api/useCaseCountsMatrix.tsapps/csm-portal/webapp/src/features/csm-dashboard/components/CaseCountsMatrix.tsx
💤 Files with no reviewable changes (1)
- apps/csm-portal/webapp/src/features/csm-dashboard/components/CaseCountsMatrix.tsx
… SLA filters Address review feedback on the cases list: - When the total shrinks (background refetch / rows closing) while on a later page, clamp back to the last valid page during render so the table never shows an empty out-of-range page with a misleading "showing X-Y" range. - SLA status filters (mock mode) no longer match closed cases: a closed row with minutesToBreach = 0 previously satisfied "at_risk".
|
@coderabbitai review |
|
✅ Action performedFull review finished. |
What
A cases-list + dashboard overhaul, plus a backend field-name correction.
Backend field alignment (bug fix)
The FE types used
wso2Id/createdAt/updatedAt, but the actual/cases/searchand case-view payloads useinternalId/createdOn/updatedOn(andcreatedByis an object). The old names silently resolved toundefined, so the WSO2 case id and timestamps were blank. Corrected the types and mappers. FE-only change — no backend touched.Case identifiers shown to humans
id(API/links only), a CS-prefixednumber, and the project-scopedinternalId. The mappers no longer fall back to the UUID, so it's never shown to humans.Server-side pagination + page size
total/limit/offset/hasMore, with aTablePaginationfooter (10 / 20 / 50 per page; 50 is the backend max) — consistent with the projects/accounts pages.Filters pushed server-side where supported
search→searchQuery(debounced), alongside severity / state / project; results sorted byupdated_at desc.Column layout tuned for long subjects
Dashboard "Cases by severity and state"
limit: 1, readtotal) instead of a 500-row client-side sample; dropped the Closed column.Verification
pnpm lint,pnpm build(typecheck),pnpm test(84 tests) all pass.