63 lines
1.8 KiB
TypeScript
63 lines
1.8 KiB
TypeScript
/* eslint-disable react/jsx-props-no-spreading */
|
|
import React from 'react';
|
|
import { Layout, Menu } from 'antd';
|
|
const { Header, Content, Footer } = Layout;
|
|
import { useIntl, FormattedMessage } from 'gatsby-plugin-intl';
|
|
import { useLocation } from '@reach/router';
|
|
import { Link } from 'gatsby'
|
|
import './DefaultLayout.less'
|
|
|
|
type Props = {};
|
|
|
|
const DefaultLayout: React.FC<Props> = ({
|
|
children,
|
|
...props
|
|
}) => {
|
|
const intl = useIntl()
|
|
const location = useLocation()
|
|
return (
|
|
<Layout style={{ minHeight: '100vh' }}>
|
|
<Header>
|
|
<Menu
|
|
theme="dark"
|
|
mode="horizontal"
|
|
selectedKeys={[location.pathname.split('/')[2]]}
|
|
style={{display: 'flex', justifyContent: 'space-around'}}
|
|
>
|
|
<Menu.Item key="">
|
|
<Link to={`/${intl.locale}/`}>
|
|
<span className="logo">
|
|
<FormattedMessage id="homepage.title" />
|
|
</span>
|
|
</Link>
|
|
</Menu.Item>
|
|
<Menu.Item key="network">
|
|
<Link to={`/${intl.locale}/network/`}>{intl.formatMessage({id: "nav.networkLink"})}</Link>
|
|
</Menu.Item>
|
|
<Menu.Item key="code">
|
|
<a
|
|
href="https://github.com/certusone/wormhole"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
{intl.formatMessage({id: "nav.codeLink"})}
|
|
</a>
|
|
</Menu.Item>
|
|
</Menu>
|
|
</Header>
|
|
<Content>
|
|
<div
|
|
{...props}
|
|
>
|
|
{children}
|
|
</div>
|
|
</Content>
|
|
<Footer style={{textAlign: 'center'}} className="primary-test">
|
|
{intl.formatMessage({id: "footer.createdWith"})}{` ♥`}<br />©{new Date().getFullYear()}
|
|
</Footer>
|
|
</Layout>
|
|
);
|
|
};
|
|
|
|
export default DefaultLayout;
|