feat(core-flows,product,types): scoped variant images (#13623)

* wip(product): variant images

* fix: return type

* wip: repo and list approach

* fix: redo repo method, make test pass

* fix: change getVariantImages impl

* feat: update test

* feat: API and core flows layer

* wip: integration spec

* fix: deterministic test

* chore: refactor and simplify, cleanup, remove repo method

* wip: batch add all images to all vairants

* fix: remove, expand testing

* refactor: pass variants instead of refetch

* chore: expand integration test

* feat: test multi assign route

* fix: remove `/admin/products/:id/variants/images` route

* feat: batch images to variant endpoint

* fix: length assertion

* feat: variant thumbnail

* fix: send variant thumbnail by default

* fix: product export test assertion

* fix: test

* feat: variant thumbnail on line item

* fix: add missing list and count method, update types

* feat: optimise variant images lookups

* feat: thumbnail management in core flows

* fix: typos, type, build

* feat: cascade delete to pivot table, rm unused unused fields

* feat(dashboard): variant images management UI (#13670)

* wip(dashboard): setup variant media form

* wip: cleanup table and images, wip check handler

* feat: proper sidebar functionallity

* fefat: add js-sdk and hooks

* feat: allow only one selection

* wip: lazy load variants in the table

* feat: new variants management for images on product details

* chore: refactor

* wip: variant details page work

* fix: cleanup media section, fix issues and types

* feat: correct scoped images, cleanup in edit modal

* feat: js sdk and hooks, filter out product images on variant details, labels, add API call and wrap UI

* chore: cleanup

* refacto: rename route

* feat: thumbnail functionallity

* fix: refresh checked after revalidation load

* fix: rm unused, refactor type

* Create thirty-clocks-refuse.md

* feat: new add remove variant media layout

* feat: new image add UX

---------

Co-authored-by: Oli Juhl <59018053+olivermrbl@users.noreply.github.com>

* fix: table name in migration

* chore: update changesets

---------

Co-authored-by: Oli Juhl <59018053+olivermrbl@users.noreply.github.com>

packages/modules/product/src/models/index.ts

@@ -7,3 +7,4 @@ export { default as ProductOptionValue } from "./product-option-value"
 export { default as ProductTag } from "./product-tag"
 export { default as ProductType } from "./product-type"
 export { default as ProductVariant } from "./product-variant"
+export { default as ProductVariantProductImage } from "./product-variant-product-image"

packages/modules/product/src/models/product-image.ts

@@ -1,5 +1,7 @@
 import { model } from "@medusajs/framework/utils"
 import Product from "./product"
+import ProductVariant from "./product-variant"
+import ProductVariantProductImage from "./product-variant-product-image"
 
 const ProductImage = model
   .define(
@@ -12,6 +14,10 @@ const ProductImage = model
       product: model.belongsTo(() => Product, {
         mappedBy: "images",
       }),
+      variants: model.manyToMany(() => ProductVariant, {
+        mappedBy: "images",
+        pivotEntity: () => ProductVariantProductImage,
+      }),
     }
   )
   .indexes([

packages/modules/product/src/models/product-variant-product-image.ts

@@ -0,0 +1,15 @@
+import { model } from "@medusajs/framework/utils"
+import ProductVariant from "./product-variant"
+import ProductImage from "./product-image"
+
+const ProductVariantProductImage = model.define("ProductVariantProductImage", {
+  id: model.id({ prefix: "pvpi" }).primaryKey(),
+  variant: model.belongsTo(() => ProductVariant, {
+    mappedBy: "images",
+  }),
+  image: model.belongsTo(() => ProductImage, {
+    mappedBy: "variants",
+  }),
+})
+
+export default ProductVariantProductImage

packages/modules/product/src/models/product-variant.ts

@@ -1,5 +1,6 @@
 import { model } from "@medusajs/framework/utils"
-import { Product, ProductOptionValue } from "@models"
+import { Product, ProductImage, ProductOptionValue } from "@models"
+import ProductVariantProductImage from "./product-variant-product-image"
 
 const ProductVariant = model
   .define("ProductVariant", {
@@ -21,12 +22,17 @@ const ProductVariant = model
     width: model.number().nullable(),
     metadata: model.json().nullable(),
     variant_rank: model.number().default(0).nullable(),
+    thumbnail: model.text().nullable(),
     product: model
       .belongsTo(() => Product, {
         mappedBy: "variants",
       })
       .searchable()
       .nullable(),
+    images: model.manyToMany(() => ProductImage, {
+      mappedBy: "variants",
+      pivotEntity: () => ProductVariantProductImage,
+    }),
     options: model.manyToMany(() => ProductOptionValue, {
       pivotTable: "product_variant_option",
       mappedBy: "variants",