// Credit card incurs a $3.00 processing fee.
const creditCardFee = {
  label: "Credit card processing fee",
  amount: { currency: "USD", value: "3.00" },
};

// Visa card incurs a $1.00 processing fee.
const visaFee = {
  label: "Visa processing fee",
  amount: { currency: "USD", value: "1.00" },
};

// Modifiers apply when the user chooses to pay with
// a credit card.
const modifiers = [
  {
    additionalDisplayItems: [creditCardFee],
    supportedMethods: "basic-card",
    total: {
      label: "Total due",
      amount: { currency: "USD", value: "53.00" },
    },
    data: {
      supportedTypes: ["credit"],
    },
  },
  {
    additionalDisplayItems: [visaFee],
    supportedMethods: "basic-card",
    total: {
      label: "Total due",
      amount: { currency: "USD", value: "54.00" },
    },
    data: {
      supportedNetworks: ["visa"]
    },
  },
];
Object.assign(details, { modifiers });