@configuratorware/configurator-frontendgui 1.40.4 → 1.40.6

package/App/configuration.js

@@ -31,7 +31,7 @@ var DEVELOPMENT_HOST_INT = 'http://int.configuratorware.local'; // eslint-disabl
 var DEVELOPMENT_HOST_LOCAL = 'http://localhost:10030';
 var hostsByNodeEnv = {
   production: '',
-  development: DEVELOPMENT_HOST_LOCAL,
+  development: DEVELOPMENT_HOST_INT,
   test: ''
 };
 var resourceUrlsByNodeEnv = {

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@configuratorware/configurator-frontendgui",
-  "version": "1.40.4",
+  "version": "1.40.6",
   "license": "UNLICENSED",
   "private": false,
   "main": "./index.js",
   "dependencies": {
     "@babel/polyfill": "^7.12.1",
-    "@configuratorware/scripts": "1.40.4",
+    "@configuratorware/scripts": "1.40.6",
     "@hot-loader/react-dom": "^17.0.1",
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.11.2",
@@ -39,8 +39,8 @@
     "react-router-dom": "^5.2.0",
     "react-swipeable": "^5.5.1",
     "react-zoom-pan-pinch": "^2.1.3",
-    "redhotmagma-graphics-editor": "1.40.4",
-    "redhotmagma-visualization": "1.40.4",
+    "redhotmagma-graphics-editor": "1.40.6",
+    "redhotmagma-visualization": "1.40.6",
     "redux": "^4.1.0",
     "redux-logger": "^3.0.6",
     "redux-persist": "^5.10.0",

package/src/App/Modules/Designer/Containers/ImageEditDialog.js

@@ -97,7 +97,6 @@ export class ImageEditDialogContainer extends React.Component {
         open: PropTypes.bool,
         editMode: PropTypes.bool,
         vectorsRequired: PropTypes.bool,
-        vectorizedLogoMandatory: PropTypes.bool,
         colorDisabled: PropTypes.bool,
         loading: PropTypes.bool,
         errorCode: PropTypes.string,
@@ -181,7 +180,6 @@ export class ImageEditDialogContainer extends React.Component {
             isImageCompatible,
             isColorMappingCompatible,
             vectorsRequired,
-            vectorizedLogoMandatory,
         } = this.props;
 
         const { vectorize, vectorizeColorsMap, activeTabIndex, originalImagePreview } = this.state;
@@ -258,32 +256,13 @@ export class ImageEditDialogContainer extends React.Component {
             Object.assign(newState, { vectorizeColorsMap });
         }
 
-        if (
-            activeTabIndex === 2 &&
-            (vectorsRequired || vectorizedLogoMandatory) &&
-            !vectorize &&
-            !image.gallery
-        ) {
+        if (activeTabIndex === 2 && vectorsRequired && !vectorize && !image.gallery) {
             Object.assign(newState, {
                 vectorize: true,
             });
         }
 
-        let options;
-        if (
-            activeTabIndex === 2 &&
-            !image.gallery &&
-            vectorizedLogoMandatory &&
-            !image.displayColorPreview &&
-            !this.state.displayColorPreview
-        ) {
-            options = { displayColorPreview: true };
-            Object.assign(newState, {
-                displayColorPreview: true,
-            });
-        }
-
-        (!isMatch(this.state, newState) || options) && this.handleStateChange(newState, options);
+        !isMatch(this.state, newState) && this.handleStateChange(newState);
 
         if ((justOpened || imageChanged) && !image.incomplete) {
             this.updatePreview(null, { forceFetch: operationsChanged });
@@ -535,12 +514,10 @@ export class ImageEditDialogContainer extends React.Component {
                 if (forceUpdate) {
                     this.previewVersion = Math.random();
                 }
-                if (previewUrl) {
-                    preview =
-                        getPreviewUrlFromImageData(previewUrl) +
-                        (this.previewVersion ? `?${this.previewVersion}` : '');
-                    originalImagePreview = preview;
-                }
+                preview =
+                    getPreviewUrlFromImageData(previewUrl) +
+                    (this.previewVersion ? `?${this.previewVersion}` : '');
+                originalImagePreview = preview;
             }
         }
 
@@ -664,7 +641,6 @@ export class ImageEditDialogContainer extends React.Component {
             maxColorAmount,
             colorDisabled,
             vectorsRequired,
-            vectorizedLogoMandatory,
             image,
             usedColors,
             imageColorsWereEdited,
@@ -704,7 +680,6 @@ export class ImageEditDialogContainer extends React.Component {
             activeTabIndex === 2 &&
             colorCount > 0 &&
             !isGalleryImage &&
-            !vectorizedLogoMandatory &&
             (colorPreviewEnabled || !colorPreviewRequirementFulfilled);
 
         return (
@@ -804,7 +779,6 @@ const mapStateToProps = state => {
     const colorPalettes = getColorPalettes(state);
     const designProductionMethod = getSelectedDesignProductionMethod(state);
     const vectorsRequired = !!get(designProductionMethod, 'options.vectorsRequired');
-    const vectorizedLogoMandatory = !!get(designProductionMethod, 'options.vectorizedLogoMandatory');
     const colorDisabled = isColoringDisabled(state);
     const userImages = getUserImages(imageGallery);
     const hasPlaceHolderImage = hasPlaceHolderImagesForActiveDesignArea(state);
@@ -844,7 +818,6 @@ const mapStateToProps = state => {
         userImages,
         colorPalettes,
         vectorsRequired,
-        vectorizedLogoMandatory,
         colorDisabled,
         uploadSize,
         galleryHasImages,

package/src/App/Reducers/DesignArea/Selectors.js

@@ -13,7 +13,6 @@ import intersectionBy from 'lodash/intersectionBy';
 import isEqual from 'lodash/isEqual';
 import values from 'lodash/values';
 import createSelector from 'Utils/Function/createSelector';
-import memoize from 'Utils/Function/memoize';
 import { getConf } from '../../configuration';
 import { getMissingColorPalettesColors } from '../../Services/DesignDataService';
 import { getConfigurator, getSelectedVariantIdentifier } from '../Configurator/Selectors';
@@ -369,19 +368,17 @@ export function getCurrentCanvasSize(state, defaultSize = zeroSize) {
     return getCanvasSizeFromDesignProductionMethod(designProductionMethod);
 }
 
-const memoizedCanvasSize = memoize((width, height, isMetric, dpi) => ({
-    width,
-    height,
-    isMetric,
-    dpi,
-}));
-
 export function getCanvasSizeFromDesignProductionMethod(designProductionMethod, defaultSize = zeroSize) {
     const { width, height, dpi } = designProductionMethod;
     if (!width || !height) {
         return defaultSize;
     }
-    return memoizedCanvasSize(width, height, true, dpi || getConf('designer.dpi', 300));
+    return {
+        width,
+        height,
+        isMetric: true,
+        dpi: dpi || getConf('designer.dpi', 300),
+    };
 }
 
 export function getCanvasSizeFromDesignArea(state, designArea, defaultSize = zeroSize) {
@@ -803,8 +800,7 @@ export const getDesignAreaImageCompatibilityInfo = designProductionMethod => {
         .sort();
     const vectorsRequired = !!get(designProductionMethod, 'options.vectorsRequired');
     const maxColorAmount = get(designProductionMethod, 'options.maxColorAmount', 0);
-    const vectorizedLogoMandatory = get(designProductionMethod, 'options.vectorizedLogoMandatory', false);
-    return { colorPalettes, vectorsRequired, maxColorAmount, vectorizedLogoMandatory };
+    return { colorPalettes, vectorsRequired, maxColorAmount };
 };
 
 export const getCurrentCompatibilityInfoHash = state =>
@@ -816,7 +812,6 @@ export const areHashesCompatible = (storedHash, targetHash) => {
             (storedHash &&
                 isEqual(storedHash.colorPalettes, targetHash.colorPalettes) &&
                 (!targetHash.vectorsRequired || storedHash.vectorsRequired) &&
-                (!targetHash.vectorizedLogoMandatory || storedHash.vectorizedLogoMandatory) &&
                 (!targetHash.maxColorAmount || storedHash.maxColorAmount <= targetHash.maxColorAmount))
     );
 };
@@ -900,21 +895,14 @@ export const getDesignAreaColorAmount = (maxColorAmount, preSelectionColorAmount
     return amount;
 };
 
-export const isVectorizedLogoMandatory = designProductionMethod =>
-    !!designProductionMethod?.options?.vectorizedLogoMandatory;
-
 export const getVectorizeForDesignProductionMethods = (state, designProductionMethodIdentifier) => {
     const { designProductionMethod } = getSelectedDesignAreaProperties(state);
     const newProductionMethod = getDesignProductionMethodByIdentifier(
         state,
         designProductionMethodIdentifier
     );
-    const currentVectorsRequired =
-        !!get(designProductionMethod, 'options.vectorsRequired') &&
-        isVectorizedLogoMandatory(designProductionMethod);
-    const newVectorsRequired =
-        !!get(newProductionMethod, 'options.vectorsRequired') &&
-        isVectorizedLogoMandatory(newProductionMethod);
+    const currentVectorsRequired = !!get(designProductionMethod, 'options.vectorsRequired');
+    const newVectorsRequired = !!get(newProductionMethod, 'options.vectorsRequired');
 
     return {
         currentVectorsRequired,
@@ -922,24 +910,6 @@ export const getVectorizeForDesignProductionMethods = (state, designProductionMe
     };
 };
 
-export const getMandatoryVectorizationForDesignProductionMethods = (
-    state,
-    designProductionMethodIdentifier
-) => {
-    const { designProductionMethod } = getSelectedDesignAreaProperties(state);
-    const newProductionMethod = getDesignProductionMethodByIdentifier(
-        state,
-        designProductionMethodIdentifier
-    );
-    const currentVectorsMandatory = isVectorizedLogoMandatory(designProductionMethod);
-    const newVectorsMandatory = isVectorizedLogoMandatory(newProductionMethod);
-
-    return {
-        currentVectorsMandatory,
-        newVectorsMandatory,
-    };
-};
-
 export const getImagesByDesignArea = (state, designAreaIdentifier) => {
     if (!designAreaIdentifier) {
         designAreaIdentifier = getSelectedDesignArea(state).identifier;

package/src/App/Reducers/DesignArea/__tests__/Selectors.test.js

@@ -1588,7 +1588,6 @@ describe('Reducers/DesignArea/Selectors', () => {
         expect(compatibilityInfo).toEqual({
             colorPalettes: ['default'],
             vectorsRequired: true,
-            vectorizedLogoMandatory: false,
             maxColorAmount: 4,
         });
     });
@@ -1603,7 +1602,6 @@ describe('Reducers/DesignArea/Selectors', () => {
                         options: {
                             maxColorAmount: 4,
                             vectorsRequired: true,
-                            vectorizedLogoMandatory: true,
                         },
                         colorPalettes: [
                             {
@@ -1633,7 +1631,6 @@ describe('Reducers/DesignArea/Selectors', () => {
         expect(compatibilityInfo).toEqual({
             colorPalettes: ['default'],
             vectorsRequired: true,
-            vectorizedLogoMandatory: true,
             maxColorAmount: 4,
         });
     });
@@ -1667,22 +1664,6 @@ describe('Reducers/DesignArea/Selectors', () => {
                 }
             )
         ).toBe(false);
-        expect(
-            areHashesCompatible(
-                {
-                    colorPalettes: ['palette_1'],
-                    vectorsRequired: true,
-                    maxColorAmount: 4,
-                    vectorizedLogoMandatory: false,
-                },
-                {
-                    colorPalettes: ['palette_1'],
-                    vectorsRequired: true,
-                    maxColorAmount: 4,
-                    vectorizedLogoMandatory: true,
-                }
-            )
-        ).toBe(false);
     });
 
     test('areHashesCompatible returns the correct result compatible hashes', () => {

package/src/App/Reducers/DesignData/Modifiers.js

@@ -46,14 +46,11 @@ export const getEditDataFromOperations = (imageFileName, operations, designProdu
     } = operations;
 
     const maxColorAmount = +get(designProductionMethod, 'options.maxColorAmount', 0);
-
-    const vectorizedLogoMandatory = get(designProductionMethod, 'options.vectorizedLogoMandatory', false);
     const vectorizeMonochrome = maxColorAmount === 1 && vectorizeThreshold === 1;
 
     const result = {
         fileName: imageFileName,
         operations: [],
-        vectorizedLogoMandatory,
     };
 
     if (clipping && clippingColor) {

package/src/App/Reducers/ImageGallery/Actions.js

@@ -3,11 +3,7 @@ import { createAsyncTask } from '../UI/Actions';
 import { getUserImagesByDesignArea } from './Selectors';
 import { calculateImageBrightness } from '../../Services/DesignDataService';
 import { getImageUsageInfo } from './Selectors';
-import {
-    getCurrentCompatibilityInfoHash,
-    getSelectedDesignProductionMethod,
-    isVectorizedLogoMandatory,
-} from '../DesignArea/Selectors';
+import { getCurrentCompatibilityInfoHash } from '../DesignArea/Selectors';
 
 export const RECEIVE_GALLERY = 'imageGallery/RECEIVE_GALLERY';
 export const RECEIVE_GALLERY_TAGS = 'imageGallery/RECEIVE_GALLERY_TAGS';
@@ -98,9 +94,7 @@ export const updateImage = (identifier, imageDataPatch, immediateCommit = false)
 };
 
 export const uploadImage = file =>
-    createAsyncTask(WN_UPLOAD_IMAGE, async (dispatch, getState) => {
-        const designProductionMethod = getSelectedDesignProductionMethod(getState());
-        const vectorizedLogoMandatory = isVectorizedLogoMandatory(designProductionMethod);
+    createAsyncTask(WN_UPLOAD_IMAGE, async dispatch => {
         const data = new FormData();
         data.append('userImage', file);
         data.append('userImageEditData', JSON.stringify({}));
@@ -109,9 +103,7 @@ export const uploadImage = file =>
             postDataAsync(
                 URL_UPLOAD,
                 data,
-                createDefaultReceiver(RECEIVE_IMAGE_UPLOAD_DATA, {
-                    vectorizedLogoMandatory,
-                }),
+                createDefaultReceiver(RECEIVE_IMAGE_UPLOAD_DATA),
                 {},
                 {},
                 {
@@ -150,9 +142,7 @@ export const dismissError = () => (dispatch, getState) => {
  * @param actionOptions
  */
 export const editImage = (editData, imageData, actionOptions = {}) =>
-    createAsyncTask(WN_UPLOAD_IMAGE, async (dispatch, getState) => {
-        const designProductionMethod = getSelectedDesignProductionMethod(getState());
-        const vectorizedLogoMandatory = isVectorizedLogoMandatory(designProductionMethod);
+    createAsyncTask(WN_UPLOAD_IMAGE, async dispatch => {
         const data = new FormData();
         const { createCopy } = editData;
         data.append('userImageEditData', JSON.stringify(editData));
@@ -161,12 +151,7 @@ export const editImage = (editData, imageData, actionOptions = {}) =>
             postDataAsync(
                 URL_UPLOAD,
                 data,
-                createDefaultReceiver(RECEIVE_IMAGE_UPLOAD_DATA, {
-                    imageData,
-                    createCopy,
-                    vectorizedLogoMandatory,
-                    ...actionOptions,
-                })
+                createDefaultReceiver(RECEIVE_IMAGE_UPLOAD_DATA, { imageData, createCopy, ...actionOptions })
             )
         );
         return await calculateImageBrightness(uploadResponse);

package/src/App/Reducers/ImageGallery/Reducer.js

@@ -30,11 +30,6 @@ const updateDerivedImageDataProps = imageData => {
         imageData.displayColorPreview = getConf('autoPreviewVectorization', true);
     }
 
-    if (imageData.vectorizedLogoMandatory) {
-        imageData.colorPreviewEnabled = false;
-        imageData.displayColorPreview = true;
-    }
-
     return imageData;
 };
 

package/src/App/Reducers/ImageGallery/Selectors.js

@@ -12,7 +12,6 @@ import {
     getCurrentCompatibilityInfoHash,
     getDesignProductionMethodByIdentifier,
     getSelectedDesignProductionMethod,
-    isVectorizedLogoMandatory,
 } from '../DesignArea/Selectors';
 import isEqual from 'lodash/isEqual';
 
@@ -142,9 +141,9 @@ export const isColorPreviewCompatible = (state, image, designProductionMethodIde
     const designProductionMethod = designProductionMethodIdentifier
         ? getDesignProductionMethodByIdentifier(state, designProductionMethodIdentifier)
         : getSelectedDesignProductionMethod(state);
-    const colorPreviewRequired =
-        designProductionMethodHasEmbroideryVisualizationEffect(designProductionMethod) ||
-        isVectorizedLogoMandatory(designProductionMethod);
+    const colorPreviewRequired = designProductionMethodHasEmbroideryVisualizationEffect(
+        designProductionMethod
+    );
 
     const displayColorPreview = image && (!!image.gallery || !!image.displayColorPreview);
     // do not let the user to add a raster image if the production method is embroidery

package/src/App/Reducers/ImageGallery/__tests__/Actions.test.js

@@ -35,10 +35,6 @@ jest.mock('../../../Services/DesignDataService');
 
 /*skipped Tests should be updated , the tests run properly in test file but fail globally in 'npm run test'*/
 describe('Reducers/ImageGallery/Actions', () => {
-    afterEach(() => {
-        jest.clearAllMocks();
-    });
-
     it('getGalleryUrlForTags encodes tags as comma separated query params', () => {
         const tags = [
             { title: 'tag1', checked: true },
@@ -55,7 +51,7 @@ describe('Reducers/ImageGallery/Actions', () => {
         expect(fetchDataAsync.mock.calls[0][0]).toBe(URL_TAGS);
         expect(fetchDataAsync.mock.calls[0][1]).toBe(receiveGalleryTags);
     });
-    it('selectTags calls dispatch with the correct action and calls dispatch with the fetchGalleryAction too', () => {
+    it.skip('selectTags calls dispatch with the correct action and calls dispatch with the fetchGalleryAction too', () => {
         const tags = [{ title: 'Cars', checked: true }];
         const dispatch = jest.fn();
         selectTags(tags)(dispatch);
@@ -65,7 +61,7 @@ describe('Reducers/ImageGallery/Actions', () => {
         });
         expect(fetchDataAsync.mock.calls[0][0]).toBe(getGalleryUrlForTags(tags));
     });
-    it('fetchGallery calls fetchDataAsync with the correct url and receive action creator', () => {
+    it.skip('fetchGallery calls fetchDataAsync with the correct url and receive action creator', () => {
         const mockResult = jest.fn(() => ({}));
         const fetchDataAsyncSpy = jest.fn(() => mockResult);
         fetchDataAsync.mockImplementationOnce(fetchDataAsyncSpy);
@@ -84,46 +80,12 @@ describe('Reducers/ImageGallery/Actions', () => {
             fileName,
         });
         const dispatch = jest.fn();
-        const getState = () => ({
-            configurator: {
-                configuration: {
-                    designdata: {
-                        designArea1: {
-                            designProductionMethodIdentifier: 'customPrinting',
-                        },
-                    },
-                },
-            },
-            designArea: {
-                selectedDesignArea: {
-                    identifier: 'designArea1',
-                    mask: null,
-                    designProductionMethods: [
-                        {
-                            identifier: 'customPrinting',
-                            mask: null,
-                            options: {
-                                maxColorAmount: 4,
-                                vectorsRequired: true,
-                                vectorizedLogoMandatory: true,
-                            },
-                            colorPalettes: [
-                                {
-                                    identifier: 'default',
-                                },
-                            ],
-                        },
-                    ],
-                },
-            },
-        });
-        await uploadImage(fileName)(dispatch, getState);
+        await uploadImage(fileName)(dispatch);
         expect(postDataAsync.mock.calls[0][0]).toEqual(URL_UPLOAD);
         expect(formDataToJSON(postDataAsync.mock.calls[0][1]).userImage).toEqual(fileName);
-        expect(createDefaultReceiver.mock.calls[0][0]).toBe(RECEIVE_IMAGE_UPLOAD_DATA);
-        expect(createDefaultReceiver.mock.calls[0][1]).toMatchObject({ vectorizedLogoMandatory: true });
+        expect(createDefaultReceiver).toBeCalledWith(RECEIVE_IMAGE_UPLOAD_DATA);
     });
-    it('editImage calls postDataAsync with the correct params', async () => {
+    it.skip('editImage calls postDataAsync with the correct params', async () => {
         const fileName = 'test.png';
         createAsyncTask.mockImplementationOnce((name, action) => action);
         postDataAsync.mockResolvedValueOnce({
@@ -139,46 +101,12 @@ describe('Reducers/ImageGallery/Actions', () => {
                 },
             ],
         };
-        const getState = () => ({
-            configurator: {
-                configuration: {
-                    designdata: {
-                        designArea1: {
-                            designProductionMethodIdentifier: 'customPrinting',
-                        },
-                    },
-                },
-            },
-            designArea: {
-                selectedDesignArea: {
-                    identifier: 'designArea1',
-                    mask: null,
-                    designProductionMethods: [
-                        {
-                            identifier: 'customPrinting',
-                            mask: null,
-                            options: {
-                                maxColorAmount: 4,
-                                vectorsRequired: true,
-                                vectorizedLogoMandatory: true,
-                            },
-                            colorPalettes: [
-                                {
-                                    identifier: 'default',
-                                },
-                            ],
-                        },
-                    ],
-                },
-            },
-        });
-        await editImage(editData)(dispatch, getState);
+        await editImage(editData)(dispatch);
         expect(postDataAsync.mock.calls[0][0]).toEqual(URL_UPLOAD);
         expect(formDataToJSON(postDataAsync.mock.calls[0][1]).userImageEditData).toEqual(
             JSON.stringify(editData)
         );
-        expect(createDefaultReceiver.mock.calls[0][0]).toBe(RECEIVE_IMAGE_UPLOAD_DATA);
-        expect(createDefaultReceiver.mock.calls[0][1]).toMatchObject({ vectorizedLogoMandatory: true });
+        expect(createDefaultReceiver).toBeCalledWith(RECEIVE_IMAGE_UPLOAD_DATA);
     });
     it('dismissError creates the correct action', () => {
         const dispatch = jest.fn();
@@ -267,7 +195,6 @@ describe('Reducers/ImageGallery/Actions', () => {
                             options: {
                                 maxColorAmount: 4,
                                 vectorsRequired: true,
-                                vectorizedLogoMandatory: true,
                             },
                             colorPalettes: [
                                 {
@@ -295,7 +222,6 @@ describe('Reducers/ImageGallery/Actions', () => {
             vectorizeColorsMap,
             compatibilityInfoHash: {
                 maxColorAmount: 4,
-                vectorizedLogoMandatory: true,
                 vectorsRequired: true,
                 colorPalettes: ['default'],
             },

package/src/App/Screens/DesignerProductPreview/DesignerProductPreviewManager.js

@@ -7,7 +7,6 @@ import {
     getCameraViewListForDesignAreaList,
     getDefaultDesignAreaIdentifierFromProductionMethod,
     getSelectedDesignProductionMethodForDesignArea,
-    isVectorizedLogoMandatory,
 } from '../../Reducers/DesignArea/Selectors';
 import { getSelectedVariantIdentifier } from '../../Reducers/Configurator/Selectors';
 import { setSelectedImageData } from '../../Reducers/ImageGallery/Actions';
@@ -51,8 +50,6 @@ const prepareImageData = (function createImageDataPreProcessor() {
         const colorPreviewRequired = designProductionMethodHasEmbroideryVisualizationEffect(
             designProductionMethod
         );
-        const vectorizedLogoMandatory = isVectorizedLogoMandatory(designProductionMethod);
-
         if (colorPreviewRequired) {
             // creating the color map, as it was added from the image edit dialog
             const svgContent = await getSvgContent(imageData.preview.url, false, true);
@@ -62,7 +59,7 @@ const prepareImageData = (function createImageDataPreProcessor() {
                 ...imageData,
                 colorPreviewRequired: true,
                 displayColorPreview: true,
-                colorPreviewEnabled: !vectorizedLogoMandatory,
+                colorPreviewEnabled: true,
                 operations: {
                     ...imageData.operations,
                     vectorizeColorsMap,