"use client"
import {
  Card,
  CardBody,
  CardHeader,
  CardIcon
} from "@/components/window/Card"
import { cn } from "@heroui/react"
import {
  AssemblyLine, SettingConfig, Videocamera
} from "@icon-park/react"
import { usePathname, useRouter } from "next/navigation"
// import { platform } from "@tauri-apps/plugin-os"

export default function PreferenceLayout({
  children,
}: { children: React.ReactNode }) {
  const router = useRouter()
  const pathname = usePathname()

  return (
    <Card className="max-w-full">
      <CardHeader>
        <CardIcon
          type="menu"
          onClick={() => router.push("/preference/general")}
          className={cn(pathname === "/preference/general" && "bg-black/5 dark:bg-white/5")}
        >
          <SettingConfig /> 通用
        </CardIcon>
        <CardIcon
          type="menu"
          onClick={() => router.push("/preference/path")}
          className={cn(pathname === "/preference/path" && "bg-black/5 dark:bg-white/5")}
        >
          <AssemblyLine /> 路径
        </CardIcon>
        <CardIcon
          type="menu"
          onClick={() => router.push("/preference/replay")}
          className={cn(pathname === "/preference/replay" && "bg-black/5 dark:bg-white/5")}
        >
          <Videocamera /> 录像
        </CardIcon>

        {/* TODO 完善云同步等功能 */}
        {/* <CardTool>
          <ToolButton>
            <UploadOne />
            云同步
          </ToolButton>
          <ToolButton>
            <HardDisk />
            保存
          </ToolButton>
        </CardTool> */}
      </CardHeader>
      <CardBody>{children}</CardBody>
    </Card>
  )
}
