chore(studio): tax ID banner copywriting (#43682)

## What kind of change does this PR introduce?

Copywriting improvements

## What is the current behavior?

The “missing tax ID” banner:

- Is longer than it needs to be
- Therefore overflows on smaller viewports
- Has unnecessarily qualifications despite having a dismiss button
- Has funky capitalization

## What is the new behavior?

- Tighter copywriting with less redundancy

| Before | After |
| --- | --- |
| <img width="1024" height="563" alt="AWS Healthy Toolshed
Supabase-8B1E57CE-72A6-4C7F-918F-71C1842CBDD3"
src="https://github.com/user-attachments/assets/755fd9ac-50e7-4540-9dd3-529e37bdeaff"
/> | <img width="1024" height="563" alt="AWS Healthy Toolshed
Supabase-A2B65D23-103A-4146-BE6A-DEAC592646D0"
src="https://github.com/user-attachments/assets/deefb639-0670-4d92-8b75-bc0080bfb587"
/> |
This commit is contained in:
Danny White authored and GitHub committed 2026-03-12 05:41:37 +00:00
1 parent fc7667462d
commit ff0edaafdb
1 file changed
+5 -5
@@ -1,4 +1,5 @@
import { LOCAL_STORAGE_KEYS } from 'common'
import { useOrganizationCustomerProfileQuery } from 'data/organizations/organization-customer-profile-query'
import { useRouter } from 'next/router'
import { TAX_IDS } from '@/components/interfaces/Organization/BillingSettings/BillingCustomerData/TaxID.constants'
@@ -6,7 +7,6 @@ import { HeaderBanner } from '@/components/interfaces/Organization/HeaderBanner'
import { InlineLink } from '@/components/ui/InlineLink'
import { useLocalStorageQuery } from '@/hooks/misc/useLocalStorage'
import { useSelectedOrganizationQuery } from '@/hooks/misc/useSelectedOrganization'
import { useOrganizationCustomerProfileQuery } from 'data/organizations/organization-customer-profile-query'
const SUPPORTED_TAX_ID_COUNTRIES = new Set(TAX_IDS.map((t) => t.countryIso2))
@@ -50,12 +50,12 @@ export const TaxIdBanner = () => {
return (
<HeaderBanner
variant="note"
title="Add a Tax ID to your organization"
title="Missing tax ID"
description={
<>
If you are a registered business, please{' '}
<InlineLink href={`/org/${slug}/billing#address`}>add a Tax ID</InlineLink> to your
billing settings. Not applicable for individual users.
Registered businesses should{' '}
<InlineLink href={`/org/${slug}/billing#address`}>add a tax ID</InlineLink> to their
billing details
</>
}
onDismiss={() => setIsDismissed(true)}