fix type in sg sync

[alttp.git] / resources / js / components / common / Header.js

diff --git a/resources/js/components/common/Header.js b/resources/js/components/common/Header.js
index 96106a175491a142488ee8e2b903beec945b24da..21c6a67ed7d7224c0237c12f3a5eb280ff5a3fad 100644 (file)
--- a/resources/js/components/common/Header.js
+++ b/resources/js/components/common/Header.js
@@ -2,23 +2,26 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import { Button, Container, Nav, Navbar } from 'react-bootstrap';
 import { LinkContainer } from 'react-router-bootstrap';
-import { withTranslation } from 'react-i18next';
+import { useLocation } from 'react-router-dom';
+import { useTranslation } from 'react-i18next';
 
 import Icon from './Icon';
 import LanguageSwitcher from './LanguageSwitcher';
 import { getAvatarUrl } from '../../helpers/User';
 import { withUser } from '../../helpers/UserContext';
-import i18n from '../../i18n';
 
-const Header = ({ doLogout, user }) =>
-       <Navbar id="header" bg="dark" variant="dark">
+const Header = ({ doLogout, user }) => {
+       const { pathname } = useLocation();
+       const { t } = useTranslation();
+
+       return <Navbar id="header" bg="dark" variant="dark">
                <Container fluid>
                        <LinkContainer to="/">
                                <Navbar.Brand>
                                        ALttP
                                </Navbar.Brand>
                        </LinkContainer>
-                       <Nav>
+                       <Nav activeKey={pathname}>
                                <LinkContainer to="/tournaments/6">
                                        <Nav.Link href="/tournaments/6">
                                                ALttPR Weekly
@@ -30,7 +33,19 @@ const Header = ({ doLogout, user }) =>
                                        </Nav.Link>
                                </LinkContainer>
                        </Nav>
-                       <Navbar.Text className="ms-auto me-2">
+                       <Nav activeKey={pathname} className="ms-auto">
+                               <LinkContainer to="/tech">
+                                       <Nav.Link href="/tech">
+                                               {t('menu.tech')}
+                                       </Nav.Link>
+                               </LinkContainer>
+                               <LinkContainer to="/map">
+                                       <Nav.Link href="/map">
+                                               {t('menu.map')}
+                                       </Nav.Link>
+                               </LinkContainer>
+                       </Nav>
+                       <Navbar.Text className="mx-2">
                                <LanguageSwitcher />
                        </Navbar.Text>
                        <Nav>
@@ -40,28 +55,38 @@ const Header = ({ doLogout, user }) =>
                                                        <Nav.Link>
                                                                <img alt="" src={getAvatarUrl(user)} />
                                                                {user.username}
-                                                               <span className="text-muted">#{user.discriminator}</span>
+                                                               {user.discriminator && user.discriminator !== '0' ?
+                                                                       <span className="text-muted">#{user.discriminator}</span>
+                                                               : null}
                                                        </Nav.Link>
                                                </LinkContainer>
                                                <Button
                                                        onClick={doLogout}
-                                                       title={i18n.t('button.logout')}
+                                                       title={t('button.logout')}
                                                        variant="outline-secondary"
                                                >
                                                        <Icon.LOGOUT title="" />
                                                </Button>
                                        </>
                                :
-                                       <Button href="/login" variant="discord">
+                                       <Button
+                                               href="/login"
+                                               onClick={() => {
+                                                       if (location.pathname.length > 1) {
+                                                               localStorage.setItem('returnPath', location.pathname.substr(1));
+                                                       }
+                                               }}
+                                               variant="discord"
+                                       >
                                                <Icon.DISCORD />
                                                {' '}
-                                               {i18n.t('button.login')}
+                                               {t('button.login')}
                                        </Button>
                                }
                        </Nav>
                </Container>
-       </Navbar>
-;
+       </Navbar>;
+};
 
 Header.propTypes = {
        doLogout: PropTypes.func,
@@ -73,4 +98,4 @@ Header.propTypes = {
        }),
 };
 
-export default withTranslation()(withUser(Header));
+export default withUser(Header);