fix rendering

This commit is contained in:
Rizky 2024-07-18 11:54:29 +07:00
parent 03b97dac9a
commit 8e2bb390ce
8 changed files with 85 additions and 64 deletions

File diff suppressed because one or more lines are too long

View File

@ -1,6 +1,7 @@
import { NodeModel } from "@minoru/react-dnd-treeview";
import { IMeta, PG } from "../../ed-global";
import { MItem } from "../../../../../utils/types/item";
import { createId } from "@paralleldrive/cuid2";
export const pushTreeNode = (
p: PG,
@ -51,6 +52,7 @@ export const pushTreeNode = (
if (tree.find((t) => t.id === meta.item.id)) {
console.error("Double Tree Item: ", meta.item.id, meta.item.name);
meta.mitem?.set("id", createId());
} else {
if (!meta.parent?.comp_id) {
tree.push({

View File

@ -92,8 +92,6 @@ export const EdSidePropInstance: FC<{ meta: IMeta }> = ({ meta }) => {
const evn = new Function("arg", `arg["${k}"] = ${v.value}`);
evn(arg);
} catch (e) {
console.error(e);
console.error(k, v.value);
}
}
}

View File

@ -85,8 +85,6 @@ export const EdPropInstanceOptions: FC<{
const evn = new Function("arg", `arg["${k}"] = ${v.value}`);
evn(arg);
} catch (e) {
console.error(e);
console.error(k, v.value);
}
}
}

View File

@ -13,6 +13,7 @@ import { expandTreeHook } from "./node/item/indent-hook";
import { canDrop, nodeOnDrop } from "./node/on-drop";
import { nodeRender } from "./node/render";
import { doTreeSearch } from "./search";
import { ErrorBox } from "../../../vi/utils/error-box";
export const EdTreeBody = () => {
const p = useGlobal(EDGlobal, "EDITOR");
@ -68,7 +69,7 @@ export const EdTreeBody = () => {
);
return (
<>
<ErrorBox>
<TypedTree
tree={tree}
rootId={"root"}
@ -99,7 +100,7 @@ export const EdTreeBody = () => {
<Placeholder node={node} params={params} />
)}
/>
</>
</ErrorBox>
);
};

View File

@ -90,13 +90,7 @@ export const nodeRender: NodeRender<IMeta> = (node, prm) => {
}
return (
<Tooltip
placement="right"
content={bytesToHumanFileSize(
JSON.stringify(hydrateItem(p, item)).length
)}
delay={0}
>
<Tooltip placement="right" content={`ID: ${node.data.item.id}`} delay={0}>
<div
tabIndex={0}
className={cx(

View File

@ -152,24 +152,17 @@ export const viEvalProps = (
let val = fn(...Object.values(arg));
if (typeof val === "function") {
if (w.isEditor) {
script.props[name].fn = val;
val = (...args: any[]) => {
if (script) return script.props?.[name].fn(...args);
};
} else {
val = (...args: any[]) => {
const definer = new Function(
...Object.keys(arg),
`// [${meta.item.name}] ${name}: ${meta.item.id}
val = (...args: any[]) => {
const definer = new Function(
...Object.keys(arg),
`// [${meta.item.name}] ${name}: ${meta.item.id}
return ${src}
`
);
);
const fn = definer(...Object.values(arg));
return fn(...args);
};
}
const fn = definer(...Object.values(arg));
return fn(...args);
};
}
arg[name] = val;

View File

@ -43,8 +43,17 @@ export type PrasiEdit = {
export const devItem = (
metas: Record<string, IMeta>,
mitem: MItem,
page_id: string
page_id: string,
_added?: Record<string, any>
) => {
const added = _added || {};
const id = mitem.get("id") || "";
if (added[id]) {
console.error(added);
throw new Error("already added " + id);
return added[id];
}
if (!w.prasiEditDevItem) {
w.prasiEditDevItem = {};
}
@ -66,7 +75,7 @@ export const devItem = (
const item = mitem.toJSON() as IItem;
return {
const result = {
...item,
edit: {
get props() {
@ -81,10 +90,18 @@ export const devItem = (
?.get("content");
if (content) {
result[k] = {
mode: "jsx",
value: devItem(metas, content, page_id),
};
const id = content.get("id") || "";
if (added[id]) {
result[k] = {
mode: "jsx",
value: added[id],
};
} else {
result[k] = {
mode: "jsx",
value: devItem(metas, content, page_id, added),
};
}
} else {
result[k] = {
mode: "jsx",
@ -284,18 +301,20 @@ export const devItem = (
changes.push({ type: "child", childs });
},
get childs() {
const item = mitem?.toJSON() as IItem;
if (item.component?.id) {
const child = item.component?.props.child;
if (child.content) {
if (child && child.content) {
const m = mitem
.get("component")
?.get("props")
?.get("child")
?.get("content");
if (m) {
return [devItem(metas, m, page_id)];
const id = m.get("id") || "";
if (added[id]) {
return [added[id]];
}
return [devItem(metas, m, page_id, added)];
}
}
return [];
@ -306,7 +325,12 @@ export const devItem = (
.map((e) => {
if (e) {
const m = metas[e.id];
if (m && m.mitem) return devItem(metas, m.mitem, page_id);
if (added[e.id]) {
return added[e.id];
}
if (m && m.mitem)
return devItem(metas, m.mitem, page_id, added);
}
})
.filter((e) => e);
@ -319,10 +343,17 @@ export const devItem = (
const parent = mitem.parent.toJSON();
if (Array.isArray(parent)) {
const parent_id = (mitem.parent?.parent as any).get("id");
const parent_meta = metas[parent_id].mitem;
const parent_meta = metas[parent_id]?.mitem;
if (parent_meta) {
const item = added[parent_id]
? added[parent_id]
: devItem(metas, parent_meta, page_id, added);
if (added[parent_id]) {
throw new Error("wi");
}
return {
item: devItem(metas, parent_meta, page_id),
item,
child_type: "child",
child_idx: parent.findIndex((e) => e.id === item.id),
};
@ -333,6 +364,10 @@ export const devItem = (
},
},
} as IItem & PrasiEdit;
added[id] = result;
return result;
};
const complexifyProps = (