fix(admin-ui): Only update facetValueIds if changed

vendure-ecommerce · Sep 10, 2024 · 8f22ef8 · 8f22ef8
1 parent 6a11b30
commit 8f22ef8
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 27 deletions.
diff --git a/packages/admin-ui/src/lib/catalog/src/components/product-detail/product-detail.component.ts b/packages/admin-ui/src/lib/catalog/src/components/product-detail/product-detail.component.ts
@@ -244,24 +244,19 @@ export class ProductDetailComponent
     selectProductFacetValue() {
         this.displayFacetValueModal().subscribe(facetValueIds => {
             if (facetValueIds) {
-                const productGroup = this.detailForm;
-                const currentFacetValueIds = productGroup.value.facetValueIds ?? [];
-                productGroup.patchValue({
-                    facetValueIds: unique([...currentFacetValueIds, ...facetValueIds]),
-                });
-                productGroup.markAsDirty();
-                this.changeDetector.markForCheck();
+                const facetValueIdsControl = this.detailForm.controls.facetValueIds;
+                const currentFacetValueIds = facetValueIdsControl.value ?? [];
+                facetValueIdsControl.setValue(unique([...currentFacetValueIds, ...facetValueIds]));
+                facetValueIdsControl.markAsDirty();
             }
         });
     }
 
     removeProductFacetValue(facetValueId: string) {
-        const productGroup = this.detailForm;
-        const currentFacetValueIds = productGroup.value.facetValueIds ?? [];
-        productGroup.patchValue({
-            facetValueIds: currentFacetValueIds.filter(id => id !== facetValueId),
-        });
-        productGroup.markAsDirty();
+        const facetValueIdsControl = this.detailForm.controls.facetValueIds;
+        const currentFacetValueIds = facetValueIdsControl.value ?? [];
+        facetValueIdsControl.setValue(currentFacetValueIds.filter(id => id !== facetValueId));
+        facetValueIdsControl.markAsDirty();
     }
 
     private displayFacetValueModal(): Observable<string[] | undefined> {
@@ -419,7 +414,9 @@ export class ProductDetailComponent
             ...updatedProduct,
             assetIds: this.assetChanges.assets?.map(a => a.id),
             featuredAssetId: this.assetChanges.featuredAsset?.id,
-            facetValueIds: productFormGroup.value.facetValueIds,
+            facetValueIds: productFormGroup.controls.facetValueIds.dirty
+                ? productFormGroup.value.facetValueIds
+                : undefined,
         } as UpdateProductInput | CreateProductInput;
     }
 

diff --git a/...src/lib/catalog/src/components/product-variant-detail/product-variant-detail.component.ts b/...src/lib/catalog/src/components/product-variant-detail/product-variant-detail.component.ts
@@ -296,22 +296,19 @@ export class ProductVariantDetailComponent
     }
 
     removeFacetValue(facetValueId: string) {
-        const productGroup = this.detailForm;
-        const currentFacetValueIds = productGroup.value.facetValueIds ?? [];
-        productGroup.patchValue({
-            facetValueIds: currentFacetValueIds.filter(id => id !== facetValueId),
-        });
-        productGroup.markAsDirty();
+        const facetValueIdsControl = this.detailForm.controls.facetValueIds;
+        const currentFacetValueIds = facetValueIdsControl.value ?? [];
+        facetValueIdsControl.setValue(currentFacetValueIds.filter(id => id !== facetValueId));
+        facetValueIdsControl.markAsDirty();
     }
 
     selectFacetValue() {
         this.displayFacetValueModal().subscribe(facetValueIds => {
             if (facetValueIds) {
-                const currentFacetValueIds = this.detailForm.value.facetValueIds ?? [];
-                this.detailForm.patchValue({
-                    facetValueIds: unique([...currentFacetValueIds, ...facetValueIds]),
-                });
-                this.detailForm.markAsDirty();
+                const facetValueIdsControl = this.detailForm.controls.facetValueIds;
+                const currentFacetValueIds = facetValueIdsControl.value ?? [];
+                facetValueIdsControl.setValue(unique([...currentFacetValueIds, ...facetValueIds]));
+                facetValueIdsControl.markAsDirty();
             }
         });
     }
@@ -397,8 +394,12 @@ export class ProductVariantDetailComponent
             ...updatedProduct,
             assetIds: this.assetChanges.assets?.map(a => a.id),
             featuredAssetId: this.assetChanges.featuredAsset?.id,
-            facetValueIds: variantFormGroup.value.facetValueIds,
-            taxCategoryId: variantFormGroup.value.taxCategoryId,
+            facetValueIds: variantFormGroup.controls.facetValueIds.dirty
+                ? variantFormGroup.value.facetValueIds
+                : undefined,
+            taxCategoryId: variantFormGroup.controls.taxCategoryId.dirty
+                ? variantFormGroup.value.taxCategoryId
+                : undefined,
         } as UpdateProductVariantInput | CreateProductVariantInput;
     }
 }