feat: enhance OrganizationSettings to display Tax IDs alongside business name for improved billing clarity

This commit is contained in:
Usman Baig
2026-02-20 15:36:50 +01:00
parent 2d37d065c0
commit a4f2bebd10
2 changed files with 22 additions and 3 deletions

View File

@@ -856,9 +856,20 @@ export default function OrganizationSettings() {
Change plan Change plan
</Button> </Button>
</div> </div>
{subscription.business_name && ( {(subscription.business_name || (subscription.tax_ids && subscription.tax_ids.length > 0)) && (
<div className="px-6 pb-2 -mt-2 text-sm text-neutral-500 dark:text-neutral-400"> <div className="px-6 pb-2 -mt-2 space-y-1 text-sm text-neutral-500 dark:text-neutral-400">
Billing for: {subscription.business_name} {subscription.business_name && (
<div>Billing for: {subscription.business_name}</div>
)}
{subscription.tax_ids && subscription.tax_ids.length > 0 && (
<div>
Tax ID{subscription.tax_ids.length > 1 ? 's' : ''}:{' '}
{subscription.tax_ids.map((t) => {
const label = t.type === 'eu_vat' ? 'VAT' : t.type === 'us_ein' ? 'EIN' : t.type.replace(/_/g, ' ').toUpperCase()
return `${label} ${t.value}${t.country ? ` (${t.country})` : ''}`
}).join(', ')}
</div>
)}
</div> </div>
)} )}

View File

@@ -1,5 +1,11 @@
import { API_URL } from './client' import { API_URL } from './client'
export interface TaxID {
type: string
value: string
country?: string
}
export interface SubscriptionDetails { export interface SubscriptionDetails {
plan_id: string plan_id: string
subscription_status: string subscription_status: string
@@ -15,6 +21,8 @@ export interface SubscriptionDetails {
pageview_usage?: number pageview_usage?: number
/** Business name from Stripe Tax ID collection / business purchase flow (optional). */ /** Business name from Stripe Tax ID collection / business purchase flow (optional). */
business_name?: string business_name?: string
/** Tax IDs collected on the Stripe customer (VAT, EIN, etc.) for invoice verification. */
tax_ids?: TaxID[]
} }
async function billingFetch<T>(endpoint: string, options: RequestInit = {}): Promise<T> { async function billingFetch<T>(endpoint: string, options: RequestInit = {}): Promise<T> {