wip fix

app/srv/ws/sync/editor/parser/parse-js.ts

@@ -10,7 +10,7 @@ export const parseJs = (meta: IMeta) => {
   const result = {} as {
     local?: typeof local | undefined;
     passprop?: typeof passprop | undefined;
-    props?: Record<string, { name: string; value: string }>;
+    props?: Record<string, { name: string; value: string; fn?: any }>;
   };
 
   try {

app/web/src/nova/ed/ed-base.tsx

@@ -7,6 +7,7 @@ import { EDGlobal } from "./logic/ed-global";
 import { edInit } from "./logic/ed-init";
 import { edRoute } from "./logic/ed-route";
 import { edUndoManager } from "./logic/ed-undo";
+import { EdMain } from "./panel/main/main";
 import { EdPane } from "./panel/main/pane-resize";
 import { EdPopApi } from "./panel/popup/api/api-server";
 import { EdPopCode } from "./panel/popup/code/code";
@@ -15,9 +16,6 @@ import { EdPopComp } from "./panel/popup/comp/comp-popup";
 import { EdPopPage } from "./panel/popup/page/page-popup";
 import { EdPopScript } from "./panel/popup/script/pop-script";
 import { EdPopSite } from "./panel/popup/site/site-popup";
-import { EdMain } from "./panel/main/main";
-import { ViGlobal } from "../vi/render/global";
-import { viLoad } from "../vi/load/load";
 
 export const EdBase = () => {
   const p = useGlobal(EDGlobal, "EDITOR");

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

@@ -1,8 +1,6 @@
 import init from "wasm-gzip";
-import { PG } from "./ed-global";
 import { jscript } from "../../../utils/script/jscript";
-import { viLoadLegacy } from "../../vi/load/load-legacy";
-import { treeRebuild } from "./tree/build";
+import { PG } from "./ed-global";
 
 export const edInit = async (p: PG) => {
   p.status = "ready";
@@ -10,32 +8,6 @@ export const edInit = async (p: PG) => {
   await init();
   jscript.init(p.render);
 
-  await viLoadLegacy({
-    site: {
-      api_url: p.site.config.api_url,
-      id: p.site.id,
-      api: {
-        get() {
-          return p.script.api;
-        },
-        set(val) {
-          p.script.api = val;
-        },
-      },
-      db: {
-        get() {
-          return p.script.db;
-        },
-        set(val) {
-          p.script.db = val;
-        },
-      },
-    },
-    render: p.render,
-  });
-
   p.script.loaded = true;
-
-  treeRebuild(p);
   p.render();
 };

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

@@ -3,6 +3,7 @@ import { PG } from "./ed-global";
 import { loadSite } from "./ed-site";
 import { treeRebuild } from "./tree/build";
 import { loadCompSnapshot } from "./tree/sync-walk-comp";
+import { viLoadLegacy } from "../../vi/load/load-legacy";
 
 export const edRoute = async (p: PG) => {
   if (p.status === "ready" || p.status === "init") {
@@ -113,6 +114,31 @@ export const reloadPage = async (p: PG, page_id: string, note: string) => {
       await treeRebuild(p, { note: note + " page-init" });
     }
   }
+
+  await viLoadLegacy({
+    site: {
+      api_url: p.site.config.api_url,
+      id: p.site.id,
+      api: {
+        get() {
+          return p.script.api;
+        },
+        set(val) {
+          p.script.api = val;
+        },
+      },
+      db: {
+        get() {
+          return p.script.db;
+        },
+        set(val) {
+          p.script.db = val;
+        },
+      },
+    },
+    render: () => {},
+  });
+
   p.status = "ready";
   p.render();
 };

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

@@ -3,8 +3,8 @@ import { Vi } from "../../../vi/vi";
 import { EDGlobal } from "../../logic/ed-global";
 
 export const EdMain = () => {
+  // return <div className="flex flex-1 flex-col relative"></div>;
   const p = useGlobal(EDGlobal, "EDITOR");
-
   return (
     <Vi
       meta={p.page.meta}

app/web/src/nova/vi/load/load.tsx

@@ -35,6 +35,5 @@ export const viLoad = (vi: VG, arg: { site_id: string; api_url: string }) => {
     });
   } else {
     vi.status = "ready";
-    vi.render();
   }
 };

app/web/src/nova/vi/render/script.tsx

@@ -8,12 +8,13 @@ import { ViRender } from "./render";
 import { createViLocal } from "./script/local";
 import { createViPassProp } from "./script/passprop";
 import { getScopeMeta, getScopeValue } from "./script/scope-meta";
-import { viEvalProps } from "./script/eval-prop";
+import { updatePropScope, viEvalProps } from "./script/eval-prop";
+import { viScriptArg } from "./script/arg";
 
 export const ViScript: FC<{ meta: IMeta }> = ({ meta }) => {
   const vi = useGlobal(ViGlobal, "VI");
 
-  const scope_meta = getScopeMeta(vi, meta);
+  const scope_meta = getScopeMeta({ meta: vi.meta }, meta);
   const scope = getScopeValue(scope_meta);
 
   if (meta.item.component?.id) {
@@ -46,8 +47,8 @@ export const viEvalScript = (
   if (!meta.script) {
     meta.script = {
       result: null,
-      Local: createViLocal(meta),
-      PassProp: createViPassProp(meta),
+      Local: createViLocal(meta, scope),
+      PassProp: createViPassProp(vi, meta, scope),
     };
   }
   const script = meta.script;
@@ -57,7 +58,6 @@ export const viEvalScript = (
     useEffect,
     children,
     props: parts.props,
-    isEditor: true,
     Local: script.Local,
     PassProp: script?.PassProp,
     ErrorBox: ErrorBox,
@@ -65,10 +65,10 @@ export const viEvalScript = (
     render: (jsx: ReactNode) => {
       script.result = jsx;
     },
+    ...viScriptArg(),
     ...exports,
     ...scope,
   };
-
   const fn = new Function(
     ...Object.keys(arg),
     `// ${meta.item.name}: ${meta.item.id} 
@@ -76,4 +76,6 @@ ${meta.item.adv?.jsBuilt || ""}
   `
   );
   fn(...Object.values(arg));
+
+  updatePropScope(meta, scope);
 };

app/web/src/nova/vi/render/script/arg.tsx

@@ -0,0 +1,5 @@
+export const viScriptArg = () => ({
+  isMobile: false,
+  isDesktop: true,
+  isEditor: true,
+});

app/web/src/nova/vi/render/script/eval-prop.tsx

@@ -1,7 +1,6 @@
 import { IMeta } from "../../../ed/logic/ed-global";
-import { invalidKeyword } from "../../../ed/panel/side/prop-master/prop-form";
 import { VG } from "../global";
-import { getScopeMeta, getScopeValue } from "./scope-meta";
+import { viScriptArg } from "./arg";
 
 export const viEvalProps = (
   vi: { meta: VG["meta"] },
@@ -21,11 +20,12 @@ export const viEvalProps = (
     const arg = {
       ...exports,
       ...scope,
-      isEditor: true,
+      ...viScriptArg(),
     };
 
     meta.scope.def.props = {};
     let fails = new Set<string>();
+    if (!!meta.item.component.props) {
       for (const [name, prop] of Object.entries(meta.item.component.props)) {
         try {
           const fn = new Function(
@@ -34,30 +34,44 @@ export const viEvalProps = (
   return ${prop.valueBuilt || ""}
     `
           );
-        meta.scope.def.props[name] = prop.value;
-        meta.scope.val[name] = fn(...Object.values(arg));
-        scope[name] = meta.scope.val[name];
-        arg[name] = scope[name];
-      } catch (e) {
-        fails.add(name);
-      }
+
+          meta.scope.def.props[name] = { name, value: prop.valueBuilt };
+          let val = fn(...Object.values(arg));
+
+          if (typeof val === "function") {
+            meta.scope.def.props[name].fn = val;
+            val = (...args: any[]) => {
+              return meta.scope.def?.props?.[name].fn(...args);
+            };
           }
 
-    if (fails.size > 0) {
-      for (const [name, prop] of Object.entries(meta.item.component.props)) {
-        if (fails.has(name) && !invalidKeyword.includes(name)) {
-          const fn = new Function(
-            ...Object.keys(arg),
-            `// [${meta.item.name}] ${name}: ${meta.item.id} 
-  return ${prop.valueBuilt || ""}
-    `
-          );
-          meta.scope.def.props[name] = prop.value;
-          meta.scope.val[name] = fn(...Object.values(arg));
-          scope[name] = meta.scope.val[name];
-          arg[name] = scope[name];
+          meta.scope.val[name] = val;
+          scope[name] = val;
+          arg[name] = val;
+        } catch (e) {
+          fails.add(name);
         }
       }
     }
   }
 };
+
+export const updatePropScope = (meta: IMeta, scope: any) => {
+  if (meta.scope.def?.props) {
+    for (const prop of Object.values(meta.scope.def.props)) {
+      if (prop.fn) {
+        const all_scope = {
+          ...scope,
+          ...meta.scope.val,
+        };
+        const fn = new Function(
+          ...Object.keys(all_scope),
+          `// [${meta.item.name}] ${prop.name}: ${meta.item.id} 
+  return ${prop.value || ""}
+    `
+        );
+        prop.fn = fn(...Object.values(all_scope));
+      }
+    }
+  }
+};

app/web/src/nova/vi/render/script/local.tsx

@@ -1,7 +1,9 @@
 import { ReactNode, useEffect, useRef, useState } from "react";
 import { IMeta } from "../../../ed/logic/ed-global";
+import { updatePropScope } from "./eval-prop";
+import { VG } from "../global";
 
-export const createViLocal = (meta: IMeta) => {
+export const createViLocal = (meta: IMeta, scope: any) => {
   return <T extends Record<string, any>>(arg: {
     children: ReactNode;
     name: string;
@@ -23,6 +25,7 @@ export const createViLocal = (meta: IMeta) => {
     }
     const val = meta.scope.val;
     val[arg.name] = local;
+    updatePropScope(meta, scope);
 
     if (arg.hook) {
       arg.hook(local);

app/web/src/nova/vi/render/script/passprop.tsx

@@ -1,8 +1,22 @@
-import { FC, ReactNode } from "react";
+import { ReactNode } from "react";
 import { IMeta } from "../../../ed/logic/ed-global";
+import { VG } from "../global";
+
+export const createViPassProp = (
+  vi: { meta: VG["meta"] },
+  meta: IMeta,
+  scope: any
+) => {
+  return (arg: Record<string, any> & { children: ReactNode }) => {
+    if (!meta.scope.val) {
+      meta.scope.val = {};
+    }
+    for (const [k, v] of Object.entries(arg)) {
+      if (k !== "children") {
+        meta.scope.val[k] = v;
+      }
+    }
 
-export const createViPassProp = (meta: IMeta) => {
-  return (arg: { children: ReactNode }) => {
     return arg.children;
   };
 };

app/web/src/nova/view/logic/meta/comp/instantiate.tsx

@@ -17,7 +17,7 @@ export const instantiate = (arg: {
     newitem.id = item.id;
   }
 
-  if (newitem.component && item.component) {
+  if (newitem.component && item.component && newitem.component.props) {
     for (const k of Object.keys(newitem.component.props)) {
       if (item.component.props[k]) {
         newitem.component.props[k] = item.component.props[k];

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

@@ -24,7 +24,7 @@ export const genMeta = (p: GenMetaP, arg: GenMetaArg) => {
     parent: {
       id: arg.parent?.item.id || "root",
       instance_id: arg.parent?.instance_id,
-      comp_id: arg.parent?.comp?.id,
+      comp_id: arg.parent?.comp?.component?.id,
     },
     scope,
   };