HenrikJoreteg / redux-bundler

Compose a Redux store out of smaller bundles of functionality.
https://reduxbundler.com
583 stars 46 forks source link

Route-based i18n for Route bundler #48

Closed abuinitski closed 5 years ago

abuinitski commented 5 years ago

Hi

There is a need that requires me to change URL bundler. The only proper way of adding i18n from SEO purpose is adding a base "folder" to the URL path with the language. This should not affect core router though – just provide a context variable with currently selected language.

If you agree that it should be a part of a Route bundler and agree with selected approach, I will provide a PR.

Example:

router.js

import { createRouteBundle } from 'redux-bundler';

import { Home, Dashboard } from '../containers';

export default createRouteBundle({
  '/': Home,
  '/dashboard': Dashboard,
}, {
  i18n: {
    mode: 'route_prefix', // for now the only one available, can be skipped
    languages: ['en', 'ru', 'de'],
    defaultLanguage: 'de'
  }
})

So in this setup /dashboard will be resolved to Dashboard with de language, and /en/dashboard will be resolved to Dashboard but with language en.

Current language to be added to a special new selector that Route bundle is exporting – don't want to bring undesired effects to selectRouteParams.

HenrikJoreteg commented 5 years ago

Hi! I would suggest that this doesn't actually require any changes to createRouteBundler

For example:

export default createRouteBundle({
  '/:lang/': Home,
  '/:lang/dashboard': Dashboard,
})

Then to handle redirects, you just need something to react to the fact that there isn't a language prefix.

some other bundle:

cost languages = ['en', 'ru', 'de']

export default {
  name: 'redirects',
  reactEnsureLanguage: createSelector('selectRouteParams', params => {
    if (!params.lang || !languagess.includes(params.lang)) {
      return {actionCreator: 'doUpdateUrl', args: ['/some-new-path']}
    }
  })
}