Fix context locale property not correctly set when using templates

[helloiamlukas]

This pull request fixes the missing locale property when using templates.

Example

If you are using template paths in the Gridsome configuration to generate localized pages, e.g.

module.exports = {
  templates: {
    ContentfulNews: [
      {
        path: (node) =>  `/${node.locale}/${node.locale === 'de' ? 'nachrichten' : 'news'}/${node.slug}`
      }
    ]
  }
}

Until now, $context.locale as well as $route.meta.locale were falling back to the default locale for each of these routes.

Reason

The reason for this problem is that the default Gridsome template generation doesn't set any context variable, causing the plugin to fall back to the default.

This happens for $context.locale https://github.com/daaru00/gridsome-plugin-i18n/blob/017f4eb02d5050ae5a2df1f5abbdd7fba9ad5716/gridsome.server.js#L145

as well as for $route.meta.locale https://github.com/daaru00/gridsome-plugin-i18n/blob/017f4eb02d5050ae5a2df1f5abbdd7fba9ad5716/gridsome.server.js#L215-L217

Fix

To set $context.locale I use the current node and search for a locale parameter. For $route.meta.locale there is no access to the node unfortunately, that's why I check if the locale appears in the current path.

[lejtzen]

I've tried setting the locale manually on markdown files in the onCreateNode-hook in gridsome.server.js without any success. Could this be because of the issue you're mentioning?

// gridsome.server.js

module.exports = function (api) {
    api.onCreateNode((options) => {
        options.route = options.route || {}
        options.route.meta = options.route.meta || {}
        options.route.meta.locale = options.lang

        options.internal = options.internal || {}
        options.internal.meta = options.internal.meta || {}
        options.internal.meta.locale = options.lang

        options.context = options.context || {}
        options.context.locale = options.lang
    })
}

[helloiamlukas]

I've tried setting the locale manually on markdown files in the onCreateNode-hook in gridsome.server.js without any success. Could this be because of the issue you're mentioning?

// gridsome.server.js

module.exports = function (api) {
    api.onCreateNode((options) => {
        options.route = options.route || {}
        options.route.meta = options.route.meta || {}
        options.route.meta.locale = options.lang

        options.internal = options.internal || {}
        options.internal.meta = options.internal.meta || {}
        options.internal.meta.locale = options.lang

        options.context = options.context || {}
        options.context.locale = options.lang
    })
}

Did you already try adding this pull request to your repo and see if it works? I'm not sure how it works in your case.

To use this pull request in your repo, just update this line in your package.json

{
  "dependencies": {
     ...
    "gridsome-plugin-i18n": "https://github.com/helloiamlukas/gridsome-plugin-i18n",
     ...
  }
}

[chrisrueger]

Your fix works like a charm. @daaru00, could you review it and merge it if possible?

For us this fixes a problem that locale is not detected when you directly go to URLs e.g. /en/foo. Without the fix the url changes immediately back to default locale which is /de/foo.

[daaru00]

@chrisrueger I'm trying to take my time these days to review and merge it, I'll update you