diff options
author | 2021-09-06 23:13:22 +0200 | |
---|---|---|
committer | 2021-09-06 23:13:22 +0200 | |
commit | 569bdb8c5d7538fa0ea8a99ff2f8376f7cbfa51a (patch) | |
tree | 8d1cb94a56d60b9d726222277b7516fc59895613 /components/Header.js | |
parent | 275bd1d0a9aea90696c145cf992d522a0d6b0aa8 (diff) | |
download | my_apps-569bdb8c5d7538fa0ea8a99ff2f8376f7cbfa51a.tar.gz my_apps-569bdb8c5d7538fa0ea8a99ff2f8376f7cbfa51a.tar.bz2 my_apps-569bdb8c5d7538fa0ea8a99ff2f8376f7cbfa51a.zip |
added stadard linter
Diffstat (limited to 'components/Header.js')
-rw-r--r-- | components/Header.js | 73 |
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> |