custom hook?

Unanswered

American Curl posted this in #help-forum

American CurlOP

2023-10-27T08:46:14.000Z

I'm trying to use a custom hook for a local storage and I've created this

token-hook.tsx

export default function useToken() {
const [token, tokenSetUseState] = useState(getToken());

return {
token,
auth: (responseText: string) => {
setToken(responseText)
tokenSetUseState(getToken())
},
logout: () => {
removeToken()
tokenSetUseState(null)
}
}
}

but if I use in other two component don't get the same token, what I'm doing wrong?

2 Replies

@American Curl I'm trying to use a custom hook for a local storage and I've created this token-hook.tsx export default function useToken() { const [token, tokenSetUseState] = useState(getToken()); return { token, auth: (responseText: string) => { setToken(responseText) tokenSetUseState(getToken()) }, logout: () => { removeToken() tokenSetUseState(null) } } } but if I use in other two component don't get the same token, what I'm doing wrong?

@ts-ignore

2023-10-27T08:47:05.000Z

show the usage

American CurlOP

2023-10-27T09:14:14.000Z

'use client'
import Link from 'next/link'
import useTokenData from "@/hooks/token-hook";

export default function Header() {

const tokenData = useTokenData();

return (
#Unknown Channel
{tokenData.token ?
#Unknown Channel
<button onClick={tokenData.logout} >Logout â›”</button>
</>
:
#Unknown Channel
<Link href="/login">Login</Link>
</>
}
</>
)
}