Add query variables

[kdichev]

motivation: we have a multi language website and as I understood the best practice is to create multiple indices per language, and then in the front-end to target the specific index by locale name.

problem:

query($locale: String){
  contentful {
    urlSlugCollection(locale: $locale) {
      items {
        sys {
          id
        }
        slug
        pageTitle
      }
    }
  }
}

Performing this query needs a variable locale in order to be able to fetch the correct localised data from the slugs(this is just an example query).

Currently there is no support for variables which this PR aims to add.

Looking forward to your review and suggestions.

related to: #8

[Haroenv]

You can try this out by changing the resolve in the example to the local version :) Thanks for this PR!

[kdichev]

You can try this out by changing the resolve in the example to the local version :) Thanks for this PR!

Thanks missed this :)

[kdichev]

@Haroenv just managed to test it, works as intended. How would we go about in documenting this?

[Haroenv]

So far the only info is in the readme; I think for this another title is in order and an example how + why to use it

[Haroenv]

This looks good. I will try it out (since we don't have tests here 😢) and will merge after that.

By the way, I was wondering why you would need variables, since the configuration is static; you could just as well hard code it in the query no?

[kdichev]

We support around 30 locales(potentially even more in the coming year), which we would need to fetch prior requesting indexable data, then iterating over each locale and fetching the according localised indexable content.

Since hardcoding is not a good option, adding variables would potentially open up the possibility to find a solution on how to create those indices dynamically.

I am open to solutions, suggestions. When I talked with Algolia reps I could not get a clear answer how this can be achieved with Gatsby because there was not a team member that had Gatsby experience.

PS. same issue as #8 @sedubois @brotzky

[Haroenv]

That makes sense! If at any point you feel like what I made here is too limited, know that you can always write inline plugins too in gatsby. In your case, all the content comes from within the gatsby source from separate plugins, or is it form a single third party? It could be useful to see if it could be an option to get the info immediately there. Anyway I will try this out, and merge

[kdichev]

Hey, you might be on to something here... :)

We are using contentful and adding it to gatsby source using the gatsby-source-plugin.

I will try writing my own plugin and check out the pros/cons of this approach :)

[Haroenv]

Let me know when you get back to it. I know that Contentful is also working on their own Algolia integration, you can reach out to them (probably @stefanjudis?) to see what they are working on :)

[kdichev]

@Haroenv I am closing this, will re-open it if needed in the next year.

[Haroenv]

Makes sense! Note for anyone else who sees this thread, feel free to explain why you would find this necessary for the plugin!

[Isaac-Tait]

This has been closed for awhile now but I am looking for something like this. I have a site that implements Algolia to search the blog posts. However, I have 30+ "static pages" that I would also like to populate a separate Algolia Indices with so that I can search all the content of my site... I opened a discussion here Any suggestions on how to get this project off the ground? Cheers!

[Haroenv]

@Isaac-Tait, I think this PR was pretty much fine, if you reopen a PR with almost the same code (rebased obviously) and documentation, I'm happy to merge 👍

[kdichev]

I actually made a separate plugin https://github.com/kdichev/gatsby-plugin-algolia-index with another approach where the plugin accepts a path to a file where you could customize fetching and transformation of the data and it's heavily based on this plugin.

// algolia-index-config.js
// (graphql: GraphQlClient) => Promise<[]<{indexName: string, indexData: []<any>}>>

module.exports = async (/*graphql*/) => [
  { indexName: 'index1', indexData: [{ hello: '1' }] },
  { indexName: 'index2', indexData: [{ hello: '2' }] },
]

[Isaac-Tait]

After taking a closer look at the old PR that @kdichev submitted it appears the change was made in the gatsby-node.js file... However, the code base has changed a lot since that PR over three years ago.

Correct me if I am wrong (and I probably am 🤣 ) - it would seem that within the jobs function queryVariables was defined and then called in the result function within the query. Now though the jobs function is an empty array. This level of JavaScript coding is a bit out of my wheelhouse but if I add queryVariables to the const queryPromise object would that be sufficient to allow calling multiple indices within one search query using gatsby-plugin-algolia?

[Haroenv]

It was indeed easier to add variable support myself @Isaac-Tait, version 0.26.0 now has queryVariables key in each of the individual queries. Thanks for bringing this idea back up 👍

[Isaac-Tait]

Thanks for bringing this idea back up

My pleasure 😄 and thank you for pushing out the update so quickly 💯