rsnext/examples/with-lingui/components/LangSwitcher.js
2019-02-21 12:53:02 +01:00

32 lines
926 B
JavaScript

import Router from 'next/router'
import { I18n } from '@lingui/react'
import { t, Trans } from '@lingui/macro'
const availableLanguageNames = {
'en': t`English`,
'sv': t`Swedish`
}
const availableLanguages = Object.keys(availableLanguageNames)
export default () => {
function onSubmit (evt) {
evt.preventDefault()
Router.push({
pathname: window.location.pathname,
query: {lang: evt.currentTarget.lang.value}
})
}
return (
<I18n>{({i18n}) =>
<form onSubmit={onSubmit}>
<select key={i18n.language} name='lang' defaultValue={availableLanguages.find(lang => lang !== i18n.language)}>
{availableLanguages.map(lang => (
<option key={lang} value={lang} disabled={i18n.language === lang}>{i18n._(availableLanguageNames[lang])}</option>
))}
</select>
<button><Trans>Switch language</Trans></button>
</form>
}</I18n>
)
}