web fix

app/web/src/nova/ed/panel/main/main-per-item.tsx

@@ -0,0 +1,103 @@
+import { IContent } from "../../../../utils/types/general";
+import { VG } from "../../../vi/render/global";
+import { IMeta, PG, active } from "../../logic/ed-global";
+
+type MPIVParam = Parameters<Exclude<VG["visit"], undefined>>;
+export const mainPerItemVisit = (
+  p: PG,
+  meta: MPIVParam[0],
+  parts: MPIVParam[1]
+) => {
+  if ((meta.item as IContent).type === "text" && !meta.item.adv?.jsBuilt) {
+    parts.props.spellCheck = false;
+    parts.props.contentEditable = true;
+    parts.props.dangerouslySetInnerHTML = {
+      __html: meta.mitem?.get("html") || "&nbsp;",
+    };
+    parts.props.onBlur = (e) => {
+      e.stopPropagation();
+      const mitem = meta.mitem;
+      if (mitem) {
+        mitem.set("html", e.currentTarget.innerHTML);
+      }
+    };
+  }
+
+  let isActive: boolean = active.item_id === meta.item.id;
+  if (active.comp_id) {
+    isActive = active.item_id === meta.item.originalId;
+  }
+
+  parts.props.className = cx(
+    parts.props.className,
+    isActive &&
+      css`
+        &::after {
+          content: " ";
+          pointer-events: none;
+          position: absolute;
+          top: 0;
+          bottom: 0;
+          left: 0;
+          right: 0;
+          border: 2px solid #1c88f3;
+        }
+      `
+  );
+  parts.props.onPointerOver = (e) => {
+    e.stopPropagation();
+    active.hover.id = meta.item.id;
+    active.hover.renderMain();
+    active.hover.renderTree();
+  };
+  parts.props.onPointerLeave = (e) => {
+    e.stopPropagation();
+    active.hover.id = "";
+    active.hover.renderMain();
+    active.hover.renderTree();
+  };
+  parts.props.onPointerDown = (e) => {
+    e.stopPropagation();
+
+    const item = getOuterItem(
+      {
+        meta: active.comp_id ? p.comp.list[active.comp_id].meta : p.page.meta,
+      },
+      meta
+    );
+    if (active.comp_id && item.component?.id === active.comp_id) {
+      if (meta.item.originalId) {
+        active.item_id = meta.item.originalId;
+      }
+    } else {
+      if (item) {
+        active.item_id = item.id;
+      }
+    }
+    active.hover.id = "";
+    p.render();
+  };
+};
+
+const getOuterItem = (p: { meta: Record<string, IMeta> }, meta: IMeta) => {
+  let cur: undefined | IMeta = meta;
+
+  if (cur.jsx_prop) return meta.item;
+
+  while (cur?.parent?.instance_id) {
+    cur = p.meta[cur?.parent?.instance_id];
+  }
+
+  return cur.item;
+};
+function setEndOfContenteditable(div: any) {
+  let range: any, sel: any;
+  if (document.createRange) {
+    //Firefox, Chrome, Opera, Safari, IE 9+
+    range = document.createRange();
+    range.selectNodeContents(div);
+    sel = window.getSelection();
+    sel.removeAllRanges();
+    sel.addRange(range);
+  }
+}

app/web/src/nova/ed/panel/main/main.tsx

@@ -1,7 +1,7 @@
 import { useGlobal, useLocal } from "web-utils";
-import { IContent } from "../../../../utils/types/general";
 import { Vi } from "../../../vi/vi";
 import { EDGlobal, active } from "../../logic/ed-global";
