Skip to content

[Customer Portal] feat: Date Range Filters for SR & Engagements + Time Tracking CSV/PDF Export - #891

Merged
cloby99 merged 4 commits into
wso2-open-operations:mainfrom
SasmithaDilshan:feature/case-date-range-filters
Jun 18, 2026
Merged

[Customer Portal] feat: Date Range Filters for SR & Engagements + Time Tracking CSV/PDF Export#891
cloby99 merged 4 commits into
wso2-open-operations:mainfrom
SasmithaDilshan:feature/case-date-range-filters

Conversation

@SasmithaDilshan

@SasmithaDilshan SasmithaDilshan commented Jun 18, 2026

Copy link
Copy Markdown
Contributor

Summary

  • Service Requests — forwards startCreatedDate, endCreatedDate, startUpdatedDate,
    endUpdatedDate from the existing filter UI to the /cases/search API (values were silently
    dropped before)
  • Engagements — adds Created Date and Updated Date DateRangeFilter pickers to the custom
    filter panel and wires them through to the search request; active filter badge count updated
    accordingly
  • Time Tracking export — adds an Export button (CSV / PDF) to the Project Details → Time
    Tracking tab, matching the UX of the existing case list export; respects the active date range
    filter and includes a totals row

Out of Scope

Change Request date filters are intentionally excluded — the backend API does not support them
in this release.

Files Changed

File Change
features/operations/utils/operationsPages.ts Forward date fields in SR search builder
features/engagements/components/EngagementsListSection.tsx Add DateRangeFilter UI + badge count
features/engagements/utils/engagements.ts Forward date fields in engagement search builder
features/usage-metrics/api/fetchAllCaseTimeCards.ts New — fetch all time card pages for export
features/project-details/utils/timeCardsCsvExport.ts New — build CSV/PDF from time card data
features/project-details/components/time-tracking/TimeCardsCsvExportButton.tsx New — export button component
features/project-details/components/time-tracking/ProjectTimeTracking.tsx Wire export button into the page

Summary by CodeRabbit

Release Notes

  • New Features
    • Added date range filters (Created Date and Updated Date) for engagements and service requests to refine search results
    • Added CSV and PDF export functionality for project time cards

SasmithaDilshan and others added 3 commits June 18, 2026 17:42
…gagements

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@coderabbitai

coderabbitai Bot commented Jun 18, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Warning

Review limit reached

@SasmithaDilshan, we couldn't start this review because you've reached your PR review rate limit.

More reviews will be available in 44 minutes and 35 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 @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based credits.

🚦 How do rate limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan refill rate.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, the refill rate gradually slows as usage increases. The highest same-day bursts are limited more strictly.

Please see our Fair Usage Limits Policy for further information.

ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: fdd62c36-c1d3-441f-ac46-f0a82c1d473b

📥 Commits

Reviewing files that changed from the base of the PR and between 78edc42 and 5e7d97f.

📒 Files selected for processing (2)
  • apps/customer-portal/webapp/src/features/project-details/components/time-tracking/TimeCardsCsvExportButton.tsx
  • apps/customer-portal/webapp/src/features/project-details/utils/timeCardsCsvExport.ts
📝 Walkthrough

Walkthrough

Two independent features are added: (1) created/updated date range filters are wired into the engagements and service-requests search request builders and surfaced as DateRangeFilter controls in EngagementsListSection; (2) a TimeCardsCsvExportButton component is introduced with a paginated fetch utility (fetchAllCaseTimeCards) and CSV/PDF download helpers, then rendered inside ProjectTimeTracking.

Changes

Date Range Filters for Engagements and Operations

Layer / File(s) Summary
Date filter fields in search request builders
features/engagements/utils/engagements.ts, features/operations/utils/operationsPages.ts
buildEngagementSearchRequest and buildServiceRequestsPageCaseSearchRequest now pass startCreatedDate, endCreatedDate, startUpdatedDate, and endUpdatedDate from filter state into the API payload.
DateRangeFilter UI controls in EngagementsListSection
features/engagements/components/EngagementsListSection.tsx
Imports DateRangeFilter, extends countListSearchAndFilters to count date fields as active filters, adds alignItems="flex-end" to the filter grid, and renders "Created Date" and "Updated Date" range pickers wired to onFilterChange.

Time Cards CSV/PDF Export

