@bigbinary/neeto-themes-frontend 1.1.12 → 1.1.13

package/dist/index.js

@@ -36,6 +36,7 @@ var useThemeStore = create$3(withImmutableActions(function (set) {
   return {
     currentTheme: {},
     isCurrentThemeLoading: true,
+    previewingTheme: {},
     setThemeState: set
   };
 }));
@@ -574,6 +575,14 @@ var useListConfigs = function useListConfigs(_ref) {
 
 var useThemeUtils = function useThemeUtils() {
   var setConfigState = useConfigStore(prop("setConfigState"));
+  var _useThemeStore = useThemeStore(function (store) {
+      return {
+        previewingTheme: store["previewingTheme"],
+        currentTheme: store["currentTheme"]
+      };
+    }, shallow),
+    previewingTheme = _useThemeStore.previewingTheme,
+    currentTheme = _useThemeStore.currentTheme;
   var _useListConfigs = useListConfigs({
       onSuccess: function onSuccess(_ref) {
         var _ref$config = _ref.config,
@@ -614,7 +623,9 @@ var useThemeUtils = function useThemeUtils() {
   };
   return {
     setTheme: setTheme,
-    setVariable: setVariable
+    setVariable: setVariable,
+    previewingTheme: previewingTheme,
+    currentTheme: currentTheme
   };
 };
 
@@ -6978,6 +6989,12 @@ var Properties = function Properties() {
       };
     }, shallow),
     variableNamesMap = _useConfigStore.variableNamesMap;
+  var _useThemeStore = useThemeStore(function (store) {
+      return {
+        setThemeState: store["setThemeState"]
+      };
+    }, shallow),
+    setThemeState = _useThemeStore.setThemeState;
   var _useFormikContext = useFormikContext(),
     setFieldValue = _useFormikContext.setFieldValue,
     values = _useFormikContext.values;
@@ -7000,6 +7017,9 @@ var Properties = function Properties() {
   };
   useEffect(function () {
     setTheme(values);
+    setThemeState({
+      previewingTheme: values
+    });
   }, [values]);
   return /*#__PURE__*/React.createElement(Card$2, {
     title: t("neetoThemes.common.style")
@@ -7367,8 +7387,6 @@ var Themes = function Themes(_ref) {
     _ref$defaultThemes = _ref.defaultThemes,
     defaultThemes = _ref$defaultThemes === void 0 ? [] : _ref$defaultThemes,
     onDeleteTheme = _ref.onDeleteTheme,
-    previewingTheme = _ref.previewingTheme,
-    setPreviewingTheme = _ref.setPreviewingTheme,
     themeToHighlight = _ref.themeToHighlight,
     highlightTheme = _ref.highlightTheme,
     didScrollActiveThemeIntoView = _ref.didScrollActiveThemeIntoView,
@@ -7379,6 +7397,14 @@ var Themes = function Themes(_ref) {
     t = _useTranslation.t;
   var _useThemeUtils = useThemeUtils(),
     setTheme = _useThemeUtils.setTheme;
+  var _useThemeStore = useThemeStore(function (store) {
+      return {
+        setThemeState: store["setThemeState"],
+        previewingTheme: store["previewingTheme"]
+      };
+    }, shallow),
+    setThemeState = _useThemeStore.setThemeState,
+    previewingTheme = _useThemeStore.previewingTheme;
   var _useState = useState(""),
     _useState2 = _slicedToArray$3(_useState, 2),
     searchQuery = _useState2[0],
@@ -7393,6 +7419,9 @@ var Themes = function Themes(_ref) {
       onSuccess: function onSuccess(_ref2) {
         var theme = _ref2.theme;
         setTheme(theme);
+        setThemeState({
+          previewingTheme: theme
+        });
         setThemeBeingApplied({});
       }
     }),
@@ -7406,8 +7435,9 @@ var Themes = function Themes(_ref) {
     }, 100);
   }, [didScrollActiveThemeIntoView, currentTheme === null || currentTheme === void 0 ? void 0 : currentTheme.id]);
   var setPreviewTheme = function setPreviewTheme(theme) {
-    var id = theme.id;
-    setPreviewingTheme(id);
+    setThemeState({
+      previewingTheme: theme
+    });
     setTheme(theme);
   };
   var filteredDefaultThemes = defaultThemes.filter(function (theme) {
@@ -7456,7 +7486,7 @@ var Themes = function Themes(_ref) {
       setThemeBeingApplied: setThemeBeingApplied,
       theme: theme,
       active: (currentTheme === null || currentTheme === void 0 ? void 0 : currentTheme.id) === theme.id,
-      isPreviewing: previewingTheme === theme.id,
+      isPreviewing: (previewingTheme === null || previewingTheme === void 0 ? void 0 : previewingTheme.id) === theme.id,
       key: theme.id,
       isApplyingTheme: isApplyingTheme && (themeBeingApplied === null || themeBeingApplied === void 0 ? void 0 : themeBeingApplied.id) === theme.id,
       onCloneTheme: handleCloneTheme,
@@ -7473,7 +7503,7 @@ var Themes = function Themes(_ref) {
     className: "flex flex-col gap-4 px-6"
   }, filteredThemes.map(function (theme) {
     var isActive = (currentTheme === null || currentTheme === void 0 ? void 0 : currentTheme.id) === theme.id;
-    var isPreviewing = previewingTheme === theme.id;
+    var isPreviewing = (previewingTheme === null || previewingTheme === void 0 ? void 0 : previewingTheme.id) === theme.id;
     return /*#__PURE__*/React.createElement(Card$1, {
       isPreviewing: isPreviewing,
       onApplyTheme: onApplyTheme,
@@ -7557,12 +7587,8 @@ var Sidebar = function Sidebar() {
     setIsDeleteAlertOpen = _useState4[1];
   var _useState5 = useState(null),
     _useState6 = _slicedToArray$3(_useState5, 2),
-    previewingTheme = _useState6[0],
-    setPreviewingTheme = _useState6[1];
-  var _useState7 = useState(null),
-    _useState8 = _slicedToArray$3(_useState7, 2),
-    themeToHighlight = _useState8[0],
-    setThemeToHighlight = _useState8[1];
+    themeToHighlight = _useState6[0],
+    setThemeToHighlight = _useState6[1];
   var _useConfigStore = useConfigStore(function (store) {
       return {
         entityType: store["entityType"],
@@ -7609,6 +7635,9 @@ var Sidebar = function Sidebar() {
   };
   var handleBackPress = function handleBackPress() {
     setTheme(currentTheme);
+    setThemeState({
+      previewingTheme: currentTheme
+    });
     setCurrentScreen(DESIGN_SCREENS.THEMES);
     themeToEdit.current = null;
   };
@@ -7624,7 +7653,9 @@ var Sidebar = function Sidebar() {
   var onCreateTheme = function onCreateTheme(createdTheme) {
     setCurrentScreen(DESIGN_SCREENS.THEMES);
     setTheme(createdTheme);
-    setPreviewingTheme(createdTheme.id);
+    setThemeState({
+      previewingTheme: createdTheme
+    });
     highlightTheme(createdTheme);
     themeToEdit.current = null;
   };
@@ -7654,9 +7685,11 @@ var Sidebar = function Sidebar() {
     setTheme(currentTheme);
   }, [currentTheme, entityId]);
   useEffect(function () {
+    if (isNotPresent(currentTheme)) return;
     setThemeState({
       currentTheme: currentTheme,
-      isCurrentThemeLoading: isCurrentThemeLoading
+      isCurrentThemeLoading: isCurrentThemeLoading,
+      previewingTheme: currentTheme
     });
   }, [currentTheme, isCurrentThemeLoading]);
   return /*#__PURE__*/React.createElement("div", {
@@ -7674,8 +7707,6 @@ var Sidebar = function Sidebar() {
     didScrollActiveThemeIntoView: didScrollActiveThemeIntoView,
     highlightTheme: highlightTheme,
     isCurrentThemeLoading: isCurrentThemeLoading,
-    previewingTheme: previewingTheme,
-    setPreviewingTheme: setPreviewingTheme,
     themeToHighlight: themeToHighlight,
     themes: themes,
     isLoading: isLoading || isFetchingConfig,