import { Clock, Tag, Link2, ExternalLink, Edit2, Trash2 } from 'lucide-react';
import { decodeHtmlEntities, getDisplayMembers, getCategoryInfo, getScheduleTime } from '@/utils';

/**
 * PC 관리자 일정 카드 컴포넌트
 * 관리자 일정 관리 페이지에서 사용
 * 편집/삭제 버튼 포함
 */
function AdminScheduleCard({
  schedule,
  onEdit,
  onDelete,
  className = '',
}) {
  const scheduleDate = new Date(schedule.date);
  const today = new Date();
  const currentYear = today.getFullYear();
  const currentMonth = today.getMonth();

  const scheduleYear = scheduleDate.getFullYear();
  const scheduleMonth = scheduleDate.getMonth();
  const isCurrentYear = scheduleYear === currentYear;
  const isCurrentMonth = isCurrentYear && scheduleMonth === currentMonth;

  const categoryInfo = getCategoryInfo(schedule);
  const timeStr = getScheduleTime(schedule);
  const displayMembers = getDisplayMembers(schedule);
  const sourceName = schedule.source?.name;
  const sourceUrl = schedule.source?.url;
  const isBirthday = schedule.is_birthday || String(schedule.id).startsWith('birthday-');

  const dayNames = ['일', '월', '화', '수', '목', '금', '토'];

  return (
    <div className={`p-6 hover:bg-gray-50 transition-colors group ${className}`}>
      <div className="flex items-start gap-4">
        {/* 날짜 영역 */}
        <div className="w-20 text-center flex-shrink-0">
          {!isCurrentYear && (
            <div className="text-xs text-gray-400 mb-0.5">
              {scheduleYear}.{scheduleMonth + 1}
            </div>
          )}
          {isCurrentYear && !isCurrentMonth && (
            <div className="text-xs text-gray-400 mb-0.5">
              {scheduleMonth + 1}월
            </div>
          )}
          <div className="text-2xl font-bold text-gray-900">
            {scheduleDate.getDate()}
          </div>
          <div className="text-sm text-gray-500">
            {dayNames[scheduleDate.getDay()]}요일
          </div>
        </div>

        {/* 색상 바 */}
        <div
          className="w-1.5 rounded-full flex-shrink-0 self-stretch"
          style={{ backgroundColor: categoryInfo.color }}
        />

        {/* 스케줄 내용 */}
        <div className="flex-1 min-w-0">
          <h3 className="font-semibold text-gray-900">
            {decodeHtmlEntities(schedule.title)}
          </h3>
          <div className="flex items-center gap-3 mt-1 text-sm text-gray-500">
            {timeStr && (
              <span className="flex items-center gap-1">
                <Clock size={14} />
                {timeStr}
              </span>
            )}
            {categoryInfo.name && (
              <span className="flex items-center gap-1">
                <Tag size={14} />
                {categoryInfo.name}
              </span>
            )}
            {sourceName && (
              <span className="flex items-center gap-1">
                <Link2 size={14} />
                {sourceName}
              </span>
            )}
          </div>
          {displayMembers.length > 0 && (
            <div className="flex flex-wrap gap-1.5 mt-2">
              {displayMembers.map((name, i) => (
                <span
                  key={i}
                  className="px-2 py-0.5 bg-primary/10 text-primary text-xs font-medium rounded-full"
                >
                  {name}
                </span>
              ))}
            </div>
          )}
        </div>

        {/* 액션 버튼 (생일 일정은 수정/삭제 불가) */}
        {!isBirthday && (
          <div className="flex items-center gap-2 opacity-0 group-hover:opacity-100 transition-opacity">
            {sourceUrl && (
              <a
                href={sourceUrl}
                target="_blank"
                rel="noopener noreferrer"
                onClick={(e) => e.stopPropagation()}
                className="p-2 hover:bg-blue-100 rounded-lg transition-colors text-blue-500"
              >
                <ExternalLink size={18} />
              </a>
            )}
            {onEdit && (
              <button
                onClick={() => onEdit(schedule)}
                className="p-2 hover:bg-gray-200 rounded-lg transition-colors text-gray-500"
              >
                <Edit2 size={18} />
              </button>
            )}
            {onDelete && (
              <button
                onClick={() => onDelete(schedule)}
                className="p-2 hover:bg-red-100 rounded-lg transition-colors text-red-500"
              >
                <Trash2 size={18} />
              </button>
            )}
          </div>
        )}
      </div>
    </div>
  );
}

export default AdminScheduleCard;
