From 604b6f4ebff2a49a371b1d1168305a94f305ae3d Mon Sep 17 00:00:00 2001
From: Rizky <rizky@avolut.com>
Date: Fri, 12 Jul 2024 20:41:06 -0700
Subject: [PATCH] fix layout

---
 comps/form/field/table-edit/TableEdit.tsx |   8 +-
 comps/menu/Menu.tsx                       | 258 ----------------------
 preset/menu/Layout.tsx                    |  19 +-
 preset/menu/Menu.tsx                      |   3 +-
 4 files changed, 22 insertions(+), 266 deletions(-)
 delete mode 100755 comps/menu/Menu.tsx

diff --git a/comps/form/field/table-edit/TableEdit.tsx b/comps/form/field/table-edit/TableEdit.tsx
index 4a26e87..e85ca39 100755
--- a/comps/form/field/table-edit/TableEdit.tsx
+++ b/comps/form/field/table-edit/TableEdit.tsx
@@ -149,8 +149,8 @@ export const TableEdit: FC<{
                       );
                       fm.render();
                     },
-                    add: () => {
-                      tbl.data.push({});
+                    add: (e: any) => {
+                      tbl.data.push(e ? e : {});
                       fm.render();
                     },
                   }}
@@ -163,8 +163,8 @@ export const TableEdit: FC<{
         </div>
         <PassProp
           ext_fm={{
-            add: () => {
-              local.tbl.data.push({});
+            add: (e: any) => {
+              local.tbl.data.push(e ? e : {});
               fm.render();
 
               setTimeout(() => {
diff --git a/comps/menu/Menu.tsx b/comps/menu/Menu.tsx
deleted file mode 100755
index 0773315..0000000
--- a/comps/menu/Menu.tsx
+++ /dev/null
@@ -1,258 +0,0 @@
-import { getPathname } from "lib/utils/pathname";
-import { useLocal } from "lib/utils/use-local";
-import get from "lodash.get";
-import { FC, useRef } from "react";
-import { IMenu, MenuProp } from "../../preset/menu/utils/type-menu";
-
-export const Menu: FC<MenuProp> = (props) => {
-  const imenu = props.menu[0];
-  let role = props.role;
-  role = props.on_init() as string;
-  const PassProp = props.PassProp;
-  let menu = imenu[role] || [];
-  const pathname = getPathname();
-  const local = useLocal({
-    open: [] as Array<any>,
-    cache: false,
-    active: null as any,
-  });
-  if (!local.open.length && !local.cache) {
-    const result = findChildMenu(menu, (e: any) => e[2] === pathname);
-    if (Array.isArray(result)) {
-      local.open.push(result);
-      local.active = result;
-      local.cache = true;
-      local.render();
-    }
-  }
-  const ref = useRef<HTMLDivElement>(null);
-  return (
-    <div
-    ref={ref}
-      className={cx(
-        props.mode === "mini" ? "c-max-w-[35px]" : "",
-        "c-h-full c-w-full c-flex c-flex-row c-flex-grow c-px-3 c-py-4 c-overflow-y-auto c-rounded "
-      )}
-    >
-      <SideBar data={menu} local={local} pm={props} />
-    </div>
-  );
-};
-export const SideBar: FC<{
-  data: IMenu[];
-  local: any;
-  dept?: number;
-  pm: MenuProp;
-}> = ({ data, local, dept, pm }) => {
-  const PassProp = pm.PassProp;
-  console.log({ data });
-  return (
-    <div className="c-flex c-flex-col c-flex-grow">
-      {data.map((item) => {
-        const menu = {
-          label: item[0],
-          icon: item[1],
-          value: item[2],
-        };
-        return <div key={item[0]}>asdas {typeof menu.icon}</div>;
-        // const find_child = findChild(item, (e: any) => local.open.includes(e));
-        // let expand = find_child;
-        // if (find_child && !local.open.includes(item)) local.open.push(item);
-        // return (
-        //   <div className="w-full c-flex c-flex-col">
-        //     <div
-        //       onClick={() => {
-        //         const childs = getChilds(item) || [];
-        //         if (local.open.includes(item)) {
-        //           local.open = local.open.filter(
-        //             (e: any) => e !== item && !childs.includes(e)
-        //           );
-        //         } else {
-        //           local.open.push(item);
-        //         }
-        //         local.active = item;
-        //         local.render();
-        //       }}
-        //     >
-        //       <PassProp
-        //         item={menu}
-        //         dept={dept || 0}
-        //         hasChild={Array.isArray(menu.value)}
-        //         selected={local.active === item}
-        //         expand={expand}
-        //         mode={pm.mode}
-        //       >
-        //         {pm.child}
-        //       </PassProp>
-        //     </div>
-        //     <div className="c-flex c-flex-col">
-        //       {Array.isArray(menu.value) && expand ? (
-        //         <>
-        //           <SideBar
-        //             data={menu.value}
-        //             local={local}
-        //             dept={(dept || 0) + 1}
-        //             pm={pm}
-        //           />
-        //         </>
-        //       ) : (
-        //         <></>
-        //       )}
-        //     </div>
-        //   </div>
-        // );
-      })}
-    </div>
-  );
-  // return (
-  //   <div className="c-flex c-flex-col c-gap-2 c-flex-grow">
-  //     {data.map((e) => {
-  //       const label: string = e[0];
-  //       const child: any = e[2];
-  //       const hasChildren = Array.isArray(child);
-  //       const predicate = (item: MenuActive) => {
-  //         if (hasChildren) {
-  //           return item.label === e[0] && item.path === "";
-  //         } else {
-  //           return item.label === e[0] && item.path === child;
-  //         }
-  //       };
-  //       const found_local = local.open.find(predicate);
-  //       let expand = get(found_local, "expand") ? true : false;
-  //       const selected = found(e, (menu: any) =>
-  //         local.open.some(
-  //           (item: MenuActive) =>
-  //             item.label === menu[0] || item.path === menu[2]
-  //         )
-  //       );
-  //       if (selected && !found_local) {
-  //         local.open.push({
-  //           label: e[0],
-  //           path: hasChildren ? "" : e[2],
-  //           expand: hasChildren,
-  //         });
-  //         expand = true;
-  //       }
-
-  //       return (
-  //         <div
-  //           className={cx(
-  //             "c-flex c-flex-col c-w-full c-gap-1 c-items-center c-rounded c-pb-0"
-  //           )}
-  //         >
-  //           <div
-  //             className={cx(
-  //               "c-flex c-w-full c-gap-1 c-flex-grow c-items-center c-rounded c-p-2 sidebar-row"
-  //             )}
-  //             onClick={() => {
-  //               const found_local = local.open.find(predicate);
-  //               console.log(found_local);
-  //               if (found_local) {
-  //                 found_local.expand = !found_local.expand;
-  //                 // local.open = local.open.filter((item: MenuActive) => {
-  //                 //   if (hasChildren) {
-  //                 //     return item.label !== e[0] && item.path === "";
-  //                 //   } else {
-  //                 //     return item.label !== e[0] && item.path !== child;
-  //                 //   }
-  //                 // });
-  //                 local.render();
-  //               } else {
-  //                 local.open = [
-  //                   {
-  //                     label: e[0],
-  //                     path: hasChildren ? "" : e[2],
-  //                     expand: hasChildren,
-  //                   },
-  //                 ];
-  //               }
-  //               local.render();
-  //               console.log(local.open);
-  //             }}
-  //           >
-  //             <PassProp
-  //               item={e}
-  //               dept={dept || 0}
-  //               hasChild={hasChildren}
-  //               selected={selected}
-  //             >
-  //               {pm.child}
-  //             </PassProp>
-  //           </div>
-  //           {hasChildren && selected && expand ? (
-  //             <div className="sidebar-child c-flex c-w-full  c-pb-0 c-gap-1 c-pl-2 c-flex-grow c-items-center c-rounded c-py-2">
-  //               <SideBar
-  //                 data={child}
-  //                 local={local}
-  //                 dept={(dept || 0) + 1}
-  //                 pm={pm}
-  //               />
-  //             </div>
-  //           ) : (
-  //             <></>
-  //           )}
-  //         </div>
-  //       );
-  //     })}
-  //   </div>
-  // );
-};
-
-const getChilds = (data: Array<any>) => {
-  let childs = [];
-  childs.push(data);
-  const children = data[2]; // array index ke-2 bisa berupa array atau string
-  if (Array.isArray(children)) {
-    for (let child of children) {
-      childs.push(child);
-      if (Array.isArray(child[2])) {
-        const result: any = getChilds(child);
-        childs = childs.concat(result);
-      }
-    }
-  }
-  return childs;
-};
-
-const found = (data: Array<any>, predicate: any) => {
-  const result = findChild(data, predicate);
-  return result ? true : false;
-};
-const findChild = (data: Array<any>, predicate: any) => {
-  const children = data[2]; // array index ke-2 bisa berupa array atau string
-  if (predicate(data)) {
-    // kalau data ada yang cocok dari prediksi maka true, kalau gk jalankan false
-    return data;
-  } else {
-    if (Array.isArray(children)) {
-      // jika ada children, loop anaknya dan cari hingga sesuai prediksi
-      for (let child of children) {
-        const result: any = findChild(child, predicate);
-        if (result) return result;
-      }
-    } else {
-      // jika data tidak mengandung children maka cari sesuai prediksi
-      if (predicate(data)) {
-        return data;
-      }
-      return null;
-    }
-  }
-  return null;
-};
-const findChildMenu = (data: Array<any>, predicate: any) => {
-  let result = null as any;
-  if (data.length) {
-    data.map((e) => {
-      let found = findChild(e, predicate);
-      if (found) {
-        result = found;
-      }
-    });
-  }
-  return result;
-};
-
-export const MenuIcon: FC<{ child: any }> = ({ child }) => {
-  return <>{child}</>;
-};
diff --git a/preset/menu/Layout.tsx b/preset/menu/Layout.tsx
index 647b860..3a45033 100755
--- a/preset/menu/Layout.tsx
+++ b/preset/menu/Layout.tsx
@@ -37,10 +37,11 @@ type LYTChild = {
   exception?: Array<string>;
   blank_layout: ReactNode;
   login_url: string;
+  PassProp: any;
 };
 
 export const Layout: FC<LYTChild> = (props) => {
-  const local = useLocal({loading: true})
+  const local = useLocal({ loading: false });
   const render = local.render;
   useLayoutEffect(() => {
     if (!isEditor) {
@@ -78,5 +79,19 @@ export const Layout: FC<LYTChild> = (props) => {
   if (path === props.login_url) return props.blank_layout;
   if (!w.user && !isEditor) return props.blank_layout;
 
-  return <>{props.default_layout}</>;
+  return (
+    <props.PassProp
+      is_loading={local.loading}
+      page_load={(on_load: (done: () => void) => void) => {
+        local.loading = true;
+        local.render();
+        on_load(() => {
+          local.loading = false;
+          local.render();
+        });
+      }}
+    >
+      {props.default_layout}
+    </props.PassProp>
+  );
 };
diff --git a/preset/menu/Menu.tsx b/preset/menu/Menu.tsx
index e40934a..efb9153 100755
--- a/preset/menu/Menu.tsx
+++ b/preset/menu/Menu.tsx
@@ -170,8 +170,6 @@ export const SideBar: FC<{
                   typeof menu.value === "string"
                 ) {
                   if (pm.on_load) {
-                    let done = { exec: () => {} };
-                    console.log(preloaded(menu.value));
                     if (preloaded(menu.value)) {
                       pm.on_load((exec) => {
                         if (typeof menu.value === "string")
@@ -179,6 +177,7 @@ export const SideBar: FC<{
                         exec();
                       });
                     } else {
+                      let done = { exec: () => {} };
                       pm.on_load((exec) => {
                         done.exec = exec;
                       });