-
Notifications
You must be signed in to change notification settings - Fork 0
/
Nav.js
46 lines (44 loc) · 1.43 KB
/
Nav.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
import React from 'react';
import { NavLink, Link } from 'react-router-dom';
import { IntlProvider, FormattedMessage } from 'react-intl';
class Nav extends React.Component {
render() {
const locale = this.props.match.params.lang === 'ja' ? 'ja' : 'en';
const messages = require(`./locale/${locale}.json`);
const fa_icon = {
"research.interest": "fa-search",
"publication": "fa-file-o",
"presentation": "fa-bar-chart",
"cv": "fa-graduation-cap",
"contact": "fa-envelope-o"
}
const link = this.props.match.params.link ? this.props.match.params.link.replace('.', '_') : ''
return (
<IntlProvider locale={locale} messages={messages}>
<nav>
<ul className="flex-container">
{["research.interest", "publication", "presentation", "cv", "contact"]
.filter( x => x !== link )
.map( x =>
<li key={x}>
<NavLink to={"/" + locale + "/" + x.replace('.', '_')}>
<i className={"fa " + fa_icon[x]}></i><FormattedMessage id={x}/>
</NavLink>
</li>
)
}
<li>
<Link to={"/" + (locale === 'en' ? 'ja' : 'en')}>
<i className="fa fa-language"></i>{locale === 'en' ? "Japanese" : "English"}
</Link>
</li>
<li>
<img src='/img/ikkoham.jpg' alt="ホームページの中の人の画像" />
</li>
</ul>
</nav>
</IntlProvider>
);
}
}
export default Nav;