+import { mainPerItemVisit } from "./main-per-item";
 
 export const EdMain = () => {
   // return <div className="flex flex-1 flex-col relative"></div>;
@@ -29,58 +29,7 @@ export const EdMain = () => {
           db={p.script.db}
           script={{ init_local_effect: p.script.init_local_effect }}
           visit={(meta, parts) => {
-            if (
+            return mainPerItemVisit(p, meta, parts);
-              (meta.item as IContent).type === "text" &&
-              !meta.item.adv?.jsBuilt
-            ) {
-              parts.props.spellCheck = false;
-              parts.props.contentEditable = true;
-              parts.props.dangerouslySetInnerHTML = {
-                __html: meta.mitem?.get("html") || "",
-              };
-              parts.props.onBlur = (e) => {
-                e.stopPropagation();
-                const mitem = meta.mitem;
-                if (mitem) {
-                  mitem.set("html", e.currentTarget.innerHTML);
-                }
-              };
-            }
-
-            parts.props.className = cx(
-              parts.props.className,
-              active.item_id === meta.item.id &&
-                css`
-                  &::after {
-                    content: " ";
-                    pointer-events: none;
-                    position: absolute;
-                    top: 0;
-                    bottom: 0;
-                    left: 0;
-                    right: 0;
-                    border: 2px solid #1c88f3;
-                  }
-                `
-            );
-            parts.props.onPointerOver = (e) => {
-              e.stopPropagation();
-              active.hover.id = meta.item.id;
-              active.hover.renderMain();
-              active.hover.renderTree();
-            };
-            parts.props.onPointerLeave = (e) => {
-              e.stopPropagation();
-              active.hover.id = "";
-              active.hover.renderMain();
-              active.hover.renderTree();
-            };
-            parts.props.onPointerDown = (e) => {
-              e.stopPropagation();
-              active.item_id = meta.item.id;
-              active.hover.id = "";
-              p.render();
-            };
           }}
         />
       </div>
@@ -108,15 +57,3 @@ const mainStyle = () => {
       `
   );
 };
-
-function setEndOfContenteditable(div: any) {
-  let range: any, sel: any;
-  if (document.createRange) {
-    //Firefox, Chrome, Opera, Safari, IE 9+
-    range = document.createRange();
-    range.selectNodeContents(div);
-    sel = window.getSelection();
-    sel.removeAllRanges();
-    sel.addRange(range);
-  }
-}

app/web/src/nova/vi/meta/comp/instantiate.tsx

@@ -38,6 +38,10 @@ export const walkChild = (
   item: IItem,
   ids: Exclude<FNComponent["ref_ids"], undefined>
 ) => {
+  if (!item.originalId) {
+    item.originalId = item.id;
+  }
+
   if (!ids[item.id]) {
     ids[item.id] = createId();
   }

pkgs/core/api/_dbs.ts

@@ -9,7 +9,6 @@ export const _ = {
     try {
       const result = await execQuery(req.params, db);
       res.send(result);
-
     } catch (e: any) {
       res.sendStatus(500);
       res.send(e.message);

pkgs/core/server/create.ts

@@ -64,6 +64,7 @@ export const createServer = async () => {
     } as WebSocketHandler<WSData>,
     async fetch(req, server) {
       const url = new URL(req.url);
+
       const response = async () => {
         if (wsHandler[url.pathname]) {
           if (
@@ -90,6 +91,7 @@ export const createServer = async () => {
         const webPath = "app/static";
         try {
           const found = cache.static[url.pathname];
+
           if (found && g.mode === "prod") {
             return responseCached(req, found);
           }
@@ -100,7 +102,7 @@ export const createServer = async () => {
             file.type !== "application/octet-stream" // is not directory
           ) {
             if (g.mode === "dev") {
-              return new Response(file as any);
+              return new Response(file);
             }
 
             if (!cache.static[url.pathname]) {

pkgs/core/server/serve-api.ts

@@ -54,7 +54,9 @@ export const serveAPI = async (url: URL, req: Request) => {
               }
             }
           }
-        } catch (e) {}
+        } catch (e) {
+          g.log.error({ pathname: url.pathname, error: e });
+        }
       }
     }