@crystaldesign/diva-seller 24.15.0-beta.3 → 24.15.0-beta.31

package/build/esm/index.js

@@ -17,7 +17,7 @@ import CardMedia from '@mui/material/CardMedia';
 import Typography$1 from '@mui/material/Typography';
 import createStyles from '@mui/styles/createStyles';
 import makeStyles from '@mui/styles/makeStyles';
-import { styled, Typography, Card as Card$1, CardActionArea as CardActionArea$1, CardMedia as CardMedia$1, Button as Button$1, TextField, ButtonGroup as ButtonGroup$1, Tooltip, Paper as Paper$1, FormControlLabel as FormControlLabel$1, Checkbox as Checkbox$1, IconButton as IconButton$1, Link, InputBase, Accordion, AccordionSummary, Tabs, Tab, AccordionDetails, Table as Table$1, TableBody as TableBody$1, TableRow as TableRow$1, TableCell as TableCell$1, CardHeader, CardContent, FormControl as FormControl$1, FormHelperText, TextareaAutosize, Box, Select as Select$1, MenuItem as MenuItem$1, ListItemButton, ListItemIcon } from '@mui/material';
+import { styled, Typography, Card as Card$1, CardActionArea as CardActionArea$1, CardMedia as CardMedia$1, Button as Button$1, TextField, ButtonGroup as ButtonGroup$1, Tooltip, Checkbox as Checkbox$1, FormControlLabel as FormControlLabel$1, IconButton as IconButton$1, Link, InputBase, Accordion, AccordionSummary, Tabs, Tab, AccordionDetails, Table as Table$1, TableBody as TableBody$1, TableRow as TableRow$1, TableCell as TableCell$1, CardHeader, CardContent, FormControl as FormControl$1, FormHelperText, TextareaAutosize, Box as Box$1, Select as Select$1, MenuItem as MenuItem$1, ListItemButton, ListItemIcon } from '@mui/material';
 import { Histogram, useFilterState, FilterComponent, AnalyticsComponent } from '@crystaldesign/analytics';
 import Button from '@mui/material/Button';
 import ButtonGroup from '@mui/material/ButtonGroup';
@@ -55,7 +55,11 @@ import TextField$1 from '@mui/material/TextField';
 import Select from '@mui/material/Select';
 import Input from '@mui/material/Input';
 import OrderEntry, { apiSaveRenderJobs, VariantSelector } from '@crystaldesign/order-entry';
-import CloseIcon from '@mui/icons-material/Close';
+import Box from '@mui/material/Box';
+import Alert from '@mui/material/Alert';
+import InfoIcon from '@mui/icons-material/Info';
+import AlertTitle from '@mui/material/AlertTitle';
+import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline';
 import classnames from 'classnames';
 import { InfoRounded, Remove, Add, Delete } from '@mui/icons-material';
 import { Swiper, SwiperSlide } from 'swiper/react';
@@ -68,7 +72,7 @@ import 'swiper/css/free-mode';
 import 'swiper/css/mousewheel';
 import ExpandMore from '@mui/icons-material/ExpandMore';
 import ProductsComponent, { useProductState as useProductState$1 } from '@crystaldesign/products-component';
-import Alert from '@mui/lab/Alert';
+import Alert$1 from '@mui/lab/Alert';
 import Tab$1 from '@mui/material/Tab';
 import Tabs$1 from '@mui/material/Tabs';
 import Autocomplete$1 from '@mui/material/Autocomplete';
@@ -91,7 +95,6 @@ import AssetEditor, { DivaFile } from '@crystaldesign/media-upload';
 import AddIcon$1 from '@mui/icons-material/NoteAdd';
 import DeleteIcon from '@mui/icons-material/Delete';
 import debounce from 'lodash/debounce';
