 [ ← blog / 24for2019 ](/) Dec 12, 2019  ·  \#24for2019  ·  2 min read 

# Attempting to handle dynamic schema types in Gatsby GraphQL queries



Well. I had a great idea to use Gatsby's [StaticQuery component](https://www.gatsbyjs.org/docs/static-query/#how-to-use-staticquery-in-components) for catalogs and product displays. I was hoping to also use the [useStaticQuery hook](https://www.gatsbyjs.org/docs/use-static-query/) for experimenting with shadowing. There is just one problem. When you try to use string interpolation with Gatsby, things explode.

```
String interpolation is not allowed in graphql tag:

   8 |     <StaticQuery
   9 |       query={graphql`{
> 10 |         ${productType} {
     |        ^^^^^^^^^^^^^^
  11 | 
  12 |         }
  13 |       }`}

File: src/components/catalog-product-card.js
```

There are quite a few issues I found asking for this support ([\#5069](https://github.com/gatsbyjs/gatsby/issues/5069), [\#3186](https://github.com/gatsbyjs/gatsby/issues/3186).) And there is good reasoning. Gatsby runs an abstract syntax tree against the components in the application Any GraphQL queries in ***graphql&#96;&#96;*** are extracted, executed, and passed into the component. That means there cannot be string interpolation... because there is no value to pass.

Okay, the next idea. Just use a logic check based on the ***productType*** and return a different ***StaticQuery*** component. Maybe?

```
    <StaticQuery
      query={graphql`query($productId:String!) {
        commerceProductSimple(id:{eq:$productId }) {
          id
          title
          __typename
          path {
            alias
          }
        }
      }
      `}
      render={data => <CatalogProductCard data={data} {...props} />}
    />
```

All right, so I can use a logic check to return this for a simple product type and a different one for clothing product types.

But I can't. Because this won't work either. You cannot pass variables to static queries: <https://github.com/gatsbyjs/gatsby/issues/10482>. Static queries are *really* static.

😬Back to the drawing board. The main option is normalizing the product data into a single schema type. Currently, the ***gatsby-drupal-source*** plugin puts each product into a schema based on the product type.

 

  ![](/themes/custom/mglaman/images/headshot.webp)Thanks for reading

I write about Drupal, PHP, and the quiet infrastructure behind large sites — caching, config, and testing. New posts land every week or two.

 [Subscribe via RSS →](/rss.xml) [About me →](/about-me) 

 



 

  [← Older

Gatsby with Redux using a Gatsby theme

 ](/blog/gatsby-redux-using-gatsby-theme) [Newer →

Using onCreateNode to combine Drupal bundle schema types in GatsbyJS

 ](/blog/using-oncreatenode-combine-drupal-bundle-schema-types-gatsbyjs)