'use client';
import React from 'react';
import Link from 'next/link';
import { formatScore, countdown } from '../lib/format';
function TeamOrb({ code, tone, logoUrl }: { code: string; tone: 'a' | 'b'; logoUrl?: string }) {
const bg =
tone === 'a'
? 'bg-gradient-to-br from-sky-600 to-blue-800'
: 'bg-gradient-to-br from-orange-400 to-orange-600';
if (logoUrl) {
// eslint-disable-next-line @next/next/no-img-element
return (
);
}
return (
{(code || 'T').slice(0, 3).toUpperCase()}
);
}
export function MatchCard({ match }: { match: any }) {
const a = match.teamA?.shortName || match.teamA?.name || 'T1';
const b = match.teamB?.shortName || match.teamB?.name || 'T2';
const isLive = match.status === 'LIVE';
const isDone = match.status === 'COMPLETED';
const isUpcoming = match.status === 'SCHEDULED';
const fantasyOn = match.fantasyEnabled !== false;
const href =
isUpcoming && fantasyOn ? `/fantasy?matchId=${match._id}` : `/matches/${match._id}`;
const cta = isUpcoming ? (fantasyOn ? 'Join' : 'View') : isLive ? 'Live' : 'Score';
const when = new Date(match.startTime).toLocaleString(undefined, {
day: 'numeric',
month: 'short',
hour: '2-digit',
minute: '2-digit',
});
return (
{/* Compact meta row */}
{match.tournamentId?.title || match.venue || 'Cricket'}
{isLive ? (
Live
) : isDone ? (
Done
) : (
{countdown(match.startTime)}
)}
{/* Teams — single dense row */}
{a}
{(isLive || isDone) && (
{formatScore(match.teamA)}
)}
vs
{b}
{(isLive || isDone) && (
{formatScore(match.teamB)}
)}
{/* Footer CTA strip */}
{when}
{cta}
);
}