wip fix content

app/srv/ws/sync/actions/comp_load.ts

@@ -27,28 +27,22 @@ const scanMeta = async (id: string, doc: DComp, sync: SyncConnection) => {
   const scope = {};
   const scope_comps: IScopeComp = {};
   const loaded = new Set<string>();
-  const root = doc.getMap("map").get("root");
+  const mitem = doc.getMap("map").get("root");
-  if (root) {
+  if (mitem) {
-    const name = root.get("name") || "";
+    const name = mitem.get("name") || "";
-    const childs = root.get("childs");
+    await serverWalkLoad(mitem, scope_comps, sync, loaded);
-    if (childs) {
-      await Promise.all(
-        childs.map((m) => serverWalkLoad(m, scope_comps, sync, loaded))
-      );
-      childs.map((m, i) => {
     serverWalkMap(
       { sync, scope, scope_comps },
       {
-            mitem: m,
+        mitem,
         parent_item: { id: "root" },
         parent_ids: ["root"],
       }
     );
-      });
-    }
 
     const bin = Y.encodeStateAsUpdate(doc as any);
     const snapshot = await gzipAsync(bin);
+
     scope_comps[id] = { id, name, scope, snapshot };
   }
 

app/srv/ws/sync/editor/load-page-comp.ts

@@ -0,0 +1,45 @@
+import {
+  ensureMItemProps,
+  ensureMProp,
+  ensurePropContent,
+} from "../../../../web/src/nova/ed/logic/tree/sync-walk-utils";
+import { MItem } from "../../../../web/src/utils/types/item";
+import {
+  FNCompDef,
+  FNComponent,
+} from "../../../../web/src/utils/types/meta-fn";
+import { parseJs } from "./parser/parse-js";
+
+export const extractMItemProps = (arg: {
+  mitem: MItem;
+  item_comp: FNComponent;
+  mcomp: MItem;
+  scope: Exclude<ReturnType<typeof parseJs>, undefined>;
+  mcontent: (mcontent: MItem) => void;
+}) => {
+  const { mitem, item_comp, mcomp, scope } = arg;
+
+  const mitem_comp = mitem.get("component");
+
+  const mprops = mcomp.get("component")?.get("props")?.toJSON() as Record<
+    string,
+    FNCompDef
+  >;
+  if (mitem_comp) {
+    const mitem_props = ensureMItemProps(mitem_comp, item_comp);
+    if (mitem_props) {
+      for (const [k, v] of Object.entries(mprops)) {
+        scope.props[k] = { name: k, value: `null as any` };
+        const mprop = ensureMProp(mitem_props, k, v);
+        item_comp.props[k] = v;
+        if (mprop && v.meta?.type === "content-element") {
+          scope.props[k].value = "null as ReactElement";
+          const mcontent = ensurePropContent(mprop, k);
+          if (mcontent) {
+            arg.mcontent(mcontent);
+          }
+        }
+      }
+    }
+  }
+};

app/srv/ws/sync/editor/load-page.ts

@@ -6,20 +6,18 @@ import {
   IScopeComp,
 } from "../../../../web/src/nova/ed/logic/ed-global";
 import {
-  ensureMItemProps,
+  ensurePropContent
-  ensureMProp,
-  ensurePropContent,
 } from "../../../../web/src/nova/ed/logic/tree/sync-walk-utils";
 import { MContent } from "../../../../web/src/utils/types/general";
 import { IItem, MItem } from "../../../../web/src/utils/types/item";
 import {
-  FNCompDef,
+  FNComponent
-  FNComponent,
 } from "../../../../web/src/utils/types/meta-fn";
 import { docs } from "../entity/docs";
 import { gzipAsync } from "../entity/zlib";
 import { SyncConnection } from "../type";
 import { loadComponent } from "./load-component";
+import { extractMItemProps } from "./load-page-comp";
 import { parseJs } from "./parser/parse-js";
 
 export const serverWalkLoad = async (
@@ -123,7 +121,34 @@ export const serverWalkMap = (
 
   const item_comp = item.component;
   const mitem_comp = mitem.get("component");
-  if (item_comp && item_comp.id && parent_item.id !== "root") {
+  if (item_comp && item_comp.id) {
+    if (parent_item.id === "root") {
+      const scope = { props: {} } as Exclude<
+        ReturnType<typeof parseJs>,
+        undefined
+      >;
+      extractMItemProps({
+        item_comp,
+        mitem,
+        mcomp: mitem,
+        scope,
+        mcontent(mcontent) {},
+      });
+      p.scope[item.id] = {
+        p: arg.parent_ids,
+        n: item.name,
+        s: scope,
+      };
+      const js = item.adv?.js;
+      if (typeof js === "string") {
+        const s = parseJs(js);
+        const ps = p.scope[item.id].s;
+        if (ps) {
+          if (s?.local) ps.local = s.local;
+          if (s?.passprop) ps.passprop = s.passprop;
+        }
+      }
+    } else {
       if (!docs.comp[item_comp.id]) {
         console.error("Component failed to load:", item_comp.id);
         return;
@@ -149,31 +174,19 @@ export const serverWalkMap = (
           mapItem(mcomp, item);
           item.id = original_id;
 
-        const mprops = mcomp.get("component")?.get("props")?.toJSON() as Record<
-          string,
-          FNCompDef
-        >;
-
           const scope = { props: {} } as Exclude<
             ReturnType<typeof parseJs>,
             undefined
           >;
 
-        if (mprops) {
+          extractMItemProps({
-          const mitem_comp = mitem.get("component");
+            item_comp,
-          if (mitem_comp) {
+            mitem,
-            const mitem_props = ensureMItemProps(mitem_comp, item_comp);
+            mcomp,
-            if (mitem_props) {
+            scope,
-              for (const [k, v] of Object.entries(mprops)) {
+            mcontent(mcontent) {
-                scope.props[k] = { name: k, value: `null as any` };
-                const mprop = ensureMProp(mitem_props, k, v);
-                item_comp.props[k] = v;
-                if (mprop && v.meta?.type === "content-element") {
-                  scope.props[k].value = "null as ReactElement";
-                  const mcontent = ensurePropContent(mprop, k);
-                  if (mcontent) {
               serverWalkMap(p, {
-                      parent_ids: [...arg.parent_ids, item.id],
+                parent_ids: ["root", item.id],
                 mitem: mcontent,
                 parent_item: { id: item.id, mitem: mitem as MItem },
                 is_prop: true,
@@ -183,15 +196,12 @@ export const serverWalkMap = (
                   mcomp,
                 },
               });
-                  }
+            },
-                }
+          });
-              }
-            }
-          }
-        }
 
           const pcomp = p.scope_comps[item_comp.id];
-        pcomp.scope[item.id] = { p: arg.parent_ids, n: item.name, s: null };
+          pcomp.scope[item.id] = { p: ["root"], n: item.name, s: null };
+
           const js = item.adv?.js;
           if (typeof js === "string") {
             const res = parseJs(js);
@@ -215,7 +225,7 @@ export const serverWalkMap = (
           for (const e of childs) {
             serverWalkMap(p, {
               mitem: e,
-            parent_ids: [...arg.parent_ids, item.id],
+              parent_ids: ["root", item.id],
               parent_item: {
                 id: item.id,
                 mitem: mitem as MItem,
@@ -231,6 +241,7 @@ export const serverWalkMap = (
       }
       return;
     }
+  }
 
   if (arg.parent_mcomp && !arg.is_prop) {
     const pcomp = p.scope_comps[arg.parent_mcomp.id];
@@ -241,6 +252,7 @@ export const serverWalkMap = (
       if (scope) pcomp.scope[item.id].s = scope;
     }
   } else {
+    if (!(item_comp && item_comp.id)) {
       p.scope[item.id] = { p: arg.parent_ids, n: item.name, s: null };
       const js = item.adv?.js;
       if (typeof js === "string") {
@@ -248,6 +260,7 @@ export const serverWalkMap = (
         if (scope) p.scope[item.id].s = scope;
       }
     }
+  }
 
   const childs = mitem.get("childs")?.map((e) => e) || [];
   for (const e of childs) {

app/web/src/nova/ed/panel/popup/script/monaco.tsx

@@ -22,7 +22,11 @@ export const ScriptMonaco = () => {
   const Editor = jscript.editor;
   if (!Editor) return null;
 
-  const meta = p.page.meta[active.item_id];
+  let meta = p.page.meta[active.item_id];
+  if (active.comp_id) {
+    meta = p.comp.list[active.comp_id].meta[active.item_id];
+  }
+
   if (!meta) return null;
 
   const item = meta.item;

app/web/src/nova/ed/panel/popup/script/scope.tsx

@@ -9,8 +9,12 @@ export const declareScope = async (
   editor: MonacoEditor,
   monaco: Monaco
 ) => {
-  const active_id = active.item_id;
+  let active_id = active.item_id;
-  const s = deepClone(p.page.scope[active_id]);
+  let s = deepClone(p.page.scope[active_id]);
+
+  if (active.comp_id) {
+    s = deepClone(p.comp.list[active.comp_id].scope[active.item_id]);
+  }
 
   monaco.editor.getModels().forEach((model) => {
     if (model.uri.toString().startsWith("ts:scope~")) {
@@ -37,6 +41,17 @@ export const declareScope = async (
   });
 
   spreadScope(p, s, (arg) => {
+    if (arg.type !== "local") {
+      addScope(
+        monaco,
+        `${arg.type}~${arg.name}`,
+        `\
+export const {};
+declare global {
+  const ${arg.name} = ${arg.value};
+}`
+      );
+    } else {
       addScope(
         monaco,
         `${arg.type}~${arg.id}`,
@@ -44,11 +59,10 @@ export const declareScope = async (
 export const {};
 const __val = ${arg.value};
 declare global {
-  const ${arg.name}: typeof __val ${
+  const ${arg.name}: typeof __val & { render: ()=>void };
-    arg.type === "local" ? " & { render: ()=>void}" : ""
-  };
 }`
       );
+    }
   });
 };
 
@@ -100,8 +114,12 @@ const spreadScope = (
       }
     }
     if (!item) {
+      if (active.comp_id) {
+        item = p.comp.list[active.comp_id].scope[parent_id];
+      } else {
         item = p.page.scope[parent_id];
       }
+    }
 
     if (item) {
       const scope = item.s;
@@ -120,7 +138,7 @@ const spreadScope = (
           for (const [k, v] of Object.entries(scope.passprop)) {
             each({
               s,
-              type: "prop",
+              type: "passprop",
               id: parent_id,
               name: k,
               value: v.value,
@@ -133,7 +151,7 @@ const spreadScope = (
           for (const [k, v] of Object.entries(scope.props)) {
             each({
               s,
-              type: "passprop",
+              type: "prop",
               id: parent_id,
               name: k,
               value: v.value,