Dynamic queries with gatsby-source-prismic

[alex.martens]

The gatsby-source-prismic-graphql allowed you to dynamically fetch data by applying values to the variables defined in your page query. This was done using using 'prismic.load'. How can this be done using the recommended gatsby-source-prismic plugin?

Here is the example from the gatsby-source-prismic-graphql documentation:

import React from 'react';
import { graphql } from 'gatsby';

export const query = graphql`
  query Example($limit: Int) {
    prismic {
      allArticles(first: $limit) {
        edges {
          node {
            title
          }
        }
      }
    }
  }
`;

export default function Example({ data, prismic }) {
  const handleClick = () =>
    prismic.load({
      variables: { limit: 20 },
      query, // (optional)
      fragments: [], // (optional)
    });

  return (
    // ... data
    <button onClick={handleClick}>load more</button>
  );
}

[Paulina]

Hello Alex, thanks for reaching out

These are done in the 'traditional Gatsby way' by using the gatsby-node file rather than in the configuration of the actual plugin in the gatsby-config file.

Here's the example of how you do it in this plugin. And also, the docs for Gatsby Node APIs:

Gatsby Node APIs

[alex.martens]

Thank you for your response Paulina. The problem with doing this solely at build time is that, we are going to have several possible filters that could be applied, plus pagination on top of that. Generating pages for all of these possible scenarios seems a bit cumbersome, not to mention inelegant. gatsby-source-prismic-graphql let you simply to reuse the existing query and provide arguments to it. Is there anyway to do this with the gatsby-source-prismic plugin?

[Paulina]

I understand, and I do see why this was a useful tool in the other plugin, but usually CMS source plugins are just that and they do not handle createPages for you. So gatsby-source-prismic is actually more aligned with with Gatsby concepts of building pages.

You can pass context to the dynamic queries of your pages via gatsby-node, but then again as you said before, you need to pass the arguments to it afterwards.