-import Alert$1 from '@mui/material/Alert';
 import Settings from '@mui/icons-material/Settings';
 
 (function() {
@@ -654,8 +657,6 @@ function _apiLoadCatalogs() {
               // "Johann Jakob - CLASSICS"
               subCategory: data.RetailSubCategory ? data.RetailSubCategory : data.SubCategory ? data.SubCategory : undefined,
               retailArticleNr: data.RetailArticleNr ? data.RetailArticleNr : undefined,
-              fileBaseUrl: data.BaseURL ? data.BaseURL : undefined,
-              // "https://myCC3Retail.crystal-design.local/files"
               nArticles: data.Articles ? Number(data.Articles) : 0,
               // "236"
               nConfigurators: data.Configurators ? Number(data.Configurators) : 0,
@@ -3087,7 +3088,7 @@ var Wrapper = styled('div')({
   display: 'flex',
   justifyContent: 'space-between',
   alignItems: 'center',
-  margin: '10px 10px 0 10px',
+  margin: '5px 5px 5px 5px',
   flexWrap: 'wrap',
   gap: '10px'
 });
@@ -3994,8 +3995,10 @@ function Header$1(_ref) {
     enableVKPExportButton = _ref.enableVKPExportButton;
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
+  var _useDivaCore = useDivaCore(),
+    organization = _useDivaCore.state.organization;
   var handleClick = function handleClick(event) {
-    if (event.currentTarget.name == 'Step1' || event.currentTarget.name == 'Step2' || event.currentTarget.name == 'Step3') {
+    if (event.currentTarget.name == 'Step1' || event.currentTarget.name == 'Step2' || event.currentTarget.name == 'Step3' || event.currentTarget.name == 'Step4') {
       setActBasketPage(event.currentTarget.name);
     }
   };
@@ -4006,7 +4009,7 @@ function Header$1(_ref) {
       zIndex: 1
     },
     children: /*#__PURE__*/jsxs(Title, {
-      text: t('data.' + status) + ' - Nr. ' + divaNr + '-' + documentVersion,
+      text: (actBasketPage === 'Step4' ? 'Marketing' : t('data.' + status)) + ' - Nr. ' + divaNr + '-' + documentVersion,
       children: [showVKPExportButton && /*#__PURE__*/jsx(Button, {
         color: 'primary',
         variant: 'contained',
@@ -4041,6 +4044,13 @@ function Header$1(_ref) {
           children: t('basket.navigation.checkoutNew', {
             step: (config === null || config === void 0 ? void 0 : config.clientData) != false ? 3 : 2
           })
+        }), organization.settings.enableVKMarketing && /*#__PURE__*/jsx(Button, {
+          name: "Step4",
+          onClick: handleClick,
+          variant: actBasketPage == 'Step4' ? 'contained' : 'outlined',
+          children: t('basket.navigation.checkoutMarketing', {
+            step: (config === null || config === void 0 ? void 0 : config.clientData) != false ? 4 : 3
+          })
         })]
       })]
     })
@@ -4101,12 +4111,12 @@ function MenuListComposition(_ref) {
     }
     prevOpen.current = open;
   }, [open]);
-  return /*#__PURE__*/jsx("div", {
+  return /*#__PURE__*/jsxs("div", {
     style: {
       "float": 'right',
       height: 'fit-content'
     },
-    children: /*#__PURE__*/jsxs(ButtonGroup, {
+    children: [/*#__PURE__*/jsxs(ButtonGroup, {
       color: "primary",
       "aria-label": "outlined primary button group",
       children: [/*#__PURE__*/jsx(Button, {
@@ -4128,61 +4138,61 @@ function MenuListComposition(_ref) {
         "aria-haspopup": "true",
         onClick: handleToggle,
         children: t('basket.priceOverview.actions.addtionalActions')
-      }), /*#__PURE__*/jsx(Popper, {
-        style: {
-          zIndex: 1
-        },
-        open: open,
-        anchorEl: anchorRef.current,
-        role: undefined,
-        transition: true,
-        disablePortal: true,
-        children: function children(_ref2) {
-          var TransitionProps = _ref2.TransitionProps,
-            placement = _ref2.placement;
-          return /*#__PURE__*/jsx(Grow, _objectSpread$w(_objectSpread$w({}, TransitionProps), {}, {
-            style: {
-              transformOrigin: placement === 'bottom' ? 'right top' : 'right bottom'
-            },
-            children: /*#__PURE__*/jsx(Paper, {
-              children: /*#__PURE__*/jsx(ClickAwayListener, {
-                onClickAway: handleClose,
-                children: /*#__PURE__*/jsxs(MenuList, {
-                  autoFocusItem: open,
-                  id: "menu-list-grow",
-                  onKeyDown: handleListKeyDown,
-                  children: [/*#__PURE__*/jsx(MenuItem, {
-                    style: {
-                      display: !visibile ? 'block' : 'none'
-                    },
-                    onClick: function onClick(e) {
-                      handleClose(e);
-                      setVisibile(true);
-                    },
-                    children: t('basket.priceOverview.actions.showOrder')
-                  }), /*#__PURE__*/jsx(MenuItem, {
-                    style: {
-                      display: visibile ? 'block' : 'none'
-                    },
-                    onClick: function onClick(e) {
-                      handleClose(e);
-                      setVisibile(false);
-                    },
-                    children: t('basket.priceOverview.actions.hideOrder')
-                  }), /*#__PURE__*/jsx(MenuItem, {
-                    onClick: function onClick(e) {
-                      handleClose(e);
-                      openInfo();
-                    },
-                    children: t('basket.priceOverview.actions.openInfo')
-                  })]
-                })
+      })]
+    }), /*#__PURE__*/jsx(Popper, {
+      sx: {
+        zIndex: 1
+      },
+      open: open,
+      anchorEl: anchorRef.current,
+      role: undefined,
+      transition: true,
+      disablePortal: true,
+      children: function children(_ref2) {
+        var TransitionProps = _ref2.TransitionProps,
+          placement = _ref2.placement;
+        return /*#__PURE__*/jsx(Grow, _objectSpread$w(_objectSpread$w({}, TransitionProps), {}, {
+          style: {
+            transformOrigin: placement === 'bottom' ? 'right top' : 'right bottom'
+          },
+          children: /*#__PURE__*/jsx(Paper, {
+            children: /*#__PURE__*/jsx(ClickAwayListener, {
+              onClickAway: handleClose,
+              children: /*#__PURE__*/jsxs(MenuList, {
+                autoFocusItem: open,
+                id: "menu-list-grow",
+                onKeyDown: handleListKeyDown,
+                children: [/*#__PURE__*/jsx(MenuItem, {
+                  style: {
+                    display: !visibile ? 'block' : 'none'
+                  },
+                  onClick: function onClick(e) {
+                    handleClose(e);
+                    setVisibile(true);
+                  },
+                  children: t('basket.priceOverview.actions.showOrder')
+                }), /*#__PURE__*/jsx(MenuItem, {
+                  style: {
+                    display: visibile ? 'block' : 'none'
+                  },
+                  onClick: function onClick(e) {
+                    handleClose(e);
+                    setVisibile(false);
+                  },
+                  children: t('basket.priceOverview.actions.hideOrder')
+                }), /*#__PURE__*/jsx(MenuItem, {
+                  onClick: function onClick(e) {
+                    handleClose(e);
+                    openInfo();
+                  },
+                  children: t('basket.priceOverview.actions.openInfo')
+                })]
               })
             })
-          }));
-        }
-      })]
-    })
+          })
+        }));
+      }
+    })]
   });
 }
 
@@ -5319,8 +5329,7 @@ function Step2ClientData(_ref) {
 function StatusMenu(_ref) {
   var visibleStatus = _ref.visibleStatus,
     status = _ref.status,
-    setStatus = _ref.setStatus,
-    productSaved = _ref.productSaved;
+    setStatus = _ref.setStatus;
   var handleClick = function handleClick(item) {
     setStatus(item);
   };
@@ -5345,7 +5354,6 @@ function StatusMenu(_ref) {
           onClick: function onClick() {
             return handleClick(item);
           },
-          disabled: productSaved && item !== 'BASE_CONFIGURATION',
           children: t('data.' + item, item)
         }, item);
       })
@@ -5746,7 +5754,7 @@ var HQ_RenderingTypeSource = [{
 
 function ownKeys$s(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$s(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$s(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$s(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function useProduct(basket) {
+function useProduct() {
   var _useState = useState(undefined),
     _useState2 = _slicedToArray(_useState, 2),
     currentProduct = _useState2[0],
@@ -5754,7 +5762,7 @@ function useProduct(basket) {
   var _useDivaCore = useDivaCore(),
     productHandler = _useDivaCore.handler.productHandler;
   var loadProduct = /*#__PURE__*/function () {
-    var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+    var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(basket) {
       var _myProduct$baseData$p;
       var myProduct;
       return _regeneratorRuntime.wrap(function _callee$(_context) {
@@ -5763,7 +5771,8 @@ function useProduct(basket) {
             _context.next = 2;
             return productHandler.loadProducts({
               basket: new BasketData(basket),
-              divaNr: basket.DivaNr
+              productData: currentProduct !== null && currentProduct !== void 0 ? currentProduct : undefined,
+              getUniqueNewDivaNr: true
             });
           case 2:
             myProduct = _context.sent;
@@ -5777,13 +5786,10 @@ function useProduct(basket) {
         }
       }, _callee);
     }));
-    return function loadProduct() {
+    return function loadProduct(_x) {
       return _ref.apply(this, arguments);
     };
   }();
-  useEffect(function () {
-    loadProduct();
-  }, [basket]);
   var saveProduct = /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2(favourite) {
       var _myproduct$0$parent;
@@ -5805,17 +5811,16 @@ function useProduct(basket) {
               break;
             }
             _context2.next = 7;
-            return productHandler.apiMarkAsFavorite(currentProduct._id, basket.OrganizationId);
+            return productHandler.apiMarkAsFavorite(currentProduct._id, currentProduct.organizationId);
           case 7:
             setCurrentProduct(currentProduct);
-            basket.DocumentVersion = basket.DocumentVersion + 1;
-          case 9:
+          case 8:
           case "end":
             return _context2.stop();
         }
       }, _callee2);
     }));
-    return function saveProduct(_x) {
+    return function saveProduct(_x2) {
       return _ref2.apply(this, arguments);
     };
   }();
@@ -5826,40 +5831,6 @@ function useProduct(basket) {
   };
 }
 
-function styleInject(css, ref) {
-  if ( ref === void 0 ) ref = {};
-  var insertAt = ref.insertAt;
-
-  if (!css || typeof document === 'undefined') { return; }
-
-  var head = document.head || document.getElementsByTagName('head')[0];
-  var style = document.createElement('style');
-  style.type = 'text/css';
-
-  if (insertAt === 'top') {
-    if (head.firstChild) {
-      head.insertBefore(style, head.firstChild);
-    } else {
-      head.appendChild(style);
-    }
-  } else {
-    head.appendChild(style);
-  }
-
-  if (style.styleSheet) {
-    style.styleSheet.cssText = css;
-  } else {
-    style.appendChild(document.createTextNode(css));
-  }
-}
-
-var paperContainer = "paperContainer-9grpT";
-var hqMediaHeaderContainer = "hqMediaHeaderContainer-PlXdo";
-var hqmediaContainer = "hqmediaContainer-sBjym";
-var hqMediaTitle = "hqMediaTitle-ugda8";
-var css_248z$a = ".paperContainer-9grpT {\n  height: 68vh;\n  margin-left: 50px;\n  margin-right: 50px;\n  margin-top: 10px;\n}\n\n.hqMediaHeaderContainer-PlXdo {\n  display: flex;\n  justify-content: space-between;\n  padding-left: 15px;\n}\n\n.hqmediaContainer-sBjym {\n  height: 90%;\n  border: 1px solid rgb(224, 224, 224);\n}\n.hqMediaTitle-ugda8 {\n  font-size: 20px;\n  font-weight: normal;\n  color: #333;\n  padding: 10px 0;\n}\n";
-styleInject(css_248z$a);
-
 function ownKeys$r(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$r(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$r(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$r(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function CheckOut(_ref) {
@@ -5875,23 +5846,29 @@ function CheckOut(_ref) {
     updateBasket = _ref.updateBasket,
     statusArray = _ref.statusArray,
     configSaveButtons = _ref.configSaveButtons,
-    gdpr = _ref.gdpr;
+    gdpr = _ref.gdpr,
+    setCurrentProduct = _ref.setCurrentProduct,
+    setProductSaved = _ref.setProductSaved;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isSaving = _useState2[0],
     setIsSaving = _useState2[1];
   var _useState3 = useState(false),
     _useState4 = _slicedToArray(_useState3, 2),
-    isSaved = _useState4[0],
-    setIsSaved = _useState4[1];
+    isSaved = _useState4[0];
+    _useState4[1];
   var _useState5 = useState(false),
     _useState6 = _slicedToArray(_useState5, 2),
-    showRenderJobs = _useState6[0],
-    setShowRenderJobs = _useState6[1];
+    basket3DExportChecked = _useState6[0],
+    setBasket3DExportChecked = _useState6[1];
   var _useState7 = useState(false),
     _useState8 = _slicedToArray(_useState7, 2),
-    basket3DExportChecked = _useState8[0],
-    setBasket3DExportChecked = _useState8[1];
+    imgIsLoaded = _useState8[0],
+    setImgIsLoaded = _useState8[1];
+  var _useProduct = useProduct(),
+    currentProduct = _useProduct.currentProduct,
+    loadProduct = _useProduct.loadProduct,
+    saveProduct = _useProduct.saveProduct;
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
   var _useSellerState = useSellerState(),
@@ -5901,15 +5878,14 @@ function CheckOut(_ref) {
     userHasPermission = _useDivaCore$actions.userHasPermission,
     toggleLoading = _useDivaCore$actions.toggleLoading,
     openModal = _useDivaCore$actions.openModal,
-    productHandler = _useDivaCore.handler.productHandler,
     _useDivaCore$state = _useDivaCore.state,
     apiConfig = _useDivaCore$state.apiConfig,
     jwt = _useDivaCore$state.jwt,
     organization = _useDivaCore$state.organization;
-  var _useProduct = useProduct(basket),
-    currentProduct = _useProduct.currentProduct,
-    loadProduct = _useProduct.loadProduct,
-    saveProduct = _useProduct.saveProduct;
+  var _useState9 = useState(false),
+    _useState10 = _slicedToArray(_useState9, 2),
+    isFavorite = _useState10[0],
+    setIsFavorite = _useState10[1];
   useEffect(function () {
     var fetchProduct = /*#__PURE__*/function () {
       var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
@@ -5921,7 +5897,7 @@ function CheckOut(_ref) {
                 break;
               }
               _context.next = 3;
-              return loadProduct();
+              return loadProduct(basket);
             case 3:
             case "end":
               return _context.stop();
@@ -5933,75 +5909,53 @@ function CheckOut(_ref) {
       };
     }();
     fetchProduct();
-    setShowRenderJobs(false);
   }, [status]);
-  var saveProductAndShowHqMedia = /*#__PURE__*/function () {
-    var _ref3 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
-      var myProduct;
-      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-        while (1) switch (_context2.prev = _context2.next) {
-          case 0:
-            _context2.next = 2;
-            return loadProduct();
-          case 2:
-            myProduct = _context2.sent;
-            if (!(!myProduct || myProduct.isNew)) {
-              _context2.next = 11;
-              break;
-            }
-            toggleLoading('saveProduct');
-            _context2.next = 7;
-            return saveProduct();
-          case 7:
-            toggleLoading('saveProduct');
-            setShowRenderJobs(true);
-            _context2.next = 12;
-            break;
-          case 11:
-            setShowRenderJobs(true);
-          case 12:
-          case "end":
-            return _context2.stop();
-        }
-      }, _callee2);
-    }));
-    return function saveProductAndShowHqMedia() {
-      return _ref3.apply(this, arguments);
-    };
-  }();
+  useEffect(function () {
+    var fetchProduct = /*#__PURE__*/function () {
+      var _ref3 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+        return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+          while (1) switch (_context2.prev = _context2.next) {
+            case 0:
+              if (currentProduct) {
+                setCurrentProduct(currentProduct);
+              }
+            case 1:
+            case "end":
+              return _context2.stop();
+          }
+        }, _callee2);
+      }));
+      return function fetchProduct() {
+        return _ref3.apply(this, arguments);
+      };
+    }();
+    fetchProduct();
+  }, [currentProduct]);
+  var handleFavoriteToggle = function handleFavoriteToggle() {
+    setIsFavorite(!isFavorite);
+  };
   var handleSave = useCallback(/*#__PURE__*/function () {
-    var _ref4 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4(openPDF, sendMail, favourite, hqMedia) {
+    var _ref4 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4(openPDF, sendMail, isFav) {
       return _regeneratorRuntime.wrap(function _callee4$(_context4) {
         while (1) switch (_context4.prev = _context4.next) {
           case 0:
             if (!(status === 'BASE_CONFIGURATION')) {
-              _context4.next = 13;
-              break;
-            }
-            if (!hqMedia) {
-              _context4.next = 6;
+              _context4.next = 8;
               break;
             }
+            toggleLoading('saveProduct');
             _context4.next = 4;
-            return saveProductAndShowHqMedia();
+            return saveProduct(isFav);
           case 4:
-            _context4.next = 11;
-            break;
-          case 6:
-            toggleLoading('saveProduct');
-            _context4.next = 9;
-            return saveProduct(favourite);
-          case 9:
             toggleLoading('saveProduct');
             openModal({
               title: t('basket.checkout.productsavedtitle'),
               accept: true,
               text: t('basket.checkout.productsavedtext')
             });
-          case 11:
-            setIsSaved(true);
+            setProductSaved(true);
             return _context4.abrupt("return");
-          case 13:
+          case 8:
             if (!isSaving) {
               setIsSaving(true);
               onClickSave(openPDF, sendMail).then(/*#__PURE__*/function () {
@@ -6035,20 +5989,20 @@ function CheckOut(_ref) {
                     }
                   }, _callee3);
                 }));
-                return function (_x5) {
+                return function (_x4) {
                   return _ref5.apply(this, arguments);
                 };
               }())["catch"](function () {
                 return setIsSaving(false);
               });
             }
-          case 14:
+          case 9:
           case "end":
             return _context4.stop();
         }
       }, _callee4);
     }));
