granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix Menu authenticated status

Browse source
This commit is contained in:
Justin Edmund 2022-02-02 21:42:36 -08:00
parent 50d2d814eb
commit f9eba3d857
2 changed files with 9 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
components/Header/index.tsx
View file

@ -12,7 +12,7 @@ import './index.scss'
interface Props {} interface Props {}
const Header = (props: Props) => { const Header = (props: Props) => {
const { editable, setEditable, setAuthenticated } = useContext(AppContext) const { editable, setEditable, authenticated, setAuthenticated } = useContext(AppContext)
const [username, setUsername] = useState(undefined) const [username, setUsername] = useState(undefined)
const [cookies, _, removeCookie] = useCookies(['user']) const [cookies, _, removeCookie] = useCookies(['user'])
@ -21,12 +21,14 @@ const Header = (props: Props) => {
useEffect(() => { useEffect(() => {
if (cookies.user) { if (cookies.user) {
setAuthenticated(true)
setUsername(cookies.user.username) setUsername(cookies.user.username)
console.log(`Logged in as user "${cookies.user.username}"`) console.log(`Logged in as user "${cookies.user.username}"`)
} else { } else {
setAuthenticated(false)
console.log('You are currently not logged in.') console.log('You are currently not logged in.')
} }
}, [cookies]) }, [cookies, setUsername, setAuthenticated])
function copyToClipboard() { function copyToClipboard() {
const el = document.createElement('input') const el = document.createElement('input')
@ -60,8 +62,8 @@ const Header = (props: Props) => {
<div className="dropdown"> <div className="dropdown">
<Button type="menu">Menu</Button> <Button type="menu">Menu</Button>
{ (username) ? { (username) ?
<HeaderMenu username={username} logout={logout} /> : <HeaderMenu authenticated={authenticated} username={username} logout={logout} /> :
<HeaderMenu logout={logout} /> <HeaderMenu authenticated={authenticated} />
} }
</div> </div>
</div> </div>

9
components/HeaderMenu/index.tsx
View file

@ -6,8 +6,6 @@ import Link from 'next/link'
import LoginModal from '~components/LoginModal' import LoginModal from '~components/LoginModal'
import SignupModal from '~components/SignupModal' import SignupModal from '~components/SignupModal'
import AppContext from '~context/AppContext'
import { useModal as useSignupModal } from '~utils/useModal' import { useModal as useSignupModal } from '~utils/useModal'
import { useModal as useLoginModal } from '~utils/useModal' import { useModal as useLoginModal } from '~utils/useModal'
import { useModal as useAboutModal } from '~utils/useModal' import { useModal as useAboutModal } from '~utils/useModal'
@ -16,13 +14,12 @@ import AboutModal from '~components/AboutModal'
interface Props { interface Props {
authenticated: boolean,
username?: string, username?: string,
logout: () => void logout?: () => void
} }
const HeaderMenu = (props: Props) => { const HeaderMenu = (props: Props) => {
const { authenticated } = useContext(AppContext)
const { open: signupOpen, openModal: openSignupModal, closeModal: closeSignupModal } = useSignupModal() const { open: signupOpen, openModal: openSignupModal, closeModal: closeSignupModal } = useSignupModal()
const { open: loginOpen, openModal: openLoginModal, closeModal: closeLoginModal } = useLoginModal() const { open: loginOpen, openModal: openLoginModal, closeModal: closeLoginModal } = useLoginModal()
const { open: aboutOpen, openModal: openAboutModal, closeModal: closeAboutModal } = useAboutModal() const { open: aboutOpen, openModal: openAboutModal, closeModal: closeAboutModal } = useAboutModal()
@ -83,7 +80,7 @@ const HeaderMenu = (props: Props) => {
) )
} }
return (authenticated) ? authItems() : unauthItems() return (props.authenticated) ? authItems() : unauthItems()
} }
export default HeaderMenu export default HeaderMenu