fix comp

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

@@ -1,6 +1,7 @@
 import { syncronize } from "y-pojo";
 import { docs } from "../entity/docs";
 import { snapshot } from "../entity/snapshot";
+import { gzipAsync } from "../entity/zlib";
 import { ActionCtx } from "../type";
 
 export const comp_load = async function (this: ActionCtx, id: string) {
@@ -34,16 +35,31 @@ export const comp_load = async function (this: ActionCtx, id: string) {
       return {
         id: id,
         name: comp.name,
-        snapshot: bin,
+        snapshot: await gzipAsync(bin),
       };
     }
-  }
+  } else if (snap && !ydoc) {
+    const doc = new Y.Doc();
+    Y.applyUpdate(doc, snap.bin);
+    let root = doc.getMap("map");
 
-  if (snap) {
+    const um = new Y.UndoManager(root, { ignoreRemoteMapChanges: true });
+    docs.page[id] = {
+      doc: doc as any,
+      id,
+      um,
+    };
+
+    return {
+      id: id,
+      name: snap.name,
+      snapshot: await gzipAsync(snap.bin),
+    };
+  } else if (snap && ydoc) {
     return {
       id: snap.id,
       name: snap.name,
-      snapshot: snap.bin,
+      snapshot: await gzipAsync(snap.bin),
     };
   }
 };

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

