"use client";

import * as React from "react";
import { cva, type VariantProps } from "class-variance-authority";
import { cn } from "@/lib/utils";

export type PlatformKey =
  | "wenxin"
  | "kimi"
  | "tongyi"
  | "baidu_ai"
  | "yuanbao"
  | "qingyan"
  | "doubao"
  | "tiangong"
  | "xinghuo"
  | string;

interface PlatformConfig {
  label: string;
  short: string;
  colorClass: string;
  bgClass: string;
  textClass: string;
}

const platformConfigs: Record<string, PlatformConfig> = {
  wenxin: {
    label: "文心一言",
    short: "文",
    colorClass: "border-blue-200",
    bgClass: "bg-blue-50",
    textClass: "text-blue-600",
  },
  kimi: {
    label: "Kimi",
    short: "K",
    colorClass: "border-indigo-200",
    bgClass: "bg-indigo-50",
    textClass: "text-indigo-600",
  },
  tongyi: {
    label: "通义千问",
    short: "通",
    colorClass: "border-purple-200",
    bgClass: "bg-purple-50",
    textClass: "text-purple-600",
  },
  baidu_ai: {
    label: "百度AI",
    short: "百",
    colorClass: "border-red-200",
    bgClass: "bg-red-50",
    textClass: "text-red-600",
  },
  yuanbao: {
    label: "腾讯元宝",
    short: "元",
    colorClass: "border-cyan-200",
    bgClass: "bg-cyan-50",
    textClass: "text-cyan-600",
  },
  qingyan: {
    label: "智谱清言",
    short: "智",
    colorClass: "border-violet-200",
    bgClass: "bg-violet-50",
    textClass: "text-violet-600",
  },
  doubao: {
    label: "豆包",
    short: "豆",
    colorClass: "border-amber-200",
    bgClass: "bg-amber-50",
    textClass: "text-amber-600",
  },
  tiangong: {
    label: "天工AI",
    short: "天",
    colorClass: "border-sky-200",
    bgClass: "bg-sky-50",
    textClass: "text-sky-600",
  },
  xinghuo: {
    label: "讯飞星火",
    short: "星",
    colorClass: "border-orange-200",
    bgClass: "bg-orange-50",
    textClass: "text-orange-600",
  },
};

const fallbackConfig: PlatformConfig = {
  label: "未知平台",
  short: "?",
  colorClass: "border-border",
  bgClass: "bg-muted",
  textClass: "text-muted-foreground",
};

const platformBadgeVariants = cva(
  "inline-flex items-center gap-1.5 rounded-md border font-medium transition-colors duration-200",
  {
    variants: {
      size: {
        sm: "px-2 py-0.5 text-xs",
        default: "px-2.5 py-1 text-xs",
        lg: "px-3 py-1.5 text-sm",
      },
      showIcon: {
        true: "",
        false: "",
      },
    },
    defaultVariants: {
      size: "default",
      showIcon: true,
    },
  }
);

export interface PlatformBadgeProps
  extends React.HTMLAttributes<HTMLDivElement>,
    Omit<VariantProps<typeof platformBadgeVariants>, "showIcon"> {
  platform: PlatformKey;
  /** 自定义标签文字（默认用平台名称） */
  label?: string;
  /** 是否显示左侧图标圆点 */
  showIcon?: boolean;
  /** 是否只显示icon不显示文字 */
  iconOnly?: boolean;
}

const PlatformBadge = React.forwardRef<HTMLDivElement, PlatformBadgeProps>(
  ({ className, platform, label, showIcon = true, iconOnly = false, size, ...props }, ref) => {
    const config = platformConfigs[platform] ?? { ...fallbackConfig, label: platform, short: platform.slice(0, 1).toUpperCase() };
    const displayLabel = label ?? config.label;

    return (
      <div
        ref={ref}
        className={cn(
          platformBadgeVariants({ size, showIcon }),
          config.bgClass,
          config.colorClass,
          config.textClass,
          className
        )}
        title={displayLabel}
        {...props}
      >
        {showIcon && (
          <span
            className={cn(
              "flex items-center justify-center rounded font-bold shrink-0",
              size === "lg" ? "h-4.5 w-4.5 text-xs" : "h-4 w-4 text-[10px]"
            )}
          >
            {config.short}
          </span>
        )}
        {!iconOnly && <span>{displayLabel}</span>}
      </div>
    );
  }
);
PlatformBadge.displayName = "PlatformBadge";

export { PlatformBadge, platformConfigs };
