diff --git a/app/web/src/nova/ed/ed-mid.tsx b/app/web/src/nova/ed/ed-mid.tsx
index e85ce990..960f8207 100644
--- a/app/web/src/nova/ed/ed-mid.tsx
+++ b/app/web/src/nova/ed/ed-mid.tsx
@@ -30,7 +30,7 @@ export const EdMid: FC<{}> = () => {
             <div className="border-r border-r-slate-100 text-slate-400 text-[9px] flex items-center px-1 mr-1">
               ADD
             </div>
-            {!active.comp_id && <EdAddSection />}
+            <EdAddSection />
             <EdAddItem />
             <EdAddText />
             <EdCompPicker />
@@ -70,7 +70,7 @@ export const EdMid: FC<{}> = () => {
             </TopBtn>
           </a>
         </div>
-      </div> 
+      </div>
     </div>
   );
-}; 
+};
diff --git a/app/web/src/nova/ed/logic/active/activate-meta.tsx b/app/web/src/nova/ed/logic/active/activate-meta.tsx
index 616317a0..897b8115 100644
--- a/app/web/src/nova/ed/logic/active/activate-meta.tsx
+++ b/app/web/src/nova/ed/logic/active/activate-meta.tsx
@@ -1,8 +1,42 @@
 import { IMeta, PG, active } from "../ed-global";
 
-export const activateMeta = (p: PG, meta: IMeta) => {
+export const activateMeta = (p: PG, _meta: IMeta) => {
+  let meta = _meta;
   let parent_comp_id = meta.parent?.comp_id;
 
+  if (!active.comp_id && meta.parent?.comp_id) {
+    let parent = meta.parent;
+
+    let is_jsx = false;
+    let i = 0;
+    while (parent) {
+      const meta_parent = p.page.meta[parent.id];
+
+      if (meta_parent && meta_parent.parent) {
+        if (meta_parent.jsx_prop) {
+          is_jsx = true;
+        }
+
+        parent = meta_parent.parent;
+      } else {
+        break;
+      }
+      if (i > 10000) {
+        console.warn("warning cyclic item tree possibility detected.");
+        break;
+      }
+      i++;
+    }
+
+    if (!is_jsx) {
+      if (meta.parent.instance_id) {
+        meta = p.page.meta[meta.parent.instance_id];
+      } else {
+        return;
+      }
+    }
+  }
+
   if (
     active.comp_id &&
     meta.item.component?.id === active.comp_id &&
diff --git a/app/web/src/nova/ed/panel/header/mid/add-section.tsx b/app/web/src/nova/ed/panel/header/mid/add-section.tsx
index c99f8719..3483ec61 100644
--- a/app/web/src/nova/ed/panel/header/mid/add-section.tsx
+++ b/app/web/src/nova/ed/panel/header/mid/add-section.tsx
@@ -13,7 +13,12 @@ export const EdAddSection = () => {
   return (
     <TopBtn
       style="slim"
-      onClick={() => {
+      className={cx(active.comp_id && "opacity-20")}
+      onClick={async () => {
+        if (active.comp_id) {
+          alert("Cannot add section while editing component");
+          return;
+        }
         const json = {
           id: createId(),
           name: `New Section`,
diff --git a/app/web/src/nova/ed/panel/header/mid/add-text.tsx b/app/web/src/nova/ed/panel/header/mid/add-text.tsx
index 84bc81db..44c1bc5a 100644
--- a/app/web/src/nova/ed/panel/header/mid/add-text.tsx
+++ b/app/web/src/nova/ed/panel/header/mid/add-text.tsx
@@ -16,7 +16,12 @@ export const EdAddText = () => {
   return (
     <TopBtn
       style="slim"
+      className={cx(active.comp_id && "opacity-20")}
       onClick={async () => {
+        if (active.comp_id) {
+          alert("Cannot add text while editing component");
+          return;
+        }
         let meta = getActiveMeta(p);
 
         if (!meta) {
@@ -76,7 +81,7 @@ export const EdAddText = () => {
             }
 
             if (mitem) {
-              if (mitem.get("type") === "section") {
+              if ((mitem as any).get("type") === "section") {
                 const json = {
                   id: createId(),
                   name: `new_item`,