From 5856e80fcb78446be37456ec1e5c47b2ab02201f Mon Sep 17 00:00:00 2001
From: lonkaars <l.leblansch@gmail.com>
Date: Fri, 9 Apr 2021 17:10:50 +0200
Subject: dprint format :tada:

---
 components/navbar.tsx | 192 ++++++++++++++++++++++++++++----------------------
 1 file changed, 109 insertions(+), 83 deletions(-)

(limited to 'components/navbar.tsx')

diff --git a/components/navbar.tsx b/components/navbar.tsx
index d6775ee..70de574 100644
--- a/components/navbar.tsx
+++ b/components/navbar.tsx
@@ -1,121 +1,147 @@
-import { CSSProperties, useEffect, useState, useContext } from "react";
-import axios from "axios";
+import axios from 'axios';
+import { CSSProperties, useContext, useEffect, useState } from 'react';
 
-import { LogoDark } from "../components/logo";
-import { AccountAvatar } from "./account";
-import { userInfo } from "../api/api";
-import { NotificationsArea } from "./notificationsArea";
-import { SocketContext } from "./socketContext";
+import { userInfo } from '../api/api';
+import { LogoDark } from '../components/logo';
+import { AccountAvatar } from './account';
+import { NotificationsArea } from './notificationsArea';
+import { SocketContext } from './socketContext';
 
-import Home from '@material-ui/icons/Home';
-import VideogameAssetIcon from '@material-ui/icons/VideogameAsset';
 import ExtensionIcon from '@material-ui/icons/Extension';
+import Home from '@material-ui/icons/Home';
+import NotificationsIcon from '@material-ui/icons/Notifications';
+import PersonIcon from '@material-ui/icons/Person';
 import SearchIcon from '@material-ui/icons/Search';
 import SettingsIcon from '@material-ui/icons/Settings';
