hotfix LTS: Fix for duplicating the components (#10208)

* fix: while duplicating the component, the component ID was sent to BE instead of entity ID

* Fixes: page duplication entity mappings
- On page duplication, after cloning of components and mapping to respectived ids, the references used inside the the new/cloned components's definition needs to be updated

* fixes: component crash on page deletion

---------

Co-authored-by: arpitnath <arpitnath42@gmail.com>

frontend/src/Editor/Editor.jsx

@@ -1767,7 +1767,9 @@ const EditorComponent = (props) => {
     });
 
     const copyOfAppDefinition = JSON.parse(JSON.stringify(appDefinition));
+    const newCurrentPageId = isHomePage ? Object.keys(copyOfAppDefinition.pages)[0] : copyOfAppDefinition.homePageId;
 
+    setCurrentPageId(newCurrentPageId);
     const toBeDeletedPage = copyOfAppDefinition.pages[pageId];
 
     const newAppDefinition = {
@@ -1775,9 +1777,6 @@ const EditorComponent = (props) => {
       pages: omit(copyOfAppDefinition.pages, pageId),
     };
 
-    const newCurrentPageId = isHomePage ? Object.keys(copyOfAppDefinition.pages)[0] : copyOfAppDefinition.homePageId;
-
-    setCurrentPageId(newCurrentPageId);
     updateEditorState({
       isUpdatingEditorStateInProcess: true,
     });
@@ -1789,8 +1788,6 @@ const EditorComponent = (props) => {
     });
 
     toast.success(`${toBeDeletedPage.name} page deleted.`);
-
-    switchPage(newCurrentPageId);
   };
 
   const disableEnablePage = ({ pageId, isDisabled }) => {

frontend/src/_helpers/appUtils.js

@@ -85,7 +85,9 @@ const debouncedChange = _.debounce(() => {
 
 export function onComponentOptionsChanged(component, options, id) {
   let componentName = component.name;
-  const { isEditorReady, page } = getCurrentState();
+  const { isEditorReady, page } = useCurrentStateStore.getState();
+
+  if (!isEditorReady || !useEditorStore.getState().appDefinition.pages[page.id]) return;
 
   if (id) {
     const _component = useEditorStore.getState().appDefinition.pages[page.id].components[id];

frontend/src/_stores/appDataStore.js

@@ -54,7 +54,7 @@ export const useAppDataStore = create(
 
             let updateDiff = appDefinitionDiff.updateDiff;
 
-            if (appDefinitionDiff.operation === 'update') {
+            if (appDefinitionDiff.operation === 'update' || appDefinitionDiff.operation === 'create') {
               updateDiff = useResolveStore.getState().actions.findReferences(updateDiff);
             }
 

server/src/services/page.service.ts

@@ -11,6 +11,8 @@ import { EventsService } from './events_handler.service';
 import { Component } from 'src/entities/component.entity';
 import { Layout } from 'src/entities/layout.entity';
 import { EventHandler } from 'src/entities/event_handler.entity';
+import { findAllEntityReferences, isValidUUID, updateEntityReferences } from 'src/helpers/import_export.helpers';
+import { isEmpty } from 'class-validator';
 
 @Injectable()
 export class PageService {
@@ -211,6 +213,20 @@ export class PageService {
           await manager.update(Component, component.id, { parent: parentId });
         }
       }
+
+      const toUpdateComponents = clonedComponents.filter((component) => {
+        const entityReferencesInComponentDefinitions = findAllEntityReferences(component, []).filter(
+          (entity) => entity && isValidUUID(entity)
+        );
+
+        if (entityReferencesInComponentDefinitions.length > 0) {
+          return updateEntityReferences(component, componentsIdMap);
+        }
+      });
+
+      if (!isEmpty(toUpdateComponents)) {
+        await manager.save(toUpdateComponents);
+      }
     });
   }