38 lines
1.2 KiB
TypeScript
38 lines
1.2 KiB
TypeScript
|
"use client";
|
||
|
|
|
||
|
|
import { AccountSwitcher } from "@/components/layout/account-switcher";
|
||
|
|
import { ThemeToggle } from "@/components/theme-toggle";
|
||
|
|
|
||
|
|
interface SidebarUtilitiesProps {
|
||
|
|
userEmail?: string | null;
|
||
|
|
onLogout?: () => void;
|
||
|
|
}
|
||
|
|
|
||
|
|
export function SidebarUtilities({ userEmail, onLogout }: SidebarUtilitiesProps) {
|
||
|
|
return (
|
||
|
|
<div className="mt-5 space-y-3 border-t border-border pt-4">
|
||
|
|
<div className="px-2">
|
||
|
|
<p className="mb-2 text-[11px] text-muted-foreground">經營帳號</p>
|
||
|
|
<AccountSwitcher />
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="flex items-center justify-between gap-2 px-2">
|
||
|
|
<span className="text-[11px] text-muted-foreground">外觀</span>
|
||
|
|
<ThemeToggle compact />
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="flex items-center justify-between gap-2 px-2 pb-1">
|
||
|
|
<p className="min-w-0 truncate text-[11px] text-muted-foreground">{userEmail ?? "已登入"}</p>
|
||
|
|
{onLogout && (
|
||
|
|
<button
|
||
|
|
type="button"
|
||
|
|
onClick={onLogout}
|
||
|
|
className="shrink-0 text-[11px] text-muted-foreground outline-none transition-colors hover:text-foreground focus-visible:text-foreground"
|
||
|
|
>
|
||
|
|
登出
|
||
|
|
</button>
|
||
|
|
)}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|