// Open Marketplace — data + placeholder thumbs
// Public marketplace: contractors, homeowners, vendors.

// ── Placeholder thumbs (abstract gradients + light pattern; real photos come later) ──
function MPThumb({ kind }) {
  const palettes = {
    "shingle-charcoal":  ["#3b3a36", "#5a5953"],
    "shingle-driftwood": ["#937d5e", "#bda480"],
    "shingle-weathered": ["#7a6c54", "#9d8b6c"],
    "underlayment":      ["#2a3d6c", "#445c8c"],
    "ice-water":         ["#1f2630", "#3a4452"],
    "drip-edge":         ["#dcd7c9", "#b7b0a1"],
    "nails":             ["#7a7064", "#a39684"],
    "ridge-vent":        ["#b5ad9a", "#8d8676"],
    "equipter":          ["#8a4a3a", "#b06a52"],
    "hoist":             ["#5a6a4a", "#7d8f66"],
    "trailer":           ["#4a4a52", "#6c6c78"],
    "forklift":          ["#a8842a", "#c7a24a"],
    "compressor":        ["#3a5a6a", "#5a7d8f"],
    "crane":             ["#6a5a3a", "#8f7d5a"],
  };
  const [a, b] = palettes[kind] || ["#8a8275", "#b5ac9a"];
  const gid = "mp_g_" + kind;
  return (
    <svg viewBox="0 0 200 140" width="100%" height="100%" preserveAspectRatio="none" style={{ display: "block" }}>
      <defs>
        <linearGradient id={gid} x1="0" x2="1" y1="0" y2="1">
          <stop offset="0%" stopColor={a} />
          <stop offset="100%" stopColor={b} />
        </linearGradient>
      </defs>
      <rect width="200" height="140" fill={"url(#" + gid + ")"} />
      {kind.startsWith("shingle") && Array.from({ length: 6 }).map((_, r) =>
        Array.from({ length: 7 }).map((_, c) => (
          <rect key={r + "-" + c}
                x={c * 32 + (r % 2 ? -16 : 0)} y={r * 18 + 10}
                width="28" height="14" rx="1"
                fill={r % 2 ? a : b} opacity="0.55" stroke="rgba(0,0,0,0.12)" />
        ))
      )}
      {!kind.startsWith("shingle") && (
        <g opacity="0.35">{Array.from({ length: 8 }).map((_, i) => (
          <line key={i} x1="0" y1={i * 22 - 10} x2="200" y2={i * 22 - 40} stroke="#fff" strokeOpacity="0.22" strokeWidth="1.2" />
        ))}</g>
      )}
      <text x="12" y="128" fontFamily="Inter, sans-serif" fontSize="9" fill="rgba(255,255,255,0.55)" letterSpacing="1.5">PHOTO</text>
    </svg>
  );
}

// ── Real listing photos (generated) ──
const MP_CDN = "assets/marketplace/";
const MP_PHOTOS = {
  m1: MP_CDN + "hf_20260714_024808_c843f72f-5ad2-4150-b4a7-852dc5d2ecd6.png",
  m2: MP_CDN + "hf_20260714_024809_36098faa-8061-4f49-bc22-a9ef5862a9bf.png",
  m3: MP_CDN + "hf_20260714_024811_c86014ee-22d0-43f8-ba11-af7dc70ae05b.png",
  m4: MP_CDN + "hf_20260714_024812_7c2c9779-4203-472a-96ba-23130d7b983d.png",
  m5: MP_CDN + "hf_20260714_024814_95773bf9-7a29-46be-82ec-f9e1887e2f99.png",
  m6: MP_CDN + "hf_20260714_024814_92efd26d-7501-44fa-bf35-b202a7a1dc1b.png",
  m7: MP_CDN + "hf_20260714_024816_7188cb59-e546-43fe-8798-9d313acd3bc1.png",
  m8: MP_CDN + "hf_20260714_024817_1187de4b-a364-4228-9897-0e698bd2f6a4.png",
  q1: MP_CDN + "hf_20260714_024901_2cf3bae9-befd-4b92-9f62-cba4bc5c58ed.png",
  q2: MP_CDN + "hf_20260714_024902_527e9bbc-957c-4673-9863-33714673809c.png",
  q3: MP_CDN + "hf_20260714_024903_b40b7347-b35c-422f-a75e-9e17202fb39f.png",
  q4: MP_CDN + "hf_20260714_024904_3e25c68e-8345-4ff4-ad99-d0cb3a0cae87.png",
  q5: MP_CDN + "hf_20260714_024905_601619e1-a9b9-418c-9b69-a72d6423d4df.png",
  q6: MP_CDN + "hf_20260714_024827_084ef3d6-eeeb-4a4c-88a7-7f8eb26f8c4c.png",
};
const MP_HERO = MP_CDN + "hf_20260714_024829_5736a0b8-380e-4ec6-b2be-a46acadce0b2.png";

