ref: Use narrower type for next bill preview API

static/gsApp/utils/billing.tsx

@@ -32,9 +32,8 @@ import type {
   BillingMetricHistory,
   BillingStatTotal,
   EventBucket,
-  InvoiceItem,
+  InvoiceItemType,
   Plan,
-  PreviewInvoiceItem,
   ProductTrial,
   Subscription,
 } from 'getsentry/types';
@@ -798,10 +797,10 @@ export const RETENTION_SETTINGS_CATEGORIES = new Set([
   DataCategory.TRANSACTIONS,
 ]);
 
-export function getCredits({
+export function getCredits<T extends {amount: number; type: InvoiceItemType}>({
   invoiceItems,
 }: {
-  invoiceItems: InvoiceItem[] | PreviewInvoiceItem[];
+  invoiceItems: T[];
 }) {
   return invoiceItems.filter(
     item =>
@@ -820,7 +819,7 @@ export function getCreditApplied({
   invoiceItems,
 }: {
   creditApplied: number;
-  invoiceItems: InvoiceItem[] | PreviewInvoiceItem[];
+  invoiceItems: Array<{amount: number; type: InvoiceItemType}>;
 }) {
   const credits = getCredits({invoiceItems});
   if (credits.some(item => item.type === 'balance_change')) {
@@ -833,10 +832,10 @@ export function getCreditApplied({
  * Returns extra fees included in the invoice or preview data, such as tax
  * or cancellation fees.
  */
-export function getFees({
+export function getFees<T extends {amount: number; type: InvoiceItemType}>({
   invoiceItems,
 }: {
-  invoiceItems: InvoiceItem[] | PreviewInvoiceItem[];
+  invoiceItems: T[];
 }) {
   return invoiceItems.filter(
     item =>
@@ -848,10 +847,10 @@ export function getFees({
 /**
  * Returns ondemand invoice items from the invoice or preview data.
  */
-export function getOnDemandItems({
+export function getOnDemandItems<T extends {amount: number; type: InvoiceItemType}>({
   invoiceItems,
 }: {
-  invoiceItems: InvoiceItem[] | PreviewInvoiceItem[];
+  invoiceItems: T[];
 }) {
   return invoiceItems.filter(item => item.type.startsWith('ondemand'));
 }

static/gsApp/views/amCheckout/components/checkoutSuccess.tsx

@@ -519,7 +519,7 @@ export function CheckoutSuccess({
 
   const isImmediateCharge = !!invoice; // if they paid for something now, the changes are effective immediately
   const data = isImmediateCharge ? invoice : previewData;
-  const invoiceItems = isImmediateCharge
+  const invoiceItems: Array<InvoiceItem | PreviewInvoiceItem> = isImmediateCharge
     ? invoice.items
     : (previewData?.invoiceItems ?? []);
   const planItem = invoiceItems.find(item => item.type === 'subscription');

static/gsApp/views/subscriptionPage/headerCards/nextBillCard.tsx

@@ -12,7 +12,7 @@ import {getApiUrl} from 'sentry/utils/api/getApiUrl';
 import {getDaysSinceDate} from 'sentry/utils/getDaysSinceDate';
 import {useApiQuery} from 'sentry/utils/queryClient';
 
-import type {PreviewData, Subscription} from 'getsentry/types';
+import type {PreviewInvoiceItem, Subscription} from 'getsentry/types';
 import {
   displayBudgetName,
   getCreditApplied,
@@ -22,6 +22,16 @@ import {
 import {displayPriceWithCents} from 'getsentry/views/amCheckout/utils';
 import {SubscriptionHeaderCard} from 'getsentry/views/subscriptionPage/headerCards/subscriptionHeaderCard';
 
+type NextBillInvoiceItem = Pick<PreviewInvoiceItem, 'amount' | 'type' | 'description'>;
+
+type NextBillPreview = {
+  billedAmount: number;
+  creditApplied: number;
+  effectiveAt: string;
+  invoiceItems: NextBillInvoiceItem[];
+  isAnnual: boolean;
+};
+
 export function NextBillCard({
   subscription,
   organization,
@@ -33,7 +43,7 @@ export function NextBillCard({
     data: nextBill,
     isLoading,
     isError,
-  } = useApiQuery<PreviewData>(
+  } = useApiQuery<NextBillPreview>(
     [
       getApiUrl('/customers/$organizationIdOrSlug/subscription/next-bill/', {
         path: {organizationIdOrSlug: organization.slug},