Access shop metafields

[meandillar]

We need a way to access metafields in the function Input other than those that are owned by the Delivery Customization - for example shop metafields. Is this possible?

Background
We have a Plus store and currently use a combination of JS in checkout.liquid and Shopify Scripts to achieve our shipping customisations. There are a few main things we do:

• Hide irrelevant shipping options based on customer postcode
• Rename shipping options according to the current time, based off some "shipping cutoff times" (for example depending on the shipping cutoff time the option title could display as "Same Day Delivery", "Next Day Delivery" or "Next Working Day")
• Display estimated delivery times as a subtitle
• Discount the shipping rate based on customer tags

It seems like we'll need to use a combination of a Delivery Customization, a Checkout UI Extension and a Shipping discount function to achieve these things.

Our Problem
The problem we're having is sharing our preset "shipping cutoff times" between the Delivery Customization and the Checkout UI Extension. Currently they are stored in metafields on the shop. We could theoretically access these via the storefront API in the Checkout UI Extension but not in the Delivery Customization. If we set the metafields on the Delivery Customization they are not accessible in the Checkout UI Extension because the Delivery Customization objects aren't available via Storefront API.

Any suggestions would be greatly appreciated :-)

[nickwesselman]

We have plans to add shop metafields to Function APIs, but meanwhile your best option is to duplicate the metafield value across the shop and the customization. I had to do something similar here when implementing a Checkout UI extension and discount which needed to share configuration.

[meandillar]

@nickwesselman That's great to hear and thanks for the suggestion. Doing this as a workaround also.

[nickwesselman]

This shipped in 2023-10 🎉

https://shopify.dev/changelog/new-fields-available-for-shopify-functions-input-queries

[meandillar]

@nickwesselman I can't get it to work. Stuck on Error 0: Cannot query field "shop" on type "Input".

I've updated my api version to 2023-10. pushed the config, deployed the app, uninstalled and reinstalled the app, checked in the partners dashboard and it shows the correct api version. Any ideas?

[daniel-elva]

@meandillar

you should be able to create a metafield defintion within your app, and then fetch that definition and its values in your front end.

I have something like this

async function getMetafieldDefinition(adminApiQuery) { const query = #graphql
query GetMetafieldDefinition {
metafieldDefinitions(first: 1, ownerType: DISCOUNT, namespace: "${METAFIELD_NAMESPACE}", key: "${METAFIELD_KEY}") {
nodes {
id
}
}
}
`;

const result = await adminApiQuery(query);

return result?.data?.metafieldDefinitions?.nodes[0];
}

async function createMetafieldDefinition(adminApiQuery) {
const definition = {
access: {
admin: "MERCHANT_READ_WRITE",
storefront: "PUBLIC_READ"
},
key: METAFIELD_KEY,
name: "Discount Configuration",
namespace: METAFIELD_NAMESPACE,
ownerType: "DISCOUNT",
type: "json",
};

const query = #graphql mutation CreateMetafieldDefinition($definition: MetafieldDefinitionInput!) { metafieldDefinitionCreate(definition: $definition) { createdDefinition { id } } } ;

const variables = { definition };
const result = await adminApiQuery(query, { variables });

return result?.data?.metafieldDefinitionCreate?.createdDefinition;
}`

and then you can obtain your matafield definition someething like this

id: "gid://shopify/MetafieldDefinition/[ID]

and then this query will return all the Metafield definition data
query MetafieldsCount($metafieldDefinitionId: ID!) { metafieldDefinition(id: $metafieldDefinitionId) { id metafieldsCount key namespace metafields(first: 5) { nodes{ key jsonValue } } } }