wip fix content

2023-11-26 17:49:36 +07:00 · 2023-11-26 17:49:36 +07:00 · b229c7ae32
parent 722ff572f2
commit b229c7ae32
13 changed files with 111 additions and 20 deletions
--- a/app/web/src/nova/ed/logic/tree/build.tsx
+++ b/app/web/src/nova/ed/logic/tree/build.tsx
@ -51,6 +51,7 @@ export const treeRebuild = async (p: PG, arg?: { note?: string }) => {
              }
              syncWalkMap(
                {
+                  note: "tree-rebuild layout",
                  comps: p.comp.list,
                  item_loading: p.ui.tree.item_loading,
                  meta: p.page.meta,
@ -125,6 +126,7 @@ export const treeRebuild = async (p: PG, arg?: { note?: string }) => {
          }
          syncWalkMap(
            {
+              note: "tree-rebuild doc",
              comps: p.comp.list,
              item_loading: p.ui.tree.item_loading,
              meta: p.page.meta,
--- a/app/web/src/nova/ed/logic/tree/sync-walk-comp.tsx
+++ b/app/web/src/nova/ed/logic/tree/sync-walk-comp.tsx
@ -19,7 +19,7 @@ export const loadCompSnapshot = async (
    if (typeof p.comp.list[id_comp]?.on_update === "function") {
      doc.off("update", p.comp.list[id_comp].on_update);
    }
- 
+
    p.comp.list[id_comp] = {
      comp: { id: id_comp, snapshot },
      doc,
@ -82,6 +82,7 @@ const walkCompTree = async (p: PG, mitem: MItem) => {

  syncWalkMap(
    {
+      note: "walk-comp",
      comps: p.comp.list,
      item_loading: p.ui.tree.item_loading,
      meta,
--- a/app/web/src/nova/ed/logic/tree/sync-walk.tsx
+++ b/app/web/src/nova/ed/logic/tree/sync-walk.tsx
@ -58,6 +58,7 @@ export const syncWalkLoad = async (

 export const syncWalkMap = (
  p: {
+    note?: string;
    item_loading: PG["ui"]["tree"]["item_loading"];
    tree?: NodeModel<EdMeta>[];
    comps: PG["comp"]["list"];
@ -91,6 +92,7 @@ export const syncWalkMap = (
    skip_tree_child = true;
  }

+  let mapped = false;
  if (parent_mcomp && id) {
    const fcomp = parent_mcomp.mitem.get("component");
    if (fcomp) {
@ -104,11 +106,15 @@ export const syncWalkMap = (
          ref_ids.set(id, ref_id);
        }
        override_id = ref_id;
+        mapItem(mitem, item, ref_ids.toJSON());
+        mapped = true;
      }
    }
  }

-  mapItem(mitem, item);
+  if (!mapped) {
+    mapItem(mitem, item);
+  }

  if (override_id) {
    if (!item.originalId) item.originalId = item.id;
@ -144,7 +150,7 @@ export const syncWalkMap = (
          ref_ids = {};
        }
        const old_id = item.id;
-        mapItem(mcomp, item);
+        mapItem(mcomp, item, ref_ids);
        item.originalId = item.id;
        item.id = old_id;

@ -188,14 +194,25 @@ export const syncWalkMap = (
              for (const [k, v] of Object.entries(mprops)) {
                const mprop = ensureMProp(mitem_props, k, v);
                item_comp.props[k] = v;
+                if (meta.item.type === "item" && meta.item.component) {
+                  meta.item.component.props[k] = v;
+                }
+
                if (mprop && v.meta?.type === "content-element") {
                  const mcontent = ensurePropContent(mprop, k);
+                  item_comp.props[k].content = mcontent?.toJSON() as IItem;
+                  if (meta.item.type === "item" && meta.item.component) {
+                    meta.item.component.props[k].content =
+                      item_comp.props[k].content;
+                  }
+
                  if (mcontent) {
                    syncWalkMap(p, {
                      is_layout: arg.is_layout,
                      tree_root_id: arg.tree_root_id,
                      mitem: mcontent,
                      is_jsx_prop: true,
+                      parent_mcomp: arg.parent_mcomp,
                      parent_item: { id: item.id, mitem: mitem as MItem },
                      portal: arg.portal,
                      skip_add_tree: skip_tree_child,
@ -209,6 +226,7 @@ export const syncWalkMap = (
        }

        const childs = mcomp.get("childs")?.map((e) => e) || [];
+
        for (const e of childs) {
          syncWalkMap(p, {
            is_layout: arg.is_layout,
@ -259,6 +277,7 @@ export const syncWalkMap = (
  }

  const childs = mitem.get("childs")?.map((e) => e) || [];
+
  for (const e of childs) {
    syncWalkMap(p, {
      is_layout: arg.is_layout,
@ -301,7 +320,11 @@ export const loadComponent = async (p: PG, id_comp: string) => {
  });
 };

-const mapItem = (mitem: MContent, item: any) => {
+const mapItem = (
+  mitem: MContent,
+  item: any,
+  ref_ids?: Record<string, string>
+) => {
  mitem.forEach((e, k) => {
    if (k !== "childs") {
      let val = e;
@ -312,10 +335,17 @@ const mapItem = (mitem: MContent, item: any) => {
      }
      item[k] = val;
    } else {
-      if (!item[k]) item[k] = [];
+      item[k] = [];
      const childs = e as unknown as TypedArray<{}>;
      childs.forEach((c) => {
-        item[k].push({ id: c.get("id") });
+        if (ref_ids) {
+          const id = ref_ids[c.get("id")];
+          if (id) {
+            item[k].push({ id });
+          }
+        } else {
+          item[k].push({ id: c.get("id") });
+        }
      });
    }
  });
--- a/app/web/src/nova/ed/panel/main/main.tsx
+++ b/app/web/src/nova/ed/panel/main/main.tsx
@ -7,6 +7,7 @@ import { code } from "../popup/code/code";

 export const EdMain = () => {
  const p = useGlobal(EDGlobal, "EDITOR");
+  const root = p.page.tree.find((e) => e.parent === "root");
  return (
    <div
      className={cx(
--- a/app/web/src/nova/ed/panel/tree/node/item/name.tsx
+++ b/app/web/src/nova/ed/panel/tree/node/item/name.tsx
@ -74,7 +74,7 @@ export const EdTreeName = ({
      ) : (
        <div className="flex flex-col">
          <Name name={node.text} is_jsx_prop={is_jsx_prop} />
-          {/* <div className={"text-[11px] text-gray-500 -mt-1"}>{item.id}</div> */}
+          <div className={"text-[11px] text-gray-500 -mt-1"}>{item.id}</div>
        </div>
      )}
    </div>
--- a/app/web/src/nova/view/logic/global.ts
+++ b/app/web/src/nova/view/logic/global.ts
@ -10,7 +10,7 @@ export const ViewGlobal = {
  layout: { show: false },
  meta: {} as Record<string, EdMeta>,
  entry: [] as string[],
-  bodyCache: null as null | ReactElement,
+  body_cache: null as null | ReactElement,
  component: {
    load: async (id_comp: string) => {},
  },
--- a/app/web/src/nova/view/logic/load-code-old.ts
+++ b/app/web/src/nova/view/logic/load-code-old.ts
@ -1,5 +1,58 @@
+import importModule from "../../../render/editor/tools/dynamic-import";
+import { devLoader } from "../../../render/live/dev-loader";
+import { createAPI, createDB } from "../../../utils/script/init-api";
 import { VG } from "./global";

-export const oldLoadCode = (v: VG) => {
-  v.status = "ready";
+export const oldLoadCode = async (v: VG) => {
+  const site = await db.site.findFirst({
+    where: { id: v.current.site_id },
+    include: { component_site: true },
+  });
+
+  const loader = devLoader;
+  const p = {} as any;
+  if (site) {
+    const w = window as any;
+    if (!w.exports) w.exports = {};
+
+    if (site.component_site) {
+      for (const cg of site.component_site) {
+        await importModule(loader.npm(p, "site", cg.id_component_group));
+      }
+    }
+
+    await importModule(loader.npm(p, "site", site.id));
+    if (site.js_compiled) {
+      const config = site.config as any;
+      const exec = (fn: string, scopes: any) => {
+        if (config.api_url) {
+          scopes["api"] = createAPI(config.api_url);
+          scopes["db"] = createDB(config.api_url);
+        }
+        scopes.params = w.params;
+        scopes.module = {};
+        const f = new Function(...Object.keys(scopes), fn);
+        const res = f(...Object.values(scopes));
+        return res;
+      };
+      const scope = {
+        types: {},
+        exports: w.exports,
+        load: importModule,
+        render: p.render,
+        module: {
+          exports: {} as any,
+        },
+      };
+      exec(site.js_compiled, scope);
+      if (scope.module.exports) {
+        for (const [k, v] of Object.entries(scope.module.exports)) {
+          w.exports[k] = v;
+        }
+      }
+    }
+  }
+
+  v.status = "rebuild";
+  v.render();
 };
--- a/app/web/src/nova/view/render/meta/children.tsx
+++ b/app/web/src/nova/view/render/meta/children.tsx
@ -3,10 +3,13 @@ import { IItem } from "../../../../utils/types/item";
 import { IText } from "../../../../utils/types/text";
 import { ISection } from "../../../../utils/types/section";
 import { ViewMeta } from "./meta";
+import { useGlobal } from "web-utils";
+import { ViewGlobal } from "../../logic/global";

 export const ViewMetaChildren: FC<{ item: IItem | IText | ISection }> = ({
  item,
 }) => {
+  const v = useGlobal(ViewGlobal, "VIEW");
  const children: ReactNode[] = [];

  if (item.type !== "text") {
--- a/app/web/src/nova/view/render/meta/meta.tsx
+++ b/app/web/src/nova/view/render/meta/meta.tsx
@ -13,6 +13,7 @@ export const ViewMeta: FC<{ id: string; scopeIndex?: Record<string, any> }> = ({
  const [, _render] = useState({});

  const meta = v.meta[id];
+
  if (!meta) return null;
  meta.render = () => _render({});

--- a/app/web/src/nova/view/render/meta/render.tsx
+++ b/app/web/src/nova/view/render/meta/render.tsx
@ -12,6 +12,7 @@ export const ViewMetaRender: FC<{
 }> = ({ meta, v, props, className }) => {
  let _className = className;
  const item = meta.item;
+
  if (meta.is_layout && !v.layout.show) {
    return <ViewMetaChildren item={item} />;
  }
@ -23,7 +24,6 @@ export const ViewMetaRender: FC<{
      active: v.view.active ? v.view.active.get(item) : undefined,
    });
  }
-
  return (
    <div
      className={_className}
--- a/app/web/src/nova/view/render/meta/script.tsx
+++ b/app/web/src/nova/view/render/meta/script.tsx
@ -64,7 +64,9 @@ export const ViewMetaScript: FC<{
          } = v as any;
          if (t._jsx && t.Comp) {
            finalScope[k] = (
-              <t.Comp parent_id={meta.item.id} scopeIndex={scopeIndex} />
+              <>
+                <t.Comp parent_id={meta.item.id} scopeIndex={scopeIndex} />
+              </>
            );
          }
        }
--- a/app/web/src/nova/view/render/meta/script/comp-propval.tsx
+++ b/app/web/src/nova/view/render/meta/script/comp-propval.tsx
@ -9,19 +9,18 @@ import { mergeScopeUpwards } from "./merge-upward";
 const jsxProps = {} as Record<string, any>;
 export const compPropVal = (v: VG, meta: EdMeta) => {
  let props = {} as Record<string, FNCompDef>;
-  let cprops = {} as [string, FNCompDef][];
+  let cprops = [] as [string, FNCompDef][];
  const item = meta.item;
  if (item.type === "item" && item.component?.id) {
    const icomp = item.component;
    if (icomp) {
-      cprops = Object.entries(props);
+      props = icomp.props;
+      cprops = Object.entries({ ...icomp.props });

      if (v.script.api_url) {
        if (!v.script.db) v.script.db = createDB(v.script.api_url);
        if (!v.script.api) v.script.api = createAPI(v.script.api_url);

-        const props = icomp.props;
-
        const w = window as any;
        const finalScope = mergeScopeUpwards;
        const args = {
--- a/app/web/src/nova/view/view.tsx
+++ b/app/web/src/nova/view/view.tsx
@ -5,11 +5,10 @@ import { Loading } from "../../utils/ui/loading";
 import { ViewGlobal } from "./logic/global";
 import { vInit } from "./logic/init";
 import { newLoadCode } from "./logic/load-code-new";
+import { oldLoadCode } from "./logic/load-code-old";
 import { VLoad, VLoadComponent } from "./logic/types";
 import { VEntry } from "./render/entry";
 import { ErrorBox } from "./render/meta/script/error-box";
-import { IRoot } from "../../utils/types/root";
-import { oldLoadCode } from "./logic/load-code-old";

 type ViewProp = {
  load: VLoad;
@ -101,9 +100,9 @@ const BoxedView: FC<ViewProp> = ({
      v.meta = load.meta;
      v.entry = load.entry;
    }
-    v.bodyCache = <VEntry />;
+    v.body_cache = <VEntry />;
    v.status = "ready";
  }

-  return <div className="flex flex-1 flex-col relative">{v.bodyCache}</div>;
+  return <div className="flex flex-1 flex-col relative">{v.body_cache}</div>;
 };