* Replace all usage of useProjectContext with useSelectedProjectQuery
* Replace all usage of useSelectedProject with useSelectedProjectQuery
* Replace all usage of useProjectByRef with useProjectByRefQuery
* Replace all usage of useSelectedOrganization with useSelectedOrganizationQuery
* Deprecate useSelectedProject, useSelectedOrganization, and useProjectByRef hooks
* Deprecate ProjecContext
* basic typography classes
* Clean up classes for where we use h1 tags
* Clean up classes for where we use h2, h3, h4
* Clean up classes for where we use h6
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
- Mandatory address input when adding a new payment method
- Removed the global HCaptcha store that wasn't used consistently and would sometimes block payment method changes
- Remove the custom billing address data & tax id form on org creation and plan upgrades in favour of Stripe's `AddressElement`
- Unify usage of the Stripe payment elements into a single component
- Customers can mark "Purchasing as a business" and will then be able to put down a tax id
- Adjusted billing address form to have better labels + tax id is filtered down to selected country
- Adjusted Stripe Elements styling to use floating labels (otherwise very hard to use with address element) + additional styling changes
- New flag to filter out payment methods that do not have an address for org upgrades and credit top ups, this will be enforced a few days after rolling this out
- Added Google Maps Places API integration for address auto-completion via Stripe AddressElement
- Upgraded Stripe dependencies
- Slight adjustments to styling of plan upgrade modal
When changing the plan while also creating a payment method in the same breath, some customers double-clicked the confirm button leading to a double-submission and possibly leading to a state where the customer gets charged, but the plan change is not going through.
* update cancellation reasons
* update texts
* randomise options and only single select reasons
* label overrides and reason readability
* minor fixes
* fix reasons sending
* Fixes
* Adjust tooltip side
* improve header description
* add a label for radio options
* wrap shuffledReasons in useState so it doesn't randomly shuffle
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
Co-authored-by: Alaister Young <a@alaisteryoung.com>
* When a Vercel customer downgrades in the middle of the billing cycle the get credits (no refund to card). To make that clearer, they need to be able to see their balance.
- Remove captcha for downgrades to Free, it is not needed
- Properly handle 3DS if customer has multiple payment methods
- Move payment method invalidation to react-query
* original files from previous PR
* get rid of router in jwt-secrets to make it show up
* rename jwt-secrets page to jwt-signing-keys
* add jwt-signing-keys query
* add legacy jwt signing keys query
* wire-up JwtSecretKeysTable with queries
* add jwt signing keys page to settings menu
* deduplicate labels, descriptions, etc
* add create, update jwt-signing-key mutations
* update types
* remove unused components, to be refactored later
* make everything into a mostly working state
* legacy migration added
* put jwt keys page like api keys
* fully migrate legacy jwt secret page
* fix prettier
* fix typecheck ts-expect-error
* rm unneeded file
* Fix compile errors.
* Rename the files and move them to the same folder.
* Merge the two constant files.
* Fix the imports.
* Fix a bug in the API keys page when opening it in a new tab.
* Change the page to be at /signing-keys
* Fix some minor types.
* Break apart some of the components in the signing keys UI.
* Use a feature banner for the initial action.
* Make a create key dialog and move functionality there.
* Fix some cosmetic issues.
* Minor cosmetic fixes.
* Remove extra keys in RQ cache.
* Add a missing link
* Add a banner when the feature flag is false.
* Minor type fix.
* more tiny type fix
* fix error on create standby key
* add alert to prevent revoking legacy jwt secret without disabling legacy api keys first
---------
Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
Disables organization selection if the org requires MFA but the user
does not have MFA enabled.
Add badges / hints to show that user has access to an Organization but
access is disabled because of MFA access requirement
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
This PR implements the new flow to confirm subscription upgrades using Orb pending changes. This is backwards compatible and based on a flag exposed by the backend (`subscriptionPreview.pending_subscription_flow`).
Just like the organization creation, the entire flow is slightly different - instead of creating a payment method separately, the payment method is added inline while doing the upgrade and then attached to the customer. If payment fails, the upgrade will not go through. If payment requires additional action, the user needs to confirm the payment before allowing the upgrade.
For testing the new flow locally, toggle the flag in `flags.ts` on the backend.
Changes include
- No longer rely on the `changeType` from the plans endpoint as this is regularly out-of-sync and displays wrong up/downgrade info due to race conditions
- `readOnly` mode for Stripe elements if anything is loading/submitting
- Reduced prop drilling for some components
- Hide payment method and address selection on downgrade
- Prefill email in Stripe form to set up Link faster or connect faster
- Overwrite a bit of styling so it looks less foreign
- Moved the Payment component from the NewOrgForm into it's own file and renamed it
Adds support for the new Orb pending subscription change flow that has been added to the backend.
By default, the new feature is disabled (enabled after merge on staging). If disabled, this should work just like before with the regular `confirmPayment` function that triggers 3DS if needed and properly lets a user confirm their additional factor.
With the new flag, we only create a payment method, as we will do another payment intent that is set up for future usage and that may require 3DS - so we avoid the possible double confirmation (setup confirmation + payment intent). The organization creation endpoint can either return a full organization (i.e. on Free Plan or immediate payment success) or a payment_intent_secret. In case of the secret being returned, we need to confirm the secret with the Stripe SDK.
Moved the Stripe Elements further down to avoid the entire form reloading (especially billing address) in case of a payment failure.
When translation tools go over prices, they wrongfully convert USD into other currencies without changing the price. $25 becomes Rp25 (Rupiah).
By using `translate='no'` we avoid the translation of pricing info. There are some tooltips left that are not covered yet, but this should be the majority already.
Kept the docs Pricing component as simple as possible, just wrapping in a span to avoid translation, not modifying any formatting.
We currently get support requests about adding or amending invoices due to no billing address being set. Changes in this PR:
- Unify tax id and billing address into a single form
- Add ability to set billing name that diverges from org name
- Add ability to set billing address & tax id during org creation (only paid plans)
- Add ability to set billing address & tax id during plan upgrade
- Merge billing & invoices page
- Moved credits under payment method management to keep it closer to invoices
- Reduced invoice list to 5 by default
- Added "Billing" navigation item for new org nav
- Rewrote invoices links to use new billing invoices section
- Permanent redirect for organization invoices page
- Read Replica and Branching Compute is now explicitly listed (previously Read Replica compute was not distinguishable)
- All usage items have a link to their respective docs
- Branching Compute is aggregated into a single line item to avoid listing dozens of branches (they are listed in the tooltip still)
- Displays basic discounts with a strike-through price
- For Replica+Compute, it specifically lists the projects as sub line items, whereas other line items are not broken down, it's shown on the tooltip
- Compute credits are a sub line item under compute, rather than having it separate
- Pricing is displayed on the tooltip
- Breakdown focuses on costs, rather than mixing cost, usage and line item pricing descriptions
- Avoid confusing users in the breakdown with hourly usage (for add-ons)
- Fixed number formatting to properly work with negative number and 0 (use 2 decimals)
- Upcoming Invoice Section is hidden for Free Plan users
* chore: only load data in modals when they're visible
* SidePanelGitHubRepoLinker
* scrolling is not my strong suit
* simple loading state for add new secret
* fix button width
* update to use shadcn
* fix ts
Joshen Lim