diff --git a/apps/studio/components/interfaces/Organization/BillingSettings/BillingBreakdown/UpcomingInvoice.tsx b/apps/studio/components/interfaces/Organization/BillingSettings/BillingBreakdown/UpcomingInvoice.tsx index 4b7feab3e57..d9405b96769 100644 --- a/apps/studio/components/interfaces/Organization/BillingSettings/BillingBreakdown/UpcomingInvoice.tsx +++ b/apps/studio/components/interfaces/Organization/BillingSettings/BillingBreakdown/UpcomingInvoice.tsx @@ -288,20 +288,23 @@ const UpcomingInvoice = ({ slug }: UpcomingInvoiceProps) => { {formatCurrency(upcomingInvoice?.amount_total) ?? '-'} - - - Projected Costs - - Projected costs at the end of the billing cycle. Includes predictable costs - for Compute Hours, IPv4, Custom Domain and Point-In-Time-Recovery, but no - costs for metrics like MAU, storage or function invocations. Final amounts may - vary depending on your usage. - - - - {formatCurrency(upcomingInvoice?.amount_projected) ?? '-'} - - + + {upcomingInvoice?.amount_projected && ( + + + Projected Costs + + Projected costs at the end of the billing cycle. Includes predictable costs + for Compute Hours, IPv4, Custom Domain and Point-In-Time-Recovery, but no + costs for metrics like MAU, storage or function invocations. Final amounts + may vary depending on your usage. + + + + {formatCurrency(upcomingInvoice.amount_projected) ?? '-'} + + + )}