wip fix component

app/web/src/nova/ed/logic/ed-global.ts

@@ -7,6 +7,7 @@ import { IItem, MItem } from "../../../utils/types/item";
 import { DComp, DPage, IRoot } from "../../../utils/types/root";
 import { ISection } from "../../../utils/types/section";
 import { IText, MText } from "../../../utils/types/text";
+import { FNComponent } from "../../../utils/types/meta-fn";
 
 export const EmptySite = {
   id: "",
@@ -88,6 +89,7 @@ export const EDGlobal = {
     cur: EmptyComp,
     doc: null as null | DComp,
     item: null as null | IItem,
+    map: {} as Record<string, { id: string; item: IItem }>,
     list: {} as Record<string, { comp: EComp; doc: DComp }>,
     group: {} as Record<string, Awaited<ReturnType<SAction["comp"]["group"]>>>,
   },

app/web/src/nova/ed/logic/tree/build.tsx

@@ -93,7 +93,7 @@ const walkLoad = async (p: PG, mitem: MItem, loaded: Set<string>) => {
     if (id) {
       loaded.add(id);
       if (!p.comp.list[id]) {
-        await loadComponent(p, comp);
+        await loadComponent(p, comp.id);
       }
 
       const pcomp = p.comp.list[id];
@@ -305,13 +305,17 @@ const walkMap = (
   }
 };
 
-const loadComponent = async (p: PG, item_comp: FNComponent) => {
-  const cur = await p.sync.comp.load(item_comp.id);
+export const loadComponent = async (p: PG, id_comp: string) => {
+  const cur = await p.sync.comp.load(id_comp);
   if (cur && cur.snapshot) {
     const doc = new Y.Doc() as DComp;
     if (cur.snapshot) {
       Y.applyUpdate(doc as any, decompress(cur.snapshot));
-      p.comp.list[item_comp.id] = { comp: cur, doc };
+      p.comp.map[id_comp] = {
+        id: id_comp,
+        item: doc.getMap("map").get("root")?.toJSON() as IItem,
+      };
+      p.comp.list[id_comp] = { comp: cur, doc };
       return true;
     }
   }

app/web/src/nova/ed/panel/header/left/api.tsx

@@ -5,11 +5,25 @@ export const EdApi = () => {
   return (
     <TopBtn
       style="slim"
-      className="font-bold font-mono text-[10px]"
+      className={cx(
+        "font-mono text-[10px]",
+        css`
+          .text {
+            border-top: 1px solid #ddd;
+            border-bottom: 1px solid #ccc;
+          }
+          &:hover .text {
+            border-top: 1px solid white;
+            border-bottom: 1px solid white;
+          }
+        `
+      )}
       popover={(popover) => <EdApiServer popover={popover} />}
       placement="right"
     >
-      <div className="h-[26px] flex items-center justify-center">API</div>
+      <div className="h-[26px] flex items-center justify-center">
+        <div className="text">API</div>
+      </div>
     </TopBtn>
   );
 };

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

@@ -2,6 +2,7 @@ import { useGlobal } from "web-utils";
 import { Loading } from "../../../../utils/ui/loading";
 import { View } from "../../../view/view";
 import { EDGlobal } from "../../logic/ed-global";
+import { loadComponent } from "../../logic/tree/build";
 
 export const EdMain = () => {
   const p = useGlobal(EDGlobal, "EDITOR");
@@ -10,6 +11,12 @@ export const EdMain = () => {
       {!!p.page.building && <Loading backdrop={false} />}
       {!p.page.building && (
         <View
+          component={{
+            map: p.comp.map,
+            load(id_comp) {
+              loadComponent(p, id_comp);
+            },
+          }}
           load={{
             mode: "tree_meta",
             meta: p.page.meta,

app/web/src/nova/view/logic/load-code.ts

@@ -112,15 +112,17 @@ const importCJS = async (url: string) => {
 
   const src = await res.text();
   if (src) {
-    const fn = new Function("module", src);
-    await fn(module);
+    try {
+      const fn = new Function("module", src);
+      await fn(module);
 
-    const result = { ...module.exports };
-    if (result.__esModule) {
-      delete result.__esModule;
-    }
+      const result = { ...module.exports };
+      if (result.__esModule) {
+        delete result.__esModule;
+      }
 
-    return result;
+      return result;
+    } catch (e) {}
   }
 
   return {};

app/web/src/nova/view/logic/types.ts

@@ -1,4 +1,7 @@
-import { EdMeta } from "../../ed/logic/ed-global";
+import { component } from "../../../../../db/db";
+import { IItem } from "../../../utils/types/item";
+import { FNComponent } from "../../../utils/types/meta-fn";
+import { EdMeta, PG } from "../../ed/logic/ed-global";
 
 export type VLoad =
   | { mode: "page"; page_id: string }
@@ -8,3 +11,8 @@ export type VLoad =
       entry: string[];
       meta: Record<string, EdMeta>;
     };
+
+export type VLoadComponent = {
+  map: PG["comp"]["map"];
+  load: (id_comp: string) => void;
+};

app/web/src/nova/view/view.tsx

@@ -4,11 +4,12 @@ import { Loading } from "../../utils/ui/loading";
 import { ViewGlobal } from "./logic/global";
 import { vInit } from "./logic/init";
 import { vLoadCode } from "./logic/load-code";
-import { VLoad } from "./logic/types";
+import { VLoad, VLoadComponent } from "./logic/types";
 import { VEntry } from "./render/entry";
 
 export const View: FC<{
   load: VLoad;
+  component: VLoadComponent;
   site_id: string;
   page_id: string;
   bind?: (arg: { render: () => void }) => void;