feat(product,dashboard): Allow re-ordering images (#10187)

* migration

* fix snapshot

* primarykey

* init work on dnd

* progress

* dnd

* undo changes

* undo changes

* undo changes

* undo changes

* fix firefox issue

* lint

* lint

* lint

* add changeset

* undo changes to product module

* set activator node

* init work on service layer

* alternative

* switch to OneToMany

* add tests

* progress

* update migration

* update approach and remove all references to images in product.ts tests

* handle delete images on empty array

* fix config and order type

* update changeset

* rm flag

* export type and fix type in test

* fix type

---------

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

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

@@ -1,9 +1,9 @@
 export { default as Product } from "./product"
 export { default as ProductCategory } from "./product-category"
 export { default as ProductCollection } from "./product-collection"
+export { default as Image } from "./product-image"
+export { default as ProductOption } from "./product-option"
+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 ProductOption } from "./product-option"
-export { default as ProductOptionValue } from "./product-option-value"
-export { default as Image } from "./product-image"

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

@@ -1,13 +1,13 @@
 import {
   BeforeCreate,
-  Collection,
   Entity,
   Filter,
   Index,
-  ManyToMany,
+  ManyToOne,
   OnInit,
   PrimaryKey,
   Property,
+  Rel,
 } from "@mikro-orm/core"
 
 import {
@@ -58,8 +58,21 @@ class ProductImage {
   @Property({ columnType: "timestamptz", nullable: true })
   deleted_at?: Date
 
-  @ManyToMany(() => Product, (product) => product.images)
-  products = new Collection<Product>(this)
+  @Property({ columnType: "integer", default: 0 })
+  rank: number
+
+  @ManyToOne(() => Product, {
+    columnType: "text",
+    onDelete: "cascade",
+    fieldName: "product_id",
+    mapToPk: true,
+  })
+  product_id: string
+
+  @ManyToOne(() => Product, {
+    persist: false,
+  })
+  product: Rel<Product>
 
   @OnInit()
   onInit() {

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

@@ -1,5 +1,6 @@
 import {
   BeforeCreate,
+  Cascade,
   Collection,
   Entity,
   Enum,
@@ -166,11 +167,8 @@ class Product {
   })
   tags = new Collection<ProductTag>(this)
 
-  @ManyToMany(() => ProductImage, "products", {
-    owner: true,
-    pivotTable: "product_images",
-    joinColumn: "product_id",
-    inverseJoinColumn: "image_id",
+  @OneToMany(() => ProductImage, (image) => image.product_id, {
+    cascade: [Cascade.PERSIST, Cascade.REMOVE],
   })
   images = new Collection<ProductImage>(this)