GraphQL variables not working with arrays

[RDuthie]

Hi. I'm having an issue when trying to pass an array of slugs into an GraphQL query. For context I've got a array of blog post slugs I want GraphQL to filter by. Array would look something like ['value-1', 'value-2'] etc..

I tried everything, but for some reason HUBL doesn't translate the array into the filter.

The array is a variable defined in HUBL on top of my .graphql file.

Any help would be appreciated. Thanks

Example of code:

# $post_tag_slug: ['seo-paid-media'] //This array would ideally be split from an string received from query params.
query resourceCenterPosts($post_tag_slug: [String]) {
  BLOG {    
    post_collection(limit: 9, filter: {post_tag_slug__in: $post_tag_slug}) {
      items {
        id
        name
      }
    }
  }
}

[JEdwards71]

It’s pretty strict about how variables are structured, and in some cases, array inputs just don’t behave as expected—especially when passed in as variables rather than inline. One thing that helps is double-checking the expected input type in the schema and making sure the array is exactly in that format, both in shape and in how it’s passed. Sometimes wrapping or unwrapping it slightly can make the difference.

[phlp]

Here is my current solution.

It's ugly and stupid, but it works

# label: "Blog Post Tag Filter"
# $blog_id: "{{ blog.id }}"


# $tag0: {{ (request.query|split('&')|select('containing', 'tag' )|join('&')|replace('tag=', '')|split('&'))[0] || [] }}
# $tag1: {{ (request.query|split('&')|select('containing', 'tag' )|join('&')|replace('tag=', '')|split('&'))[1] || [] }}
# $tag2: {{ (request.query|split('&')|select('containing', 'tag' )|join('&')|replace('tag=', '')|split('&'))[2] || [] }}
# $tag3: {{ (request.query|split('&')|select('containing', 'tag' )|join('&')|replace('tag=', '')|split('&'))[3] || [] }}
# $tag4: {{ (request.query|split('&')|select('containing', 'tag' )|join('&')|replace('tag=', '')|split('&'))[4] || [] }}
# $tag5: {{ (request.query|split('&')|select('containing', 'tag' )|join('&')|replace('tag=', '')|split('&'))[5] || [] }}
# $tag6: {{ (request.query|split('&')|select('containing', 'tag' )|join('&')|replace('tag=', '')|split('&'))[6] || [] }}
# $tag7: {{ (request.query|split('&')|select('containing', 'tag' )|join('&')|replace('tag=', '')|split('&'))[7] || [] }}
# $tag8: {{ (request.query|split('&')|select('containing', 'tag' )|join('&')|replace('tag=', '')|split('&'))[8] || [] }}
# $tag9: {{ (request.query|split('&')|select('containing', 'tag' )|join('&')|replace('tag=', '')|split('&'))[9] || [] }}


query getPostByTagFilter($blog_id: String!, $tag0: String, $tag1: String, $tag2: String, $tag3: String, $tag4: String, $tag5: String, $tag6: String, $tag7: String, $tag8: String, $tag9: String) {
  BLOG {
    blogPosts: post_collection(
        filter: {
            content_group_id__eq: $blog_id,
            state__eq: "PUBLISHED",
            post_tag_slug__in: [$tag0, $tag1, $tag2, $tag3, $tag4, $tag5, $tag6, $tag7, $tag8, $tag9]
        },
        orderBy: publish_date__desc
    ) {
      items {
        tag_ids
        blog_tags {
          name
          id
        }
        name
        post_summary
        url
        featured_image
        featured_image_alt_text,
        publish_date
        state
        widgets
      }
      offset
      limit
      total
    }
  }
}

If 10 Filters by tag aren't enough, just add more. They are all optional

[phlp · Accepted solution]

And today I found a better solution:

#$filter_tag: {{ (request.query|split('&')|select('containing', 'tag' )|join('&')|replace('tag=', '')|split('&'))|length > 0 ? { "state__eq": "PUBLISHED", "content_group_id__eq": blog.id, "post_tag_slug__in": (request.query|split('&')|select('containing', 'tag' )|join('&')|replace('tag=', '')|split('&')) }|tojson : { "state__eq": "PUBLISHED", "content_group_id__eq": blog.id }|tojson }}

query getPostByFirstFilter($offset: Int!, $filter_tag: blog_post_filter) {
	BLOG {
		blogPostsByTag: post_collection(
			filter: $filter_tag,
			limit: 6,
			offset: $offset,
			orderBy: publish_date__desc
		) {
		items {
			blog_tags {
				name
			}
			name
			post_summary
			url
			featured_image
			featured_image_alt_text,
			publish_date
			state
			widgets
		}
		offset
		limit
		total
		}
	}
}

[RDuthie]

Thank you I'll give this a go and see how well it works.

[phlp]

@RDuthie I have the same problem. Did you find a solution?

I tried every combination, all the escaping-filters, … I found no way to get the array of tags as a variable in my query. I'm completly lost

[KhushbooRevOps]

Hi @RDuthie ,

If you're having trouble passing an array of slugs into a GraphQL query in HubL, here's a simple approach.

1. When you define an array of slugs in HubL and pass it to your GraphQL query, it might not be correctly translated into the format GraphQL expects.

2. Before passing the array to GraphQL, convert it into a string that GraphQL can parse. You can use HubL to join the array into a comma-separated string.

{% set slug_list = ['value-1', 'value-2'] %}
{% set slug_string = slug_list|join(',') %}

3. Use the string in your GraphQL query instead of the array.

query GetPosts {
posts(slugs: "{{ slug_string }}") {
title
slug
}
}

4. Make sure to test this setup to confirm that GraphQL correctly interprets the slug list.

If you need more help, let's talk!

Khushboo Pokhriyal

Growth & Operations

GroRapid Labs

LinkedIn | 9315044754 | Email | Website

[RDuthie]

Thanks for replying.

This doesn't seem to work at all. I think there's an issue with HUBL interpreting arrays as variables in .graphql files.

This of course works perfectly fine if I directly pass an array to the filter, but doesn't work if its passed from a parameter in the graphQL query.