-    return function (_x, _x2, _x3, _x4) {
+    return function (_x, _x2, _x3) {
       return _ref4.apply(this, arguments);
     };
   }(), [isSaving, onClickSave, basket3DExportChecked]);
@@ -6058,13 +6012,6 @@ function CheckOut(_ref) {
       basket[key] = data[key];
     }
   };
-  var onErrorHqMedia = function onErrorHqMedia(error) {
-    openModal({
-      title: t('Error'),
-      accept: true,
-      text: t('basket.checkout.errorhqmediatext')
-    });
-  };
 
   // for LEAFLET don't show printOptions, if there are any configured.
   var finalSchema = _objectSpread$r(_objectSpread$r({}, uiSchema), {}, {
@@ -6103,59 +6050,73 @@ function CheckOut(_ref) {
         productSaved: isSaved
       })]
     }), /*#__PURE__*/jsxs("div", {
-      children: [showRenderJobs && /*#__PURE__*/jsxs(Paper$1, {
-        elevation: 4,
-        className: paperContainer,
-        children: [/*#__PURE__*/jsxs("div", {
-          className: hqMediaHeaderContainer,
-          children: [/*#__PURE__*/jsx("div", {
-            className: hqMediaTitle,
-            children: "HQ Medien"
-          }), /*#__PURE__*/jsx(Button$1, {
-            onClick: function onClick() {
-              return setShowRenderJobs(false);
-            },
-            children: /*#__PURE__*/jsx(CloseIcon, {})
-          })]
-        }), /*#__PURE__*/jsx("div", {
-          className: hqmediaContainer,
-          children: /*#__PURE__*/jsx(OrderEntry, {
-            variantData: [],
-            baseData: currentProduct,
-            basketData: basket,
-            onSave: function onSave() {
-              return productHandler.saveProducts({
-                products: [currentProduct]
-              }).then(function (r) {
-                return !!r.length;
-              });
-            },
-            saved: true,
-            onError: function onError() {
-              return onErrorHqMedia;
-            }
-          })
-        })]
-      }), status === 'BASE_CONFIGURATION' && !showRenderJobs && /*#__PURE__*/jsx(Fragment, {
-        children: /*#__PURE__*/jsxs("div", {
+      children: [status === 'BASE_CONFIGURATION' && /*#__PURE__*/jsxs("div", {
+        style: {
+          padding: 50
+        },
+        children: [/*#__PURE__*/jsx("div", {
           style: {
-            margin: '1rem',
-            marginLeft: '150px',
+            width: 'fit-content'
+          },
+          children: /*#__PURE__*/jsx(InfoAlert$1, {
+            content: /*#__PURE__*/jsx(Fragment, {
+              children: t('basket.checkout.step4.info')
+            })
+          })
+        }), /*#__PURE__*/jsxs(Box, {
+          sx: {
             display: 'flex',
-            alignItems: 'center',
-            gap: 25
+            gap: 2
           },
           children: [/*#__PURE__*/jsx("img", {
             src: currentProduct === null || currentProduct === void 0 ? void 0 : currentProduct.image,
-            height: 250
-          }), /*#__PURE__*/jsx("div", {
+            height: 250,
+            alt: "Product",
+            onLoad: function onLoad() {
+              return setImgIsLoaded(true);
+            },
             style: {
-              whiteSpace: 'pre-wrap'
+              display: imgIsLoaded ? 'block' : 'none'
+            }
+          }), /*#__PURE__*/jsx(Typography, {
+            sx: {
+              whiteSpace: 'pre-wrap',
+              fontSize: 14
             },
             children: currentProduct === null || currentProduct === void 0 ? void 0 : currentProduct.technicalDescription
           })]
-        })
-      }), status !== 'BASE_CONFIGURATION' && !showRenderJobs && /*#__PURE__*/jsxs(Fragment, {
+        }), /*#__PURE__*/jsxs(Box, {
+          sx: {
+            display: 'flex',
+            alignItems: 'center',
+            mt: 2
+          },
+          children: [/*#__PURE__*/jsx(Checkbox$1, {
+            checked: isFavorite,
+            onChange: handleFavoriteToggle
+          }), /*#__PURE__*/jsx(Typography, {
+            variant: "body2",
+            children: t('basket.checkout.step4.favorite')
+          })]
+        }), /*#__PURE__*/jsxs(Box, {
+          sx: {
+            display: 'flex',
+            gap: 2,
+            mt: 2
+          },
+          children: [/*#__PURE__*/jsx(Button$1, {
+            variant: "contained",
+            onClick: function onClick() {
+              return handleSave(undefined, false, isFavorite);
+            },
+            children: t('basket.checkout.step4.saveproduct')
+          }), /*#__PURE__*/jsx(Button$1, {
+            onClick: startWithEmptyBasket,
+            variant: "outlined",
+            children: t('basket.checkout.step4.cancel')
+          })]
+        })]
+      }), status !== 'BASE_CONFIGURATION' && /*#__PURE__*/jsxs(Fragment, {
         children: [/*#__PURE__*/jsx("div", {
           style: {
             margin: '1rem',
@@ -6172,7 +6133,7 @@ function CheckOut(_ref) {
         }), !!renderService && permissionAnyHqRenderBox && (catalogData === null || catalogData === void 0 ? void 0 : catalogData[0].has3D) && /*#__PURE__*/jsx(HqRenderBox, {
           basket: basket,
           config: renderService
-        }), (catalogData === null || catalogData === void 0 ? void 0 : catalogData[0].has3D) && (catalogData === null || catalogData === void 0 ? void 0 : catalogData[0].arReady) && organization.settings.enable3DExport && /*#__PURE__*/jsxs("div", {
+        }), (catalogData === null || catalogData === void 0 ? void 0 : catalogData[0].has3D) && organization.settings.enable3DExport && /*#__PURE__*/jsxs("div", {
           style: {
             marginLeft: '50px',
             width: '700px'
@@ -6200,7 +6161,7 @@ function CheckOut(_ref) {
           })
         })]
       })]
-    }), !showRenderJobs && /*#__PURE__*/jsx(SaveButtonsGroup, {
+    }), status !== 'BASE_CONFIGURATION' && /*#__PURE__*/jsx(SaveButtonsGroup, {
       orderEmpty: !basket.OrderSets || basket.OrderSets.length == 0 || gdpr && !isEmpty(basket === null || basket === void 0 ? void 0 : basket.Client) && !basket.Gdpr,
       onClickSave: handleSave,
       startWithEmptyBasket: startWithEmptyBasket,
@@ -6223,6 +6184,26 @@ function isEmpty(data) {
     return isEmpty(data[k]);
   });
 }
+function InfoAlert$1(_ref7) {
+  var content = _ref7.content;
+  return /*#__PURE__*/jsx(Alert, {
+    severity: "info",
+    iconMapping: {
+      info: /*#__PURE__*/jsx(InfoIcon, {
+        sx: {
+          fontSize: '2rem'
+        }
+      })
+    },
+    sx: {
+      display: 'flex',
+      alignItems: 'center',
+      fontSize: '1.1rem',
+      textAlign: 'center'
+    },
+    children: content
+  });
+}
 
 function ownKeys$q(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$q(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$q(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$q(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -6464,7 +6445,10 @@ function Step3Checkout(_ref) {
     status = _ref.status,
     setStatus = _ref.setStatus,
     statusArray = _ref.statusArray,
-    config = _ref.config;
+    config = _ref.config,
+    currentProduct = _ref.currentProduct,
+    setCurrentProduct = _ref.setCurrentProduct,
+    setProductSaved = _ref.setProductSaved;
   var _useDivaCore = useDivaCore(),
     organization = _useDivaCore.state.organization;
   return /*#__PURE__*/jsx(CheckOut, {
@@ -6479,7 +6463,140 @@ function Step3Checkout(_ref) {
     updateBasket: updateBasket,
     renderService: config === null || config === void 0 || (_config$checkout3 = config.checkout) === null || _config$checkout3 === void 0 ? void 0 : _config$checkout3.renderService,
     configSaveButtons: (config === null || config === void 0 || (_config$checkout4 = config.checkout) === null || _config$checkout4 === void 0 ? void 0 : _config$checkout4.saveButtons) || ['SAVE', 'SAVE_AND_OPEN', 'SAVE_AND_SEND', 'NEW'],
-    gdpr: config === null || config === void 0 || (_config$checkout5 = config.checkout) === null || _config$checkout5 === void 0 ? void 0 : _config$checkout5.checkGdpr
+    gdpr: config === null || config === void 0 || (_config$checkout5 = config.checkout) === null || _config$checkout5 === void 0 ? void 0 : _config$checkout5.checkGdpr,
+    currentProduct: currentProduct,
+    setCurrentProduct: setCurrentProduct,
+    setProductSaved: setProductSaved
+  });
+}
+
+function Step4Checkout(_ref) {
+  var currentProduct = _ref.currentProduct,
+    basket = _ref.basket,
+    productSaved = _ref.productSaved,
+    is3dReady = _ref.is3dReady;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useDivaCore = useDivaCore(),
+    openModal = _useDivaCore.actions.openModal,
+    productHandler = _useDivaCore.handler.productHandler;
+  var onErrorHqMedia = function onErrorHqMedia(error) {
+    openModal({
+      title: t('Error'),
+      accept: true,
+      text: t('basket.checkout.errorhqmediatext')
+    });
+  };
+  if (!is3dReady) {
+    return /*#__PURE__*/jsx(ErrorAlert, {
+      title: t('basket.checkout.step4.errortitle'),
+      content: t('basket.checkout.step4.error3d')
+    });
+  }
+  if (!productSaved) {
+    return /*#__PURE__*/jsx(ErrorAlert, {
+      title: t('basket.checkout.step4.errortitle'),
+      content: t('basket.checkout.step4.productNotSaved')
+    });
+  }
+  return /*#__PURE__*/jsxs(Box, {
+    sx: {
+      display: 'flex',
+      flexDirection: 'column',
+      gap: 2,
+      height: '100%'
+    },
+    children: [/*#__PURE__*/jsx(InfoAlert, {
+      content: /*#__PURE__*/jsxs(Fragment, {
+        children: [t('basket.checkout.step4.hqmediainfo'), ":", ' ', /*#__PURE__*/jsx("a", {
+          href: "https://www.diva-portal.de/digitalisierungs-service",
+          target: "_blank",
+          children: "www.diva-portal.de/digitalisierungs-service"
+        })]
+      })
+    }), /*#__PURE__*/jsx(OrderEntry, {
+      variantData: [],
+      baseData: currentProduct,
+      basketData: basket,
+      onSave: function onSave() {
+        return productHandler.saveProducts({
+          products: [currentProduct]
+        }).then(function (r) {
+          return !!r.length;
+        });
+      },
+      saved: true,
+      onError: function onError() {
+        return onErrorHqMedia;
+      }
+    })]
+  });
+}
+function InfoAlert(_ref2) {
+  var content = _ref2.content;
+  return /*#__PURE__*/jsx(Alert, {
+    severity: "info",
+    iconMapping: {
+      info: /*#__PURE__*/jsx(InfoIcon, {
+        sx: {
+          fontSize: '2rem'
+        }
+      })
+    },
+    sx: {
+      display: 'flex',
+      alignItems: 'center',
+      fontSize: '1.1rem',
+      textAlign: 'center'
+    },
+    children: content
+  });
+}
+function ErrorAlert(_ref3) {
+  var title = _ref3.title,
+    content = _ref3.content;
+  return /*#__PURE__*/jsx("div", {
+    style: {
+      paddingLeft: 100,
+      paddingRight: 100,
+      paddingTop: 25
+    },
+    children: /*#__PURE__*/jsx(Alert, {
+      severity: "error",
+      icon: false,
+      sx: {
+        display: 'flex',
+        justifyContent: 'center',
+        alignItems: 'center',
+        textAlign: 'center'
+      },
+      children: /*#__PURE__*/jsxs("div", {
+        style: {
+          display: 'flex',
+          flexDirection: 'column',
+          alignItems: 'center'
+        },
+        children: [/*#__PURE__*/jsx(ErrorOutlineIcon, {
+          sx: {
+            fontSize: '100px',
+            marginBottom: '16px'
+          }
+        }), /*#__PURE__*/jsxs("div", {
+          children: [/*#__PURE__*/jsx(AlertTitle, {
+            sx: {
+              fontSize: '28px',
+              marginBottom: '8px'
+            },
+            children: title
+          }), /*#__PURE__*/jsx("span", {
+            style: {
+              fontSize: '22px'
+            },
+            children: content
+          })]
+        })]
+      })
+    })
   });
 }
 
@@ -6487,7 +6604,7 @@ function ownKeys$p(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymb
 function _objectSpread$p(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$p(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$p(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var LOG$4 = getLogger('SellerBasket', 'Basket');
 function Basket(_ref) {
-  var _configurationData$Ch5;
+  var _configurationData$Ch5, _currentBasket$OrderS5;
   var divaNr = _ref.divaNr,
     basket = _ref.basket,
     checkBasket = _ref.checkBasket;
@@ -6496,6 +6613,14 @@ function Basket(_ref) {
     _useState2 = _slicedToArray(_useState, 2),
     actBasketPage = _useState2[0],
     setActBasketPage = _useState2[1];
+  var _useState3 = useState(),
+    _useState4 = _slicedToArray(_useState3, 2),
+    currentProduct = _useState4[0],
+    setCurrentProduct = _useState4[1];
+  var _useState5 = useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    productSaved = _useState6[0],
+    setProductSaved = _useState6[1];
   var _useTranslation = useTranslation(),
     t = _useTranslation.t,
     i18n = _useTranslation.i18n;
@@ -6701,6 +6826,7 @@ function Basket(_ref) {
                   message: t('basket.checkout.pdfqr'),
                   type: 'big',
                   clickable: true,
+                  qrCodeSize: 312,
                   autoHideDuration: (_configurationData$Ch3 = configurationData === null || configurationData === void 0 || (_configurationData$Ch4 = configurationData.Checkout) === null || _configurationData$Ch4 === void 0 ? void 0 : _configurationData$Ch4.pdfQRAutoHideDuration) !== null && _configurationData$Ch3 !== void 0 ? _configurationData$Ch3 : 1000 * 60 * 2
                 });
               }
@@ -6868,7 +6994,7 @@ function Basket(_ref) {
       config: configurationData === null || configurationData === void 0 ? void 0 : configurationData.Checkout,
       status: statusRef.current,
       documentVersion: currentBasket.getDocumentVersion(),
-      divaNr: currentBasket.DivaNr,
+      divaNr: statusRef.current == 'BASE_CONFIGURATION' && currentProduct ? currentProduct.divaNr : currentBasket.DivaNr,
       actBasketPage: actBasketPage,
       setActBasketPage: setActBasketPage,
       showVKPExportButton: !!(vkpExportData !== null && vkpExportData !== void 0 && vkpExportData.callbackurl) || !!(configurationData !== null && configurationData !== void 0 && configurationData.VKPExportUrl),
@@ -6907,12 +7033,50 @@ function Basket(_ref) {
         onClickSave: onClickSave,
         statusArray: getBasketStatusArr(),
         updateBasket: update,
-        currentUser: currentUser
+        currentUser: currentUser,
+        currentProduct: currentProduct,
+        setCurrentProduct: setCurrentProduct,
+        setProductSaved: setProductSaved
+      }), actBasketPage == 'Step4' && organization.settings.enableVKMarketing && /*#__PURE__*/jsx(Step4Checkout, {
+        config: configurationData === null || configurationData === void 0 ? void 0 : configurationData.Checkout,
+        basket: currentBasket,
+        setActBasketPage: setActBasketPage,
+        startWithEmptyBasket: startWithEmptyBasket,
+        currentProduct: currentProduct,
+        productSaved: productSaved,
+        is3dReady: currentBasket !== null && currentBasket !== void 0 && (_currentBasket$OrderS5 = currentBasket.OrderSets[0]) !== null && _currentBasket$OrderS5 !== void 0 && _currentBasket$OrderS5.HQRenderScript ? true : false
       })]
     })]
   });
 }
 
+function styleInject(css, ref) {
+  if ( ref === void 0 ) ref = {};
+  var insertAt = ref.insertAt;
+
+  if (!css || typeof document === 'undefined') { return; }
+
+  var head = document.head || document.getElementsByTagName('head')[0];
+  var style = document.createElement('style');
+  style.type = 'text/css';
+
+  if (insertAt === 'top') {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+
 var wrapper$6 = "wrapper-fSL18";
 var title$2 = "title-iTDPA";
 var descriptionContainer$1 = "description-container-k1vLT";
@@ -6920,7 +7084,7 @@ var modelTitle = "model-title-Sgm-0";
 var description = "description-GyPZq";
 var pdf = "pdf-oNnao";
 var hidden = "hidden-xYPOr";
-var css_248z$9 = ".wrapper-fSL18 {\n  display: flex;\n  flex-direction: column;\n  padding: 0 12px;\n  height: 100%;\n}\n\n.title-iTDPA {\n  padding: 16px 8px;\n  font-size: 36px;\n}\n\n.title-iTDPA .MuiButtonBase-root {\n  display: none;\n}\n\n.subTitle-4-0PW {\n  padding: 12px 18px;\n  font-size: 28px;\n}\n\n.description-container-k1vLT {\n  display: flex;\n  flex-direction: column;\n  background-color: #f2f2f2;\n  padding: 18px;\n  gap: 12px;\n  height: 100%;\n}\n\n.model-title-Sgm-0 {\n  font-size: 24px;\n  font-weight: 600;\n}\n.description-GyPZq {\n  font-size: 16px;\n  overflow: auto;\n  flex-grow: 3;\n}\n\n.pdf-oNnao {\n  display: 'flex';\n  flex: 1 1 10px;\n}\n\n.pdf-oNnao svg {\n  margin-right: 10px;\n}\n\n@media (max-width: 820px) {\n  .wrapper-fSL18 {\n    height: 75px;\n  }\n  .description-container-k1vLT {\n    position: fixed;\n    top: 22px;\n    width: 80%;\n    z-index: 101;\n    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);\n    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);\n    margin-top: 135px;\n    margin-left: -10px;\n    transition: width 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n  }\n  .title-iTDPA .MuiButtonBase-root {\n    display: inline-flex;\n  }\n  .hidden-xYPOr .description-container-k1vLT {\n    padding: 0;\n    width: 0;\n  }\n\n  .hidden-xYPOr .model-title-Sgm-0 {\n    display: none;\n  }\n\n  .hidden-xYPOr .description-GyPZq {\n    display: none;\n  }\n}\n";
+var css_248z$9 = ".wrapper-fSL18 {\n  display: flex;\n  flex-direction: column;\n  padding: 0 12px;\n  height: 100%;\n}\n\n.title-iTDPA {\n  padding: 16px 8px;\n  font-size: 36px;\n}\n\n.title-iTDPA .MuiButtonBase-root {\n  display: none;\n}\n\n.subTitle-4-0PW {\n  padding: 12px 18px;\n  font-size: 28px;\n}\n\n.description-container-k1vLT {\n  display: flex;\n  flex-direction: column;\n  background-color: #f2f2f2;\n  padding: 18px;\n  gap: 12px;\n  height: 100%;\n  overflow: auto;\n}\n\n.model-title-Sgm-0 {\n  font-size: 24px;\n  font-weight: 600;\n}\n.description-GyPZq {\n  font-size: 16px;\n  overflow: auto;\n  flex-grow: 3;\n  scrollbar-width: thin;\n}\n\n.pdf-oNnao {\n  display: 'flex';\n  flex: 1 1 10px;\n}\n\n.pdf-oNnao svg {\n  margin-right: 10px;\n}\n\n@media (max-width: 820px) {\n  .wrapper-fSL18 {\n    height: 75px;\n  }\n  .description-container-k1vLT {\n    position: fixed;\n    top: 22px;\n    width: 80%;\n    z-index: 101;\n    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);\n    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);\n    margin-top: 135px;\n    margin-left: -10px;\n    transition: width 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n    height: calc(100% - 195px);\n  }\n  .title-iTDPA .MuiButtonBase-root {\n    display: inline-flex;\n  }\n  .hidden-xYPOr .description-container-k1vLT {\n    padding: 0;\n    width: 0;\n  }\n\n  .hidden-xYPOr .pdf-oNnao {\n    display: none;\n  }\n\n  .hidden-xYPOr .model-title-Sgm-0 {\n    display: none;\n  }\n\n  .hidden-xYPOr .description-GyPZq {\n    display: none;\n  }\n}\n";
 styleInject(css_248z$9);
 
 var _excluded$6 = ["data", "text"];
@@ -6975,8 +7139,9 @@ function Description$1 (_ref) {
 }
 
 var container = "container-Sr3pC";
+var iconOnly = "icon-only-2SJ6e";
 var icon$1 = "icon-0h-39";
-var css_248z$8 = ".container-Sr3pC {\n  display: flex;\n  gap: 12px;\n  justify-content: flex-end;\n  padding: 8px;\n  flex-wrap: wrap;\n}\n.container-Sr3pC .MuiButton-root {\n  height: 45px;\n}\n\n.icon-0h-39 {\n  width: 24px;\n  height: 24px;\n}\n";
+var css_248z$8 = ".container-Sr3pC {\n  display: flex;\n  gap: 12px;\n  justify-content: flex-end;\n  padding: 8px;\n  flex-wrap: wrap;\n}\n.container-Sr3pC .MuiButton-root {\n  height: 45px;\n}\n\n.icon-only-2SJ6e span {\n  margin-right: 2px;\n}\n\n.icon-0h-39 {\n  width: 24px;\n  height: 24px;\n}\n";
 styleInject(css_248z$8);
 
 function ownKeys$n(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -7049,6 +7214,7 @@ function NavBar (buttons) {
   return /*#__PURE__*/jsxs("div", {
     className: container,
     children: [/*#__PURE__*/jsx(Button, {
+      className: iconOnly,
       variant: "outlined",
       color: "primary",
       startIcon: /*#__PURE__*/jsx(NavBackSvg, {
@@ -7238,7 +7404,7 @@ function NothingFound (_ref) {
     children: [/*#__PURE__*/jsx(Typography$1, {
       variant: "body2",
       children: text
-    }), info && /*#__PURE__*/jsx(Alert, {
+    }), info && /*#__PURE__*/jsx(Alert$1, {
       variant: "outlined",
       severity: "info",
       children: info
@@ -7330,14 +7496,6 @@ var ProductsOrArticles = function ProductsOrArticles(_ref) {
     }
   };
   if (hideAll || vzProductsState.loading || favoriteProductsState.loading) return /*#__PURE__*/jsx(Fragment, {});
-  /*#__PURE__*/jsx(ProductsComponent, {
-    productState: vzProductsState,
-    onClickFunction: onProductClick,
-    groupVariantsByField: configurationData === null || configurationData === void 0 ? void 0 : configurationData.groupVariantsByField,
-    galleryConfig: {
-      hidePrices: true
-    }
-  });
   var isEmpty = tab == 0 ? vzProductsState.groups.length == 0 : favoriteProductsState.groups.length == 0;
   return /*#__PURE__*/jsxs(Accordion, {
     className: wrapper$4,
@@ -7354,7 +7512,7 @@ var ProductsOrArticles = function ProductsOrArticles(_ref) {
         children: [showVZProducts && /*#__PURE__*/jsx(Tab, {
           label: t('info.products.shared'),
           value: 0
-        }), /*#__PURE__*/jsx(Tab, {
+        }), showFavoriteProducts && /*#__PURE__*/jsx(Tab, {
           label: t('info.products.favorite'),
           value: 1
         })]
@@ -7370,7 +7528,10 @@ var ProductsOrArticles = function ProductsOrArticles(_ref) {
         onClickFunction: onProductClick,
         groupVariantsByField: configurationData === null || configurationData === void 0 ? void 0 : configurationData.groupVariantsByField,
         galleryConfig: {
-          hidePrices: true
+          hidePrices: true,
+          imageWrapperStyle: {
+            maxHeight: '200px'
+          }
         }
       }), isEmpty && /*#__PURE__*/jsx(NothingFound, {
         text: selectedTab == 0 ? t('info.products.novzproducts') : t('info.products.nofavorites'),
@@ -8772,9 +8933,9 @@ var CustomDataFields = function CustomDataFields(_ref) {
     children: [/*#__PURE__*/jsx(CardHeader, {
       title: t('seller.productcreator.customfields') + (productData.variantId !== undefined ? ' (' + t('productvariant') + ':' + productData.variantId + ')' : '')
     }), /*#__PURE__*/jsx(CardContent, {
-      children: /*#__PURE__*/jsxs(Box, {
+      children: /*#__PURE__*/jsxs(Box$1, {
         children: [pairs.map(function (pair, index) {
-          return /*#__PURE__*/jsxs(Box, {
+          return /*#__PURE__*/jsxs(Box$1, {
             className: wrapper$2,
             children: [/*#__PURE__*/jsx(TextField, {
               style: {
@@ -12452,13 +12613,13 @@ function ProductCreator (_ref) {
             })
           })]
         })
-      }), !!error && /*#__PURE__*/jsx(Alert$1, {
+      }), !!error && /*#__PURE__*/jsx(Alert, {
         severity: "error",
         onClose: function onClose() {
           return setError(undefined);
         },
         children: error
-      }), warn && /*#__PURE__*/jsx(Alert$1, {
+      }), warn && /*#__PURE__*/jsx(Alert, {
         severity: "warning",
         onClose: function onClose() {
           return setWarning(undefined);