How I can make a graphql mutation request inside Checkout UI Extension?

[Danyel1980]

Hello all,

in the documentation I see a lot of examples for graphql mutations but never a complete example with Shopify UI Extension React JS based.
Here is my example but It doesn`t work. I don`t know why:

function createDraftOrder() {
  query(
      `mutation ($input: DraftOrderInput!) {
          draftOrderCreate(input: $input) {
              draftOrder {
                  id
              }
          }
      }`,
      {
        "input": {
          "lineItems": [{
            "appliedDiscount": {
              "amount": "5.00",
              "description": "test modify lineitem price",
              "title": "modify lineitem price",
              "value": 5.00,
              "valueType": "FIXED_AMOUNT"
            },
            "variantId": "gid://shopify/ProductVariant/39803484209270",
            "quantity": 1
          }
          ],
          "purchasingEntity":{
            "customerId": "gid://shopify/Customer/5790884724854"
          }
        }
      },
  )
      .then(({data}) => {
      })
      .catch((error) => console.error(error));
}

Thanks

[lizk · Accepted solution]

Hi there 👋

From a Checkout UI extension you can make calls to to the Shopify Storefront API. These will be Queries only to retrieve information. 

From a Checkout UI extension it is also possible to make network requests to external services such as your apps server. 

At this time it is not currently possible to directly make GraphQL mutations to the Shopify Admin API from Checkout UI extensions.