Using cropFocus from frontmatter on list page

[abemedia]

I have a bunch of markdown files which have both an image and a cropFocus value in the frontmatter e.g.

---
title: foo
image: bar.jpg
cropFocus: NORTH
---

Hello World

Using the createPages API I'm passing the cropFocus value to the page context to use it in the GraphQL query of that page's template e.g.

  query Page($path: String!, $cropFocus: ImageCropFocus) {
    markdownRemark(fields: { slug: { eq: $path } }) {
      html
      frontmatter {
        title
        image {
          childImageSharp {
            fluid(maxWidth: 800, maxHeight: 600, cropFocus: $cropFocus) {
              ...GatsbyImageSharpFluid
            }
          }
        }
      }
    }
  }

This works great but how do I use it on the list view where I'm getting all of the articles?

  query PageList {
    allMarkdownRemark(
      filter: { fileAbsolutePath: { regex: "/myPageDir/" } }
      limit: 1000
    ) {
      edges {
        node {
          html
          frontmatter {
            title
            image {
              childImageSharp {
                fluid(maxWidth: 300, maxHeight: 200, cropFocus: ???) {
                  ...GatsbyImageSharpFluid
                }
              }
            }
          }
        }
      }
    }
  }