Edit billing details in Codecov UI

[aj-codecov]

Problem to Solve: As it stands today, if a user wants to edit any of their billing details they either need to go to Stripe (where they must be the original billing contact) or reach out to support - this creates roughly a third of support billing issues.

Proposed Solution: Enable more fields for users to edit in Codecov's UI.

Sentry Example: (conditionally shows) the TAX ID when the postal code is in a region where it exists

Figma: link

### Tasks
- [ ] https://github.com/codecov/engineering-team/issues/1685
- [ ] https://github.com/codecov/engineering-team/issues/1695
- [x] Update Stripe Packages in Gazebo + Pin Stripe Version
- [ ] https://github.com/codecov/engineering-team/issues/1866
- [ ] https://github.com/codecov/engineering-team/issues/1865
- [ ] https://github.com/codecov/engineering-team/issues/1864
- [ ] https://github.com/codecov/engineering-team/issues/1863
- [ ] https://github.com/codecov/engineering-team/issues/1861
- [ ] https://github.com/codecov/engineering-team/issues/1862
- [ ] https://github.com/codecov/engineering-team/issues/1867
- [ ] https://github.com/codecov/engineering-team/issues/1868
- [ ] https://github.com/codecov/engineering-team/issues/1869
- [ ] https://github.com/codecov/engineering-team/issues/1891
- [ ] https://github.com/codecov/engineering-team/issues/1973
- [ ] https://github.com/codecov/engineering-team/issues/1974
- [ ] https://github.com/codecov/engineering-team/issues/1978

[codecovdesign]

from our call @Adal3n3 assigning you:

• investigate stripe fields
• identify essential fields
• explore ux/ui and prep for dev ready with @ajay-sentry

[Adal3n3]

Please correct me if I'm wrong.. Stripe doesn't provide that tax ID field so we don't need that tax field.

[rohan-at-sentry]

Stripe allows for collection of taxes - either from their paid offering called Stripe Tax, or using the free Tax Rate api.

The Tax Rate api will require individually creating tax rates for address etc, whereas Stripe Tax looks it up automatically.

https://docs.stripe.com/payments/checkout/taxes?tax-calculation=stripe-tax

[Adal3n3]

• @ajay-sentry will do an investigation on the use of Stripe UI components. https://github.com/codecov/engineering-team/issues/1685
• This work will roll out to all paid plans (Sentry Pro, Pro, team and enterprise)
• note that we can do two API calls in a single CTA

[Adal3n3]

• We will use the Address Element from Stripe, and this is the component we are going to use: https://docs.stripe.com/elements/address-element/collect-addresses?platform=web&client=react
• No need phone number field.
• We can have the style align with our design system. Text Input with label component in Storybook: https://5fa9228f77839a00217f8a45-skelcuitot.chromatic.com/?path=/story/components-textinput--text-input-with-label
• Validation message comes from Stripe, they already highlight invalid value in red color text.

[Adal3n3]

Adding a note here for the tax field: @ajay-sentry will double check if its on the address component itself or something else. @Adal3n3 will need to update design to show the tax field.

[ajay-sentry]

On the subject of surfacing Tax Ids

• Tax Ids live on the invoice (so we can surface on invoice view)
• Tax ids can be set during checkout session
• Tax ids cannot be modified via any stripe components after the fact
• Tax ids can be update in the stripe dashboard after the fact by calling support Related link: https://docs.stripe.com/tax/checkout/tax-ids

Knowing the above, I think it'd make sense for us to:

• Surface the taxId somewhere on the invoice view page
• Add taxId field to checkout session
• Maybe some messaging to user if they want to change taxId? Idk if we have a general FAQ / support somewhere on billing but maybe this can go on there