import { Tag, Badge, Tooltip } from 'antd';
import {
  CheckCircleOutlined,
  ClockCircleOutlined,
  CloseCircleOutlined,
  ExclamationCircleOutlined,
  MinusCircleOutlined,
  SyncOutlined,
  LockOutlined,
} from '@ant-design/icons';

export type StatusType =
  | 'active'
  | 'inactive'
  | 'pending'
  | 'error'
  | 'success'
  | 'warning'
  | 'info'
  | 'draft'
  | 'closed'
  | 'locked'
  | 'processing';

export interface StatusBadgeProps {
  /** Status type determines color and icon */
  status: StatusType;
  /** Text to display in the badge */
  text?: string;
  /** Whether to show the icon */
  showIcon?: boolean;
  /** Custom icon override */
  icon?: React.ReactNode;
  /** Tooltip text */
  tooltip?: string;
  /** Size of the badge */
  size?: 'small' | 'default';
  /** Whether to show as dot only (for compact displays) */
  dot?: boolean;
}

const statusConfig: Record<
  StatusType,
  {
    color: string;
    icon: React.ReactNode;
    defaultText: string;
  }
> = {
  active: {
    color: 'green',
    icon: <CheckCircleOutlined />,
    defaultText: 'Aktiv',
  },
  inactive: {
    color: 'default',
    icon: <MinusCircleOutlined />,
    defaultText: 'Inaktiv',
  },
  pending: {
    color: 'orange',
    icon: <ClockCircleOutlined />,
    defaultText: 'Afventer',
  },
  error: {
    color: 'red',
    icon: <CloseCircleOutlined />,
    defaultText: 'Fejl',
  },
  success: {
    color: 'green',
    icon: <CheckCircleOutlined />,
    defaultText: 'Succces',
  },
  warning: {
    color: 'orange',
    icon: <ExclamationCircleOutlined />,
    defaultText: 'Advarsel',
  },
  info: {
    color: 'blue',
    icon: <ExclamationCircleOutlined />,
    defaultText: 'Info',
  },
  draft: {
    color: 'default',
    icon: <MinusCircleOutlined />,
    defaultText: 'Kladde',
  },
  closed: {
    color: 'default',
    icon: <LockOutlined />,
    defaultText: 'Lukket',
  },
  locked: {
    color: 'default',
    icon: <LockOutlined />,
    defaultText: 'Låst',
  },
  processing: {
    color: 'blue',
    icon: <SyncOutlined spin />,
    defaultText: 'Behandles',
  },
};

/**
 * A consistent badge/tag component for displaying status.
 *
 * @example
 * <StatusBadge status="active" />
 * <StatusBadge status="pending" text="Afventer godkendelse" />
 * <StatusBadge status="error" showIcon tooltip="Fejl ved behandling" />
 */
export function StatusBadge({
  status,
  text,
  showIcon = true,
  icon,
  tooltip,
  size = 'default',
  dot = false,
}: StatusBadgeProps) {
  const config = statusConfig[status];

  if (dot) {
    const badge = <Badge status={status === 'active' || status === 'success' ? 'success' : status === 'error' ? 'error' : status === 'pending' || status === 'warning' ? 'warning' : status === 'processing' ? 'processing' : 'default'} text={text || config.defaultText} />;

    return tooltip ? <Tooltip title={tooltip}>{badge}</Tooltip> : badge;
  }

  const tag = (
    <Tag
      color={config.color}
      icon={showIcon ? (icon || config.icon) : undefined}
      style={size === 'small' ? { fontSize: 11, padding: '0 4px', lineHeight: '18px' } : undefined}
    >
      {text || config.defaultText}
    </Tag>
  );

  return tooltip ? <Tooltip title={tooltip}>{tag}</Tooltip> : tag;
}

/**
 * Fiscal year specific status badge
 */
export type FiscalYearStatus = 'active' | 'closed' | 'future';

const fiscalYearStatusConfig: Record<FiscalYearStatus, { status: StatusType; text: string }> = {
  active: { status: 'active', text: 'Aktiv' },
  closed: { status: 'closed', text: 'Lukket' },
  future: { status: 'pending', text: 'Fremtidig' },
};

export function FiscalYearStatusBadge({ status }: { status: FiscalYearStatus }) {
  const config = fiscalYearStatusConfig[status];
  return <StatusBadge status={config.status} text={config.text} />;
}

/**
 * Account status badge
 */
export type AccountStatus = 'active' | 'inactive' | 'locked';

export function AccountStatusBadge({ status }: { status: AccountStatus }) {
  return <StatusBadge status={status} />;
}

/**
 * Transaction status badge
 */
export type TransactionStatus = 'posted' | 'pending' | 'draft' | 'cancelled';

const transactionStatusConfig: Record<TransactionStatus, { status: StatusType; text: string }> = {
  posted: { status: 'success', text: 'Bogført' },
  pending: { status: 'pending', text: 'Afventer' },
  draft: { status: 'draft', text: 'Kladde' },
  cancelled: { status: 'inactive', text: 'Annulleret' },
};

export function TransactionStatusBadge({ status }: { status: TransactionStatus }) {
  const config = transactionStatusConfig[status];
  return <StatusBadge status={config.status} text={config.text} />;
}

/**
 * Count badge - shows a count with a status color
 */
export interface CountBadgeProps {
  count: number;
  label: string;
  status?: StatusType;
  showZero?: boolean;
}

export function CountBadge({ count, label, status = 'info', showZero = false }: CountBadgeProps) {
  if (count === 0 && !showZero) return null;

  return (
    <Tag color={statusConfig[status].color}>
      {count} {label}
    </Tag>
  );
}

export default StatusBadge;
