Processing Payments with GraphQL Mutations

Last edit: 

Contributors: 

This guide will teach you how to process payments with GraphQL mutations.

Requirements

It is recommended that you:

Steps

Processing payments with GraphQL mutations is a four-step process:

  1. Create Invoice Model
  2. Fetch stored Credit Card
  3. Create payment
  4. Charge payment with mutation

Step 1: Create Invoice Model

Usually when you create a payment in your system, you want to associate it with another object.
This association is saved on the payment object and it's called payable.
In this example you will create a custom model called Invoice - that accepts only an amount,
and you will use it as payment payable. Payable can have only one payment, when you try to create
multiple payments to the same object you will get an error. Start with a simple definition of the Custom Model:

name: invoice
properties:
- name: amount
  type: float

You now need to create the object of the Invoice model, you can do that with a mutation:

mutation create_invoice(
  $form_configuration_name: String = "create_invoice_form"
  $amount: String!
) {
  customization_create(
    form_configuration_name: $form_configuration_name
    customization: {
      properties: [{ name: "amount", value: $amount }]
      custom_model_type_name: "invoice"
    }
  ) {
    id
  }
}

The form for the above mutation is:

---
name: create_invoice_form
resource: Customization
resource_owner: anyone
fields:
  customizable_type:
  customizable_id:
  user_id:
  properties:
    amount:
      validates:
        presence: true
---

Now create invoice object with mutation execution:


{% execute_query "create_invoice", amount: "10", result_name: "i" %}
{% assign invoice = i.customization_create %}

Step 2: Fetch stored Credit Card

In Step 5 of Integrating Stripe you have learned how to
fetch data of Credit Cards saved on your instance. You will now use this data to create a new payment.
To do that, you need the id and payment_method_id that are saved on the CreditCard object.
The following lines assign that data to cc variable:


{% query_graph "get_credit_cards", user_id: context.current_user.id %}
{% assign cc = g.credit_cards.last %}

Step 3: Create payment

As you now have all the data required to create a new payment, you need to create the proper mutation and form:

mutation create_payment(
  $credit_card_id: ID
  $credit_card_token: String
  $payment_method_id: ID!
  $payable_id: ID!
  $payable_type: String = "Customization"
  $payer_id: ID!
  $total_amount: Float!
  $form_configuration_name: String = "create_payment_form"
) {
  payment_create(
    payment: {
      amount: {
        currency: "USD"
        total_amount: $total_amount
      }
      credit_card_id: $credit_card_id
      credit_card_token: $credit_card_token
      payment_method_id: $payment_method_id
      payable_type: $payable_type
      payable_id: $payable_id
      payer_id: $payer_id
    }
    form_configuration_name: $form_configuration_name
  ) {
    errors
    result {
      id
    }
  }
}

To make things simpler, USD is the default currency, but feel free to change it.

---
name: create_payment_form
resource: Payment
fields:
  credit_card_id:
  payment_method_id:
    validation:
      presence: true
  payable_type:
    validation:
      presence: true
  payable_id:
    validation:
      presence: true
  payer_id:
    validation:
      presence: true
  currency:
    validation:
      presence: true
  total_amount:
    validation:
      presence: true
      numericality:
        greater_than: 0
---

With the definition above, execute the query with the data that you've previously assigned to proper variables.


{% execute_query "create_payment",
  credit_card_id: cc.id,
  payment_method_id: cc.payment_method_id,
  payable_id: invoice.id,
  payable_type: "Customization",
  payer_id: context.current_user.id,
  total_amount: 10,
  result_name: "p"
%}

{% assign payment_id = p.payment_create.result.id %}

The result of the mutation will be saved to variable p as defined in the last line of query execution.
What you need to extract is payment_id that is used in the next step.

Step 4: Charge payment with GrahpQL mutation

As you now have payment saved in the system, you can at any time send a request to accually process and
charge the credit card assigned to it. In order to do it define charge_payment mutation and form:

mutation charge_payment($id: ID!) {
  payment_charge(id: $id, form_configuration_name: "charge_payment_form") {
    id
    paid_at
  }
}
---
name: charge_payment_form
resource: Payment
fields: {}
resource_owner: anyone
---

Now as everything is in place, execute the mutation and see the results on the Stripe dashboard.
Result of mutation is saved to p variable, so you can inspect if paid_at was set correctly.

{% execute_query "charge_payment", result_name: "p", id: payment_id %}

Congratulations! You now know how to use stored credit cards to process new payments.

Live example and source code

For code examples please go to this example project on Github.

Questions?

We are always happy to help with any questions you may have. Check out our Help page, or contact us.