xueteng/video-flow-b
1
0
Fork 0
forked from 77media/video-flow
Code Pull Requests Activity

侧边栏加Tooltip

Browse Source
This commit is contained in:
北枳 2025-10-22 18:48:36 +08:00
parent 4680f2229a
commit 174b2a4d1d
1 changed files with 31 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
components/layout/sidebar.tsx
View File

@ -8,6 +8,7 @@ import {
PanelRightClose
} from 'lucide-react';
import { navigationItems } from './type';
import { Tooltip } from "antd";
interface SidebarProps {
collapsed: boolean;
@ -31,6 +32,7 @@ export function Sidebar({ collapsed, onToggle }: SidebarProps) {
<div className="flex h-full flex-col">
{/* Toggle Button */}
<div className="flex h-16 items-center px-4">
<Tooltip placement="right" title={collapsed ? "Expand Sidebar" : "Collapse Sidebar"}>
<Button
data-alt="toggle-sidebar"
variant="ghost"
@ -43,6 +45,7 @@ export function Sidebar({ collapsed, onToggle }: SidebarProps) {
>
<PanelRightClose className="h-4 w-4" />
</Button>
</Tooltip>
</div>
{/* Navigation */}
@ -52,7 +55,8 @@ export function Sidebar({ collapsed, onToggle }: SidebarProps) {
{section.items.map((item) => {
const isActive = pathname === item.href;
return (
<Link key={item.name} href={item.href}>
<Tooltip placement="right" title={item.name} key={item.name}>
<Link href={item.href}>
<Button
data-alt={`nav-item-${item.name}`}
variant={isActive ? 'secondary' : 'ghost'}
@ -66,6 +70,7 @@ export function Sidebar({ collapsed, onToggle }: SidebarProps) {
{!collapsed && <span>{item.name}</span>}
</Button>
</Link>
</Tooltip>
);
})}
</div>