shangzy/new-api-analytics
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: harden analytics dashboard

Browse Source
This commit is contained in:
shangzy
2026-05-27 15:19:31 +08:00
parent 5e0ca6a504
commit 356039d9cf
34 changed files with 1424 additions and 879 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
components/Sidebar.tsx
View File

@@ -26,9 +26,9 @@ export function Sidebar() {
];
return (
<aside className="fixed left-0 top-0 z-30 flex h-screen w-[220px] flex-col glass !rounded-none !border-l-0 !border-t-0 !border-b-0">
<aside className="fixed left-0 top-0 z-30 flex h-20 w-full flex-row glass !rounded-none !border-l-0 !border-t-0 lg:h-screen lg:w-[220px] lg:flex-col lg:!border-b-0">
{/* Logo */}
<div className="flex h-16 items-center gap-3 border-b border-t px-5" style={{ borderColor: "var(--surface-border)" }}>
<div className="flex h-full shrink-0 items-center gap-3 border-r px-4 lg:h-16 lg:border-b lg:border-r-0 lg:border-t lg:px-5" style={{ borderColor: "var(--surface-border)" }}>
<div className="flex h-8 w-8 items-center justify-center rounded-lg border" style={{ borderColor: "var(--surface-border)", background: "var(--btn-active-bg)" }}>
<Activity className="h-4 w-4 text-t-accent" style={{ color: "var(--accent)" }} />
</div>
@@ -38,14 +38,14 @@ export function Sidebar() {
</div>
</div>
<nav className="flex-1 space-y-1 p-3 pt-4">
<nav className="flex flex-1 items-center gap-1 overflow-x-auto px-2 lg:block lg:space-y-1 lg:p-3 lg:pt-4">
{nav.map((item) => {
const active = item.href === "/" ? pathname === "/" : pathname.startsWith(item.href);
const Icon = item.icon;
return (
<Link key={item.href} href={item.href}>
<motion.div
className="relative flex items-center gap-3 rounded-lg px-3 py-2.5 text-sm transition-colors"
className="relative flex min-w-max items-center gap-2 rounded-lg px-3 py-2 text-sm transition-colors lg:gap-3 lg:py-2.5"
style={{ color: active ? "var(--text-accent)" : "var(--text-muted)" }}
whileHover={{ x: 2 }}
transition={{ type: "spring", stiffness: 400, damping: 30 }}
@@ -59,10 +59,10 @@ export function Sidebar() {
/>
)}
<Icon className="relative z-10 h-4 w-4" />
<span className="relative z-10 font-medium">{item.label}</span>
<span className="relative z-10 hidden font-medium sm:inline">{item.label}</span>
{active && (
<motion.div
className="absolute left-0 top-1/2 h-5 w-[2px] -translate-y-1/2 rounded-full"
className="absolute bottom-0 left-1/2 h-[2px] w-5 -translate-x-1/2 rounded-full lg:left-0 lg:top-1/2 lg:h-5 lg:w-[2px] lg:-translate-x-0 lg:-translate-y-1/2"
style={{ background: "var(--accent)" }}
layoutId="sidebar-indicator"
transition={{ type: "spring", stiffness: 350, damping: 30 }}
@@ -75,7 +75,7 @@ export function Sidebar() {
</nav>
{/* Controls */}
<div className="space-y-3 p-4 border-t" style={{ borderColor: "var(--surface-border)" }}>
<div className="hidden space-y-3 border-t p-4 lg:block" style={{ borderColor: "var(--surface-border)" }}>
{!isEmbedded && (
<div className="flex gap-1 rounded-lg p-0.5" style={{ background: "var(--row-hover)", border: "1px solid var(--surface-border)" }}>
{themes.map(({ value, icon: Icon }) => (