feat: make new chat always on top

This commit is contained in:
Henry Li
2026-01-19 00:00:35 +08:00
parent c321c9293a
commit b431567666
2 changed files with 48 additions and 35 deletions

View File

@@ -1,13 +1,23 @@
"use client"; "use client";
import { MessageSquarePlus } from "lucide-react";
import Link from "next/link"; import Link from "next/link";
import { usePathname } from "next/navigation";
import { SidebarTrigger, useSidebar } from "@/components/ui/sidebar"; import {
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
SidebarTrigger,
useSidebar,
} from "@/components/ui/sidebar";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
export function WorkspaceHeader({ className }: { className?: string }) { export function WorkspaceHeader({ className }: { className?: string }) {
const { state } = useSidebar(); const { state } = useSidebar();
const pathname = usePathname();
return ( return (
<>
<div <div
className={cn( className={cn(
"group/workspace-header flex h-12 flex-col justify-center", "group/workspace-header flex h-12 flex-col justify-center",
@@ -16,7 +26,7 @@ export function WorkspaceHeader({ className }: { className?: string }) {
> >
{state === "collapsed" ? ( {state === "collapsed" ? (
<div className="group-has-data-[collapsible=icon]/sidebar-wrapper:-translate-y flex w-full cursor-pointer items-center justify-center"> <div className="group-has-data-[collapsible=icon]/sidebar-wrapper:-translate-y flex w-full cursor-pointer items-center justify-center">
<div className="text-primary block font-serif group-hover/workspace-header:hidden"> <div className="text-primary block pt-1 font-serif group-hover/workspace-header:hidden">
DF DF
</div> </div>
<SidebarTrigger className="hidden pl-2 group-hover/workspace-header:block" /> <SidebarTrigger className="hidden pl-2 group-hover/workspace-header:block" />
@@ -30,5 +40,19 @@ export function WorkspaceHeader({ className }: { className?: string }) {
</div> </div>
)} )}
</div> </div>
<SidebarMenu>
<SidebarMenuItem>
<SidebarMenuButton
isActive={pathname === "/workspace/chats/new"}
asChild
>
<Link className="text-muted-foreground" href="/workspace/chats/new">
<MessageSquarePlus size={16} />
<span>New chat</span>
</Link>
</SidebarMenuButton>
</SidebarMenuItem>
</SidebarMenu>
</>
); );
} }

View File

@@ -1,6 +1,6 @@
"use client"; "use client";
import { MessageSquarePlus, MessagesSquare } from "lucide-react"; import { MessagesSquare } from "lucide-react";
import Link from "next/link"; import Link from "next/link";
import { usePathname } from "next/navigation"; import { usePathname } from "next/navigation";
@@ -14,19 +14,8 @@ import {
export function WorkspaceNavMenu() { export function WorkspaceNavMenu() {
const pathname = usePathname(); const pathname = usePathname();
return ( return (
<SidebarGroup> <SidebarGroup className="pt-1">
<SidebarMenu> <SidebarMenu>
<SidebarMenuItem>
<SidebarMenuButton
isActive={pathname === "/workspace/chats/new"}
asChild
>
<Link className="text-muted-foreground" href="/workspace/chats/new">
<MessageSquarePlus size={16} />
<span>New chat</span>
</Link>
</SidebarMenuButton>
</SidebarMenuItem>
<SidebarMenuItem> <SidebarMenuItem>
<SidebarMenuButton isActive={pathname === "/workspace/chats"} asChild> <SidebarMenuButton isActive={pathname === "/workspace/chats"} asChild>
<Link className="text-muted-foreground" href="/workspace/chats"> <Link className="text-muted-foreground" href="/workspace/chats">