import { getApprovedListings } from '@/lib/listings'
import { AgentListingsGrid } from './AgentListingsGrid'
import type { Language } from '@/lib/i18n'

/**
 * Server component que fetcha los listings aprobados y los pasa al grid.
 * Usar como contenido del tab "Agent Listings" en HomePropertiesCarousel
 * o como sección independiente en /[lang]/agent-listings.
 */
export async function AgentListingsTab({
  lang,
  limit = 6,
}: {
  lang: Language
  limit?: number
}) {
  const listings = await getApprovedListings({ limit })

  return (
    <AgentListingsGrid
      listings={listings.map((l) => ({
        id: l.id,
        slug: l.slug,
        title: l.title,
        titleEs: l.titleEs,
        titleFr: l.titleFr,
        priceUsd: l.priceUsd,
        beds: l.beds,
        baths: l.baths,
        sqft: l.sqft,
        images: l.images.map((i) => ({
          id: i.id,
          path: i.path,
          alt: i.alt,
          isCover: i.isCover,
        })),
        agent: {
          id: l.agent.id,
          name: l.agent.name,
          phone: l.agent.phone,
          whatsapp: l.agent.whatsapp,
          photoUrl: l.agent.photoUrl,
        },
      }))}
      lang={lang}
    />
  )
}