VEYNDO
Handbook
frontend/src/admin/catalog/README.mdView source ↗

English source · 5 min

admin/catalog

Central product editing, translations, assets, rich descriptions and product-scoped review publication. Writes carry API revisions and permission checks remain on the server.

Files and their individual responsibilities are listed in the generated source inventory. Each file starts with its contract summary.

Modules

  • AiImageStudio.tsx: Optional image-provider jobs create private previews; applying a reviewed image is explicit and revision checked.
  • CategoriesWorkspace.tsx: Localized category tree editor; parent moves and revisions are validated in the API.
  • CategoryFactQuery.tsx: Single-language saved fact predicate in the existing category revision, source and staging path; browsing calls no model.
  • EditorBuffer.ts: Unsaved Markdown source participates in the aggregate's save/navigation guard without becoming product content.
  • MarkdownSource.tsx: Live Markdown buffer updates the same structured product document; no raw HTML is rendered or persisted.
  • MediaDropzone.tsx: Accessible multi-file upload with drag/drop, visible progress and the same validated asset API as attachments.
  • PairFields.tsx: Explicit key/value row creation and collision-safe names for properties, specifications and variant options.
  • ProductAssignments.tsx: Searchable category paths, retained selection and explicit channel restrictions in the native product draft.
  • product-assignment-model.ts: Cycle-bounded category paths, enabled-region language resolution and current channel IDs.
  • product-assignment-i18n.ts: Four-language assignment guidance and read-only search states.
  • ProductAssets.tsx: Bounded upload and explicit digest-bound publication of attachments and paid files.
  • ProductDataView.tsx: Central catalog workspace: server-filtered cursor list, product details and hierarchical categories.
  • ProductGeneral.tsx: Compact basics and full description with expandable identifiers and shipping flags.
  • product-content-model.ts: Rich-content language resolution preserves explicit blanks and legacy text when creating translations.
  • product-content-i18n.ts: Four-language guidance for short text, full descriptions and optional product fields.
  • ProductEditor.tsx: Revision-aware product aggregate editor: one save, translation tabs and product-scoped linked capabilities.
  • ProductEditorHeader.tsx: Compact product identity, current save state and shared language context above every section.
  • ProductEditorNav.tsx: Grouped native/app sections, manual keyboard activation and compact mobile selection.
  • product-editor-i18n.ts: Four-language section guidance and empty review states.
  • ProductLocalizedContent.tsx: Consistent main-language inheritance for product rich documents.
  • ProductSpecifications.tsx: Localized visible details, shared technical properties, unit-labelled dimensions and effective product-page preview.
  • product-specification-i18n.ts: Four-language specification guidance and safe map-editing feedback.
  • ProductSeo.tsx: Single-language SEO fields, native-limit feedback and a responsive search preview use the native aggregate save.
  • product-seo-i18n.ts: Four-language preview, automatic-field and validation guidance.
  • ProductGallery.tsx: Local drag ordering with visible drop positions and native-draft updates; inspector arrows remain the keyboard/touch alternative.
  • product-media-i18n.ts: Four-language gallery ordering and position guidance.
  • ProductMediaWorkspace.tsx: One product-media workspace: cover, ordered gallery, multilingual image metadata, drag/drop and optional reviewed AI drafts.
  • ProductPricing.tsx: Grouped native price, tax-class and availability inputs with expandable optional pricing conditions.
  • ProductPriceTiers.tsx: Existing rule and quantity-bound discount edits in the revisioned aggregate.
  • product-pricing-i18n.ts: Four-language guidance for product price and availability tasks.
  • ProductPanels.tsx: Native commerce, media, translated SEO/specifications and category panels for one editable product.
  • ProductTextFields.tsx: Product text uses the shared single-language editor and field inheritance; product number stays language independent.
  • ProductVariants.tsx: Native variant family browser with cursor pagination, explicit editing and a bounded creation wizard.
  • ReferencePriceFields.tsx: Native reference-unit inputs feed the same server-calculated unit price displayed on product pages.
  • RelatedProducts.tsx: Retained ordered selections, scoped content-language search, cursor pagination and read-only browsing.
  • RelatedProductRow.tsx: Native merchant detail reads resolve selected names/media and retain unavailable IDs for explicit removal.
  • related-products-i18n.ts: Four-language selection, ordering, retry and native-limit guidance.
  • ReviewModeration.tsx: Product-scoped review publication; authoritative authorization stays in the API.
  • RichEditor.tsx: Actual Tiptap WYSIWYG editor with structured safe content, media, formatting and per-language drafts.
  • TaxClassSelect.tsx: Assign a product to an actual tenant tax class; legacy standard/reduced mapping remains explicit.
  • VariantGenerator.tsx: Reviewable, bounded batch creation uses saved parent data and keeps successful rows on partial failure.
  • catalog-i18n.ts: Complete four-language catalog workspace vocabulary, separate from commerce data translations.
  • catalog-model.ts: Editable native product aggregate and defaults shared by creation, detail and variant workflows.
  • editor-document.ts: Canonical transport drops editor-only null attributes; description headings remain within the native H2/H3 contract.
  • editor-i18n.ts: Four-language controls for visual/Markdown editing without changing content-language inheritance.
  • markdown-content.ts: Markdown admission shares the public rich-document node/URL boundary; rich-only features never silently disappear.
  • media-model.ts: Pure gallery operations preserve order, explicit alt translations and upload bounds without fabricating language values.
  • rich-conversion.ts: Lossless import of legacy blocks into structured WYSIWYG content, preserving inline emphasis.
  • variant-family.ts: Cursor-based family lookup for duplicate review, bounded independently of the 50-row creation limit.
  • variant-i18n.ts: Guided variant creation and editing vocabulary; content still follows shop language inheritance.
  • variant-model.ts: Bounded option combinations and metadata-free child payloads shared by the guided variant creator.

Verification

During development, run affected frontend test suites, npm run build and npm run architecture from frontend/. Complete tests and coverage run daily through the existing workflow. Coverage includes untested source files; a module in this folder is not automatically fully tested. See the root testing guide for backend integration and coverage limits.

ProductTextFields.tsx edits nullable per-field names/descriptions. ProductLocalizedContent.tsx, ProductSpecifications.tsx and ProductSeo.tsx own their respective content inheritance; TaxClassSelect.tsx loads assignable native tax classes. Product/category languages come from shop configuration. No inherited text is fabricated on save.

ProductEditorNav.tsx joins core editor sections with registered, authorized app-owned product tabs. General settings render registered contextual sections; no arbitrary app code executes in the core renderer.

MarkdownSource, markdown-content and EditorBuffer implement an explicit, guarded Markdown source buffer over the same safe TipTap document. variant-model, variant-family and VariantGenerator provide bounded combination review, current-SKU defaults, existing-family lookup and partial-failure retry. ProductVariants handles family cursor pagination and child option editing. Tests: studio-product-upgrades.test.tsx plus the real catalog_management suite.

Product and category editors import their catalogue styles directly. Their layout and permission fields must render on a cold Canvas entry without first mounting ProductDataView. CanvasCommerceEditor owns its generic wrapper stylesheet; App Studio does not provide styles on behalf of the shop designer.

ProductModels uploads typed GLB assets and explicitly reuses parent assignments inside the product draft. ProductModelCard edits localized model text and selects actual material variants discovered in the shared 3D viewer. Merchant workflow.