Layer / File(s) Summary
Paginated fetchAllCaseTimeCards API
features/usage-metrics/api/fetchAllCaseTimeCards.ts
New function POSTs filters with limit/offset, validates responses, accumulates CaseTimeCard pages until total records or empty page signals completion, and returns the full list.
CSV/PDF row building and download utilities
features/project-details/utils/timeCardsCsvExport.ts
Defines TIME_CARDS_CSV_HEADERS, transforms CaseTimeCard[] into formatted rows with aggregated totals, generates date-stamped filenames, and triggers CSV/PDF downloads via shared download helpers.
TimeCardsCsvExportButton component
features/project-details/components/time-tracking/TimeCardsCsvExportButton.tsx
Renders an outlined button with a CSV/PDF menu; uses prefetched cards or calls fetchAllCaseTimeCards for the full dataset; guards against concurrent exports with isExportingRef; shows a spinner during export.
Wired into ProjectTimeTracking
features/project-details/components/time-tracking/ProjectTimeTracking.tsx
Renders TimeCardsCsvExportButton alongside the "Showing X of Y" label in a flex row, passing project details, date filters, fixed Approved state, prefetched cards, total count, and a disabled flag.

Sequence Diagram(s)

sequenceDiagram
  participant User
  participant TimeCardsCsvExportButton
  participant fetchAllCaseTimeCards
  participant Backend
  participant downloadTimeCardsCsv
  participant downloadTimeCardsPdf

  User->>TimeCardsCsvExportButton: clicks Export, selects CSV or PDF
  TimeCardsCsvExportButton->>TimeCardsCsvExportButton: set isExportingRef=true
  alt prefetchedCards sufficient
    TimeCardsCsvExportButton->>TimeCardsCsvExportButton: reuse prefetchedCards
  else full fetch needed
    loop paginated pages
      TimeCardsCsvExportButton->>fetchAllCaseTimeCards: POST filters + limit/offset
      fetchAllCaseTimeCards->>Backend: authenticated POST /time-cards
      Backend-->>fetchAllCaseTimeCards: page of CaseTimeCard[]
    end
    fetchAllCaseTimeCards-->>TimeCardsCsvExportButton: full CaseTimeCard[]
  end
  alt format = csv
    TimeCardsCsvExportButton->>downloadTimeCardsCsv: cards, filenamePrefix
  else format = pdf
    TimeCardsCsvExportButton->>downloadTimeCardsPdf: cards, filenamePrefix, projectName
  end
  TimeCardsCsvExportButton->>TimeCardsCsvExportButton: reset isExportingRef, clear exportingFormat
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Poem

🐇 Hop hop, dates now filter with flair,
Created and updated — a matching pair!
Time cards leap into CSV neat,
PDF columns aligned, oh so sweet.
The rabbit exports with one little click,
No more manual totals — that's the trick! 🌟

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Title check ✅ Passed The title accurately summarizes the main changes: date range filters for Service Requests and Engagements plus time tracking CSV/PDF export functionality.
Description check ✅ Passed The description provides a clear summary of changes with a files-changed table and explicitly identifies out-of-scope items, though it does not follow the full template structure with sections like Purpose, Goals, Approach, User stories, etc.
Docstring Coverage ✅ Passed Docstring coverage is 80.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.

@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.

Actionable comments posted: 2

🧹 Nitpick comments (2)
apps/customer-portal/webapp/src/features/engagements/utils/engagements.ts (1)

89-92: ⚡ Quick win

Normalize optional date fields before building the search payload.

These fields can be empty strings when a user clears a date filter. Coercing empty values to undefined avoids sending ambiguous date values to /cases/search.

Suggested change
-      startCreatedDate: filters.startCreatedDate,
-      endCreatedDate: filters.endCreatedDate,
-      startUpdatedDate: filters.startUpdatedDate,
-      endUpdatedDate: filters.endUpdatedDate,
+      startCreatedDate: filters.startCreatedDate || undefined,
+      endCreatedDate: filters.endCreatedDate || undefined,
+      startUpdatedDate: filters.startUpdatedDate || undefined,
+      endUpdatedDate: filters.endUpdatedDate || undefined,
🤖 Prompt for 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.

In `@apps/customer-portal/webapp/src/features/engagements/utils/engagements.ts`
around lines 89 - 92, In the search payload construction where the date fields
startCreatedDate, endCreatedDate, startUpdatedDate, and endUpdatedDate are being
assigned from the filters object, normalize these optional date fields to handle
empty strings. When any of these date filter values are empty strings
(indicating the user cleared the filter), convert them to undefined instead of
passing the empty string value. This prevents sending ambiguous date values to
the /cases/search endpoint. Apply this normalization logic to all four date
fields before assigning them to the search payload.
apps/customer-portal/webapp/src/features/operations/utils/operationsPages.ts (1)

