@configuratorware/configurator-admingui 1.40.0 → 1.40.2

package/Components/ModalContainer.js

@@ -15,6 +15,8 @@ var _GeneralFragments = require("./GeneralFragments");
 
 var _debounce = _interopRequireDefault(require("lodash/debounce"));
 
+var _withStyles = _interopRequireDefault(require("@material-ui/core/styles/withStyles"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
@@ -39,6 +41,17 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
+var styles = function styles() {
+  return {
+    dialogContentContainer: {
+      display: 'flex',
+      flexDirection: 'column',
+      flex: 1,
+      width: '100%'
+    }
+  };
+};
+
 var ModalContainer = /*#__PURE__*/function (_React$Component) {
   _inherits(ModalContainer, _React$Component);
 
@@ -116,6 +129,7 @@ var ModalContainer = /*#__PURE__*/function (_React$Component) {
         maxWidth: "lg",
         classes: classes
       }, /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.dialogContentContainer,
         ref: this.setContainerRef
       }, detailsComponent)), children);
     }
@@ -124,5 +138,6 @@ var ModalContainer = /*#__PURE__*/function (_React$Component) {
   return ModalContainer;
 }(_react["default"].Component);
 
-var _default = ModalContainer;
+var _default = (0, _withStyles["default"])(styles)(ModalContainer);
+
 exports["default"] = _default;

package/Screens/Client/Reducers/Actions.js

