1 files changed, 37 insertions, 36 deletions

diff --git a/components/Header.js b/components/Header.js
index 83f0ff9..32ec977 100644
--- a/components/Header.js
+++ b/components/Header.js
@@ -1,27 +1,26 @@
 import styles from 'styles/Main.module.scss'
-import React, {useState} from 'react'
-import {useRouter} from 'next/router'
+import React, { useState } from 'react'
+import { useRouter } from 'next/router'
 import Link from 'next/link'
 import useUser from 'hooks/useUser'
 import fetchJson from 'helpers/fetchJson'
-import {focus, toggleMin} from 'helpers/windowActions'
-import {open, close} from 'helpers/windowActions'
+import { focus, toggleMin, open, close } from 'helpers/windowActions'
 import appList from 'configs/appList'
 import useSettings from 'hooks/useSettings'
-import {faTimes} from '@fortawesome/free-solid-svg-icons'
-import {FontAwesomeIcon} from '@fortawesome/react-fontawesome'
+import { faTimes } from '@fortawesome/free-solid-svg-icons'
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 
-const Header = ({apps, setApps}) => {
+const Header = ({ apps, setApps }) => {
   const [userMenu, setUserMenu] = useState(false)
   const [showApps, setShowApps] = useState(false)
-  const {user, mutateUser} = useUser()
-  const {t} = useSettings()
+  const { user, mutateUser } = useUser()
+  const { t } = useSettings()
   const router = useRouter()
 
   const handleLogout = async (e) => {
     e.preventDefault()
     mutateUser(
-      await fetchJson('/api/logout', {method: 'POST'}),
+      await fetchJson('/api/logout', { method: 'POST' }),
       false
     )
     router.push('/login')
@@ -39,13 +38,13 @@ const Header = ({apps, setApps}) => {
       <nav>
         <div>
           <span onClick={() => setShowApps(s => !s)} className='mobile-only'>
-            {apps && apps.length > 0 && apps[apps.length-1]?.name}
+            {apps && apps.length > 0 && apps[apps.length - 1]?.name}
             {apps && apps.length > 1 ? (' (' + (apps.length) + ')') : ''}
           </span>
           <ul className={showApps ? styles.showMobileAppList : 'desktop-only'}>
-            <li className="mobile-only">{t('open_apps')}</li>
+            <li className='mobile-only'>{t('open_apps')}</li>
             {
-              apps && [...apps].sort((a,b) => a.name > b.name ? 1 : -1).map(app => {
+              apps && [...apps].sort((a, b) => a.name > b.name ? 1 : -1).map(app => {
                 if (!app) return null
                 return (
                   <li
@@ -54,8 +53,8 @@ const Header = ({apps, setApps}) => {
                   >
                     <span
                       style={{
-                        ...apps.findIndex(a => a.name === app.name) === apps.length - 1 ? {fontWeight: 600} : {},
-                        ...app.min ? {color: '#888'} : {}
+                        ...apps.findIndex(a => a.name === app.name) === apps.length - 1 ? { fontWeight: 600 } : {},
+                        ...app.min ? { color: '#888' } : {}
                       }}
                     >
                       {t(app.name)}
@@ -67,7 +66,7 @@ const Header = ({apps, setApps}) => {
                 )
               })
             }
-            <li className="mobile-only">
+            <li className='mobile-only'>
               <span onClick={() => setShowApps(false)} className='window__button'>{t('close')}</span>
             </li>
           </ul>
@@ -75,14 +74,14 @@ const Header = ({apps, setApps}) => {
         <ul>
           {!user?.isLoggedIn && (
             <li>
-              <Link href="/register">
+              <Link href='/register'>
                 <a>{t('register')}</a>
               </Link>
             </li>
           )}
           {!user?.isLoggedIn && (
             <li>
-              <Link href="/login">
+              <Link href='/login'>
                 <a>{t('login')}</a>
               </Link>
             </li>
@@ -92,30 +91,32 @@ const Header = ({apps, setApps}) => {
               <p
                 className={styles.user}
                 onClick={() => setUserMenu(!userMenu)}
-              >{user?.email}</p>
+              >{user?.email}
+              </p>
               {
                 userMenu && (
 
-                <>
-                  <div className={styles.headerOverlay} onClick={() => setUserMenu(false)} />
-                  <ul className={styles.submenu}>
-                    {user.isVerified && (
+                  <>
+                    <div className={styles.headerOverlay} onClick={() => setUserMenu(false)} />
+                    <ul className={styles.submenu}>
+                      {user.isVerified && (
+                        <li>
+                          <span onClick={() => {
+                            open({ appName: 'Settings', ...appList.Settings }, setApps)
+                            setUserMenu()
+                          }}
+                          >
+                            {t('Settings')}
+                          </span>
+                        </li>
+                      )}
                       <li>
-                        <span onClick={() => {
-                          open({appName: 'Settings', ...appList.Settings}, setApps)
-                          setUserMenu()
-                        }}>
-                          {t('Settings')}
+                        <span onClick={handleLogout}>
+                          {t('logout')}
                         </span>
                       </li>
-                    )}
-                    <li>
-                      <a href="/api/logout" onClick={handleLogout}>
-                        {t('logout')}
-                      </a>
-                    </li>
-                  </ul>
-                </>
+                    </ul>
+                  </>
                 )
               }
             </li>