'use client' import Image from 'next/image' import { motion } from 'framer-motion' import { useCountdown } from '@/hooks/useCountdown' import { cn } from '@/lib/utils' import type { Listing } from '@/lib/types' function formatMins(mins: number | null): string { if (mins === null) return '—' if (mins < 1) return '<1m' const d = Math.floor(mins / 1440) const h = Math.floor((mins % 1440) / 60) const m = Math.floor(mins % 60) return [d && `${d}d`, h && `${h}h`, `${m}m`].filter(Boolean).join(' ') } const AiBadge = ({ match }: { match: 1 | 0 | null }) => { if (match === 1) return Match if (match === 0) return Skip return } interface Props { listing: Listing; onSelect: (l: Listing) => void } export default function ListingRow({ listing, onSelect }: Props) { const getTime = useCountdown() const mins = getTime(listing.id) ?? listing.time_left_mins const isUrgent = mins !== null && mins < 60 return ( {listing.images[0] ? (
{listing.title} { e.currentTarget.style.display = 'none' }} />
) : (
)}
{listing.location && {listing.location}} {listing.location && ·} {listing.site_name}
{listing.price_raw || '—'}
{formatMins(mins)} {isUrgent && Live}
= 20 ? 'text-g-green' : listing.score >= 10 ? 'text-g-amber' : 'text-g-muted' )}> {listing.score} {listing.keyword}
) }