// Photo with shimmer-in + gradient fallback. Parent must be position:relative.
function MPPhoto({ item, alt }) {
  const [loaded, setLoaded] = React.useState(false);
  const [err, setErr] = React.useState(false);
  const url = MP_PHOTOS[item.id];
  if (!url || err) return <MPThumb kind={item.thumb} />;
  return (
    <div style={{ position: "absolute", inset: 0, overflow: "hidden" }}>
      {!loaded && <div className="mpx-shimmer" />}
      <img src={url} alt={alt || item.title} loading="lazy"
           onLoad={() => setLoaded(true)} onError={() => setErr(true)}
           className="mpx-img"
           style={{ width: "100%", height: "100%", objectFit: "cover", display: "block", opacity: loaded ? 1 : 0 }} />
    </div>
  );
}

// ── Live activity feed (social proof ticker) ──
const MP_ACTIVITY = [
  { who: "Marco V.", what: "rented the telehandler", where: "Phoenix", ago: "2 min" },
  { who: "Danielle R.", what: "requested 3 quotes", where: "Mesa", ago: "4 min" },
  { who: "Northcrest Roofing", what: "listed 42 bundles of shingles", where: "Mesa", ago: "11 min" },
  { who: "J. Whitfield", what: "saved the Equipter RB4000", where: "Chandler", ago: "16 min" },
  { who: "Sol Valley Homes", what: "booked a crane half-day", where: "Tempe", ago: "24 min" },
  { who: "Rita M.", what: "messaged Cardenas Roofing", where: "Gilbert", ago: "31 min" },
];

// ── Sellers ──
const MP_SELLERS = {
  ridgeline: { name: "Ridgeline Exteriors", type: "Contractor", rating: 4.9, reviews: 212, verified: true, member: true,  resp: "~1 hr",  grad: "linear-gradient(140deg,#2C4A3E,#6B8A66)" },
  cardenas:  { name: "Cardenas Roofing",    type: "Contractor", rating: 4.8, reviews: 164, verified: true, member: true,  resp: "~2 hr",  grad: "linear-gradient(140deg,#4A3F30,#847562)" },
  summit:    { name: "Summit Roof Co.",     type: "Contractor", rating: 4.7, reviews: 98,  verified: true, member: false, resp: "~4 hr",  grad: "linear-gradient(140deg,#3E5A6B,#6E8CA0)" },
  halcon:    { name: "Halcón Roofing",      type: "Contractor", rating: 4.6, reviews: 45,  verified: false, member: false, resp: "~1 day", grad: "linear-gradient(140deg,#6B4A2C,#A0784E)" },
  abc:       { name: "Peak Supply Outlet",  type: "Vendor",     rating: 4.8, reviews: 310, verified: true, member: false, resp: "~30 min", grad: "linear-gradient(140deg,#5A3A4A,#8F5A72)" },
  petes:     { name: "Pete's Equipment",    type: "Vendor",     rating: 4.7, reviews: 129, verified: true, member: false, resp: "~2 hr",  grad: "linear-gradient(140deg,#3A3A5A,#5A5A8F)" },
};

// ── Materials listings ──
const MP_MATERIALS = [
  { id: "m1", title: "Architectural shingles — Charcoal", detail: "42 bundles · GAF Timberline HDZ", price: 28, unit: "/bundle", cond: "Surplus", cat: "Shingles", loc: "Mesa, AZ", dist: 12, seller: "ridgeline", thumb: "shingle-charcoal" },
  { id: "m2", title: "Driftwood shingles — full pallet", detail: "36 bundles · Owens Corning Duration", price: 24, unit: "/bundle", cond: "Surplus", cat: "Shingles", loc: "Chandler, AZ", dist: 8, seller: "cardenas", thumb: "shingle-driftwood" },
  { id: "m3", title: "Synthetic underlayment", detail: "10 rolls · 10 sq each", price: 89, unit: "/roll", cond: "New", cat: "Underlayment", loc: "Phoenix, AZ", dist: 15, seller: "abc", thumb: "underlayment" },
  { id: "m4", title: "Ice & water shield", detail: "6 rolls · 2 sq each", price: 95, unit: "/roll", cond: "New", cat: "Underlayment", loc: "Tempe, AZ", dist: 22, seller: "summit", thumb: "ice-water" },
  { id: "m5", title: "Drip edge F5 — white", detail: "120 pieces · 10 ft aluminum", price: 9, unit: "/pc", cond: "New", cat: "Flashing", loc: "Gilbert, AZ", dist: 5, seller: "halcon", thumb: "drip-edge" },
  { id: "m6", title: "Coil roofing nails 1¼\"", detail: "20 boxes · 7,200 ct", price: 38, unit: "/box", cond: "New", cat: "Fasteners", loc: "Phoenix, AZ", dist: 15, seller: "abc", thumb: "nails" },
  { id: "m7", title: "Ridge vent — 4 ft sections", detail: "60 pieces · shingle-over", price: 11, unit: "/pc", cond: "Surplus", cat: "Ventilation", loc: "Tempe, AZ", dist: 22, seller: "summit", thumb: "ridge-vent" },
  { id: "m8", title: "Weathered Wood shingles", detail: "18 bundles · open box", price: 22, unit: "/bundle", cond: "Used", cat: "Shingles", loc: "Gilbert, AZ", dist: 5, seller: "halcon", thumb: "shingle-weathered" },
];
const MP_MATERIAL_CATS = ["All", "Shingles", "Underlayment", "Flashing", "Fasteners", "Ventilation"];

