evanpage/frontend/app/home-dock.tsx

"use client";

import { Dock, DockIcon } from "@/components/ui/dock";
import { signOut } from "next-auth/react";
import { Home, User, LogOut, Download, BookOpen, LayoutDashboard } from "lucide-react";

export function HomeDock({
  isAuthenticated,
  onLoginClick,
}: {
  isAuthenticated: boolean;
  onLoginClick?: () => void;
}) {
  return (
    <div className="fixed bottom-8 left-1/2 -translate-x-1/2">
      <Dock>
        <DockIcon>
          <a href="/" aria-label="首页">
            <Home className="h-5 w-5 text-slate-700" />
          </a>
        </DockIcon>
        <DockIcon>
          <a
            href="https://file.liukersun.com"
            target="_blank"
            rel="noopener noreferrer"
            aria-label="下载网站"
          >
            <Download className="h-5 w-5 text-slate-700" />
          </a>
        </DockIcon>
        <DockIcon>
          <a
            href="https://blog.liukersun.com"
            target="_blank"
            rel="noopener noreferrer"
            aria-label="博客"
          >
            <BookOpen className="h-5 w-5 text-slate-700" />
          </a>
        </DockIcon>
        {isAuthenticated && (
          <DockIcon>
            <a href="/dashboard" aria-label="仪表盘">
              <LayoutDashboard className="h-5 w-5 text-slate-700" />
            </a>
          </DockIcon>
        )}
        <DockIcon>
          {isAuthenticated ? (
            <button
              onClick={async () => {
                await signOut({ redirect: false });
                window.location.href = "/";
              }}
              aria-label="退出"
              className="flex h-full w-full items-center justify-center"
            >
              <LogOut className="h-5 w-5 text-slate-700" />
            </button>
          ) : (
            <button
              onClick={onLoginClick}
              aria-label="登录"
              className="flex h-full w-full items-center justify-center"
            >
              <User className="h-5 w-5 text-slate-700" />
            </button>
          )}
        </DockIcon>
      </Dock>
    </div>
  );
}