Add switch language button on footer

This commit is contained in:
Hoàng Rio 2018-10-29 10:26:19 +07:00
parent 234e29697f
commit 4b821f0bd7
8 changed files with 28 additions and 16 deletions
client/src/components/ui

View file

@ -1,6 +1,7 @@
import React, { Component } from 'react';
import { Trans } from 'react-i18next';
import { Trans, withNamespaces } from 'react-i18next';
import { REPOSITORY } from '../../helpers/constants';
import i18n from '../../i18n';
class Footer extends Component {
getYear = () => {
@ -8,6 +9,10 @@ class Footer extends Component {
return today.getFullYear();
};
changeLanguage = () => {
i18n.changeLanguage(i18n.language === 'en' ? 'vi' : 'en');
}
render() {
return (
<footer className="footer">
@ -25,6 +30,12 @@ class Footer extends Component {
</li>
</ul>
</div>
<div className="col-auto">
<button className="btn btn-outline-info btn-sm" onClick={this.changeLanguage}
title={i18n.language === 'en' ? 'Chuyển sang Tiếng Việt' : 'Change to English'}>
{i18n.language === 'en' ? 'English' : 'Tiếng Việt'}
</button>
</div>
<div className="col-auto">
<a href={`${REPOSITORY.URL}/issues/new`} className="btn btn-outline-primary btn-sm" target="_blank" rel="noopener noreferrer">
<Trans>Report an issue</Trans>
@ -39,4 +50,4 @@ class Footer extends Component {
}
}
export default Footer;
export default withNamespaces()(Footer);