Syntax for "query" argument in GraphQL (Storefront API)

Retired Boards Appdev Custom Storefronts
21

i do however, regret to report, that as far as i can tell: it is impossible to run a product query within a specific collection (let alone within a set of collections).

  • rather than relying on docs, i had a much better time finding ground-truth by directly experimenting on the GraphiQL app. install the app in your shopify admin and use it, if you’re trying to figure out the storefront graphql api. it’s more complete than the docs.

anyways, as things stand, it looks like we’re very limited in our ability to provide a search experience for users.

from what i can gather, using the storefront graphql api, here are the different viable approaches i can muster, to implement search in a custom storefront for my library:

  • fetch everything up-front: (in pages of 250 products at a time)
    • this is viable if your store has less than, maybe, a thousand products – beyond that, and the download time and size becomes worrisome
    • once everything is downloaded clientside, we can manage the search and filtering entirely ourselves. that can be a good user experience.
    • it’s an abomination that shopify might drive us to this, after all, it defeats the entire purpose of pagination (which i have already implemented dutifully)
  • duct-tape together the working scraps of shopify’s search api:
    • well, there’s no way to run a search/query inside a collection. at all.
    • we can give the users a search bar, and checkboxes for tags – and they can use that to search/filter through all products.
    • then we can give users the ability to browse collections.
    • the key is that users cannot browse collections AND run searches – the interface has to put them in either “browse collections mode”, OR “search mode” – each mode must be mutually exclusive – we can run pagination within each of those modes

for my use-case, building the shopify-shepherd typescript library along with the store ui project sheep-cart, i’ll prefer the paginated duct-tape method, as it’s more robust for bigger stores – but hopefully i’ll have time to implement both modes..

22

oh dear.

for reasons that are entirely beyond me, for some reason my products(query) is now working in my graphiql explorer.

the exact same query that before, was not working – is now working.

i don’t know if the API is being sporadic, or if something’s wrong with graphiql explorer, or what, but i don’t like it.

i’m now finding that totalInventory and quantityAvailable is bugged out and throws unsolvable permissions errors from deprecated scopes that no longer exist – there’s not even any way to count the number of variants a product has (so i can’t determine whether to show my variants ui, except to string match against “Default Value”)…

good lord, this graphql api is an absolute nightmare dumpsterfire!

23

i just discovered that “collection_id” is a valid product query filter param. this saved my bacon.

it’s supposed to be documented here, but it’s not.

i literally found this by randomly guessing, and i’m not joking.

{
  products(
    first: 10
    query: "(tag:appetizer) AND (collection_id:'gid://shopify/Collection/424441479')"
  ) {
    edges {
      node {
        id
        title
      }
    }
  }
}

this kafkaesque nightmare has me in a fugue-state.

24

i’m sorry everybody.

today i’ve been trying to implement this “collection_id”, and it’s not working at all.

it turns out, half of everything i’ve said in this thread is WRONG and only adds confusing noise. i think of myself as a good developer, but somehow, half of what i thought was working, was some kind of mirage.

somehow, lost in the hall of mirrors that is the shopify api, i fall into a cycle of false pretenses and self-delusion – i can’t tell up from down anymore.

i think i’ll have to just shut up until my unofficial sdk, shopify-shepherd, is done.

i suppose going to proceed by fully separating collection-browsing from search-and-tag-filtering.

25

I can’t believe that you can’t search within a specific collection, it feels like this should very much be core functionality.