import Link from 'next/link'
import type { Master } from '@/lib/types'
import { ScorePill } from '@/components/ui/ScorePill'
import { CriteriaBars } from '@/components/ui/CriteriaBars'

interface Props {
  master: Master
}

export function MasterRow({ master }: Props) {
  const rankLabel = String(master.rank).padStart(2, '0')

  return (
    <tr className={master.isTop3 ? 'top-3' : ''}>
      <td><span className="rank-n">{rankLabel}</span></td>
      <td>
        <div className="master-cell-inner">
          <span
            className="school-badge"
            style={{ width: 32, height: 32, background: master.schoolColor }}
          >
            {master.schoolBadge}
          </span>
          <div>
            <Link href={`/classement/${master.slug}/`} className="master-name-cell" style={{ fontSize: '0.95rem' }}>
              {master.fullName}
            </Link>
            <span className="master-school-cell">{master.school}</span>
          </div>
        </div>
      </td>
      <td>
        <ScorePill grade={master.scoreGrade} large />
        <span style={{ fontFamily: 'var(--mono)', fontSize: '0.68rem', color: 'var(--muted)', marginLeft: '0.5rem' }}>
          {master.scoreValue.toFixed(1)} / 10
        </span>
      </td>
      <td className="col-hide-sm">
        <span style={{ fontSize: '0.75rem', color: 'var(--text-body)' }}>
          <span className="selectivity-dot" style={{ background: master.selectivityColor }} />
          {master.selectivity}
        </span>
      </td>
      <td className="col-hide-md">
        <CriteriaBars heights={master.criteriaHeights} filledCount={master.criteriaFilledCount} />
      </td>
    </tr>
  )
}