Fix TS product add to cart flow

denisprotassoff · Sep 29, 2022 · ceae48b · ceae48b
1 parent 3b79538
commit ceae48b
Show file tree

Hide file tree

Showing 7 changed files with 19 additions and 13 deletions.
diff --git a/packages/scandipwa/src/component/Product/Product.component.tsx b/packages/scandipwa/src/component/Product/Product.component.tsx
@@ -157,7 +157,7 @@ export class Product<P extends ProductComponentProps = ProductComponentProps> ex
 
     renderConfigurableOptions(): ReactElement {
         const {
-            // setActiveProduct,
+            setActiveProduct,
             parameters,
             product: { type_id: type, variants = [] },
             inStock,
@@ -182,7 +182,7 @@ export class Product<P extends ProductComponentProps = ProductComponentProps> ex
                   mix={ { block: this.className, elem: 'Attributes' } }
                   parameters={ parameters }
                   variants={ variants }
-                //   updateConfigurableVariant={ setActiveProduct }
+                  updateConfigurableVariant={ setActiveProduct }
                   configurable_options={ this.getConfigurableAttributes() }
                   isContentExpanded
                   inStock={ inStock }

diff --git a/packages/scandipwa/src/component/Product/Product.container.tsx b/packages/scandipwa/src/component/Product/Product.container.tsx
@@ -467,8 +467,8 @@ S extends ProductContainerState = ProductContainerState
         const { showError } = this.props;
 
         if (
-            errorFields
-            || errorMessages
+            errorFields.length
+            || errorMessages.length
             || this.validateConfigurableProduct()
             || this.filterAddToCartFileErrors(values)
         ) {
@@ -496,7 +496,7 @@ S extends ProductContainerState = ProductContainerState
      * @param key
      * @param value
      */
-    updateConfigurableVariant(key: string, value: string, checkEmptyValue = false): void {
+    updateConfigurableVariant(key: string, value: string | number | boolean, checkEmptyValue = false): void {
         const { parameters: prevParameters } = this.state;
 
         const newParameters = getNewParameters(prevParameters, key, value);

diff --git a/packages/scandipwa/src/component/Product/Product.type.ts b/packages/scandipwa/src/component/Product/Product.type.ts
@@ -64,7 +64,7 @@ export interface ProductComponentContainerFunctions {
     setDownloadableLinks: (links: string[]) => void;
     updateAddToCartTriggeredWithError: () => void;
     getActiveProduct: () => IndexedProduct;
-    setActiveProduct: (key: string, value: string, checkEmptyValue?: boolean) => void;
+    setActiveProduct: (key: string, value: string | number | boolean, checkEmptyValue?: boolean) => void;
     getMagentoProduct: () => ProductTransformData[];
     setValidator: (elem: HTMLElement) => void;
     scrollOptionsIntoView: () => void;

diff --git a/packages/scandipwa/src/component/ProductAttributeValue/ProductAttributeValue.component.tsx b/packages/scandipwa/src/component/ProductAttributeValue/ProductAttributeValue.component.tsx
@@ -22,7 +22,7 @@ import { ReactElement } from 'Type/Common.type';
 import { noopFn } from 'Util/Common';
 import { getBooleanLabel } from 'Util/Product';
 
-import { AttributeType, STRING_ONLY_ATTRIBUTE_CODES } from './ProductAttributeValue.config';
+import { AttributeType, SelectAttributeType, STRING_ONLY_ATTRIBUTE_CODES } from './ProductAttributeValue.config';
 import { ProductAttributeValueComponentProps, ProductAttributeValueOption } from './ProductAttributeValue.type';
 
 import './ProductAttributeValue.style';
@@ -159,11 +159,11 @@ export class ProductAttributeValue extends PureComponent<ProductAttributeValueCo
         const { value, type } = swatch_data;
 
         switch (type) {
-        case '0':
+        case SelectAttributeType.STRING:
             return this.renderStringValue(value, labelText, count);
-        case '1':
+        case SelectAttributeType.COLOR:
             return this.renderColorValue(value, label);
-        case '2':
+        case SelectAttributeType.IMAGE:
             return this.renderImageValue(value, label);
         default:
             return this.renderStringValue(labelText || __('N/A'), labelText, count);

diff --git a/packages/scandipwa/src/component/ProductAttributeValue/ProductAttributeValue.config.ts b/packages/scandipwa/src/component/ProductAttributeValue/ProductAttributeValue.config.ts
@@ -20,3 +20,9 @@ export enum AttributeType {
     TEXTAREA = 'textarea',
     WEIGHT = 'weight'
 }
+
+export enum SelectAttributeType {
+    STRING = '0',
+    COLOR = '1',
+    IMAGE = '2'
+}
diff --git a/packages/scandipwa/src/store/Cart/Cart.dispatcher.ts b/packages/scandipwa/src/store/Cart/Cart.dispatcher.ts
@@ -67,7 +67,7 @@ export class CartDispatcher {
                             } = {},
                             method_code = ''
                         } = {}
-                    }] = []
+                    } = {}] = []
                 } = {}
             } = await fetchQuery(
                 CartQuery.getCartQuery(

diff --git a/packages/scandipwa/src/util/Product/Product.ts b/packages/scandipwa/src/util/Product/Product.ts
@@ -429,15 +429,15 @@ export const sortBySortOrder = <T>(options: T[], sortKey?: keyof T): T[] => opti
 export const getIsConfigurableParameterSelected = (
     parameters: Record<string, string>,
     key: string,
-    value: string
+    value: string | number | boolean
 ): boolean => Object.hasOwnProperty.call(parameters, key) && parameters[key] === value;
 
 /** @namespace Util/Product/getNewParameters */
 // eslint-disable-next-line max-len
 export const getNewParameters = (
     parameters: Record<string, string>,
     key: string,
-    value = ''
+    value: string | number | boolean = ''
 ): Record<string, string> => {
     // If value is already selected, than we remove the key to achieve deselection
     if (getIsConfigurableParameterSelected(parameters, key, value)) {