Could you clarify what you were hoping to accomplish with the API call to the Admin API? Are you trying to query or mutate information?
If you are just looking to get product information, or read data I would recommend using the Storefront API. Using the Admin API directly in the Checkout UI extension would reveal your access token.
import {useEffect, useState} from 'react';
import {
useApi,
reactExtension,
List,
ListItem,
} from '@shopify/ui-extensions-react/checkout';
export default reactExtension(
'purchase.checkout.block.render',
() =>
Thanks for the reply and example. I’m trying to do several stuff that needs Admin API. One of them is to mutate a Metafield that belongs to the Customer (since I can get the Customer Id during checkout)
If i am using Storefront API just to query the product information like you mentioned above. What is the method for authentication?. Not sure about the authentications for the Checkout ui extensions apps
Please let me know what other approach you took to figure this out?
I need to get the same thing done i.e., need to run a graqhQL query within the UI extension in order to get customer ID, but I am unable to run it from inside the extension.
FYI, I am trying to get customer ID of the customer who is interacting with the cart on store, so that I can fetch the tags on that customer using the ID, and then run a mutation to create a metafield and store the obtained customer tags in that metafield. I am doing this so that I can further use that metafield as a variable in one of my other gql queries which acts as in input for my function to hide Payment Methods on the checkout page.
At the moment, I am able to get the customer tags from admin API from outside of my extension, however, I am unable to figure out a way to fetch the exact customer which is interacting with the cart at the moment. For this I need to run query inside of extension. I am however open to other suggestions for implementing this.