@griddo/ax 1.49.42 → 1.51.2

package/src/components/Fields/ComponentArray/SameComponentArray/index.tsx

@@ -4,7 +4,7 @@ import { IModule } from "@ax/types";
 import { ComponentContainer } from "@ax/components";
 
 import AddItemButton from "./AddItemButton";
-import { getComponentProps } from "../helpers";
+import { getComponentProps, getTypefromKey } from "../helpers";
 
 import * as S from "./style";
 
@@ -21,8 +21,13 @@ const SameComponentArray = (props: ISameComponentArrayProps): JSX.Element => {
     maxItems,
     disabled,
     activatedModules,
+    objKey,
+    field,
   } = props;
 
+  const type = getTypefromKey(objKey);
+  const { contentType = type } = field;
+
   let addModuleAction: any;
   let addComponentAction: any;
 
@@ -35,14 +40,14 @@ const SameComponentArray = (props: ISameComponentArrayProps): JSX.Element => {
     return value.length > 1 ? `#${index + 1} ${name}` : name;
   };
 
-  const { elements, componentModules, kind } = selectedContent;
+  const { kind } = selectedContent;
 
-  const isModuleArr = !elements;
-  const isComponentModule = !!componentModules;
+  const isModuleArr = contentType === "modules";
+  const isComponentModule = contentType === "components";
 
   const handleAddModule = (moduleType: string) => addModuleAction(moduleType, editorID, isComponentModule);
 
-  const handleAddComponent = () => addComponentAction && addComponentAction(kind);
+  const handleAddComponent = () => addComponentAction && addComponentAction(kind, objKey);
 
   const handleAdd = isModuleArr ? handleAddModule : handleAddComponent;
 
@@ -82,6 +87,7 @@ const SameComponentArray = (props: ISameComponentArrayProps): JSX.Element => {
               selectedContent={selectedContent}
               disabled={disabled}
               canDuplicate={showAddItemButton && !isModuleDeactivated}
+              parentKey={objKey}
             />
           );
         })}
@@ -102,6 +108,8 @@ export interface ISameComponentArrayProps {
   categories?: any;
   disabled?: boolean;
   activatedModules: string[];
+  objKey: string;
+  field: any;
 }
 
 export default SameComponentArray;

package/src/components/Fields/ComponentArray/helpers.tsx

@@ -29,4 +29,16 @@ const getComponentProps = (element: any, activatedModules: string[], isModuleArr
 const containerToComponentArray = (value: Record<string, IComponent>): IComponent[] =>
   Object.values(value).filter((item: IComponent) => !isComponentEmpty(item));
 
-export { getComponentTitle, getComponentProps, containerToComponentArray };
+const getTypefromKey = (key: string) => {
+  switch (key) {
+    case "elements":
+    case "componentModules":
+      return "components";
+    case "modules":
+      return key;
+    default:
+      return null;
+  }
+};
+
+export { getComponentTitle, getComponentProps, containerToComponentArray, getTypefromKey };

package/src/components/Fields/ComponentContainer/index.tsx

@@ -26,6 +26,7 @@ const ComponentContainer = (props: IComponentContainerProps): JSX.Element => {
     arrayLength,
     disabled,
     canDuplicate,
+    parentKey,
   } = props;
 
   let deleteModuleAction: any;
@@ -65,8 +66,8 @@ const ComponentContainer = (props: IComponentContainerProps): JSX.Element => {
     }
   };
 
