Skip to content

feat(sdk): add sorting + RQL infinite loading to views-new invoices#1553

Merged
paanSinghCoder merged 13 commits intomainfrom
feat/add-sorting-and-pagination-invoices
Apr 22, 2026
Merged

feat(sdk): add sorting + RQL infinite loading to views-new invoices#1553
paanSinghCoder merged 13 commits intomainfrom
feat/add-sorting-and-pagination-invoices

Conversation

@paanSinghCoder
Copy link
Copy Markdown
Contributor

@paanSinghCoder paanSinghCoder commented Apr 20, 2026

Summary

  • Swap views-new billing `Invoices` component from the plain `listInvoices` RPC to `FrontierServiceQueries.searchOrganizationInvoices` with `useInfiniteQuery` (server-mode pagination).
  • Enable server-side sorting on Date, Status, and Amount columns via `<DataTable.Toolbar />` + DisplaySettings.
  • Default sort: `createdAt desc` (matching the admin invoices view).
  • `listInvoices` call remains in `billing-view.tsx` to feed `PaymentIssue` (which needs `dueDate`/`hostedUrl` not present in the RQL response shape).
  • Duplicate `connect-pagination.ts` and `transform-query.ts` into `sdk/react/utils/` (kept independent from `sdk/admin/utils/` — the admin and react entrypoints deploy separately, so utilities can't be shared via direct imports).
Screen.Recording.2026-04-20.at.1.14.52.PM.mov

Field mapping

The RQL response (`OrganizationInvoice`) has a trimmed projection vs the full `Invoice`:

  • `effectiveAt` (with draft → `dueDate` fallback) → `createdAt`
  • `hostedUrl` → `invoiceLink`
    Other fields (`state`, `amount`, `currency`) map 1:1.

Depends on

Test plan

  • `pnpm run build` (web turbo) passes
  • `docker-compose build` succeeds against the local proton tarball
  • Manual: change sort via DisplaySettings; Reset to default snaps back to createdAt desc
  • Manual: scroll triggers `fetchNextPage` (infinite loading)
  • Manual: PaymentIssue banner still fires for past-due subscriptions (uses the untouched `listInvoices` call)

🤖 Generated with Claude Code

paanSinghCoder and others added 2 commits April 17, 2026 16:42
Move the RPC from AdminService to FrontierService so org admins (not only
platform superusers) can list their own org's invoices. Matches the gate
pattern already used by FrontierService/ListInvoices (UpdatePermission on
the org namespace). Superusers still pass via the standard interceptor
bypass.

- Bump PROTON_COMMIT to pick up the proto move (raystack/proton#476).
- Regenerate proto/v1beta1 via `make proto`.
- Swap authorization.go entry from IsSuperUser to IsAuthorized(org, UpdatePermission).
- Switch the admin dashboard frontend from AdminServiceQueries to
  FrontierServiceQueries; request/response shape is unchanged.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@vercel
Copy link
Copy Markdown

vercel Bot commented Apr 20, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
frontier Ready Ready Preview, Comment Apr 22, 2026 9:11am

@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented Apr 20, 2026

📝 Walkthrough

Summary by CodeRabbit

  • New Features

    • Invoice list now uses server-driven infinite pagination with load-more behavior.
    • Invoice rows now link directly to invoice pages.
  • Enhancements

    • Status column adds grouping indicators, sorting, and hide/show controls.
    • Additional invoice statuses supported (draft, void, uncollectible).
  • Bug Fixes / UX

    • Improved error handling and a dedicated error empty state when invoice retrieval fails.

Walkthrough

Updates Proton commit in Makefile, adds RQL React utilities for pagination and query transformation, extends invoice state constants, and refactors the Invoices component to internally perform server-backed infinite loading via useInfiniteQuery (BillingView stops passing invoices/isLoading).

Changes

Cohort / File(s) Summary
Build Configuration
Makefile
Updated PROTON_COMMIT hash used for downloading Proton archive (changes protobuf generation input).
React Utilities
web/sdk/react/utils/connect-pagination.ts, web/sdk/react/utils/transform-query.ts
Added pagination helpers (DEFAULT_PAGE_SIZE, getConnectNextPageParam, getGroupCountMapFromFirstPage) and transformDataTableQueryToRQLRequest plus TransformOptions for mapping DataTable queries to RQL requests.
Constants
web/sdk/react/utils/constants.ts
Extended INVOICE_STATES to include DRAFT, VOID, and UNCOLLECTIBLE.
Billing Components
web/sdk/react/views-new/billing/billing-view.tsx, web/sdk/react/views-new/billing/components/invoices.tsx
BillingView stops supplying invoices/isLoading; Invoices converted to internal server-backed infinite-query flow, owns DataTableQuery state, debounces and transforms queries, handles pagination/error empty states, and changed column accessors/types.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

Suggested reviewers

  • rohanchkrabrty
  • rohilsurana
🚥 Pre-merge checks | ✅ 2
✅ Passed checks (2 passed)
Check name Status Explanation
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
⚔️ Resolve merge conflicts
  • Resolve merge conflict in branch feat/add-sorting-and-pagination-invoices

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.

@coveralls
Copy link
Copy Markdown

coveralls commented Apr 20, 2026

Coverage Report for CI Build 24770144522

Coverage remained the same at 42.228%

Details

  • Coverage remained the same as the base build.
  • Patch coverage: No coverable lines changed in this PR.
  • No coverage regressions found.

Uncovered Changes

No uncovered changes found.

Coverage Regressions

No coverage regressions found.


Coverage Stats

Coverage Status
Relevant Lines: 36895
Covered Lines: 15580
Line Coverage: 42.23%
Coverage Strength: 11.92 hits per line

💛 - Coveralls

Base automatically changed from refactor/search-org-invoices-to-frontier-service to main April 20, 2026 08:53
Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 3


ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 822a8b82-d707-4637-b968-776c4e14c15c

📥 Commits

Reviewing files that changed from the base of the PR and between cd1a62d and 1b8a353.

📒 Files selected for processing (6)
  • Makefile
  • web/sdk/react/utils/connect-pagination.ts
  • web/sdk/react/utils/constants.ts
  • web/sdk/react/utils/transform-query.ts
  • web/sdk/react/views-new/billing/billing-view.tsx
  • web/sdk/react/views-new/billing/components/invoices.tsx

Comment thread web/sdk/react/utils/connect-pagination.ts
Comment thread web/sdk/react/views-new/billing/components/invoices.tsx Outdated
Comment thread web/sdk/react/views-new/billing/components/invoices.tsx
Comment thread web/sdk/react/views-new/billing/components/invoices.tsx
Comment thread web/sdk/react/views-new/billing/components/invoices.tsx Outdated
Comment thread web/sdk/react/views-new/billing/components/invoices.tsx Outdated
Comment thread web/sdk/react/views-new/billing/components/invoices.tsx
Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

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

♻️ Duplicate comments (2)
web/sdk/react/views-new/billing/components/invoices.tsx (2)

38-41: ⚠️ Potential issue | 🟠 Major

Seed INITIAL_QUERY with DEFAULT_SORT.

defaultSort only configures the UI; the initial RQL request built from INITIAL_QUERY has no sort, so the first page loads unsorted until the user interacts with the table. Including sort: [DEFAULT_SORT] here ensures the first request is deterministically created_at desc.

Proposed fix
 const INITIAL_QUERY: DataTableQuery = {
   offset: 0,
-  limit: DEFAULT_PAGE_SIZE
+  limit: DEFAULT_PAGE_SIZE,
+  sort: [DEFAULT_SORT]
 };

168-181: ⚠️ Potential issue | 🟠 Major

Zero-amount invoices are no longer filtered out.

The previous listInvoices call used nonzeroAmountOnly: true, but SearchOrganizationInvoices has no equivalent parameter and this RQL query does not include an amount filter. Either add a filter clause for amount != 0 to the initial query or extend the proto/handler to support nonzero_amount_only.


ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 3a4d5199-4d41-4911-bae1-2ad0b06e2f24

📥 Commits

Reviewing files that changed from the base of the PR and between 1b8a353 and afbedcf.

📒 Files selected for processing (1)
  • web/sdk/react/views-new/billing/components/invoices.tsx

@paanSinghCoder paanSinghCoder merged commit cbf83ad into main Apr 22, 2026
8 checks passed
@paanSinghCoder paanSinghCoder deleted the feat/add-sorting-and-pagination-invoices branch April 22, 2026 09:15
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.

3 participants