fix: Flag payment method display props as optional

Since this can be used as a top level component, it may not receive them. We had the right type guards in place already, but the types weren’t accurate.

Author: dawsontoth

src/features/organization/billing/paymentMethod/AddNewPaymentMethod.tsx

@@ -6,7 +6,7 @@ import { useParams } from '@tanstack/react-router';
 
 interface AddNewPaymentMethodProps {
 	readonly onPaymentAdded: (added: boolean) => void;
-	readonly onSaveStateForBillingRedirect: (redirecting: boolean) => void;
+	readonly onSaveStateForBillingRedirect?: (redirecting: boolean) => void;
 }
 
 export function AddNewPaymentMethod({ onPaymentAdded, onSaveStateForBillingRedirect }: AddNewPaymentMethodProps) {

src/features/organization/billing/paymentMethod/AddNewPaymentMethodForm.tsx

@@ -11,7 +11,7 @@ import { toast } from 'sonner';
 interface AddNewPaymentMethodFormProps {
 	readonly hasExistingBilling: boolean;
 	readonly onPaymentAdded: (added: boolean) => void;
-	readonly onSaveStateForBillingRedirect: (redirecting: boolean) => void;
+	readonly onSaveStateForBillingRedirect?: (redirecting: boolean) => void;
 }
 
 export function AddNewPaymentMethodForm({

src/features/organization/billing/paymentMethod/PaymentMethodsDisplay.tsx

@@ -16,14 +16,12 @@ import { useCallback, useState } from 'react';
 const route = getRouteApi('');
 
 interface PaymentMethodsDisplayProps {
-	onSaveStateForBillingRedirect: (redirecting: boolean) => void;
-	onReplacingPaymentMethod: (value: boolean) => void;
+	onSaveStateForBillingRedirect?: (redirecting: boolean) => void;
+	onReplacingPaymentMethod?: (value: boolean) => void;
 }
 
-export function PaymentMethodsDisplay({
-	onSaveStateForBillingRedirect,
-	onReplacingPaymentMethod,
-}: PaymentMethodsDisplayProps) {
+export function PaymentMethodsDisplay(props?: PaymentMethodsDisplayProps) {
+	const { onSaveStateForBillingRedirect, onReplacingPaymentMethod } = props ?? {};
 	const { organizationId } = route.useParams();
 	const { update } = useOrganizationPermissions(organizationId);
 	const { data: organization, refetch } = useQuery(getOrganizationQueryOptions(organizationId));