spb/fabri-ka

1import { Link } from 'react-router-dom'2import { formatInt, hostnameOf, Store, STORE_KIND_LABELS } from '../api'3import { IconMapPin } from './Icons'4import OriginBadge from './OriginBadge'5import StoreLogo from './StoreLogo'67export default function StoreCard({ store }: { store: Store }) {8  return (9    <Link to={`/boutiques/${encodeURIComponent(store.id)}`} className="card store-card">10      <div className="store-card-top">11        <StoreLogo12          storeId={store.id}13          name={store.name}14          logoUrl={store.logo_url}15          size="md"16        />17        <div className="store-card-heading">18          <h3 className="store-card-name">{store.name}</h3>19          <p className="store-card-domain">{hostnameOf(store.url)}</p>20        </div>21        <OriginBadge origin={store.origin_class} />22      </div>23      <p className="store-card-location">24        <IconMapPin size={14} />25        {[store.city, store.region].filter(Boolean).join(', ') || 'Québec'}26      </p>27      <div className="store-card-meta">28        {store.platform && (29          <span className="platform-badge">{store.platform}</span>30        )}31        {store.store_kind && STORE_KIND_LABELS[store.store_kind] && (32          <span className="platform-badge" title="Type de boutique">33            {STORE_KIND_LABELS[store.store_kind]}34          </span>35        )}36        <span className="store-card-count">37          {formatInt(store.product_count)} produit38          {store.product_count === 1 ? '' : 's'}39        </span>40      </div>41    </Link>42  )43}44