feat(frontend): add subscription limit info to Usage and Billing pages#6539
Merged
talissoncosta merged 10 commits intomainfrom Jan 20, 2026
Merged
Conversation
- Add card-based layout with icons to UsageChartTotals component - Display API calls limit alongside total usage (X / Y format) - Add Subscription Limits section to BillingTab showing all limits - Hide Audit Log and Feature History when not available (value = 0) Closes #5404 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
github-actions
Bot
added
front-end
Contributor
Docker builds report
|
- Create reusable LimitItem component to reduce code duplication - Remove inline CSS styles in favour of Bootstrap utility classes Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
github-actions
Bot
added
feature
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
github-actions
Bot
added
feature
Address PR feedback: - Feature History limit is now only shown when feature_versioning flag is enabled - null values already display as 'Unlimited' for all limit values Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
github-actions
Bot
added
feature
…values - Change condition from !!value to value !== 0 - null values now display as 'Unlimited' instead of being hidden - 0 values are still hidden (not available) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
github-actions
Bot
added
feature
github-actions
Bot
added
feature
- Fix organisationId type from string to number in OrganisationUsagePage - Remove unnecessary nested Row components in UsageChartTotals and BillingTab - Combine CSS classes for cleaner markup Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
github-actions
Bot
added
feature
Zaimwa9
requested changes
Jan 19, 2026
Contributor
Zaimwa9
left a comment
Zaimwa9
left a comment
There was a problem hiding this comment.
Couple of NITs. Maybe being ISO with white color is necessary, the 2 others I leave it up to you
- Add text-white class to checkmark icon container to fix colour inheritance - Add row-gap-4 for better vertical spacing in subscription limits section Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
…StatItem - Create reusable StatItem component in components/StatItem.tsx - Support both static display and interactive visibility toggle modes - Update UsageChartTotals to use StatItem with visibilityToggle prop - Update BillingTab to use StatItem for subscription limits display - Removes code duplication and ensures consistent styling Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
github-actions
Bot
added
feature
github-actions
Bot
added
feature
- Move LimitItem type outside component function in BillingTab - Extract TotalItem type in UsageChartTotals for better readability - Add visibility-checkbox CSS class to replace inline styles - Add accessibility attributes to visibility toggle: - role="checkbox", aria-checked, aria-label - tabIndex for keyboard navigation - onKeyDown handler for Enter/Space keys Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
talissoncosta
force-pushed
the
5404-add-subscription-limit-info-to-usage-and-billing
branch
from
168d7e4 to
846a94a
Compare
github-actions
Bot
added
feature
Zaimwa9
approved these changes
Jan 20, 2026
talissoncosta
deleted the
5404-add-subscription-limit-info-to-usage-and-billing
branch
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Thanks for submitting a PR! Please check the boxes below:
docs/if required so people know about the feature.Changes
Closes #5404
This PR adds subscription limit information to the Usage and Billing pages so users can see their API request quota alongside their current usage.
Usage Page (
/organisation/{id}/usage)max_api_callsUsageChartTotalscomponent to display limits alongside usage valuesBilling Tab (Organisation Settings)
max_api_calls)max_seats)max_projects) - shows "Unlimited" if nullaudit_log_visibility_days) - hidden if 0/unavailablefeature_history_visibility_days) - hidden if 0/unavailable, gated behindfeature_versioningflagShared StatItem Component
StatItemcomponent (web/components/StatItem.tsx)LimitItem(BillingTab) andLegendItem(UsageChartTotals) componentsHow did you test this code?
npm run dev/organisation/{id}/usage)🤖 Generated with Claude Code