-import PersonIcon from '@material-ui/icons/Person';
-import NotificationsIcon from '@material-ui/icons/Notifications';
+import VideogameAssetIcon from '@material-ui/icons/VideogameAsset';
 
 var NavBarItemStyle: CSSProperties = {
 	margin: 12,
 	marginBottom: 16,
-	display: "block"
-}
+	display: 'block',
+};
 
 export function NavBar() {
-	var [ loggedIn, setLoggedIn ] = useState(false);
-	var [ gotData, setGotData ] = useState(false);
+	var [loggedIn, setLoggedIn] = useState(false);
+	var [gotData, setGotData] = useState(false);
 
-	var [ friendRequests, setFriendRequests ] = useState<Array<userInfo>>(null);
+	var [friendRequests, setFriendRequests] = useState<Array<userInfo>>(null);
 
-	var [ notificationsAreaVisible, setNotificationsAreaVisible ] = useState(false);
-	var [ gotNotifications, setGotNotifications ] = useState(false);
+	var [notificationsAreaVisible, setNotificationsAreaVisible] = useState(false);
+	var [gotNotifications, setGotNotifications] = useState(false);
 
 	var { io } = useContext(SocketContext);
 
 	async function getNotifications() {
-		var friendRequestsReq = await axios.request<{ requests: Array<userInfo> }>({
-			method: "get",
-			url: `/api/social/list/requests`
+		var friendRequestsReq = await axios.request<{ requests: Array<userInfo>; }>({
+			method: 'get',
+			url: `/api/social/list/requests`,
 		});
 		setFriendRequests(friendRequestsReq.data.requests);
 
 		setGotNotifications(friendRequestsReq.data.requests.length > 0);
 	}
 
-	useEffect(() => {(async () => {
-		if (gotData) return;
-		if (typeof window === "undefined") return;
-
-		var loggedIn = document.cookie.includes("token");
-		setLoggedIn(loggedIn);
-
-		if (loggedIn) {
-			await getNotifications();
-			io.on("incomingFriendRequest", getNotifications);
-			io.on("changedRelation", getNotifications);
-		}
+	useEffect(() => {
+		(async () => {
+			if (gotData) return;
+			if (typeof window === 'undefined') return;
 
-		setGotData(true);
-	})()}, []);
+			var loggedIn = document.cookie.includes('token');
+			setLoggedIn(loggedIn);
 
-	return <div className="navbar" style={{
-		width: 48,
-		height: "100%",
+			if (loggedIn) {
+				await getNotifications();
+				io.on('incomingFriendRequest', getNotifications);
+				io.on('changedRelation', getNotifications);
+			}
 
-		lineHeight: 0,
+			setGotData(true);
+		})();
+	}, []);
 
-		backgroundColor: "var(--background)",
-		display: "inline-block",
+	return <div
+		className='navbar'
+		style={{
+			width: 48,
+			height: '100%',
 
-		position: "fixed",
-		top: 0,
-		left: 0,
+			lineHeight: 0,
 
-		overflow: "visible",
-		whiteSpace: "nowrap",
-		zIndex: 2
-	}}>
-		<div style={NavBarItemStyle}><LogoDark/></div>
-		<a href="/" style={NavBarItemStyle}><Home/></a>
-		<a href="/game" style={NavBarItemStyle}><VideogameAssetIcon/></a>
-		{ false && <a href="/" style={NavBarItemStyle}><ExtensionIcon/></a> }
-		<a href="/search" style={NavBarItemStyle}><SearchIcon/></a>
+			backgroundColor: 'var(--background)',
+			display: 'inline-block',
 
-		<div style={{
-			position: "absolute",
-			bottom: -4,
+			position: 'fixed',
+			top: 0,
 			left: 0,
-			backgroundColor: "var(--background)"
-		}}>
-			{ loggedIn && <a style={{
-				overflow: "visible",
-				position: "relative",
-				...NavBarItemStyle
-			}}>
-				<div style={{ cursor: "pointer" }} onClick={() => setNotificationsAreaVisible(!notificationsAreaVisible)}>
-					<NotificationsIcon/>
-					{ gotNotifications && <div style={{
-						backgroundColor: "var(--disk-a)",
-						width: 8, height: 8,
-						borderRadius: 4,
-						position: "absolute",
-						top: 2, right: 2
-					}}/> }
+
+			overflow: 'visible',
+			whiteSpace: 'nowrap',
+			zIndex: 2,
+		}}
+	>
+		<div style={NavBarItemStyle}>
+			<LogoDark />
+		</div>
+		<a href='/' style={NavBarItemStyle}>
+			<Home />
+		</a>
+		<a href='/game' style={NavBarItemStyle}>
+			<VideogameAssetIcon />
+		</a>
+		{false && <a href='/' style={NavBarItemStyle}>
+			<ExtensionIcon />
+		</a>}
+		<a href='/search' style={NavBarItemStyle}>
+			<SearchIcon />
+		</a>
+
+		<div
+			style={{
+				position: 'absolute',
+				bottom: -4,
+				left: 0,
+				backgroundColor: 'var(--background)',
+			}}
+		>
+			{loggedIn && <a
+				style={{
+					overflow: 'visible',
+					position: 'relative',
+					...NavBarItemStyle,
+				}}
+			>
+				<div
+					style={{ cursor: 'pointer' }}
+					onClick={() => setNotificationsAreaVisible(!notificationsAreaVisible)}
+				>
+					<NotificationsIcon />
+					{gotNotifications && <div
+						style={{
+							backgroundColor: 'var(--disk-a)',
+							width: 8,
+							height: 8,
+							borderRadius: 4,
+							position: 'absolute',
+							top: 2,
+							right: 2,
+						}}
+					/>}
 				</div>
 				<NotificationsArea
 					visible={notificationsAreaVisible}
 					friendRequests={friendRequests}
-					rerender={getNotifications}/>
-			</a> }
-			<a href={loggedIn ? "/user" : "/login"} style={NavBarItemStyle}>
-				{
-					loggedIn ?
-					<AccountAvatar size={24} round/> :
-					<PersonIcon/>
-				}
+					rerender={getNotifications}
+				/>
+			</a>}
+			<a href={loggedIn ? '/user' : '/login'} style={NavBarItemStyle}>
+				{loggedIn
+					? <AccountAvatar size={24} round />
+					: <PersonIcon />}
 			</a>
-			{ loggedIn && <a href="/settings" style={NavBarItemStyle}><SettingsIcon/></a> }
+			{loggedIn && <a href='/settings' style={NavBarItemStyle}>
+				<SettingsIcon />
+			</a>}
 		</div>
-	</div>
+	</div>;
 }
-
-- 
cgit v1.2.3