import React from 'react'
import {
  artifactPath,
  artifactTypeLabel,
  compactSkillDisplayRows,
  formatClubPercent,
} from '../../utils/skillProfileListHelpers'

function formatWeight(value) {
  const n = Number(value)
  if (!Number.isFinite(n)) return '0'
  return n % 1 === 0 ? String(n) : n.toFixed(1)
}

/**
 * Kompakte Fähigkeiten-Zeile für Listen/Kacheln.
 */
export default function SkillProfileCompact({
  summary,
  skillIds = [],
  loading = false,
  emptyText = 'Noch keine Übungen mit Fähigkeiten',
  displayLimit = 6,
  showClubBest = true,
}) {
  if (loading) {
    return <p className="skill-profile-compact skill-profile-compact--loading form-sub">Fähigkeiten werden berechnet…</p>
  }

  const rows = compactSkillDisplayRows(summary, { skillIds, limit: displayLimit })

  if (!rows.length) {
    return summary ? (
      <p className="skill-profile-compact skill-profile-compact--empty form-sub">{emptyText}</p>
    ) : null
  }

  return (
    <div className="skill-profile-compact">
      <span className="skill-profile-compact__label">Fähigkeiten</span>
      <ul className="skill-profile-compact__list">
        {rows.map((sk) => {
          const best = sk.club_best
          const path = showClubBest && best ? artifactPath(best) : null
          return (
            <li key={sk.skill_id} className="skill-profile-compact__item">
              <span className="skill-profile-compact__name" title={sk.skill_name}>
                {sk.skill_name}
              </span>
              <span className="skill-profile-compact__metric" title="Trainingsgewicht und Anteil am Vereins-Maximum">
                {formatWeight(sk.weight)} · {formatClubPercent(sk.universal_percent)} Verein
              </span>
              {showClubBest && best && path && sk.universal_percent != null && sk.universal_percent < 100 ? (
                <span className="skill-profile-compact__best form-sub">
                  Vereins-Top: {artifactTypeLabel(best.artifact_type)} „{best.artifact_title || best.artifact_id}“ (
                  {formatWeight(best.weight)})
                </span>
              ) : sk.universal_percent >= 100 ? (
                <span className="skill-profile-compact__best form-sub">Stärkste Vereins-Nutzung dieser Fähigkeit</span>
              ) : null}
            </li>
          )
        })}
      </ul>
    </div>
  )
}