import type { ReactNode } from "react";
import {
  CheckCircleIcon,
  ClockIcon,
  ExclamationTriangleIcon,
  ChatBubbleLeftRightIcon,
  SparklesIcon,
} from "@heroicons/react/24/outline";
import { SUPPORT_CASE_STATUS, SUPPORT_CASE_PRIORITY } from "@customer-portal/domain/support";

/**
 * Status variant types for styling
 */
export type CaseStatusVariant = "success" | "info" | "warning" | "neutral" | "purple";
export type CasePriorityVariant = "high" | "medium" | "low" | "neutral";

/**
 * Icon size options
 */
export type IconSize = "sm" | "md";

const ICON_SIZE_CLASSES: Record<IconSize, string> = {
  sm: "h-5 w-5",
  md: "h-6 w-6",
};

/**
 * Status to icon mapping
 * Uses customer-friendly status values (internal statuses are mapped before reaching here)
 */
const STATUS_ICON_MAP: Record<string, (className: string) => ReactNode> = {
  [SUPPORT_CASE_STATUS.NEW]: cls => <SparklesIcon className={`${cls} text-primary`} />,
  [SUPPORT_CASE_STATUS.IN_PROGRESS]: cls => <ClockIcon className={`${cls} text-info`} />,
  [SUPPORT_CASE_STATUS.AWAITING_CUSTOMER]: cls => (
    <ExclamationTriangleIcon className={`${cls} text-warning`} />
  ),
  [SUPPORT_CASE_STATUS.CLOSED]: cls => <CheckCircleIcon className={`${cls} text-success`} />,
};

/**
 * Status to variant mapping
 * Uses customer-friendly status values (internal statuses are mapped before reaching here)
 */
const STATUS_VARIANT_MAP: Record<string, CaseStatusVariant> = {
  [SUPPORT_CASE_STATUS.NEW]: "purple",
  [SUPPORT_CASE_STATUS.IN_PROGRESS]: "info",
  [SUPPORT_CASE_STATUS.AWAITING_CUSTOMER]: "warning",
  [SUPPORT_CASE_STATUS.CLOSED]: "success",
};

/**
 * Priority to variant mapping
 */
const PRIORITY_VARIANT_MAP: Record<string, CasePriorityVariant> = {
  [SUPPORT_CASE_PRIORITY.HIGH]: "high",
  [SUPPORT_CASE_PRIORITY.MEDIUM]: "medium",
  [SUPPORT_CASE_PRIORITY.LOW]: "low",
};

/**
 * Tailwind class mappings for status variants
 */
const STATUS_CLASSES: Record<CaseStatusVariant, string> = {
  success: "text-success bg-success-soft",
  info: "text-info bg-info-soft",
  warning: "text-warning bg-warning-soft",
  purple: "text-primary bg-primary/10",
  neutral: "text-muted-foreground bg-muted",
};

/**
 * Tailwind class mappings for status variants with border
 */
const STATUS_CLASSES_WITH_BORDER: Record<CaseStatusVariant, string> = {
  success: "text-success bg-success-soft border-success/20",
  info: "text-info bg-info-soft border-info/20",
  warning: "text-warning bg-warning-soft border-warning/20",
  purple: "text-primary bg-primary/10 border-primary/20",
  neutral: "text-muted-foreground bg-muted border-border",
};

/**
 * Tailwind class mappings for priority variants
 */
const PRIORITY_CLASSES: Record<CasePriorityVariant, string> = {
  high: "text-danger bg-danger-soft",
  medium: "text-warning bg-warning-soft",
  low: "text-success bg-success-soft",
  neutral: "text-muted-foreground bg-muted",
};

/**
 * Tailwind class mappings for priority variants with border
 */
const PRIORITY_CLASSES_WITH_BORDER: Record<CasePriorityVariant, string> = {
  high: "text-danger bg-danger-soft border-danger/20",
  medium: "text-warning bg-warning-soft border-warning/20",
  low: "text-success bg-success-soft border-success/20",
  neutral: "text-muted-foreground bg-muted border-border",
};

/**
 * Get the icon component for a case status
 */
export function getCaseStatusIcon(status: string, size: IconSize = "sm"): ReactNode {
  const sizeClass = ICON_SIZE_CLASSES[size];
  const iconFn = STATUS_ICON_MAP[status];

  if (iconFn) {
    return iconFn(sizeClass);
  }

  return <ChatBubbleLeftRightIcon className={`${sizeClass} text-muted-foreground`} />;
}

/**
 * Get the variant type for a case status
 */
export function getCaseStatusVariant(status: string): CaseStatusVariant {
  return STATUS_VARIANT_MAP[status] ?? "neutral";
}

/**
 * Get Tailwind classes for a case status
 */
export function getCaseStatusClasses(status: string, withBorder = false): string {
  const variant = getCaseStatusVariant(status);
  return withBorder ? STATUS_CLASSES_WITH_BORDER[variant] : STATUS_CLASSES[variant];
}

/**
 * Get the variant type for a case priority
 */
export function getCasePriorityVariant(priority: string): CasePriorityVariant {
  return PRIORITY_VARIANT_MAP[priority] ?? "neutral";
}

/**
 * Get Tailwind classes for a case priority
 */
export function getCasePriorityClasses(priority: string, withBorder = false): string {
  const variant = getCasePriorityVariant(priority);
  return withBorder ? PRIORITY_CLASSES_WITH_BORDER[variant] : PRIORITY_CLASSES[variant];
}
