"use client";

import Link from "next/link";
import { usePathname } from "next/navigation";
import { ChevronRight } from "lucide-react";

import { getWorkspaceHref, getWorkspacePathFromPathname, getWorkspaceSlugFromPathname } from "@/modules/shared/lib/workspace-routing";

type BreadcrumbItem = {
  href?: string;
  label: string;
};

const routeLabels: Record<string, string> = {
  "/dashboard": "运营看板",
  "/elders": "老人档案",
  "/beds": "床位房间",
  "/health": "健康照护",
  "/care": "护理服务",
  "/emergency": "安全应急",
  "/devices": "设备运维",
  "/notices": "公告通知",
  "/alerts": "规则预警",
  "/family": "家属服务",
  "/settings/global": "全局配置",
  "/settings/organizations": "机构管理",
  "/settings/users": "用户管理",
  "/settings/roles": "角色权限",
  "/settings/audit": "审计日志",
  "/settings/status": "运行状态",
};

function getBreadcrumbs(pathname: string): BreadcrumbItem[] {
  const workspacePath = getWorkspacePathFromPathname(pathname);
  const organizationSlug = getWorkspaceSlugFromPathname(pathname);

  if (workspacePath === "/dashboard") {
    return [{ label: "工作台" }];
  }

  if (workspacePath.startsWith("/settings/organizations/")) {
    return [
      { href: getWorkspaceHref(organizationSlug, "/dashboard"), label: "工作台" },
      { href: getWorkspaceHref(organizationSlug, "/settings/users"), label: "管理系统" },
      { href: getWorkspaceHref(organizationSlug, "/settings/organizations"), label: "机构管理" },
      { label: "机构详情" },
    ];
  }

  if (workspacePath.startsWith("/settings")) {
    return [
      { href: getWorkspaceHref(organizationSlug, "/dashboard"), label: "工作台" },
      { href: getWorkspaceHref(organizationSlug, "/settings/users"), label: "管理系统" },
      { label: routeLabels[workspacePath] ?? "设置" },
    ];
  }

  return [
    { href: getWorkspaceHref(organizationSlug, "/dashboard"), label: "工作台" },
    { label: routeLabels[workspacePath] ?? "工作区" },
  ];
}

export function AppBreadcrumbs(): React.ReactElement {
  const pathname = usePathname();
  const breadcrumbs = getBreadcrumbs(pathname);

  return (
    <nav aria-label="面包屑" className="flex min-w-0 items-center gap-1 text-sm">
      {breadcrumbs.map((item, index) => {
        const isLast = index === breadcrumbs.length - 1;

        return (
          <span className="flex min-w-0 items-center gap-1" key={`${item.label}-${index}`}>
            {index > 0 ? <ChevronRight className="size-3.5 shrink-0 text-muted-foreground" aria-hidden="true" /> : null}
            {item.href && !isLast ? (
              <Link className="shrink-0 font-medium hover:text-primary" href={item.href}>
                {item.label}
              </Link>
            ) : (
              <span className={isLast ? "min-w-0 truncate text-muted-foreground" : "shrink-0 font-medium"}>{item.label}</span>
            )}
          </span>
        );
      })}
    </nav>
  );
}