Have your say in Community Polls: What was/is your greatest motivation to start your own business?
Our Partner & Developer boards on the community are moving to a brand new home: the .dev community forums! While you can still access past discussions here, for all your future app and storefront building questions, head over to the new forums.

Hiding Payment Methods based on Customer Tags

Hiding Payment Methods based on Customer Tags

munzahshah
Shopify Partner
6 0 0

Hi everyone, I am trying to implement the following feature in my app:

"The customer who is interacting with the store cart if contains [ABC] tag, then [XYZ] payment method should hide".

 

where [ABC] and [XYZ] represents a dynamic value provided by the merchant. Now the functionality is all implemented and will work fine as well, except for one thing that I am yet to figure out.

 

In my app extensions, I am running the following graphQL query. The hasAnyTag under buyerIdentity in customer gets a dynamic array of strings as customer tags coming from a variable which is coming from the metafield that I have created while creating mutation outside of my extension.

 

query RunInput($customerTags: [String!]) {
  cart {
    cost {
      totalAmount {
        amount
      }
      subtotalAmount {
        amount
      }
    }
    buyerIdentity {
      email
      phone
      isAuthenticated
      customer {
        id
        email
        hasAnyTag(tags: $customerTags)
      }
    }
    lines {
      merchandise {
        ... on ProductVariant {
          product {
            title
            isGiftCard
          }
        }
      }
    }
  }
  paymentMethods {
    id
    name
  }
  paymentCustomization {
    metafield(
      namespace: "$app:payment-customization"
      key: "function-configuration"
    ) {
      value
    }
  }
}

 


This is how I have queried the customerTags outside of my extension in the /app folder and stored it in customerTags variable:

 

const customerTagsResponse = await admin.graphql(
    `#graphql
        query getCustomerTags {
          customer(id: "gid://shopify/Customer/6618983006277") {
          email
          tags
        }
        }`,
  );

  const responseJson = await customerTagsResponse.json();
  const customerTags = responseJson.data.customer.tags;

 

 

This is how I am passing the customerTags to be created as a metafield along with other data while running create mutation of paymentCustomisation:

 

const paymentCustomizationInput = {
    functionId,
    title: `${ruleName}`,
    enabled: true,
    metafields: [
      {
        namespace: "$app:payment-customization",
        key: "function-configuration",
        type: "json",
        value: JSON.stringify({
          customerTags,
          ruleName,
          paymentMethod,
          statusValue,
          displayRules,
        }),
      },
    ],
  };

const response = await admin.graphql(
        `#graphql
        mutation createPaymentCustomization($input: PaymentCustomizationInput!) {
          paymentCustomizationCreate(paymentCustomization: $input) {
            paymentCustomization {
              id
            }
            userErrors {
              message
            }
          }
        }`,
        {
          variables: {
            input: paymentCustomizationInput,
          },
        },
      );

 

 

And finally this is how I updated my extension.toml to use this metafield to be used as a variable in my function input query (shared in first snippet):

 

[extensions.input.variables]
namespace = "$app:payment-customization"
key = "function-configuration"

 


Things are working perfectly fine upto here!

 

But what needs to change here is the customer ID being hard-coded in the graqphQL query. For testing purposes, I hardcoded a dummy customer ID to see if I could make metafields work in function input query:

 

 

query getCustomerTags {
          customer(id: "gid://shopify/Customer/6618983006277") {
          email
          tags
        }

 

 

However, since the test passed now. What I ideally want is to get the ID of the customer who is currently interacting with the cart and not a static ID. I have been looking into the docs for some time now but unable to figure out how I can make it work.

These are the questions in my mind:

  1. Should I not create customerTags metafield from outside of extension? If yes, how can I do that within the extension because I am not making any mutations within the extension.
  2. Should I query the customer tags within the extension? If yes, please provide a code snippet for heads up on this.
  3. Is there any way to pass the input query results to the files outside of extension folder? Because this way, I can query the customer ID from input query in run.graqphql and send the IDs to query running outside of extension.

    If there is any other viable solution for this, please feel free to pitch that. I am new to Shopify App development and have been looking into this for the past 3 days now. Any kind of help is appreciated!

Thank you in advance!

Best,
Munzah Shah
Replies 0 (0)