feat: show name and menu in header only when user is logged in #146
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
|
maybe use clsx for constructing className strings conditionally? |
| <a | ||
| href='#' | ||
| className={classNames( | ||
| active ? 'bg-gray-100' : '', |
There was a problem hiding this comment.
| active ? 'bg-gray-100' : '', | |
| active && 'bg-gray-100', |
is this one better?
There was a problem hiding this comment.
In this case if active is true it'll return a string that is bg-gray-100 but if it is false it'll return a boolean i.e. false. So a class named false will probably be added to the list of class names.
And as we're using TypeScript it'll straight away show an error saying something like the value of boolean is not assignable, if that makes sense 😄 Thanks for the feedback.
There was a problem hiding this comment.
false will filter out by classes.filter(Boolean).join(' ') XD
Thanks for the comment ❤️
There was a problem hiding this comment.
You're right. Didn't notice it before. But the TypeScript error would still be there if we use active && 'bg-gray-100'.
I'm not sure about adding another dependency for a simple case like this. |
This is the first of the series of PRs that improves the # and # flow. Please look at #140.
This PR hides the name and menu button when the user is not logged in. Instead, it only shows a link to the # page.