@bigbinary/neeto-themes-frontend 4.0.18 → 4.0.19

package/dist/cjs/NeetoThemesBuilder.js

@@ -9,7 +9,7 @@ var reactI18next = require('react-i18next');
 var utils = require('../index-BP-ka0mC.js');
 var reactQuery = require('@tanstack/react-query');
 var axios = require('axios');
-var useExpandedSection = require('../useExpandedSection-DvbcFXMx.js');
+var useExpandedSection = require('../useExpandedSection-B6w2AxTV.js');
 var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
 var classnames = require('classnames');
 var utils$1 = require('@bigbinary/neeto-commons-frontend/utils');
@@ -20,13 +20,13 @@ var reactRouterDom = require('react-router-dom');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var Close = require('@bigbinary/neeto-icons/Close');
+var ramda = require('ramda');
 var Popover = require('@bigbinary/neetoui/Popover');
 var Typography = require('@bigbinary/neetoui/Typography');
 var Switch = require('@bigbinary/neetoui/Switch');
 var Tooltip = require('@bigbinary/neetoui/Tooltip');
 var Form = require('@bigbinary/neetoui/formik/Form');
 var BlockNavigation = require('@bigbinary/neetoui/formik/BlockNavigation');
-var ramda = require('ramda');
 var formik = require('formik');
 var jsxRuntime = require('react/jsx-runtime');
 var i18n = require('i18next');
@@ -51,7 +51,6 @@ var Search = require('@bigbinary/neeto-molecules/Search');
 var AddImage = require('@bigbinary/neeto-icons/AddImage');
 var CodeBlock = require('@bigbinary/neeto-icons/CodeBlock');
 var ColorPicker$1 = require('@bigbinary/neeto-icons/ColorPicker');
-var Image = require('@bigbinary/neeto-icons/Image');
 var MoreDropdown = require('@bigbinary/neeto-molecules/MoreDropdown');
 var LeftArrow = require('@bigbinary/neeto-icons/LeftArrow');
 var RightArrow = require('@bigbinary/neeto-icons/RightArrow');
@@ -1374,6 +1373,7 @@ var Customize = function Customize(_ref) {
     currentScreen = _ref.currentScreen;
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
+  useExpandedSection.useSyncExpandedSectionFromUrl();
   var history = reactRouterDom.useHistory();
   var _useState = react.useState({}),
     _useState2 = _slicedToArray(_useState, 2),
@@ -1572,11 +1572,11 @@ var Customize = function Customize(_ref) {
             type: "reset"
           }), /*#__PURE__*/jsxRuntime.jsx(Button, {
             "data-testid": "save-changes-button",
+            disabled: !dirty && (themeData === null || themeData === void 0 ? void 0 : themeData.id) || isSubmitting || !isValid,
             label: t("neetoThemes.buttons.save"),
             loading: isSubmitting,
             ref: submitBtnRef,
-            type: "submit",
-            disabled: !dirty && (themeData === null || themeData === void 0 ? void 0 : themeData.id) || isSubmitting || !isValid
+            type: "submit"
           })]
         }), /*#__PURE__*/jsxRuntime.jsx(Popover, {
           appendTo: function appendTo() {
@@ -1726,7 +1726,6 @@ var Thumbnail = function Thumbnail(_ref) {
 };
 
 var Card = function Card(_ref) {
-  var _theme$logo, _theme$coverImage;
   var _ref$active = _ref.active,
     active = _ref$active === void 0 ? false : _ref$active,
     isPreviewing = _ref.isPreviewing,
@@ -1742,8 +1741,17 @@ var Card = function Card(_ref) {
     Thumbnail$1 = _ref.thumbnail;
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
+  var _useConfigStore = useExpandedSection.useConfigStore(function (store) {
+      return {
+        themePropertiesSchema: store["themePropertiesSchema"]
+      };
+    }, shallow.shallow),
+    themePropertiesSchema = _useConfigStore.themePropertiesSchema;
   var id = theme.id,
     name = theme.name;
+  var imageProperties = neetoCist.filterBy({
+    kind: "image"
+  }, themePropertiesSchema);
   var handleDeleteTheme = function handleDeleteTheme() {
     return onDeleteTheme(id, name);
   };
@@ -1867,16 +1875,19 @@ var Card = function Card(_ref) {
           label: t("neetoThemes.common.customizeStyle"),
           testId: "quick-customize-style",
           onClick: handleQuickEdit("style")
-        }), /*#__PURE__*/jsxRuntime.jsx(QuickActionRow, {
-          icon: AddImage,
-          testId: "quick-add-logo",
-          label: t((_theme$logo = theme.logo) !== null && _theme$logo !== void 0 && _theme$logo.url ? "neetoThemes.common.changeLogo" : "neetoThemes.common.addLogo"),
-          onClick: handleQuickEdit("logo")
-        }), /*#__PURE__*/jsxRuntime.jsx(QuickActionRow, {
-          icon: Image,
-          testId: "quick-add-cover-image",
-          label: t((_theme$coverImage = theme.coverImage) !== null && _theme$coverImage !== void 0 && _theme$coverImage.url ? "neetoThemes.common.changeCoverImage" : "neetoThemes.common.addCoverImage"),
-          onClick: handleQuickEdit("coverImage")
+        }), imageProperties.map(function (_ref2) {
+          var _theme$camelKey;
+          var key = _ref2.key;
+          var camelKey = neetoCist.snakeToCamelCase(key);
+          var hasImage = neetoCist.isPresent((_theme$camelKey = theme[camelKey]) === null || _theme$camelKey === void 0 ? void 0 : _theme$camelKey.url);
+          var action = hasImage ? "change" : "add";
+          var specificKey = "neetoThemes.common.".concat(action).concat(neetoCist.capitalize(camelKey));
+          return /*#__PURE__*/jsxRuntime.jsx(QuickActionRow, {
+            icon: AddImage,
+            label: t([specificKey, "neetoThemes.common.addImage"]),
+            testId: "quick-add-".concat(neetoCist.hyphenate(key)),
+            onClick: handleQuickEdit(camelKey)
+          }, key);
         }), /*#__PURE__*/jsxRuntime.jsx(QuickActionRow, {
           icon: CodeBlock,
           label: t("neetoThemes.build.leftSideBar.themes.customCSS"),