Skip to main content

Stored Value purchase

Overview

Stored Value Purchase involves managing payments effectively through a user interface and programmatically. With Credenza, you can proceed with a transaction using various UI elements designed for an intuitive experience. Additionally, the process can also be automated programmatically, ensuring flexibility and efficiency in handling payments.

Usage through UI

The Wallet page allows you to manage your stored value and monitor transactions. You can access this page using the user interface. For more detailed instructions, refer to the Wallet page article.

Usage without UI

The openUI function in Credenza's SDK is used to present a payment interface to users. This interface can be customized to include various payment methods and additional details. The function helps in initiating the payment process and displaying the necessary elements to the end-user.

Developers can specify the title, subtitle, supported payment methods, asset details, and optional email configuration in the openUI function. This allows for flexibility in how the payment UI is presented to users, ensuring that it meets specific requirements.

Here's a usage example:

typescript
import { Passport } from '@credenza3/passport-evm'

const passport = new Passport()
await passport.init()

passport.openUI(Passport.pages.PAYMENT, {
  title: 'Purchase Stored Value',
  subtitle: 'Select a payment method and complete your purchase',
  payments: {
    credenzaStoredValue: {
      disabled: true // this should be disabled, when purchasing credenza stored value, to disable payment with stored value
    },
    stripe: {
      disabled: false
    }
  },
  tokens: [
     {
       contractAddress: passport.contracts.erc20Cred.address,
       amount: 25,
     },
  ],
  email: {
    templateId: 'custom-template-id'  // Optional custom email template
  }
})