-
Notifications
You must be signed in to change notification settings - Fork 619
[Dashboard] Sort usage categories by total amount in descending order #7314
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[Dashboard] Sort usage categories by total amount in descending order #7314
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
|
WalkthroughThe code now sorts usage categories by their subtotal amount in descending order before rendering. This is achieved by summing the Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant PageComponent
participant UsageData
User->>PageComponent: Request usage page
PageComponent->>UsageData: Fetch usagePreview.data.result
PageComponent->>PageComponent: Calculate subtotal for each category
PageComponent->>PageComponent: Sort categories by subtotal (desc)
PageComponent->>User: Render sorted usage categories
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
⏰ Context from checks skipped due to timeout of 90000ms (8)
✨ Finishing Touches
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
How to use the Graphite Merge QueueAdd either label to this PR to merge it via the merge queue:
You must have a Graphite account in order to use the merge queue. Sign up using this link. An organization admin has enabled the Graphite Merge Queue in this repository. Please do not merge from GitHub as this will restart CI on PRs being processed by the merge queue. This stack of pull requests is managed by Graphite. Learn more about stacking. |
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## main #7314 +/- ##
=======================================
Coverage 55.57% 55.57%
=======================================
Files 909 909
Lines 58673 58673
Branches 4158 4158
=======================================
Hits 32607 32607
Misses 25959 25959
Partials 107 107
🚀 New features to boost your workflow:
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Bug: API Data Mutation Causes Unpredictable Behavior
The sort() method mutates the original usagePreview.data.result array in place. As this is API response data, this violates immutability principles and can cause unexpected side effects if the data is used elsewhere or cached. A copy should be created before sorting, e.g., [...usagePreview.data.result].sort().
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/page.tsx#L64-L75
BugBot free trial expires on June 14, 2025
You have used $0.00 of your $100.00 spend limit so far. Manage your spend limit in the Cursor dashboard.
Was this report helpful? Give feedback by reacting with 👍 or 👎
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/page.tsx(2 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (5)
- GitHub Check: E2E Tests (pnpm, vite)
- GitHub Check: E2E Tests (pnpm, webpack)
- GitHub Check: Size
- GitHub Check: Lint Packages
- GitHub Check: Analyze (javascript)
🔇 Additional comments (1)
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/page.tsx (1)
128-128: LGTM! Rendering update correctly uses sorted data.The change properly integrates with the sorting logic to display categories in descending order by total amount, which aligns with the PR objective.
size-limit report 📦
|
Merge activity
|
…#7314) # Sort usage categories by total amount This PR sorts the usage categories displayed on the team usage page by their total amount in descending order. Categories with higher total costs will now appear at the top of the list, making it easier for users to identify their most significant expenses at a glance. The implementation: - Creates a `sortedCategories` array by sorting the usage preview data - Sorts based on the sum of `amountUsdCents` for each category's line items - Uses the sorted array in the render function instead of the original data <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Enhancements** - Usage categories are now displayed in descending order based on their subtotal amounts, making it easier to identify the highest usage categories at a glance. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
904a0ed to
56d27d4
Compare

Sort usage categories by total amount
This PR sorts the usage categories displayed on the team usage page by their total amount in descending order. Categories with higher total costs will now appear at the top of the list, making it easier for users to identify their most significant expenses at a glance.
The implementation:
sortedCategoriesarray by sorting the usage preview dataamountUsdCentsfor each category's line itemsSummary by CodeRabbit
PR-Codex overview
This PR focuses on sorting the categories in the usage preview by their sub-total before rendering them in the UI.
Detailed summary
sortedCategoriesconstant to sortusagePreview.data.resultbased on the total oflineItems.amountUsdCents.sortedCategoriesinstead ofusagePreview.data.result.