starred/archived-linsa
1
0
Fork 0
mirror of https://github.com/linsa-io/linsa.git synced 2026-01-12 12:20:23 +01:00
Code Issues 2 Packages Projects Releases Wiki Activity

fix(link-sb): mismatch size when active

Browse Source
This commit is contained in:
Aslam H
2024-09-10 10:57:23 +07:00
parent 421bd9b0b6
commit 5466965fa6
1 changed files with 9 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/components/custom/sidebar/partial/link-section.tsx
+9 -15
View File
@@ -1,6 +1,6 @@
import React from "react" import React from "react"
import Link from "next/link" import Link from "next/link"
import { usePathname, useRouter } from "next/navigation" import { usePathname } 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"
@@ -33,23 +33,18 @@ interface LinkSectionHeaderProps {
} }
const LinkSectionHeader: React.FC<LinkSectionHeaderProps> = ({ linkCount, isActive }) => { const LinkSectionHeader: React.FC<LinkSectionHeaderProps> = ({ linkCount, isActive }) => {
const pathname = usePathname()
const [state] = useQueryState("state", parseAsStringLiteral(LEARNING_STATES.map(ls => ls.value)))
const isLinksActive = pathname.startsWith("/links") && !state
return ( return (
<div className="flex gap-px rounded-md"> <div
<Link
href="/links"
className={cn( className={cn(
"flex size-6 flex-1 items-center justify-start rounded-md px-2 py-1", "flex min-h-7 items-center gap-px rounded-md",
"focus-visible:outline-none focus-visible:ring-0", isActive ? "bg-accent text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground"
isLinksActive
? "bg-accent text-accent-foreground items-center justify-center py-4"
: "hover:bg-accent hover:text-accent-foreground"
)} )}
> >
<p className="flex w-full items-center text-xs font-medium"> <Link
href="/links"
className="flex flex-1 items-center justify-start rounded-md px-2 py-1 focus-visible:outline-none focus-visible:ring-0"
>
<p className="text-xs">
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>
@@ -58,7 +53,6 @@ const LinkSectionHeader: React.FC<LinkSectionHeaderProps> = ({ linkCount, isActi
) )
} }
const ALL_STATES = ["all", ...LEARNING_STATES.map(ls => ls.value)]
interface ListProps { interface ListProps {
personalLinks: PersonalLinkLists personalLinks: PersonalLinkLists
} }