spb/house-ka

1// -----------------------------------------------------------------------------2// Immo-Ka — Agrégateur de propriétés à vendre (province de Québec)3// Auteur : Simon-Pierre Boucher — contact@spboucher.ai4// components/PropertyImg.tsx : image de propriété robuste5//   · <TypeFallback/> : image de secours élégante PAR TYPE DE BIEN aux couleurs6//     Immo-Ka — jamais d'icône d'image cassée ni de vide gris.7//   · <PropertyImg/> : <img> avec repli automatique si l'URL ne charge pas.8// -----------------------------------------------------------------------------9import { useState } from "react";10import { Ico } from "./Icons";1112const TYPE_ICONS: Record<string, string> = {13  "Maison": "home", "Maison mobile": "home", "Maison de ville": "home",14  "Jumelé": "home", "Chalet": "tree", "Condo": "building",15  "Duplex": "building", "Triplex": "building", "Multiplex": "building",16  "Terrain": "land", "Fermette/Agricole": "leaf", "Commercial": "cart",17};1819/** Image de secours par type de bien (gradient cerise + icône + libellé). */20export function TypeFallback({ type, label = true }: { type?: string; label?: boolean }) {21  const ico = TYPE_ICONS[type ?? ""] ?? "home";22  return (23    <div className="type-fallback" aria-label={type || "Propriété"}>24      <Ico name={ico} size={40} />25      {label && <span>{type || "Photos à venir"}</span>}26    </div>27  );28}2930/** <img> qui bascule sur l'image de secours du type si le chargement échoue. */31export default function PropertyImg({32  src, alt, type, eager = false,33}: { src?: string | null; alt: string; type?: string; eager?: boolean }) {34  const [broken, setBroken] = useState(false);35  if (!src || broken) return <TypeFallback type={type} />;36  return (37    <img38      src={src}39      alt={alt}40      loading={eager ? "eager" : "lazy"}41      decoding="async"42      onError={() => setBroken(true)}43    />44  );45}46