317-320: ⚡ Quick win

Apply the same date-value normalization in service-request payloads.

Optional date fields should be omitted when empty instead of sent as "" values.

Suggested change
-      startCreatedDate: filters.startCreatedDate,
-      endCreatedDate: filters.endCreatedDate,
-      startUpdatedDate: filters.startUpdatedDate,
-      endUpdatedDate: filters.endUpdatedDate,
+      startCreatedDate: filters.startCreatedDate || undefined,
+      endCreatedDate: filters.endCreatedDate || undefined,
+      startUpdatedDate: filters.startUpdatedDate || undefined,
+      endUpdatedDate: filters.endUpdatedDate || undefined,
🤖 Prompt for 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.

In `@apps/customer-portal/webapp/src/features/operations/utils/operationsPages.ts`
around lines 317 - 320, The date fields (startCreatedDate, endCreatedDate,
startUpdatedDate, endUpdatedDate) in the service-request payload are being
included even when they contain empty string values. Apply conditional logic to
omit these optional date fields from the payload when they are empty, similar to
the normalization pattern used elsewhere in the codebase. Only include each date
field in the payload if it has a non-empty value.
🤖 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/customer-portal/webapp/src/features/project-details/components/time-tracking/TimeCardsCsvExportButton.tsx`:
- Line 59: The filenamePrefix assignment in TimeCardsCsvExportButton uses the
nullish coalescing operator which only falls back to projectId when projectName
is null or undefined, but not when it is an empty string. When projectName is an
empty string, the replace and toLowerCase operations still execute and return an
empty string, causing filenames to start with a dash instead of using the
projectId fallback. Update the filenamePrefix assignment to check for both
null/undefined AND empty strings before applying the replace and toLowerCase
transformations, ensuring that when projectName is falsy or empty after
trimming, it falls back to projectId as the prefix.

In
`@apps/customer-portal/webapp/src/features/project-details/utils/timeCardsCsvExport.ts`:
- Around line 54-56: The buildFilename function currently uses toISOString() to
generate the date portion of the filename, which returns UTC time and can result
in off-by-one day errors when the user's local timezone differs from UTC,
particularly around midnight. Replace the toISOString() call with a method that
retrieves the user's local date in YYYY-MM-DD format, such as using the local
date components (year, month, day) from the Date object padded appropriately to
ensure consistent formatting.

---

Nitpick comments:
In `@apps/customer-portal/webapp/src/features/engagements/utils/engagements.ts`:
- Around line 89-92: In the search payload construction where the date fields
startCreatedDate, endCreatedDate, startUpdatedDate, and endUpdatedDate are being
assigned from the filters object, normalize these optional date fields to handle
empty strings. When any of these date filter values are empty strings
(indicating the user cleared the filter), convert them to undefined instead of
passing the empty string value. This prevents sending ambiguous date values to
the /cases/search endpoint. Apply this normalization logic to all four date
fields before assigning them to the search payload.

In
`@apps/customer-portal/webapp/src/features/operations/utils/operationsPages.ts`:
- Around line 317-320: The date fields (startCreatedDate, endCreatedDate,
startUpdatedDate, endUpdatedDate) in the service-request payload are being
included even when they contain empty string values. Apply conditional logic to
omit these optional date fields from the payload when they are empty, similar to
the normalization pattern used elsewhere in the codebase. Only include each date
field in the payload if it has a non-empty value.
🪄 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: 6c44cd68-5a18-48f4-a432-7452df2f45dc

📥 Commits

Reviewing files that changed from the base of the PR and between f8563d9 and 78edc42.

📒 Files selected for processing (7)
  • apps/customer-portal/webapp/src/features/engagements/components/EngagementsListSection.tsx
  • apps/customer-portal/webapp/src/features/engagements/utils/engagements.ts
  • apps/customer-portal/webapp/src/features/operations/utils/operationsPages.ts
  • apps/customer-portal/webapp/src/features/project-details/components/time-tracking/ProjectTimeTracking.tsx
  • apps/customer-portal/webapp/src/features/project-details/components/time-tracking/TimeCardsCsvExportButton.tsx
  • apps/customer-portal/webapp/src/features/project-details/utils/timeCardsCsvExport.ts
  • apps/customer-portal/webapp/src/features/usage-metrics/api/fetchAllCaseTimeCards.ts

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants