X-Git-Url: https://git.localhorst.tv/?a=blobdiff_plain;f=resources%2Fjs%2Fcomponents%2Fapp%2FHeader.js;h=bd0e50b8450507e2f5799508bda423eb12c1388d;hb=a0bca4306e882d77ba192eed889bd7ed52896dad;hp=ed9af60b78ec8228f88c3de8357fdc0aa3a98224;hpb=e4e7cbc7e4944b08d74f5752de337ba7700367f4;p=alttp.git

diff --git a/resources/js/components/app/Header.js b/resources/js/components/app/Header.js
index ed9af60..bd0e50b 100644
--- a/resources/js/components/app/Header.js
+++ b/resources/js/components/app/Header.js
@@ -1,96 +1,61 @@
 import PropTypes from 'prop-types';
 import React from 'react';
-import { Button, Container, Nav, Navbar } from 'react-bootstrap';
+import { Container, Nav, Navbar } from 'react-bootstrap';
 import { LinkContainer } from 'react-router-bootstrap';
 import { useLocation } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
 
 import LanguageSwitcher from './LanguageSwitcher';
+import User from './User';
 import Icon from '../common/Icon';
-import { getAvatarUrl } from '../../helpers/User';
-import { withUser } from '../../helpers/UserContext';
 
-const Header = ({ doLogout, user }) => {
+const Header = ({ doLogout }) => {
 	const { pathname } = useLocation();
 	const { t } = useTranslation();
 
-	return <Navbar id="header" bg="dark" variant="dark">
+	return <Navbar id="header" bg="dark" expand="md" variant="dark">
 		<Container fluid>
 			<LinkContainer to="/">
 				<Navbar.Brand>
 					ALttP
 				</Navbar.Brand>
 			</LinkContainer>
-			<Nav activeKey={pathname}>
-				<LinkContainer to="/tournaments/6">
-					<Nav.Link href="/tournaments/6">
-						ALttPR Weekly
-					</Nav.Link>
-				</LinkContainer>
-			</Nav>
-			<Nav activeKey={pathname} className="ms-auto">
-				<LinkContainer to="/tech">
-					<Nav.Link href="/tech">
-						{t('menu.tech')}
-					</Nav.Link>
-				</LinkContainer>
-				<LinkContainer to="/map/lw">
-					<Nav.Link href="/map/lw">
-						{t('menu.map')}
-					</Nav.Link>
-				</LinkContainer>
-			</Nav>
-			<Navbar.Text className="mx-2">
-				<LanguageSwitcher />
-			</Navbar.Text>
-			<Nav>
-				{user ?
-					<>
-						<LinkContainer to={`/users/${user.id}`}>
-							<Nav.Link>
-								<img alt="" src={getAvatarUrl(user)} />
-								{user.username}
-								{user.discriminator && user.discriminator !== '0' ?
-									<span className="text-muted">#{user.discriminator}</span>
-								: null}
-							</Nav.Link>
-						</LinkContainer>
-						<Button
-							onClick={doLogout}
-							title={t('button.logout')}
-							variant="outline-secondary"
-						>
-							<Icon.LOGOUT title="" />
-						</Button>
-					</>
-				:
-					<Button
-						href="/login"
-						onClick={() => {
-							if (location.pathname.length > 1) {
-								localStorage.setItem('returnPath', location.pathname.substr(1));
-							}
-						}}
-						variant="discord"
-					>
-						<Icon.DISCORD />
-						{' '}
-						{t('button.login')}
-					</Button>
-				}
-			</Nav>
+			<Navbar.Toggle aria-controls="header-nav" label={t('button.menu')}>
+				<Icon.MENU title="" />
+			</Navbar.Toggle>
+			<Navbar.Collapse id="header-nav">
+				<Nav activeKey={pathname}>
+					<LinkContainer to="/tournaments/6">
+						<Nav.Link href="/tournaments/6">
+							ALttPR Weekly
+						</Nav.Link>
+					</LinkContainer>
+				</Nav>
+				<Nav activeKey={pathname} className="ms-auto">
+					<LinkContainer to="/tech">
+						<Nav.Link href="/tech">
+							{t('menu.tech')}
+						</Nav.Link>
+					</LinkContainer>
+					<LinkContainer to="/map/lw">
+						<Nav.Link href="/map/lw">
+							{t('menu.map')}
+						</Nav.Link>
+					</LinkContainer>
+				</Nav>
+				<div className="d-flex align-items-center">
+					<Navbar.Text className="mx-2">
+						<LanguageSwitcher />
+					</Navbar.Text>
+					<User doLogout={doLogout} />
+				</div>
+			</Navbar.Collapse>
 		</Container>
 	</Navbar>;
 };
 
 Header.propTypes = {
 	doLogout: PropTypes.func,
-	user: PropTypes.shape({
-		avatar: PropTypes.string,
-		discriminator: PropTypes.string,
-		id: PropTypes.string,
-		username: PropTypes.string,
-	}),
 };
 
-export default withUser(Header);
+export default Header;