Use ecommerce main images for catalog products

app/catalog-image-map.ts

@@ -0,0 +1,93 @@
+import type { CatalogProduct } from "./catalog-data";
+
+// The ecommerce image archive groups products by family rather than by the
+// individual model code used in the PDF catalog. These are the corresponding
+// family-level main images copied into public/catalog-products/source-main.
+const SOURCE_MAIN_IMAGES = {
+  "1004": "/catalog-products/source-main/1004-main.png",
+  "258": "/catalog-products/source-main/258-main.jpg",
+  "259": "/catalog-products/source-main/259-main.jpg",
+  "266": "/catalog-products/source-main/266-main.jpg",
+  "267": "/catalog-products/source-main/267-main.jpg",
+  "268": "/catalog-products/source-main/268-main.jpg",
+  "270": "/catalog-products/source-main/270-main.jpg",
+  "271": "/catalog-products/source-main/271-main.jpg",
+  "272": "/catalog-products/source-main/272-main.jpg",
+  "273": "/catalog-products/source-main/273-main.jpg",
+  "274": "/catalog-products/source-main/274-main.jpg",
+  "275": "/catalog-products/source-main/275-main.jpg",
+  "276": "/catalog-products/source-main/276-main.jpg",
+  "308": "/catalog-products/source-main/308-main.png",
+  "309": "/catalog-products/source-main/309-main.png",
+  "310": "/catalog-products/source-main/310-main.png",
+  "311": "/catalog-products/source-main/311-main.png",
+  "313": "/catalog-products/source-main/313-main.png",
+} as const;
+
+type SourceImageKey = keyof typeof SOURCE_MAIN_IMAGES;
+
+function hasWeight(name: string, grams: string) {
+  return new RegExp(`${grams}\\s*(?:g|克)`, "i").test(name);
+}
+
+function getGearSeries(name: string) {
+  if (/半金属/.test(name)) return "semi";
+  if (/全金属|金属/.test(name)) return "metal";
+  if (/塑胶|塑料/.test(name)) return "plastic";
+  return null;
+}
+
+function getSmallServoImage(name: string): string | null {
+  if (hasWeight(name, "1\\.7")) return SOURCE_MAIN_IMAGES["1004"];
+
+  const gearSeries = getGearSeries(name);
+  if (hasWeight(name, "2") && gearSeries === "plastic") return SOURCE_MAIN_IMAGES["272"];
+  if (hasWeight(name, "3\\.7") && gearSeries === "plastic") return SOURCE_MAIN_IMAGES["271"];
+
+  if (hasWeight(name, "9")) {
+    if (gearSeries === "metal") return SOURCE_MAIN_IMAGES["266"];
+    if (gearSeries === "semi") return SOURCE_MAIN_IMAGES["259"];
+    if (gearSeries === "plastic") return SOURCE_MAIN_IMAGES["258"];
+  }
+
+  if (hasWeight(name, "17")) {
+    if (gearSeries === "metal") return SOURCE_MAIN_IMAGES["274"];
+    if (gearSeries === "plastic") return SOURCE_MAIN_IMAGES["273"];
+  }
+
+  if (hasWeight(name, "25")) {
+    if (gearSeries === "metal") return SOURCE_MAIN_IMAGES["276"];
+    if (gearSeries === "plastic") return SOURCE_MAIN_IMAGES["275"];
+  }
+
+  if (hasWeight(name, "37")) {
+    if (gearSeries === "metal") return SOURCE_MAIN_IMAGES["270"];
+    if (gearSeries === "semi") return SOURCE_MAIN_IMAGES["268"];
+    if (gearSeries === "plastic") return SOURCE_MAIN_IMAGES["267"];
+  }
+
+  return null;
+}
+
+function getBrickServoImage(name: string): string | null {
+  if (name.includes("3x3x3")) return SOURCE_MAIN_IMAGES["311"];
+  if (name.includes("3x3x7")) return SOURCE_MAIN_IMAGES["310"];
+  if (name.includes("3x7x5")) return SOURCE_MAIN_IMAGES["309"];
+  if (name.includes("6x6x5")) return SOURCE_MAIN_IMAGES["308"];
+  if (name.includes("11x5x4")) return SOURCE_MAIN_IMAGES["313"];
+  return null;
+}
+
+export function getCatalogProductImage(product: CatalogProduct) {
+  if (product.category === "积木舵机") {
+    return getBrickServoImage(product.name) ?? product.image;
+  }
+
+  if (product.category === "标准舵机" || product.category === "异形舵机") {
+    return getSmallServoImage(product.name) ?? product.image;
+  }
+
+  return product.image;
+}
+
+export const CATALOG_SOURCE_IMAGE_KEYS: SourceImageKey[] = Object.keys(SOURCE_MAIN_IMAGES) as SourceImageKey[];

app/page.tsx

@@ -3,9 +3,15 @@
 import { FormEvent, useMemo, useState } from "react";
 import {
   CATALOG_COUNTS,
-  CATALOG_PRODUCTS,
+  CATALOG_PRODUCTS as RAW_CATALOG_PRODUCTS,
   type CatalogProduct,
 } from "./catalog-data";
+import { getCatalogProductImage } from "./catalog-image-map";
+
+const CATALOG_PRODUCTS = RAW_CATALOG_PRODUCTS.map((product) => ({
+  ...product,
+  image: getCatalogProductImage(product),
+}));
 
 type Requirements = {
   application: string;