Skip to content

Catalogue

Product dan semua yang mengklasifikasikannya. Backend module catalogs yang memilikinya; storefront yang menampilkannya; admin yang mengelolanya.

Cara halaman ini diverifikasi

Dibaca pada 2026-09-15 dari backend src/catalogs/, route storefront /products dan area admin /admin/products.

Modelnya

Sebuah product mengelompokkan article. Satu article adalah satu varian yang bisa dibeli (satu SKU dengan size dan colour); stock dilacak per article. Product diklasifikasikan dengan beberapa cara:

  • head → type → subtype — pohon product utama (product_heads, product_types, product_subtypes). PLP storefront memberi default head-nya ke NEXT_PUBLIC_BAG_ID.
  • category → sub-category (categories, sub_categories).
  • brand, series, collaboration, tags, color codes, icons.

Tabel pendukung: narratives, size_charts, product_on_sales, product_recommendations, dan tabel image/banner/video. Nama tabel adalah nilai @Entity({ name }); daftar lengkapnya ada di halaman Database. Sebagian besar field teks dwibahasa (nameId/nameEn, …).

Backend

src/catalogs/ — resolver dipisah menurut audiens:

  • CMS (products.resolver dan resolver per-classifier): products, product, productArticles, productArticle, productArticleQuantity, mutation delete, dan CRUD untuk heads/types/subtypes, categories, brands, series, collaborations, tags, color-codes. Create/update product lewat REST, bukan GraphQL — create/update GraphQL-nya dikomentari; admin mem-post multipart ke catalogs/products (dan /:productId/articles, /update-quantity).
  • Storefront (storefront-*.resolver.ts, operasi front*): frontProducts, frontProduct, frontSearchProducts, frontProductOfMetaUrl, frontProductOfShortcode, frontProductRecommendations, frontProductNewArrivals, frontProductOnSales, frontProductSizes, frontCategories, frontProductHeads, frontProductTypes, frontSpecialProductType, frontSeries*, frontCollaboration(s), frontTags, getPopularSearchKeywords.

Stock datang dari WMS lewat WmsService — lihat Stock (WMS).

Storefront

  • PLP /products (src/app/products/page.tsx) membaca ?head=&subcategory=&type=; UI di src/modules/products/components/, data hook src/hooks/useProducts.tsx, GraphQL di src/lib/products/, src/lib/product-heads/, src/lib/product-types/.
  • PDP /products/[slug] (src/app/products/[slug]/page.tsx, dengan layout.tsx server yang mengambil berdasarkan metaUrl untuk SEO). UI di src/modules/product-details/components/ — media, varian, add-to-cart/buy-now (product-cart-form.tsx), harga, tier discount, banner flash sale, review, share. Image zoom lewat react-zoom-pan-pinch.
  • Short link /s/[shortcode] menyelesaikan product berdasarkan shortcode dan redirect ke /products/{metaUrl}.
  • Listing terkait: /series, /collaboration, /new-arrival, /sale, /search (di balik NEXT_PUBLIC_FEAT_SEARCH).

Admin

/admin/products (src/app/admin/products/page.tsx) dengan add-product, edit-product, dan varian di bawah [slug]/add-variant / edit-variant. Form-nya bertab (Detail + SEO) dan submit FormData ke catalogs/products lewat axios (src/lib/products/product.rest.ts), karena ia mengunggah image. CRUD classifier ada di area sekitarnya: heads-types, categories, sub-categories, brands, tags, series, collaborations, color-codes, icons, category-icons.

Hal yang perlu diwaspadai

  • Write product lewat REST, read lewat GraphQL. Jangan cari mutation createProduct — itu controller REST.
  • Stock tidak disimpan di product. Quantity datang dari WMS; productArticleQuantity / frontProductSizes mencerminkannya. Lihat Stock (WMS).
  • synchronize: true — classifier atau field baru adalah perubahan entity, bukan migration. Lihat Database.