mirror of
https://github.com/usememos/memos.git
synced 2025-06-05 22:09:59 +02:00
fix: BrandBanner to use NavLink (#4536)
* Fix BrandBanner to use NavLink * Apply suggestions from code review --------- Co-authored-by: Johnny <yourselfhosted@gmail.com>
This commit is contained in:
@@ -1,6 +1,3 @@
|
|||||||
import useCurrentUser from "@/hooks/useCurrentUser";
|
|
||||||
import useNavigateTo from "@/hooks/useNavigateTo";
|
|
||||||
import { Routes } from "@/router";
|
|
||||||
import { workspaceStore } from "@/store/v2";
|
import { workspaceStore } from "@/store/v2";
|
||||||
import { cn } from "@/utils";
|
import { cn } from "@/utils";
|
||||||
import UserAvatar from "./UserAvatar";
|
import UserAvatar from "./UserAvatar";
|
||||||
@@ -12,18 +9,13 @@ interface Props {
|
|||||||
|
|
||||||
const BrandBanner = (props: Props) => {
|
const BrandBanner = (props: Props) => {
|
||||||
const { collapsed } = props;
|
const { collapsed } = props;
|
||||||
const navigateTo = useNavigateTo();
|
|
||||||
const currentUser = useCurrentUser();
|
|
||||||
const workspaceGeneralSetting = workspaceStore.state.generalSetting;
|
const workspaceGeneralSetting = workspaceStore.state.generalSetting;
|
||||||
const title = workspaceGeneralSetting.customProfile?.title || "Memos";
|
const title = workspaceGeneralSetting.customProfile?.title || "Memos";
|
||||||
const avatarUrl = workspaceGeneralSetting.customProfile?.logoUrl || "/full-logo.webp";
|
const avatarUrl = workspaceGeneralSetting.customProfile?.logoUrl || "/full-logo.webp";
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={cn("relative w-full h-auto shrink-0", props.className)}>
|
<div className={cn("relative w-full h-auto shrink-0", props.className)}>
|
||||||
<div
|
<div className={cn("w-auto flex flex-row justify-start items-center text-gray-800 dark:text-gray-400", collapsed ? "px-1" : "px-3")}>
|
||||||
className={cn("w-auto flex flex-row justify-start items-center text-gray-800 dark:text-gray-400", collapsed ? "px-1" : "px-3")}
|
|
||||||
onClick={() => navigateTo(currentUser ? Routes.ROOT : Routes.EXPLORE)}
|
|
||||||
>
|
|
||||||
<UserAvatar className="shrink-0" avatarUrl={avatarUrl} />
|
<UserAvatar className="shrink-0" avatarUrl={avatarUrl} />
|
||||||
{!collapsed && <span className="ml-2 text-lg font-medium text-slate-800 dark:text-gray-300 shrink truncate">{title}</span>}
|
{!collapsed && <span className="ml-2 text-lg font-medium text-slate-800 dark:text-gray-300 shrink truncate">{title}</span>}
|
||||||
</div>
|
</div>
|
||||||
|
@@ -80,7 +80,9 @@ const Navigation = observer((props: Props) => {
|
|||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<div className="w-full px-1 py-1 flex flex-col justify-start items-start space-y-2 overflow-auto hide-scrollbar shrink">
|
<div className="w-full px-1 py-1 flex flex-col justify-start items-start space-y-2 overflow-auto hide-scrollbar shrink">
|
||||||
<BrandBanner className="mb-2" collapsed={collapsed} />
|
<NavLink className="mb-2" to={currentUser ? Routes.ROOT : Routes.EXPLORE}>
|
||||||
|
<BrandBanner collapsed={collapsed} />
|
||||||
|
</NavLink>
|
||||||
{navLinks.map((navLink) => (
|
{navLinks.map((navLink) => (
|
||||||
<NavLink
|
<NavLink
|
||||||
className={({ isActive }) =>
|
className={({ isActive }) =>
|
||||||
|
Reference in New Issue
Block a user