stripe-react-serverless-41.tsx

const handleRetryPayment = async () => {
  if (!stripe || !elements) {
    return;
  }

  const invoiceID = localStorage.getItem('latest_invoice_id');

  try {
    if (!invoiceID) {
      throw Error('Could not process payment. Please refresh and try again.');
    }

    const { error, paymentMethod } = await stripe.createPaymentMethod({
      type: 'card',
      card: elements.getElement(CardNumberElement) as any,
      billing_details: {
        name: nameOfCard,
      },
    });

    if (error || !paymentMethod) {
      throw Error(error?.message || 'Something is not right...');
    }

    const customerID = await StripeManager.getStripeCustomerID();

    if (!customerID) {
      throw Error('Could not identify customer');
    }

    const paymentID = paymentMethod.id;
    await StripeManager.retryInvoice(customerID, paymentID, invoiceID);

    localStorage.removeItem('latest_invoice_id');

  } catch (error) {
    console.error(error);
    // Let the user know that something went wrong here...
  }
};