// ── Machinery rentals ──
const MP_MACHINERY = [
  { id: "q1", title: "Equipter RB4000 debris lift", detail: "Self-propelled · 4,000 lb", price: 189, unit: "/day", cond: "Rental", cat: "Lifts", loc: "Mesa, AZ", dist: 12, seller: "ridgeline", thumb: "equipter" },
  { id: "q2", title: "Shingle ladder hoist — 28 ft", detail: "400 lb capacity · gas", price: 75, unit: "/day", cond: "Rental", cat: "Hoists", loc: "Chandler, AZ", dist: 8, seller: "cardenas", thumb: "hoist" },
  { id: "q3", title: "Dump trailer 14k GVWR", detail: "14 ft · hydraulic", price: 120, unit: "/day", cond: "Rental", cat: "Hauling", loc: "Phoenix, AZ", dist: 18, seller: "petes", thumb: "trailer" },
  { id: "q4", title: "Telehandler 6k reach forklift", detail: "42 ft reach · JLG", price: 240, unit: "/day", cond: "Rental", cat: "Lifts", loc: "Phoenix, AZ", dist: 18, seller: "petes", thumb: "forklift" },
  { id: "q5", title: "Compressor + 3 coil nailer kit", detail: "8 gal twin-stack · hoses incl.", price: 55, unit: "/day", cond: "Rental", cat: "Tools", loc: "Gilbert, AZ", dist: 5, seller: "halcon", thumb: "compressor" },
  { id: "q6", title: "Crane with operator — half day", detail: "40-ton · certified operator", price: 580, unit: "/half-day", cond: "Rental", cat: "Cranes", loc: "Tempe, AZ", dist: 22, seller: "summit", thumb: "crane" },
];
const MP_MACHINERY_CATS = ["All", "Lifts", "Hoists", "Hauling", "Tools", "Cranes"];

// ── Vetted roofers (homeowner side) ──
const MP_ROOFERS = [
  { id: "r1", seller: "ridgeline", years: 14, jobs: 1240, specialties: ["Asphalt", "Metal"], quote: "Re-roofed our whole house in two days. Spotless cleanup.", city: "Mesa, AZ" },
  { id: "r2", seller: "cardenas", years: 11, jobs: 980, specialties: ["Tile", "Flat / Foam"], quote: "Fixed a leak two other companies couldn't find.", city: "Chandler, AZ" },
  { id: "r3", seller: "summit", years: 9, jobs: 640, specialties: ["Asphalt", "Shake"], quote: "Fair price, showed up when they said they would.", city: "Tempe, AZ" },
  { id: "r4", seller: "halcon", years: 6, jobs: 310, specialties: ["Repairs", "Coatings"], quote: "Quick repair after the monsoon, honest about what we didn't need.", city: "Gilbert, AZ" },
];

const MP_JOB_TYPES = [
  { id: "repair", label: "Repair a leak", icon: "M12 2v6m0 0l-3-3m3 3l3-3M4 14l8 7 8-7" },
  { id: "replace", label: "Full replacement", icon: "M3 12l9-8 9 8M5 10v10h14V10" },
  { id: "inspect", label: "Inspection", icon: "M11 4a7 7 0 1 0 0 14 7 7 0 0 0 0-14zm10 17l-5-5" },
  { id: "gutters", label: "Gutters & flashing", icon: "M3 6h18M5 6v4a3 3 0 0 0 3 3h0v7" },
];

Object.assign(window, {
  MPThumb, MPPhoto, MP_PHOTOS, MP_HERO, MP_ACTIVITY,
  MP_SELLERS, MP_MATERIALS, MP_MATERIAL_CATS,
  MP_MACHINERY, MP_MACHINERY_CATS, MP_ROOFERS, MP_JOB_TYPES,
});