@@ -12,7 +12,7 @@ export const page_load: SAction["page"]["load"] = async function (
   let snap = snapshot.get("page", id);
   let ydoc = docs.page[id];
 
-  if (!snap || !ydoc) {
+  if (!snap && !ydoc) {
     const page = await db.page.findFirst({ where: { id } });
     if (page) {
       const doc = new Y.Doc();
@@ -43,9 +43,25 @@ export const page_load: SAction["page"]["load"] = async function (
         snapshot: await gzipAsync(bin),
       };
     }
-  }
+  } else if (snap && !ydoc) {
+    const doc = new Y.Doc();
+    Y.applyUpdate(doc, snap.bin);
+    let root = doc.getMap("map");
 
-  if (snap) {
+    const um = new Y.UndoManager(root, { ignoreRemoteMapChanges: true });
+    docs.page[id] = {
+      doc: doc as any,
+      id,
+      um,
+    };
+
+    return {
+      id: id,
+      url: snap.url,
+      name: snap.name,
+      snapshot: await gzipAsync(snap.bin),
+    };
+  } else if (snap && ydoc) {
     return {
       id: snap.id,
       url: snap.url,

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

@@ -15,8 +15,8 @@ export const EdBase = () => {
 
   edRoute(p);
 
-  if (p.status === "loading") {
+  if (p.status === "loading" || p.status === "init") {
-    return <Loading note="loading-page" />;
+    return <Loading note={`${p.status}-page`} />;
   }
   if (p.status === "site-not-found" || p.status === "page-not-found") {
     return (

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

@@ -39,7 +39,7 @@ export type EdMeta = {
     mitem?: MItem;
   };
   parent_comp?: {
-    ref_ids: Record<string, string>;
+    mitem: MItem;
     mcomp: MItem;
   };
 };

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

@@ -12,6 +12,7 @@ import {
 import { DComp } from "../../../../utils/types/root";
 import { MSection } from "../../../../utils/types/section";
 import { EdMeta, PG } from "../ed-global";
+import { decompress } from "wasm-gzip";
 
 export const treeRebuild = async (p: PG) => {
   const doc = p.page.doc;
@@ -133,17 +134,26 @@ const walkMap = (
   const { mitem, parent_item, parent_comp } = arg;
 
   const item = {} as unknown as IItem;
+  let override_id = "";
+  const id = mitem.get("id");
+
+  if (parent_comp && id) {
+    const fcomp = parent_comp.mitem.get("component");
+    if (fcomp) {
+      const ref_ids = fcomp.get("ref_ids");
+      if (ref_ids) {
+        let ref_id = ref_ids.get(id);
+        if (!ref_id) {
+          ref_id = createId();
+          ref_ids.set(id, ref_id);
+        }
+        override_id = ref_id;
+      }
+    }
+  }
   mapItem(mitem, item);
-
+  if (override_id) {
-  // sesuaikan item instance id dengan parent comp
+    item.id = override_id;
-  if (parent_comp) {
-    if (!parent_comp["ref_ids"][item.id]) {
-      parent_comp["ref_ids"][item.id] = createId();
-    }
-
-    if (parent_comp["ref_ids"][item.id]) {
-      item.id = parent_comp["ref_ids"][item.id];
-    }
   }
 
   const item_comp = item.component;
@@ -172,7 +182,7 @@ const walkMap = (
           mitem_comp.set("ref_ids", new Y.Map() as any);
           ref_ids = {};
         }
-        mapItemComp({ parent_comp, item, mcomp, mitem_comp, ref_ids });
+        mapItem(mcomp, item);
 
         const meta: EdMeta = {
           item,
@@ -209,7 +219,7 @@ const walkMap = (
                     walkMap(p, {
                       mitem: mcontent,
                       parent_item: { id: item.id, mitem: mitem as MItem },
-                      parent_comp: { ref_ids, mcomp },
+                      parent_comp: { mitem: mitem as MItem, mcomp },
                       portal: arg.portal,
                     });
                   }
@@ -224,7 +234,7 @@ const walkMap = (
           walkMap(p, {
             mitem: e,
             parent_item: { id: item.id, mitem: mitem as MItem },
-            parent_comp: { ref_ids, mcomp },
+            parent_comp: { mitem: mitem as MItem, mcomp },
             skip_add_tree: true,
             portal: arg.portal,
           });
@@ -267,6 +277,7 @@ const walkMap = (
     walkMap(p, {
       mitem: e,
       parent_item: { id: item.id, mitem: mitem as MItem },
+      parent_comp: arg.parent_comp,
       portal: arg.portal,
     });
   }
@@ -277,7 +288,7 @@ const loadComponent = async (p: PG, item_comp: FNComponent) => {
   if (cur && cur.snapshot) {
     const doc = new Y.Doc() as DComp;
     if (cur.snapshot) {
-      Y.applyUpdate(doc as any, cur.snapshot);
+      Y.applyUpdate(doc as any, decompress(cur.snapshot));
       p.comp.list[item_comp.id] = { cur, doc };
       return true;
     }
@@ -331,32 +342,3 @@ const ensureMItemProps = (mitem_comp: FMComponent, item_comp: FNComponent) => {
   }
   return mitem_props;
 };
-
-const mapItemComp = (arg: {
-  parent_comp: EdMeta["parent_comp"];
-  mcomp: MItem;
-  item: IItem;
-  mitem_comp: FMComponent;
-  ref_ids: Record<string, string>;
-}) => {
-  const { parent_comp, mcomp, item, ref_ids, mitem_comp } = arg;
-  let ref_id = "";
-  if (parent_comp) {
-    ref_id = item.id;
-    mapItem(mcomp, item);
-  } else {
-    mapItem(mcomp, item);
-    if (ref_ids[item.id]) {
-      ref_id = ref_ids[item.id];
-    } else {
-      ref_id = createId();
-      const mref = mitem_comp.get("ref_ids");
-      if (mref) {
-        mref.set(item.id, ref_id);
-      }
-    }
-  }
-
-  ref_ids[item.id] = ref_id;
-  item.id = ref_ids[item.id];
-};

app/web/src/render/ed/panel/tree/node/item/name.tsx

@@ -12,7 +12,10 @@ export const EdTreeName = ({
   if (!item) return <></>;
   return (
     <div className="text-[14px] flex items-center cursor-pointer flex-1">
-      {item.name}
+      <div className="flex flex-col">
+        {item.name}
+        {/* <div className={"text-[11px] text-gray-500 -mt-1"}>{item.id}</div> */}
+      </div>
     </div>
   );
 };