Как использовать Stripe Checkout более одного раза в моем представлении компонентов React?

Question

Итак, у меня есть 3 разные кнопки оплаты Stripe на одной и той же веб-странице, и я хочу, чтобы пользователь мог щелкнуть любую из них, чтобы произвести платеж. Вот мой код React переднего плана.

import React, {
  Component,
  Fragment
} from "react";
import StripeCheckout from "react-stripe-checkout";
import PropTypes from "prop-types";
import {
  connect
} from "react-redux";
import {
  handleToken
} from "../actions/";

class Payments extends Component {
  render() {
    const hide = true;
    return ( <
      Fragment >
      <
      StripeCheckout name = "Quiksession"
      description = "$25 for 25 credits"
      // The amount is set in cents 100 cents in $1
      amount = {
        2500
      }
      // Token is a callback function which ran once Stripe sends back after a
      // user makes a charge
      token = {
        (token) => {
          this.props.handleToken(token);
          // console.log(token);
        }
      }
      stripeKey = {
        process.env.REACT_APP_STRIPE_KEY
      } >
      <
      button style = {
        {
          backgroundColor: "#0071bc"
        }
      }
      className = "btn" >
      Add $25 <
      /button>{" "} <
      /StripeCheckout> <
      StripeCheckout name = "Quiksession"
      description = "$50 for 50 credits"
      // The amount is set in cents 100 cents in $1
      amount = {
        5000
      }
      // Token is a callback function which ran once Stripe sends back after a
      // user makes a charge
      token = {
        (token) => {
          this.props.handleToken(token);
          // console.log(token);
        }
      }
      stripeKey = {
        process.env.REACT_APP_STRIPE_KEY
      } >
      <
      button style = {
        {
          backgroundColor: "#0071bc"
        }
      }
      className = "btn" >
      Add $50 <
      /button>{" "} <
      /StripeCheckout> <
      StripeCheckout name = "Quiksession"
      description = "$75 for 75 credits"
      // The amount is set in cents 100 cents in $1
      amount = {
        7500
      }
      // Token is a callback function which ran once Stripe sends back after a
      // user makes a charge
      token = {
        (token) => {
          this.props.handleToken(token);
          // console.log(token);
        }
      }
      stripeKey = {
        process.env.REACT_APP_STRIPE_KEY
      } >
      <
      button style = {
        {
          backgroundColor: "#0071bc"
        }
      }
      className = "btn" >
      Add $75 <
      /button>{" "} <
      /StripeCheckout> <
      StripeCheckout name = "Quiksession"
      description = "$100 for 100 credits"
      // The amount is set in cents 100 cents in $1
      amount = {
        10000
      }
      // Token is a callback function which ran once Stripe sends back after a
      // user makes a charge
      token = {
        (token) => {
          this.props.handleToken(token);
          // console.log(token);
        }
      }
      stripeKey = {
        process.env.REACT_APP_STRIPE_KEY
      } >
      <
      button style = {
        {
          backgroundColor: "#0071bc"
        }
      }
      className = "btn" >
      Add $100 <
      /button> <
      /StripeCheckout> <
      /Fragment>
    );
  }
}

Payments.propTypes = {
  handleToken: PropTypes.func.isRequired,
};

export default connect(null, {
  handleToken
})(Payments);

А вот и код моего внутреннего узла

const keys = require("../config/keys");
const stripe = require("stripe")(keys.stripeSecretKey);
const requireLogin = require("../middlewares/requireLogin");

module.exports = (app) => {
  app.post("/api/stripe", requireLogin, async(req, res) => {
    // console.log(req.body);
    const charge25 = await stripe.charges.create({
      amount: 2500,
      currency: "usd",
      description: "$25 for 25 credits",
      source: req.body.id,
    });

    const charge50 = await stripe.charges.create({
      amount: 5000,
      currency: "usd",
      description: "$50 for 50 credits",
      source: req.body.id,
    });

    const charge75 = await stripe.charges.create({
      amount: 7500,
      currency: "usd",
      description: "$75 for 75 credits",
      source: req.body.id,
    });

    const charge100 = await stripe.charges.create({
      amount: 10000,
      currency: "usd",
      description: "$100 for 100 credits",
      source: req.body.id,
    });

    // console.log(charge);
    // req.user.credits comes from passport and ../models/User
    if (charge25) {
      req.user.receipt.push(charge25.receipt_url);
      if (charge25.billing_details.email === null) {
        req.user.receipt_email.push(charge25.billing_details.name);
      } else {
        req.user.receipt_email.push(charge25.billing_details.email);
      }
      req.user.credits += 25;
    } else if (charge50) {
      req.user.receipt.push(charge50.receipt_url);
      if (charge50.billing_details.email === null) {
        req.user.receipt_email.push(charge50.billing_details.name);
      } else {
        req.user.receipt_email.push(charge50.billing_details.email);
      }
      req.user.credits += 50;
    } else if (charge75) {
      req.user.receipt.push(charge75.receipt_url);
      if (charge75.billing_details.email === null) {
        req.user.receipt_email.push(charge75.billing_details.name);
      } else {
        req.user.receipt_email.push(charge75.billing_details.email);
      }
      req.user.credits += 75;
    } else if (charge100) {
      req.user.receipt.push(charge100.receipt_url);
      if (charge100.billing_details.email === null) {
        req.user.receipt_email.push(charge100.billing_details.name);
      } else {
        req.user.receipt_email.push(charge100.billing_details.email);
      }
      req.user.credits += 100;
    }

    const user = await req.user.save();

    res.send(user);
  });
};

Но когда я пытаюсь сделать заряд, я получаю это сообщение об ошибке.

(node:43034) UnhandledPromiseRejectionWarning: Error: You cannot use a Stripe token more than once: tok_0Gj8fyDfODoqRZJM4fGsPqCc.

Я могу создать только один публичный токен для тестирования. Так как я могу это исправить?