diff --git a/frontend/src/AppBuilder/_stores/slices/componentsSlice.js b/frontend/src/AppBuilder/_stores/slices/componentsSlice.js
index 3f36c005f7..d5b0afa9d4 100644
--- a/frontend/src/AppBuilder/_stores/slices/componentsSlice.js
+++ b/frontend/src/AppBuilder/_stores/slices/componentsSlice.js
@@ -743,12 +743,9 @@ export const createComponentsSlice = (set, get) => ({
           deleteComponentNameIdMapping(oldName, moduleId);
         }
         updateComponentDependencyGraph(moduleId, newComponent);
-      });
-      set(
-        withUndoRedo((state) => {
-          newComponents.forEach((newComponent) => {
-            const parentId = newComponent.component.parent || 'canvas';
-
+        const parentId = newComponent.component.parent || 'canvas';
+        set(
+          withUndoRedo((state) => {
             if (!state.containerChildrenMapping[parentId]) {
               state.containerChildrenMapping[parentId] = [];
             }
@@ -757,14 +754,15 @@ export const createComponentsSlice = (set, get) => ({
             }
             const page = state.modules[moduleId].pages[state.currentPageIndex];
             page.components[newComponent.id] = newComponent;
-          });
-        }, skipUndoRedo),
-        false,
-        'addComponentToCurrentPage'
-      );
-
-      //incase of multiple components, only first one will be selected since it will be the parent component
-      get().setSelectedComponents([newComponents[0].id]);
+          }, skipUndoRedo),
+          false,
+          'addComponentToCurrentPage'
+        );
+        if (index === 0) {
+          //incase of multiple components, only first one will be selected since it will be the parent component
+          get().setSelectedComponents([newComponent.id]);
+        }
+      });
 
       if (saveAfterAction) {
         saveComponentChanges(diff, 'components', 'create')