@@ -61,17 +61,15 @@ var createClientActions = function createClientActions(listKey, dataKey, reducer
 
   var beforeApiStateHandler = function beforeApiStateHandler(apiAction) {
     return function (dispatch, getState) {
-      return new Promise(function (resolve) {
-        var state = (0, _cloneDeep["default"])(getState()[reducerName]);
+      var state = (0, _cloneDeep["default"])(getState()[reducerName]);
 
-        if (apiAction.type === _Helpers.RECEIVE_DATA) {
-          state.logoFile && uploadFile(apiAction.data.id, state.logoFile, 'logo', dispatch);
-          state.fontFile && uploadFile(apiAction.data.id, state.fontFile, 'font', dispatch);
-          resolve(apiAction);
-        }
+      if (apiAction.type === _Helpers.RECEIVE_DATA) {
+        return Promise.all([state.logoFile && uploadFile(apiAction.data.id, state.logoFile, 'logo', dispatch), state.fontFile && uploadFile(apiAction.data.id, state.fontFile, 'font', dispatch)]).then(function () {
+          return apiAction;
+        });
+      }
 
-        resolve(apiAction);
-      });
+      return apiAction;
     };
   };
 
@@ -84,7 +82,7 @@ var createClientActions = function createClientActions(listKey, dataKey, reducer
     var fileToUpload = new FormData();
     fileToUpload.append(field, file, file.name);
     var url = CLIENT_UPLOAD.replace('{field}', field).replace('{itemId}', clientId);
-    (0, _Helpers.dispatchPostData)(dispatch)(UPLOAD_KEY, url, fileToUpload);
+    return (0, _Helpers.dispatchPostData)(dispatch)(UPLOAD_KEY, url, fileToUpload);
   };
 
   actions.setFieldData = function (field, value) {

package/Screens/Designer/SubScreens/Visualization/Containers/Edit/Edit.js

@@ -129,6 +129,7 @@ var styles = function styles(theme) {
     editorRoot: _defineProperty({
       display: 'flex',
       flexDirection: 'row',
+      overflow: 'hidden',
       '&.fullHeight': {
         height: 'calc(100vh - 180px)'
       },
@@ -147,11 +148,10 @@ var styles = function styles(theme) {
     }),
     leftSide: {
       marginRight: 2 * theme.spacing.unit,
-      flex: 1
-    },
-    header: {
-      flex: 1
+      flex: 1,
+      overflow: 'auto'
     },
+    header: {},
     header3D: {
       flex: 1
     },
@@ -161,6 +161,9 @@ var styles = function styles(theme) {
     },
     rightSide: {
       flex: 1,
+      display: 'flex',
+      flexDirection: 'column',
+      overflow: 'auto',
       '& > $header': _defineProperty({}, breakPoint.max, {
         display: 'none'
       })
@@ -207,18 +210,25 @@ var styles = function styles(theme) {
     loadingText: {
       marginTop: 2 * theme.spacing.unit
     },
-    advancedEditor: {
-      maxWidth: 600
-    },
+    advancedEditor: _defineProperty({
+      maxWidth: 600,
+      overflow: 'auto'
+    }, breakPoint.max, {
+      maxWidth: '100%'
+    }),
     visualizationRoot: (_visualizationRoot = {
       display: 'flex',
-      flexDirection: 'row'
+      flexDirection: 'row',
+      overflow: 'hidden'
     }, _defineProperty(_visualizationRoot, breakPoint.max, {
       flexDirection: 'column'
     }), _defineProperty(_visualizationRoot, '& > $leftSide', _defineProperty({
-      width: '70%'
+      width: '70%',
+      overflow: 'hidden',
+      flex: 'initial'
     }, breakPoint.max, {
-      width: '100%'
+      width: '100%',
+      flex: 1
     })), _visualizationRoot),
     visualizationContainer: {
       width: '100%',

package/UIComponents/Dialog.js

@@ -39,7 +39,8 @@ var styles = function styles() {
       display: 'flex'
     },
     dialogContentTextRoot: {
-      width: '100%'
+      width: '100%',
+      display: 'flex'
     }
   };
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@configuratorware/configurator-admingui",
-  "version": "1.40.0",
+  "version": "1.40.2",
   "license": "UNLICENSED",
   "private": false,
   "dependencies": {
@@ -29,7 +29,7 @@
     "react-redux-i18n": "^1.9.3",
     "react-router": "^3.2.6",
     "react-sortable-hoc": "^1.11.0",
-    "redhotmagma-visualization": "1.40.0",
+    "redhotmagma-visualization": "1.40.2",
     "redux": "^4.1.0",
     "redux-logger": "^3.0.6",
     "redux-persist": "^5.10.0",

package/src/Components/ModalContainer.js

@@ -2,6 +2,16 @@ import React from 'react';
 import Dialog from '../UIComponents/Dialog';
 import { Headline } from './GeneralFragments';
 import debounce from 'lodash/debounce';
+import withStyles from '@material-ui/core/styles/withStyles';
+
+const styles = () => ({
+    dialogContentContainer: {
+        display: 'flex',
+        flexDirection: 'column',
+        flex: 1,
+        width: '100%',
+    },
+});
 
 class ModalContainer extends React.Component {
     componentDidMount() {
@@ -55,7 +65,9 @@ class ModalContainer extends React.Component {
                     maxWidth="lg"
                     classes={classes}
                 >
-                    <div ref={this.setContainerRef}>{detailsComponent}</div>
+                    <div className={classes.dialogContentContainer} ref={this.setContainerRef}>
+                        {detailsComponent}
+                    </div>
                 </Dialog>
 
                 {children}
@@ -64,4 +76,4 @@ class ModalContainer extends React.Component {
     }
 }
 
-export default ModalContainer;
+export default withStyles(styles)(ModalContainer);

package/src/Screens/Client/Reducers/Actions.js

@@ -25,15 +25,14 @@ export const setFontFile = font => ({
 
 export const createClientActions = (listKey, dataKey, reducerName, url, ctx = {}) => {
     const beforeApiStateHandler = apiAction => (dispatch, getState) => {
-        return new Promise(resolve => {
-            const state = cloneDeep(getState()[reducerName]);
-            if (apiAction.type === RECEIVE_DATA) {
-                state.logoFile && uploadFile(apiAction.data.id, state.logoFile, 'logo', dispatch);
-                state.fontFile && uploadFile(apiAction.data.id, state.fontFile, 'font', dispatch);
-                resolve(apiAction);
-            }
-            resolve(apiAction);
-        });
+        const state = cloneDeep(getState()[reducerName]);
+        if (apiAction.type === RECEIVE_DATA) {
+            return Promise.all([
+                state.logoFile && uploadFile(apiAction.data.id, state.logoFile, 'logo', dispatch),
+                state.fontFile && uploadFile(apiAction.data.id, state.fontFile, 'font', dispatch),
+            ]).then(() => apiAction);
+        }
+        return apiAction;
     };
 
     const actions = generateDefaultActions(listKey, dataKey, reducerName, url, {
@@ -46,7 +45,7 @@ export const createClientActions = (listKey, dataKey, reducerName, url, ctx = {}
         const fileToUpload = new FormData();
         fileToUpload.append(field, file, file.name);
         const url = CLIENT_UPLOAD.replace('{field}', field).replace('{itemId}', clientId);
-        dispatchPostData(dispatch)(UPLOAD_KEY, url, fileToUpload);
+        return dispatchPostData(dispatch)(UPLOAD_KEY, url, fileToUpload);
     };
 
     actions.setFieldData = (field, value) => dispatch => {

package/src/Screens/Designer/SubScreens/Visualization/Containers/Edit/Edit.js

@@ -58,6 +58,7 @@ const styles = theme => {
         editorRoot: {
             display: 'flex',
             flexDirection: 'row',
+            overflow: 'hidden',
             '&.fullHeight': {
                 height: 'calc(100vh - 180px)',
             },
@@ -80,10 +81,9 @@ const styles = theme => {
         leftSide: {
             marginRight: 2 * theme.spacing.unit,
             flex: 1,
+            overflow: 'auto',
         },
-        header: {
-            flex: 1,
-        },
+        header: {},
         header3D: {
             flex: 1,
         },
@@ -93,6 +93,9 @@ const styles = theme => {
         },
         rightSide: {
             flex: 1,
+            display: 'flex',
+            flexDirection: 'column',
+            overflow: 'auto',
             '& > $header': {
                 [breakPoint.max]: {
                     display: 'none',
@@ -146,17 +149,25 @@ const styles = theme => {
         },
         advancedEditor: {
             maxWidth: 600,
+            overflow: 'auto',
+            [breakPoint.max]: {
+                maxWidth: '100%',
+            },
         },
         visualizationRoot: {
             display: 'flex',
             flexDirection: 'row',
+            overflow: 'hidden',
             [breakPoint.max]: {
                 flexDirection: 'column',
             },
             '& > $leftSide': {
                 width: '70%',
+                overflow: 'hidden',
+                flex: 'initial',
                 [breakPoint.max]: {
                     width: '100%',
+                    flex: 1,
                 },
             },
         },

package/src/UIComponents/Dialog.js

@@ -16,6 +16,7 @@ const styles = () => ({
     },
     dialogContentTextRoot: {
         width: '100%',
+        display: 'flex',
     },
 });