Hello,So I am building a Shopify admin Purchase options extension .I have few questions and Issues if that can be helped
1: Do I need to install any other app to check if this is working ?
2: This repo GitHub - Shopify/subscriptions-reference-app: Shopify Subscriptions Reference app is kind of confusing and does not really work . Specifically this part
shopify app init --template https://github.com/Shopify/subscriptions-reference-app
3: I managed to work out PurchaseOptionsActionExtension.jsx and on handlesave() I have added data to metafield (I am not sure if its correct . Please check and let me know if I am in correct path).
function handleSave() {
const productId = data.selected[0].id;
const optionsToSave = { planName, merchantCode, discountType, deliveryOptions }; updatePurchaseOptions(productId, optionsToSave)
.then(() => {
console.log("Saved purchase options to metafield");
close();
})
.catch((err) => {
console.error("Failed to save purchase options:", err);
});}
and The Graphql code as below
export async function updatePurchaseOptions(productId, newOptions) {
return await makeGraphQLQuery(`mutation SetMetafield($namespace: String!, $ownerId: ID!, $key: String!, $type: String!, $value: String!) {
metafieldDefinitionCreate(
definition: {namespace: $namespace, key: $key, name: “Purchase Options”, ownerType: PRODUCT, type: $type, access: {admin: MERCHANT_READ_WRITE}}) { createdDefinition {
id
}}
metafieldsSet(metafields: [{ownerId:$ownerId, namespace:$namespace, key:$key, type:$type, value:$value}]) {
userErrors {
field
message
}}}`,
{
ownerId: productId,
namespace: “$app:purchase_options”,
key: “options”,
type: “json”,
value: JSON.stringify(newOptions),
} );
}
export async function getPurchaseOptions(productId) {
const res = await makeGraphQLQuery(
query Product($id: ID!) {
product(id: $id) {
metafield(namespace: "$app:purchase_options", key:"options") {
value
}
}
},
{ id: productId }
);
if (res?.data?.product?.metafield?.value) {
return JSON.parse(res.data.product.metafield.value);
}
}
async function makeGraphQLQuery(query, variables) {
const graphQLQuery = { query, variables };
const res = await fetch(“shopify:admin/api/graphql.json”, {
method: “POST”,
body: JSON.stringify(graphQLQuery),
});
if (!res.ok) {
console.error(“Network error”);
}
return await res.json();
}
I am unable to show the values as per Shopify Screenshot attached .
Only if I install Shopify Subscription app then only I am able to see this .
