Conversation
… typing, classes and accessibility
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
…VGs, improving accessibility and layout. Adjusted font size and line height for better visual consistency.
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 151d6883d8
ℹ️ About Codex in GitHub
Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".
| value === null | ||
| ? `Informative alert will be sent to ${email} when this threshold is reached` | ||
| : `Informative alert will be sent to ${email} when the $${currencyFormatter.format(value)} threshold is reached` |
There was a problem hiding this comment.
Don’t describe alert delivery when no threshold is set
When value is null, there is no configured billing alert threshold, but this branch still tells users an alert will be sent when “this threshold” is reached. In that state no custom threshold exists, so the message is inaccurate and can make teams believe alerting is already configured; this should instead communicate that no alert is currently set.
Useful? React with 👍 / 👎.
| value === null | ||
| ? 'All API requests are blocked after reaching this limit' | ||
| : `All API requests are blocked after reaching $${currencyFormatter.format(value)}` |
There was a problem hiding this comment.
Don’t claim traffic is blocked when no limit exists
The value === null branch says all API requests are blocked after reaching “this limit,” but a null limit means usage is currently uncapped. Showing enforcement copy in the unset state is misleading and can cause users to think production traffic is being capped when it is not.
Useful? React with 👍 / 👎.
…onent and replacing it with UsageLimitForm and UsageAlertForm components. Introduce a new RemoveUsageLimitDialog for handling limit removals. Update the limit-section to utilize the new forms and adjust the UsageLimits component accordingly. Enhance currency formatting utilities for better input handling.
…n component and replacing it with separate UsageLimitSection and UsageAlertSection components. Update imports in UsageLimits to reflect the new structure. Enhance currency formatting in UsageLimitForm and UsageAlertForm for improved consistency.
…lity. Introduce shouldShowCancel logic to determine when the cancel button should be displayed, ensuring a clearer user experience when editing alert and limit values.
Introduce a new SetUsageLimitDialog component to facilitate setting usage limits within the dashboard. This dialog includes confirmation and cancellation options, enhancing user interaction when managing API limits. Update UsageLimitForm to integrate the new dialog and streamline the limit-setting process, replacing the previous confirmation dialog implementation.
…r displaying currency values. Update setDraftValue to format currency correctly when editing values, enhancing user experience and consistency in currency formatting.
…teraction. Introduce controlled dialog state management and update button icons for consistency. Improve editing experience by focusing input fields when editing, and streamline the handling of alert and limit removals.
…solidate loading and limits rendering logic into a single conditional block, and adjust layout for better responsiveness by changing max-width. This enhances user experience during data fetching.
Introduce a ref to track component mount status, ensuring that the effect for focusing the input field only runs after the component has mounted. This improves the user experience by preventing unintended focus behavior during the initial render.
…ests Introduce CurrencyInputSchema for validating positive whole USD amounts, along with utility functions sanitizeCurrencyInput and formatCurrencyValue. Implement unit tests for these utilities to ensure correct functionality, covering various input scenarios. Refactor UsageAlertForm and UsageLimitForm to utilize the new currency validation schema, enhancing user input handling and consistency in currency formatting.
Ticket