[appdef] fixes: on importing a exported app child components are not present in the parent component (#7864)

* fixes: on importing a exported app child components are not present in the parent component

* handles parent component mapping for tabs and calendar component

* handles parent component mapping for tabs and calendar component for new versions

server/src/services/app_import_export.service.ts

@@ -576,6 +576,20 @@ export class AppImportExportService {
         appResourceMappings.dataQueryMapping = dataQueryMapping;
       }
 
+      const isChildOfTabsOrCalendar = (component, allComponents = [], componentParentId = undefined) => {
+        if (componentParentId) {
+          const parentId = component?.parent?.split('-').slice(0, -1).join('-');
+
+          const parentComponent = allComponents.find((comp) => comp.id === parentId);
+
+          if (parentComponent) {
+            return parentComponent.type === 'Tabs' || parentComponent.type === 'Calendar';
+          }
+        }
+
+        return false;
+      };
+
       for (const page of importingPages) {
         const newPage = manager.create(Page, {
           name: page.name,
@@ -599,12 +613,26 @@ export class AppImportExportService {
         for (const component of pageComponents) {
           const newComponent = new Component();
 
+          let parentId = component.parent ? component.parent : null;
+
+          const isParentTabOrCalendar = isChildOfTabsOrCalendar(component, pageComponents, parentId);
+
+          if (isParentTabOrCalendar) {
+            const childTabId = component.parent.split('-')[component.parent.split('-').length - 1];
+            const _parentId = component?.parent?.split('-').slice(0, -1).join('-');
+            const mappedParentId = appResourceMappings.componentsMapping[_parentId];
+
+            parentId = `${mappedParentId}-${childTabId}`;
+          } else {
+            parentId = appResourceMappings.componentsMapping[parentId];
+          }
+
           newComponent.name = component.name;
           newComponent.type = component.type;
           newComponent.properties = component.properties;
           newComponent.styles = component.styles;
           newComponent.validation = component.validation;
-          newComponent.parent = component.parent || null;
+          newComponent.parent = component.parent ? parentId : null;
 
           newComponent.page = pageCreated;
 

server/src/services/apps.service.ts

@@ -459,6 +459,20 @@ export class AppsService {
     const oldComponentToNewComponentMapping = {};
     const oldPageToNewPageMapping = {};
 
+    const isChildOfTabsOrCalendar = (component, allComponents = [], componentParentId = undefined) => {
+      if (componentParentId) {
+        const parentId = component?.parent?.split('-').slice(0, -1).join('-');
+
+        const parentComponent = allComponents.find((comp) => comp.id === parentId);
+
+        if (parentComponent) {
+          return parentComponent.type === 'Tabs' || parentComponent.type === 'Calendar';
+        }
+      }
+
+      return false;
+    };
+
     for (const page of pages) {
       const savedPage = await manager.save(
         manager.create(Page, {
@@ -497,13 +511,27 @@ export class AppsService {
 
         oldComponentToNewComponentMapping[component.id] = newComponent.id;
 
+        let parentId = component.parent ? component.parent : null;
+
+        const isParentTabOrCalendar = isChildOfTabsOrCalendar(component, page.components, parentId);
+
+        if (isParentTabOrCalendar) {
+          const childTabId = component.parent.split('-')[component.parent.split('-').length - 1];
+          const _parentId = component?.parent?.split('-').slice(0, -1).join('-');
+          const mappedParentId = oldComponentToNewComponentMapping[_parentId];
+
+          parentId = `${mappedParentId}-${childTabId}`;
+        } else {
+          parentId = oldComponentToNewComponentMapping[parentId];
+        }
+
         newComponent.name = component.name;
         newComponent.type = component.type;
         newComponent.pageId = savedPage.id;
         newComponent.properties = component.properties;
         newComponent.styles = component.styles;
         newComponent.validation = component.validation;
-        newComponent.parent = component.parent ? oldComponentToNewComponentMapping[component.parent] : null;
+        newComponent.parent = component.parent ? parentId : null;
         newComponent.page = savedPage;
 
         newComponents.push(newComponent);