Overview
The Wallet Page in Credenza is where users can manage their stored value, make purchases, and handle payment methods. It integrates real-time data to provide a seamless and personalized experience. This guide explains how to use the different features of the Wallet Page, including how to display it programmatically, select stored value amounts, and process payments.
Displaying Wallet Page programmatically
To display the Wallet page programmatically in Credenza, you can use the passport.openUI function. This function allows you to navigate to different pages within the application using code.
To open the Sign In page, use the following code snippet:
passport.openUI(Passport.pages.WALLET);
The passport.openUI function takes a parameter specifying the page to navigate to. In this case, Passport.pages.WALLET is used to specify the Wallet page.
Open Wallet page
To start Stored Value purchase process a user should select Wallet tab in Passport Widget.
Selecting Stored Value amount
Users begin by selecting an amount to purchase in the Buy Stored Value modal. They can choose from preset options like $10, $25, and $50, or enter a custom amount. After selecting, they click the Confirm purchase button.
Entering Payment Details
After confirming their stored value selection, users see the Order Summary modal. Here, they can choose a payment method such as Credit Card or Credenza Balance. For credit card payments, they'll input their card number and can use the Autofill link for convenience. They then click the Pay button.
Confirming Payment
Upon successful payment, a Success! modal confirms the transaction. Users can acknowledge the message and proceed with other activities.