How to display all unique filters

[felpsio]

Hi,

I'm having two problems related to filters:

Get all the unique filters

• Let's suppose I'm selling t-shirts with the colors: blue, green and the sizes: M and G.
• I would like to display all these possible values in the store without hardcoding. It would be something like a menu:

Filters Menu
  - color
    - [ ] green
    - [ ] blue
  - size
    - [ ] M
    - [ ] G

Is there a way to get all these possible filters without having to query all the products and parsing the array?

Filter by Metafield

• If my products have a metafield like "color". Is there a way to query all products that have "color: blue" without using collections or tags?
• I'm using a good number of metafields for each products. Being able to query using metafields would be pretty helpful.

PS. I checked the Search and Discovery App (https://help.shopify.com/en/manual/online-store/search-and-discovery). But the docs doesn't make clear how you could use it in a hydrogen app.

[blittle]

Yes, you can filter products by using a productFilter for productMetafield: https://shopify.dev/docs/api/storefront/2023-07/queries/search#argument-search-productfilters

[felpsio]

@blittle I'm trying to use the API you sent me. But I just noticed that the search query was only introduced in 2023/07. If I go to 2023/04 it doesn't exist on the docs.

When I cloned my project from the hydrogen starter it was still 2023-04. Do we need to do anything special to update the graphql API and types?

I just upgrade all my packages and I can't see the query Search on http://localhost:3000/graphiql.

I'm using:

"@shopify/cli-hydrogen": "^5.1.1",
"@shopify/hydrogen": "^2023.7.1",
"@shopify/remix-oxygen": "^1.1.2",

and I'm trying to run the example of the docs:

{
query searchProducts($query: String!, $first: Int) {
search(query: $query, first: $first, types: PRODUCT) {
  edges {
    node {
      ... on Product {
        id
        title
      }
    }
  }
}
}

}

I'm getting:

{
  "errors": [
    {
      "message": "syntax error, unexpected VAR_SIGN at [2, 24]",
      "locations": [
        {
          "line": 2,
          "column": 24
        }
      ]
    }
  ]
}

Also I can't see anything related when I click on the docs of the graphql editor

[felpsio]

Never mind. I figured out. I had to update a variable in .env as well and it solved it :)

[felpsio]

Thanks @blittle :). But it's possible to query all possible filters?

Like: query all distinct values for the metafield color?

[juanpprieto]

I don't believe this is possible at the moment.

This is a great candidate for a storefront API feature request

[felpsio]

Thanks. Just created the feature request :)