-  const removeItem = () => deleteModuleAction(editorID);
-  const duplicateItem = () => duplicateModuleAction(editorID);
+  const removeItem = () => deleteModuleAction(editorID, parentKey);
+  const duplicateItem = () => parentKey && duplicateModuleAction(editorID, parentKey);
 
   const duplicateOpt = {
     label: "duplicate",
@@ -99,7 +100,7 @@ const ComponentContainer = (props: IComponentContainerProps): JSX.Element => {
   const moveModule = (e: any, isPush: boolean) => {
     e.preventDefault();
     e.stopPropagation();
-    moveModuleAction(editorID, selectedContent, isPush);
+    moveModuleAction(editorID, selectedContent, isPush, parentKey);
   };
 
   const handleOptionClick = (option: any) => actions.addComponentAction(option);
@@ -177,6 +178,7 @@ interface IComponentContainerProps {
   arrayLength: number;
   disabled?: boolean;
   canDuplicate?: boolean;
+  parentKey?: string;
 }
 
 export default ComponentContainer;

package/src/components/Fields/FieldsDivider/index.tsx

@@ -0,0 +1,21 @@
+import React from "react";
+
+import * as S from "./style";
+
+const FieldsDivider = (props: IProps): JSX.Element => {
+  const { data } = props;
+  const { title, text } = data;
+
+  return (
+    <S.DividerWrapper>
+      <S.DividerTitle>{title}</S.DividerTitle>
+      <S.DividerText>{text}</S.DividerText>
+    </S.DividerWrapper>
+  );
+};
+
+interface IProps {
+  data: { title: string; text: string };
+}
+
+export default FieldsDivider;

package/src/components/Fields/FieldsDivider/style.tsx

@@ -0,0 +1,19 @@
+import styled from "styled-components";
+
+const DividerWrapper = styled.div`
+  padding-top: ${(p) => p.theme.spacing.m};
+  border-top: 1px solid ${(p) => p.theme.color.uiLine};
+`;
+
+const DividerTitle = styled.div`
+  ${(p) => p.theme.textStyle.headingXS};
+  color: ${(p) => p.theme.colors.textHighEmphasis};
+`;
+const DividerText = styled.div`
+  ${(p) => p.theme.textStyle.uiM};
+  color: ${(p) => p.theme.colors.textMediumEmphasis};
+  margin-top: ${(p) => p.theme.spacing.xs};
+  margin-bottom: ${(p) => p.theme.spacing.s};
+`;
+
+export { DividerWrapper, DividerTitle, DividerText };

package/src/components/Fields/RadioGroup/index.tsx

@@ -20,7 +20,7 @@ const RadioGroup = (props: IRadioGroupProps): JSX.Element => {
 
   const radiosArray = options
     ? options.map((item: IRadioFieldProps) => {
-        const checked = value.toString() === item.value.toString();
+        const checked = value ? value.toString() === item.value.toString() : false;
         return (
           <S.RadioFieldWrapper key={item.name}>
             <RadioField

package/src/components/Fields/VisualUniqueSelection/ScrollableSelection/index.tsx

@@ -4,16 +4,8 @@ import { IconAction, VisualOption } from "@ax/components";
 
 import * as S from "./style";
 
-const ScrollableSelection = ({
-  value,
-  onChange,
-  actions,
-  options,
-  objKey,
-  columns,
-  disabled,
-  ...props
-}: IScrollableSelectionProps): JSX.Element => {
+const ScrollableSelection = (props: IScrollableSelectionProps): JSX.Element => {
+  const { value, onChange, actions, options, objKey, columns, disabled, reference } = props;
   const [carouselIndex, setCarouselIndex] = useState(0);
   const [carouselItemWidth, setCarouselItemWidth] = useState<number>();
   const carouselRef = useRef<HTMLDivElement>(null);
@@ -22,7 +14,7 @@ const ScrollableSelection = ({
 
   const handleSelection = (newValue: string) => {
     onChange(newValue);
-    actions.replaceElementsInCollectionAction(newValue);
+    actions.replaceElementsInCollectionAction(newValue, reference);
   };
 
   const handlePreviousPage = () => {
@@ -90,6 +82,7 @@ interface IScrollableSelectionProps {
   disabled?: boolean;
   actions: any;
   selectedContent: any;
+  reference?: string;
 }
 
 interface IScrollableUniqueSelectionFieldOptionsProps {

package/src/components/Fields/index.tsx

@@ -1,3 +1,4 @@
+import ArrayFieldGroup from "./ArrayFieldGroup";
 import AsyncCheckGroup from "./AsyncCheckGroup";
 import AsyncSelect from "./AsyncSelect";
 import CheckField from "./CheckField";
@@ -7,6 +8,7 @@ import ComponentContainer from "./ComponentContainer";
 import ConditionalField from "./ConditionalField";
 import DateField from "./DateField";
 import FieldGroup from "./FieldGroup";
+import FieldsDivider from "./FieldsDivider";
 import HeadingField from "./HeadingField";
 import HiddenField from "./HiddenField";
 import ImageField from "./ImageField";
@@ -28,6 +30,7 @@ import VisualUniqueSelection from "./VisualUniqueSelection";
 import Wysiwyg from "./Wysiwyg";
 
 export {
+  ArrayFieldGroup,
   AsyncCheckGroup,
   AsyncSelect,
   CheckField,
@@ -37,6 +40,7 @@ export {
   ConditionalField,
   DateField,
   FieldGroup,
+  FieldsDivider,
   HeadingField,
   HiddenField,
   ImageField,

package/src/components/MainWrapper/AppBar/index.tsx

@@ -31,6 +31,7 @@ const AppBar = (props: IProps): JSX.Element => {
     currentPageUrl,
     errors,
     errorActions,
+    isFromEditor,
   } = props;
 
   const publishedTooltip: any = {
@@ -43,7 +44,7 @@ const AppBar = (props: IProps): JSX.Element => {
   const fixedClass = fixedAppBar ? "fixed" : "";
 
   const goToPages = () => {
-    typeof backLink === "string" ? props.history.push(backLink) : props.history.goBack();
+    typeof backLink === "string" ? props.history.push(backLink, { isFromEditor }) : props.history.goBack();
   };
 
   const getCurrentLanguage = (lang: string) =>
@@ -251,6 +252,7 @@ interface IAppBarProps {
   errorActions?: {
     goToError(editorID: number, tab: string, template: boolean): void;
   };
+  isFromEditor?: boolean;
 }
 
 type IProps = IAppBarProps & RouteComponentProps;

package/src/components/MainWrapper/index.tsx

@@ -35,6 +35,7 @@ interface IWrapperProps {
   currentPageID?: number;
   currentPageUrl?: string;
   fullWidth?: boolean;
+  isFromEditor?: boolean;
   languageActions?: {
     setLanguage?(lang: { locale: string; id: number | null }): void;
     setIsNewTranslation?(isNewTranslation: boolean): void;

package/src/components/index.tsx

@@ -1,4 +1,5 @@
 import {
+  ArrayFieldGroup,
   AsyncCheckGroup,
   AsyncSelect,
   CheckField,
@@ -8,6 +9,7 @@ import {
   ConditionalField,
   DateField,
   FieldGroup,
+  FieldsDivider,
   HeadingField,
   HiddenField,
   ImageField,
@@ -76,6 +78,7 @@ import ElementsTooltip from "./ElementsTooltip";
 
 export {
   //Fields
+  ArrayFieldGroup,
   AsyncCheckGroup,
   AsyncSelect,
   CheckField,
@@ -85,6 +88,7 @@ export {
   ConditionalField,
   DateField,
   FieldGroup,
+  FieldsDivider,
   HeadingField,
   HiddenField,
   ImageField,

package/src/containers/Navigation/Defaults/actions.tsx

@@ -4,11 +4,11 @@ import { navigation } from "@ax/api";
 import { IBreadcrumbItem, ISchema } from "@ax/types";
 import { getDefaultSchema, getSchema, handleRequest, removeEditorIds, deepClone, getNullValue } from "@ax/helpers";
 import {
-  deleteComponent,
   findByEditorID,
   generateEditorIDs,
   getLastComponentEditorID,
   getNewBreadcrumb,
+  getParentKey,
   moveElement,
   replaceElements,
   setIsSavedData,
@@ -441,7 +441,7 @@ const updateCollection = (elementType: string, prevCollection: any[]) => {
   return [...prevCollection, newModule];
 };
 
-const getUpdatedComponents = (editorContent: any, element: any) => {
+const getUpdatedComponents = (editorContent: any, element: any, key: string) => {
   const { editorID, type } = element;
   const isCollectionItem = typeof type === "string";
   const updatedDefault = isCollectionItem ? deepClone(editorContent) : editorContent;
@@ -449,7 +449,7 @@ const getUpdatedComponents = (editorContent: any, element: any) => {
   const mapValues = (item: any) => {
     if (item.editorID !== undefined && item.editorID === editorID) {
       if (isCollectionItem) {
-        item.elements = updateCollection(type, item.elements);
+        item[key] = updateCollection(type, item[key]);
       } else {
         addElement(type);
       }
@@ -468,41 +468,39 @@ const getUpdatedComponents = (editorContent: any, element: any) => {
   return updatedDefault;
 };
 
-function addComponent(type: any): (dispatch: Dispatch, getState: any) => void {
+function addComponent(type: any, key: string): (dispatch: Dispatch, getState: any) => void {
   return (dispatch, getState) => {
     const { editorContent, selectedEditorID } = getStateValues(getState);
     const component = {
       editorID: selectedEditorID,
       type,
     };
-    const updatedContent = getUpdatedComponents(editorContent, component);
+    const updatedContent = getUpdatedComponents(editorContent, component, key);
     generateContent(updatedContent, dispatch, getState);
 
     if (type.editorID) {
       setSelectedContent(type.editorID)(dispatch, getState);
     } else {
       const { editorContent } = getStateValues(getState);
-      const lastElementEditorID = getLastComponentEditorID(editorContent, component.editorID);
+      const lastElementEditorID = getLastComponentEditorID(editorContent, component.editorID, key);
       setSelectedContent(lastElementEditorID)(dispatch, getState);
     }
   };
 }
 
-function deleteModule(editorID: number): (dispatch: Dispatch, getState: any) => void {
+function deleteModule(editorID: number, key: string): (dispatch: Dispatch, getState: any) => void {
   return (dispatch, getState) => {
     const { editorContent } = getStateValues(getState);
     const updatedContent: any = deepClone(editorContent);
 
-    updatedContent.elements = updatedContent.elements.filter((module: any) => {
-      if (module.elements) {
-        module.elements = deleteComponent(module.elements, editorID);
-      }
-      return module.editorID !== editorID;
-    });
-
-    const { parent, grandParent } = findByEditorID(editorContent, editorID);
+    const { parent, grandParent } = findByEditorID(updatedContent, editorID);
     const parentModule = Array.isArray(parent) ? grandParent : parent;
-    setSelectedContent(parentModule.editorID)(dispatch, getState);
+
+    const parentKey = key ? key : getParentKey(parentModule, editorID);
+    const itemsArr = parentModule[parentKey];
+
+    const index = itemsArr.findIndex((module: any) => module.editorID === editorID);
+    itemsArr.splice(index, 1);
 
     generateContent(updatedContent, dispatch, getState);
   };
@@ -530,7 +528,7 @@ function replaceModule(module: any, parent: any, objKey: string): (dispatch: Dis
   };
 }
 
-function duplicateModule(editorID: number): (dispatch: Dispatch, getState: any) => void {
+function duplicateModule(editorID: number, key?: string): (dispatch: Dispatch, getState: any) => void {
   return (dispatch, getState) => {
     const { editorContent } = getStateValues(getState);
 
@@ -538,33 +536,39 @@ function duplicateModule(editorID: number): (dispatch: Dispatch, getState: any)
     const { element: originalItem, parent, grandParent } = findByEditorID(updatedContent, editorID);
     const parentModule = Array.isArray(parent) ? grandParent : parent;
 
-    const { elements } = parentModule;
+    const parentKey = key ? key : getParentKey(parentModule, editorID);
+    const itemsArr = parentModule[parentKey];
 
-    const originalItemIndex = elements.findIndex((module: any) => module.editorID === editorID);
+    const originalItemIndex = itemsArr.findIndex((module: any) => module.editorID === editorID);
     const duplicatedItemIndex = originalItemIndex + 1;
-    elements.splice(duplicatedItemIndex, 0, originalItem);
+    itemsArr.splice(duplicatedItemIndex, 0, originalItem);
 
     generateContent(updatedContent, dispatch, getState);
 
     const { editorContent: generatedContent } = getStateValues(getState);
     const { parent: generatedParent, grandParent: generatedGrandParent } = findByEditorID(generatedContent, editorID);
     const module = Array.isArray(generatedParent) ? generatedGrandParent : generatedParent;
-    const duplicatedEditorID = module.elements[duplicatedItemIndex].editorID;
+    const duplicatedEditorID = module[parentKey][duplicatedItemIndex].editorID;
 
     setSelectedContent(duplicatedEditorID)(dispatch, getState);
   };
 }
 
-function moveModule(elementID: number, content: any, isPush: boolean): (dispatch: Dispatch, getState: any) => void {
+function moveModule(
+  elementID: number,
+  content: any,
+  isPush: boolean,
+  key: string
+): (dispatch: Dispatch, getState: any) => void {
   return async (dispatch, getState) => {
     try {
       const {
         navigation: { selectedContent, editorContent },
       } = getState();
 
-      const contentElements = [...selectedContent.elements];
+      const contentElements = [...selectedContent[key]];
       const { element: selectedModule } = findByEditorID(editorContent, selectedContent.editorID);
-      selectedModule.elements = moveElement(elementID, contentElements, isPush);
+      selectedModule[key] = moveElement(elementID, contentElements, isPush);
 
       generateContent(editorContent, dispatch, getState);
     } catch {
@@ -573,13 +577,14 @@ function moveModule(elementID: number, content: any, isPush: boolean): (dispatch
   };
 }
 
-function replaceElementsInCollection(newValue: string): (dispatch: Dispatch, getState: any) => void {
+function replaceElementsInCollection(newValue: string, reference: string): (dispatch: Dispatch, getState: any) => void {
   return async (dispatch, getState) => {
     const { selectedContent } = getStateValues(getState);
+    const key = reference ? reference : "elements";
 
-    const updatedContent = replaceElements(selectedContent.elements, newValue);
+    const updatedContent = replaceElements(selectedContent[key], newValue);
 
-    updateEditorContent(selectedContent.editorID, "elements", updatedContent)(dispatch, getState);
+    updateEditorContent(selectedContent.editorID, key, updatedContent)(dispatch, getState);
   };
 }
 

package/src/containers/PageEditor/actions.tsx

@@ -15,7 +15,6 @@ import {
   getUpdatedComponents,
   getUpdatedSections,
   updateComponent,
-  deleteModules,
   updateByEditorID,
   findByEditorID,
   generateEditorIDs,
@@ -26,6 +25,7 @@ import {
   getLastComponentEditorID,
   replaceElements,
   findMandatoryFieldsErrors,
+  getParentKey,
 } from "@ax/forms";
 import { appActions } from "@ax/containers/App";
 import { navigationActions } from "@ax/containers/Navigation";
@@ -48,6 +48,7 @@ import {
   SET_SELECTED_PARENT,
   SET_ERRORS,
   SET_VALIDATED,
+  SET_SITE_PAGE_ID,
 } from "./constants";
 
 import { IPage, ISavePageParams, IBreadcrumbItem, ISchema, IErrorItem } from "@ax/types";
@@ -69,6 +70,7 @@ import {
   ISetSelectedParent,
   ISetErrors,
   ISetValidated,
+  ISetSitePageID,
 } from "./interfaces";
 
 const { setIsLoading, setIsSaving } = appActions;
@@ -141,6 +143,10 @@ function setValidated(validated: boolean): ISetValidated {
   return { type: SET_VALIDATED, payload: { validated } };
 }
 
+function setSitePageID(sitePageID: number | null): ISetSitePageID {
+  return { type: SET_SITE_PAGE_ID, payload: { sitePageID } };
+}
+
 function createNewTranslation(isNewTranslation: boolean): (dispatch: Dispatch, getState: any) => void {
   return async (dispatch, getState) => {
     try {
@@ -456,7 +462,7 @@ function addTemplate(template: string): (dispatch: Dispatch) => Promise<void> {
   };
 }
 
-function addComponent(type: any): (dispatch: Dispatch, getState: any) => void {
+function addComponent(type: any, key: string): (dispatch: Dispatch, getState: any) => void {
   return (dispatch, getState) => {
     const { editorContent, sections, editorID } = getStateValues(getState);
     const component = {
@@ -464,7 +470,7 @@ function addComponent(type: any): (dispatch: Dispatch, getState: any) => void {
       type,
     };
 
-    const updatedObj = getUpdatedComponents(sections, component);
+    const updatedObj = getUpdatedComponents(sections, component, key);
     const updatedSections = updatedObj.updatedSections;
 
     const updatedPageContent = {
@@ -481,7 +487,7 @@ function addComponent(type: any): (dispatch: Dispatch, getState: any) => void {
       setSelectedContent(type.editorID)(dispatch, getState);
     } else {
       const { sections: generatedSections } = getStateValues(getState);
-      const lastElementEditorID = getLastComponentEditorID(generatedSections, component.editorID);
+      const lastElementEditorID = getLastComponentEditorID(generatedSections, component.editorID, key);
       setSelectedContent(lastElementEditorID)(dispatch, getState);
     }
   };
@@ -490,6 +496,7 @@ function addComponent(type: any): (dispatch: Dispatch, getState: any) => void {
 function addModule(
   type: string,
   selectedID: number,
+  key: string,
   isComponentModule?: boolean
 ): (dispatch: Dispatch, getState: any) => void {
   return (dispatch, getState) => {
@@ -503,7 +510,7 @@ function addModule(
       updatedSectionIndex = 0;
 
     if (isComponentModule) {
-      const updatedObj = getUpdatedComponents(sections, componentModule);
+      const updatedObj = getUpdatedComponents(sections, componentModule, key);
       updatedSections = updatedObj.updatedSections;
       updatedSectionIndex = updatedObj.selectedIndex;
     } else {
@@ -551,33 +558,44 @@ function replaceModule(module: any, parent: any, objKey: string): (dispatch: Dis
   };
 }
 
-function replaceElementsInCollection(newValue: string): (dispatch: Dispatch, getState: any) => void {
+function replaceElementsInCollection(newValue: string, reference: string): (dispatch: Dispatch, getState: any) => void {
   return async (dispatch, getState) => {
     const { selectedContent } = getStateValues(getState);
 
-    const updatedContent = replaceElements(selectedContent.elements, newValue);
+    const key = reference ? reference : "elements";
+    const updatedContent = replaceElements(selectedContent[key], newValue);
 
-    updateEditorContent(selectedContent.editorID, "elements", updatedContent)(dispatch, getState);
+    updateEditorContent(selectedContent.editorID, key, updatedContent)(dispatch, getState);
 
     const { editorContent } = getStateValues(getState);
     generatePageContent(editorContent, dispatch, getState);
   };
 }
 
-function deleteModule(editorID: number): (dispatch: Dispatch, getState: any) => void {
+function deleteModule(editorID: number, key?: string): (dispatch: Dispatch, getState: any) => void {
   return (dispatch, getState) => {
-    const { editorContent, sections } = getStateValues(getState);
-    deleteModules(sections, editorID);
+    const { sections, editorContent } = getStateValues(getState);
+
+    const updatedSections: any = [...sections];
+    const { parent, grandParent } = findByEditorID(updatedSections, editorID);
+    const parentModule = Array.isArray(parent) ? grandParent : parent;
+
+    const parentKey = key ? key : getParentKey(parentModule, editorID);
+    const itemsArr = parentModule[parentKey];
+
+    const index = itemsArr.findIndex((module: any) => module.editorID === editorID);
+    itemsArr.splice(index, 1);
 
     const updatedPageContent = {
       ...editorContent,
+      sections: [...updatedSections],
     };
 
     generatePageContent(updatedPageContent, dispatch, getState);
   };
 }
 
-function duplicateModule(editorID: number): (dispatch: Dispatch, getState: any) => void {
+function duplicateModule(editorID: number, key?: string): (dispatch: Dispatch, getState: any) => void {
   return (dispatch, getState) => {
     const { sections, editorContent } = getStateValues(getState);
 
@@ -585,9 +603,8 @@ function duplicateModule(editorID: number): (dispatch: Dispatch, getState: any)
     const { element: originalItem, parent, grandParent } = findByEditorID(updatedSections, editorID);
     const parentModule = Array.isArray(parent) ? grandParent : parent;
 
-    const { modules, elements, componentModules } = parentModule;
-
-    const itemsArr = modules ? modules : elements ? elements : componentModules;
+    const parentKey = key ? key : getParentKey(parentModule, editorID);
+    const itemsArr = parentModule[parentKey];
 
     const originalItemIndex = itemsArr.findIndex((module: any) => module.editorID === editorID);
     const duplicatedItemIndex = originalItemIndex + 1;
@@ -603,11 +620,7 @@ function duplicateModule(editorID: number): (dispatch: Dispatch, getState: any)
     const { sections: generatedSections } = getStateValues(getState);
     const { parent: generatedParent, grandParent: generatedGrandParent } = findByEditorID(generatedSections, editorID);
     const section = Array.isArray(generatedParent) ? generatedGrandParent : generatedParent;
-    const duplicatedEditorID = modules
-      ? section.modules[duplicatedItemIndex].editorID
-      : elements
-      ? section.elements[duplicatedItemIndex].editorID
-      : section.componentModules[duplicatedItemIndex].editorID;
+    const duplicatedEditorID = section[parentKey][duplicatedItemIndex].editorID;
 
     setSelectedContent(duplicatedEditorID)(dispatch, getState);
   };
@@ -759,6 +772,7 @@ function resetPageEditor(): (dispatch: Dispatch) => Promise<void> {
       dispatch(setTemplateConfig({}));
       dispatch(setErrors([]));
       dispatch(setValidated(false));
+      dispatch(setSitePageID(null));
       localStorage.removeItem("selectedID");
     } catch (e) {
       console.log("Error", e); //TODO
@@ -766,7 +780,12 @@ function resetPageEditor(): (dispatch: Dispatch) => Promise<void> {
   };
 }
 
-function moveElement(elementID: number, content: any, isPush: boolean): (dispatch: Dispatch, getState: any) => void {
+function moveElement(
+  elementID: number,
+  content: any,
+  isPush: boolean,
+  key: string
+): (dispatch: Dispatch, getState: any) => void {
   return async (dispatch, getState) => {
     try {
       const { selectedContent, editorContent } = getState().pageEditor;
@@ -776,6 +795,7 @@ function moveElement(elementID: number, content: any, isPush: boolean): (dispatc
         selectedContent,
         isPush,
         page: editorContent.editorContent,
+        key,
       });
 
       generatePageContent(newContent, dispatch, getState);
@@ -847,11 +867,12 @@ function getGlobalFromLocalPage(): (dispatch: Dispatch, getState: any) => Promis
       dispatch(setIsLoading(true));
 
       const {
-        pageEditor: { editorContent: content },
+        pageEditor: { editorContent: content, currentPageID },
       } = getState();
 
       const { originalGlobalPage } = content.editorContent;
 
+      dispatch(setSitePageID(currentPageID));
       dispatch(setCurrentPageID(originalGlobalPage));
     } catch (e) {
       console.log(e);
@@ -899,4 +920,5 @@ export {
   deleteError,
   restorePage,
   getGlobalFromLocalPage,
+  setSitePageID,
 };

package/src/containers/PageEditor/constants.tsx

@@ -16,6 +16,7 @@ export const SET_IS_NEW_TRANSLATION = `${NAME}/SET_IS_NEW_TRANSLATION`;
 export const SET_TEMPLATE_CONFIG = `${NAME}/SET_TEMPLATE_CONFIG`;
 export const SET_ERRORS = `${NAME}/SET_ERRORS`;
 export const SET_VALIDATED = `${NAME}/SET_VALIDATED`;
+export const SET_SITE_PAGE_ID = `${NAME}/SET_SITE_PAGE_ID`;
 
 export const INITIAL_TEMPLATE = "BasicTemplate";
 export const MULTIMEDIA_COMPONENTS = ["LinkableImage", "Video"];