spb/resto-ka

1// ==============================================================================2// Author: Simon-Pierre Boucher <contact@spboucher.ai>3// File:   components/RestoCard.tsx4// Desc:   Carte de restaurant (grille de résultats) — même patron que la5//         ListingCard de Lou·Ka : prix en tête, badge de contexte de prix6//         TOUJOURS affiché (CLAUDE.md §6.2), source en pied de carte.7// ==============================================================================8import { Link } from "react-router-dom";9import {10  CONTEXT_SHORT, Restaurant, cuisineLabel, fmtPrice, sourceName, typeLabel,11} from "../api";12import { FavButton } from "../favorites";13import { IcoPlate } from "./Icons";1415export default function RestoCard({ r }: { r: Restaurant }) {16  const ms = r.menu_summary;17  const img = ms?.image || (r.images ?? [])[1] || null;   // photo de plat d'abord18  const logo = (r.images ?? [])[0] || null;19  return (20    <Link to={`/resto/${encodeURIComponent(r.uid)}`} className="card">21      <div className="card-img">22        {img ? (23          <img src={img} alt={r.name} loading="lazy" />24        ) : logo ? (25          <div className="noimg"><img className="card-logo" src={logo} alt={r.name} loading="lazy" /></div>26        ) : (27          <div className="noimg"><IcoPlate size={38} strokeWidth={1.6} /></div>28        )}29        {r.price_range && <span className="badge type">{r.price_range}</span>}30        {ms && (31          <span className={`badge right ctx ctx-${ms.price_context}`}>32            {CONTEXT_SHORT[ms.price_context] ?? ms.price_context}33          </span>34        )}35        <FavButton r={r} />36      </div>37      <div className="card-body">38        <div className="card-price">39          {ms?.price_median != null ? (40            <>41              {fmtPrice(ms.price_median)} <small>plat médian</small>42            </>43          ) : (44            <span className="no-menu">Menu à venir</span>45          )}46        </div>47        <div className="card-title">{r.name}</div>48        <div className="card-meta">49          <span>{typeLabel(r.establishment_type)}</span>50          {r.cuisines.slice(0, 2).map((c) => (51            <span key={c}>52              <span className="sep" /> {cuisineLabel(c)}53            </span>54          ))}55        </div>56        <div className="card-meta">57          {r.city && <span>{r.city}</span>}58          {r.city && r.region && <span className="sep" />}59          {r.region && <span>{r.region}</span>}60        </div>61        <div className="card-foot">62          <span className="source-tag">{sourceName(r.source)}</span>63          {ms && <span className="avail">{ms.item_count} plats au menu</span>}64        </div>65      </div>66    </Link>67  );68}69