supabase / supabase / 21811647844

73%

push

github

Add flag disabled UI handler for code redeem page (#42591)

## Context

Adds a UI state for when the feature flag for code redeem is disabled
<img width="1270" height="424" alt="image"
src="https://github.com/user-attachments/assets/90e97869-f1e5-456b-9170-4a0a576f1064"
/>

## Other changes involved

Mostly refactor + clean up here
- Pass `onClick` event to `OrganizationCard`, rather than declaring an
extra parent `div` to handle the click event
- Use `Admonition` instead of the `Alert` components within
`CreditCodeRedemption`
- Adjust element semantics in `CreditCodeRedemption` (Opting for `p`
instead of `h4` and `h1` to show credit related information)
- Use `UpgradePlanButton` component for upgrade CTA (Handles behaviour
depending if user has perms to update plan of the organization)
- Use `TimestampInfo` component for expires at
- Fix error handling when calling `redeemCode` (use `mutate` instead of
`mutateAsync` which requires a try catch)

## To Test

- [ ] Need to verify that the `TimestampInfo` component renders
correctly after redeeming a code

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Organization selection with modal-driven credit code redemption and
URL prefill.
* Upgrade button accepts an organization slug and integrates into the
upgrade flow.
* Organization cards support an optional click handler for custom
interactions.

* **UI/UX Improvements**
* Success/error messaging switched to admonition styling; expiry dates
shown with timestamps.
* Horizontal form layout, medium dialog sizing, compact balance/code
presentation, and invisible CAPTCHA with reset on success.
  * Feature gated by a flag with clearer loading/error states.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

714 of 822 branches covered (86.86%)

Branch coverage included in aggregate %.

2641 of 4263 relevant lines covered (61.95%)

115.08 hits per line