mirror of
https://github.com/linsa-io/linsa.git
synced 2026-04-27 10:47:14 +02:00
sidebar: fixed link active state, /docs link
This commit is contained in:
@@ -1,6 +1,6 @@
|
|||||||
import React from "react"
|
import React from "react"
|
||||||
import Link from "next/link"
|
import Link from "next/link"
|
||||||
import { usePathname } from "next/navigation"
|
import { usePathname, useRouter } from "next/navigation"
|
||||||
import { useAccount } from "@/lib/providers/jazz-provider"
|
import { useAccount } from "@/lib/providers/jazz-provider"
|
||||||
import { cn } from "@/lib/utils"
|
import { cn } from "@/lib/utils"
|
||||||
import { PersonalLinkLists } from "@/lib/schema/personal-link"
|
import { PersonalLinkLists } from "@/lib/schema/personal-link"
|
||||||
@@ -32,19 +32,24 @@ interface LinkSectionHeaderProps {
|
|||||||
isActive: boolean
|
isActive: boolean
|
||||||
}
|
}
|
||||||
|
|
||||||
const LinkSectionHeader: React.FC<LinkSectionHeaderProps> = ({ linkCount, isActive }) => {
|
const LinkSectionHeader: React.FC<LinkSectionHeaderProps> = ({ linkCount }) => {
|
||||||
|
const pathname = usePathname()
|
||||||
|
const [state] = useQueryState("state", parseAsStringLiteral(LEARNING_STATES.map(ls => ls.value)))
|
||||||
|
const isLinksActive = pathname.startsWith("/links") && !state
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div className="flex gap-px rounded-md">
|
||||||
className={cn(
|
|
||||||
"flex min-h-7 items-center gap-px rounded-md",
|
|
||||||
isActive ? "bg-accent text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground"
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<Link
|
<Link
|
||||||
href="/links"
|
href="/links"
|
||||||
className="flex flex-1 items-center justify-start rounded-md px-2 py-1 focus-visible:outline-none focus-visible:ring-0"
|
className={cn(
|
||||||
|
"flex size-6 flex-1 items-center justify-start rounded-md px-2",
|
||||||
|
"focus-visible:outline-none focus-visible:ring-0",
|
||||||
|
isLinksActive
|
||||||
|
? "bg-accent text-accent-foreground items-center justify-center py-3"
|
||||||
|
: "hover:bg-accent hover:text-accent-foreground"
|
||||||
|
)}
|
||||||
>
|
>
|
||||||
<p className="text-xs">
|
<p className="flex w-full items-center text-xs font-medium">
|
||||||
Links
|
Links
|
||||||
{linkCount > 0 && <span className="text-muted-foreground ml-1">{linkCount}</span>}
|
{linkCount > 0 && <span className="text-muted-foreground ml-1">{linkCount}</span>}
|
||||||
</p>
|
</p>
|
||||||
|
|||||||
@@ -75,6 +75,17 @@ export const ProfileSection: React.FC = () => {
|
|||||||
</Link>
|
</Link>
|
||||||
</DropdownMenuItem>
|
</DropdownMenuItem>
|
||||||
<DropdownMenuSeparator />
|
<DropdownMenuSeparator />
|
||||||
|
|
||||||
|
<DropdownMenuItem asChild>
|
||||||
|
<Link href="https://docs.learn-anything.xyz/">
|
||||||
|
<div className="relative flex flex-1 items-center gap-2">
|
||||||
|
<LaIcon name="Sticker" />
|
||||||
|
<span className="line-clamp-1 flex-1">Docs</span>
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
</DropdownMenuItem>
|
||||||
|
<DropdownMenuSeparator />
|
||||||
|
|
||||||
<DropdownMenuItem onClick={() => signOut()}>
|
<DropdownMenuItem onClick={() => signOut()}>
|
||||||
<div className="relative flex flex-1 items-center gap-2">
|
<div className="relative flex flex-1 items-center gap-2">
|
||||||
<LaIcon name="LogOut" />
|
<LaIcon name="LogOut" />
|
||||||
|
|||||||
Reference in New Issue
Block a user