Displaying transactions

In this section, we will set our tool to display Stipe transactions by a specific customer. For a start, drop a table component to the page, then select Stripe as the resource, and choose the Payments collection.

At this point, we can use the column selector again to filter out redundant data:

Let's specify a user for the transaction list

Let's pull a transaction list from Stripe for a specific selected customer from a table. You can use parameters passing a customer ID as a value for customer_id parameter.

Go to Component Settings -> Data -> Specify Parameters, choose the customer ID for the parameter as a value : Take value from components to select the component from which you want to get the customer ID value.

You will need to select the id field in the customer table (Take value from components -> Clicked Row -> Customers table -> id).

Display the exact number of rows

You can set pagination to specify the number of rows to be displayed per page:

Transaction Details

Let's add a Detail component to display the detailed information of the selected transaction.

1. Drag-and-drop the Title component to set the "Transaction Details" title.

2. Drag-and-drop the Detail component from the Data section to display the selected transaction:

3. Select the Stripe resource and the Payments collection to display the payment:

4. Just switch checkbox to select the fields you want to display:

5. Pass charge_id parameter to display selected transaction. We need to pass the parameter as take value from component.

6. Now let's add a dynamic field to display the transaction amount so that we can change it to refund the partial amount. Simply drag-and-drop Text Field component.

7. Set Data as take value from component to pass the amount value from the selected transaction:

8. Select transaction to get detail: