Previewing unpublished documents doesn't work with modified lang code

[mrseanbaines]

I have a multi-locale site and have had to convert the lang/locale code in URLs to country codes (actually a mix of country codes and lang codes, but for simplicity's sake and in my example project it's just country codes), so instead of /en-gb/my-page or /en/my-page, it would be /gb/my-page. It's not possible to achieve this with the plugin as it is, so I've had to hook into Gatsby's onCreatePage API and modify the path with a helper function like so:

exports.localeToCountryCode = localeCode => localeCode.split("-")[1].toLowerCase()

(this ☝️ is also used in the linkResolver)

Everything seems to work locally, in production and also when previewing published documents, but for some reason this seems to interfere with trying to preview unpublished documents.

My page query looks like this:

query($lang: String!, $uid: String!) {
  prismic {
    allPosts(lang: $lang, uid: $uid) {
...

It seems as though the lang variable isn't getting passed to the page query, since props.data.prismic.allPosts.edges is returning an empty array:

If I remove the lang filter from the query, I then get data returned and am able to preview unpublished documents. It also seems to work (even with the lang filter) if I don't convert the locale codes to country codes.

When clicking on the preview button, I am taken to http://localhost:8000/preview/post?lang=de&uid=mein-erster-beitrag, which I think is correct, as I believe this is the default preview path, plus the params with the correct locale and uid/slug as I've defined it in Prismic.

I've set up previews and configured my pages with the type, match and component properties:

{
  type: "Post",
  match: "/:lang/posts/:uid",
  component: require.resolve("./src/templates/post.js"),
}

You can find a reproducible test case here: https://github.com/mrseanbaines/prismic-previews-multi-locale.