midsuit
/
prasi-bun
6
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

wip fix body

This commit is contained in:
Rizky 2023-11-26 10:15:24 +07:00
parent 6474630cf5
commit c1098a3125
12 changed files with 285 additions and 252 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
app/srv/ws/sync/editor/load-page.ts
View File

@ -76,7 +76,15 @@ export const serverWalkLoad = async (
type ArgParentMComp = EdMeta["parent_mcomp"] & {
id: string;
parent_ids: string[];
jsx_props: Record<string, { id: string; parent_ids: string[] }>;
jsx_props: Record<
string,
{
id: string;
mitem: MItem;
parent_mcomp?: ArgParentMComp;
parent_ids: string[];
}
>;
};
export const serverWalkMap = (
p: {
@ -88,7 +96,6 @@ export const serverWalkMap = (
mitem: MItem;
parent_ids: string[];
parent_item: EdMeta["parent_item"];
is_jsx_prop?: boolean;
parent_mcomp?: ArgParentMComp;
}
) => {
@ -189,27 +196,22 @@ export const serverWalkMap = (
mcomp,
jsx_props: {},
};
extractMItemProps({
item_comp,
mitem,
mcomp,
scope,
mcontent(mcontent, prop_name) {
const parent_ids = [...arg.parent_ids, item.id];
const id = mcontent.get("id");
if (id) {
parent_mcomp.jsx_props[prop_name] = {
id,
parent_ids,
mitem: mcontent,
parent_mcomp: arg.parent_mcomp,
parent_ids: [...arg.parent_ids, item.id],
};
}
serverWalkMap(p, {
parent_ids,
mitem: mcontent,
parent_item: { id: item.id, mitem: mitem as MItem },
is_jsx_prop: true,
parent_mcomp,
});
},
});
@ -227,12 +229,11 @@ export const serverWalkMap = (
if (scope) pcomp.scope[item.id].s = scope;
if (!parent_mcomp) {
if (!arg.parent_mcomp) {
p.scope[item.id] = {
p: arg.parent_ids,
n: item.name,
s: null,
c: item.component?.id,
};
if (scope) p.scope[item.id].s = scope;
}
@ -255,16 +256,7 @@ export const serverWalkMap = (
}
}
if (item.name.startsWith("jsx=")) {
console.log(
item.name,
!!arg.parent_mcomp,
!arg.is_jsx_prop,
arg.parent_item.mitem?.get("name")
);
}
if (arg.parent_mcomp && !arg.is_jsx_prop) {
if (arg.parent_mcomp) {
let id = item.originalId || item.id;
const pcomp = p.scope_comps[arg.parent_mcomp.id];
@ -279,6 +271,24 @@ export const serverWalkMap = (
const scope = parseJs(js);
if (scope) pcomp.scope[id].s = scope;
}
if (item.name.startsWith("jsx=")) {
const name = item.name.substring(4).trim();
if (arg.parent_mcomp.jsx_props[name]) {
const jsx = arg.parent_mcomp.jsx_props[name];
serverWalkMap(p, {
mitem: jsx.mitem,
parent_item: { id: item.id, mitem: mitem as MItem },
parent_mcomp: jsx.parent_mcomp
? {
...jsx.parent_mcomp,
parent_ids: [...(arg.parent_ids || []), mitem.get("id") || ""],
}
: undefined,
parent_ids: [...arg.parent_ids, mitem.get("id") || ""],
});
}
}
} else {
if (!(item_comp && item_comp.id)) {
p.scope[item.id] = { p: arg.parent_ids, n: item.name, s: null };
@ -294,7 +304,6 @@ export const serverWalkMap = (
for (const e of childs) {
serverWalkMap(p, {
mitem: e,
is_jsx_prop: arg.is_jsx_prop,
parent_item: { id: item.id, mitem: mitem as MItem },
parent_mcomp: !!arg.parent_mcomp
? {

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

@ -48,17 +48,17 @@ export const parseJs = (code: string) => {
attr.type === "JSXAttribute" &&
attr.name.type === "JSXIdentifier"
) {
if (
attr.name.name === "value" &&
attr.value &&
attr.value.type === "JSXExpressionContainer" &&
attr.value.expression.loc
) {
const loc = attr.value.expression.loc as any;
passprop[attr.name.name] = {
value: code.substring(loc.start.index, loc.end.index),
index: loc.start.index,
};
if (attr.value) {
if (
attr.value.type === "JSXExpressionContainer" &&
attr.value.expression.loc
) {
const loc = attr.value.expression.loc as any;
passprop[attr.name.name] = {
value: code.substring(loc.start.index, loc.end.index),
index: loc.start.index,
};
}
}
}
}
@ -83,4 +83,3 @@ export const parseJs = (code: string) => {
}
return result;
};

4
app/web/src/nova/ed/logic/ed-global.ts
View File

@ -27,7 +27,6 @@ export type ISingleScope = {
p: string[];
n: string;
s: null | Exclude<ReturnType<typeof parseJs>, undefined>;
c?: string;
};
export type IScope = Record<string, ISingleScope>;
@ -116,7 +115,6 @@ export type EdMeta = {
id: string;
mitem?: MItem;
};
parent_comp?: { id: string; comp_id: string };
parent_mcomp?: {
mitem: MItem;
mcomp: MItem;
@ -126,7 +124,7 @@ export type EdMeta = {
is_jsx_prop?: boolean;
/** script related meta **/
propval?: Record<string, any>;
idexed_scope: Record<string, any>;
indexed_scope: Record<string, any>;
memoize?: Record<
string,
{

344
app/web/src/nova/ed/logic/tree/load-walk.tsx
View File

@ -1,189 +1,189 @@
import { createId } from "@paralleldrive/cuid2";
import { deepClone } from "web-utils";
import { IContent } from "../../../../utils/types/general";
import { IItem } from "../../../../utils/types/item";
import { FNComponent } from "../../../../utils/types/meta-fn";
import { EdMeta, PG } from "../ed-global";
// import { createId } from "@paralleldrive/cuid2";
// import { deepClone } from "web-utils";
// import { IContent } from "../../../../utils/types/general";
// import { IItem } from "../../../../utils/types/item";
// import { FNComponent } from "../../../../utils/types/meta-fn";
// import { EdMeta, PG } from "../ed-global";
export const walkLoad = async (
p: { map: PG["comp"]["map"] },
item: IContent,
loaded: Set<string>,
loadComponent: (id: string) => Promise<boolean>
) => {
if (item.type === "item" && item.component?.id) {
const id = item.component?.id;
const comp = item.component as FNComponent;
// export const walkLoad = async (
// p: { map: PG["comp"]["map"] },
// item: IContent,
// loaded: Set<string>,
// loadComponent: (id: string) => Promise<boolean>
// ) => {
// if (item.type === "item" && item.component?.id) {
// const id = item.component?.id;
// const comp = item.component as FNComponent;
if (id && comp) {
const isFirstLoaded = !loaded.has(id);
loaded.add(id);
if (!p.map[id]) {
await loadComponent(comp.id);
}
if (p.map[id] && isFirstLoaded) {
await walkLoad(p, p.map[id].item, loaded, loadComponent);
}
}
// if (id && comp) {
// const isFirstLoaded = !loaded.has(id);
// loaded.add(id);
// if (!p.map[id]) {
// await loadComponent(comp.id);
// }
// if (p.map[id] && isFirstLoaded) {
// await walkLoad(p, p.map[id].item, loaded, loadComponent);
// }
// }
for (const [propName, prop] of Object.entries(comp.props || {})) {
if (prop.meta?.type === "content-element") {
const mprop = comp.props[propName];
if (mprop) {
const mcontent = mprop.content;
if (mcontent) {
await walkLoad(p, mcontent, loaded, loadComponent);
}
}
}
}
}
// for (const [propName, prop] of Object.entries(comp.props || {})) {
// if (prop.meta?.type === "content-element") {
// const mprop = comp.props[propName];
// if (mprop) {
// const mcontent = mprop.content;
// if (mcontent) {
// await walkLoad(p, mcontent, loaded, loadComponent);
// }
// }
// }
// }
// }
if (item.type !== "text") {
await Promise.all(
item.childs.map((e) => walkLoad(p, e, loaded, loadComponent))
);
}
};
// if (item.type !== "text") {
// await Promise.all(
// item.childs.map((e) => walkLoad(p, e, loaded, loadComponent))
// );
// }
// };
export const walkMap = (
p: {
meta: Record<string, EdMeta>;
comps: Record<string, { id: string; item: IItem }>;
},
arg: {
isLayout: boolean;
item: IContent;
parent_item: { id: string };
portal: {
in: Record<string, EdMeta>;
out: Record<string, EdMeta>;
};
each?: (meta: EdMeta) => void;
parent_comp?: { id: string; comp_id: string };
}
) => {
const { parent_item, parent_comp } = arg;
// export const walkMap = (
// p: {
// meta: Record<string, EdMeta>;
// comps: Record<string, { id: string; item: IItem }>;
// },
// arg: {
// isLayout: boolean;
// item: IContent;
// parent_item: { id: string };
// portal: {
// in: Record<string, EdMeta>;
// out: Record<string, EdMeta>;
// };
// each?: (meta: EdMeta) => void;
// parent_comp?: { id: string; comp_id: string };
// }
// ) => {
// const { parent_item, parent_comp } = arg;
let override_id = "";
const id = arg.item.id;
// let override_id = "";
// const id = arg.item.id;
if (parent_comp && id) {
const cmeta = p.meta[parent_comp.id];
if (cmeta && cmeta.item.type === "item") {
const comp = cmeta.item.component;
if (comp) {
const ref_ids = comp.ref_ids;
if (ref_ids) {
let ref_id = ref_ids[id];
if (!ref_id) {
ref_id = createId();
ref_ids[id] = ref_id;
}
override_id = ref_id;
}
}
}
}
// if (parent_comp && id) {
// const cmeta = p.meta[parent_comp.id];
// if (cmeta && cmeta.item.type === "item") {
// const comp = cmeta.item.component;
// if (comp) {
// const ref_ids = comp.ref_ids;
// if (ref_ids) {
// let ref_id = ref_ids[id];
// if (!ref_id) {
// ref_id = createId();
// ref_ids[id] = ref_id;
// }
// override_id = ref_id;
// }
// }
// }
// }
let item = arg.item;
if (override_id) {
item.id = override_id;
}
// let item = arg.item;
// if (override_id) {
// item.id = override_id;
// }
const item_comp = item.type === "item" ? item.component : null;
// const item_comp = item.type === "item" ? item.component : null;
if (item_comp && item_comp.id && parent_item.id !== "root") {
const comp_ref = p.comps[item_comp.id];
// if (item_comp && item_comp.id && parent_item.id !== "root") {
// const comp_ref = p.comps[item_comp.id];
if (!comp_ref) {
console.error("Component failed to load: ", item_comp.id);
return;
}
const mcomp = comp_ref.item;
// if (!comp_ref) {
// console.error("Component failed to load: ", item_comp.id);
// return;
// }
// const mcomp = comp_ref.item;
if (mcomp) {
let ref_ids: Record<string, string> = item_comp.ref_ids;
if (!ref_ids) {
ref_ids = {};
item_comp.ref_ids = ref_ids;
}
const original_id = item.id;
item = deepClone(mcomp);
item.id = original_id;
// if (mcomp) {
// let ref_ids: Record<string, string> = item_comp.ref_ids;
// if (!ref_ids) {
// ref_ids = {};
// item_comp.ref_ids = ref_ids;
// }
// const original_id = item.id;
// item = deepClone(mcomp);
// item.id = original_id;
const meta: EdMeta = {
item,
parent_item,
idexed_scope: {},
is_layout: arg.isLayout,
};
if (item.name.startsWith("⬅")) {
arg.portal.in[item.name] = meta;
}
if (item.name.startsWith("⮕")) {
arg.portal.out[item.name] = meta;
}
if (arg.each) arg.each(meta);
p.meta[item.id] = meta;
// const meta: EdMeta = {
// item,
// parent_item,
// idexed_scope: {},
// is_layout: arg.isLayout,
// };
// if (item.name.startsWith("⬅")) {
// arg.portal.in[item.name] = meta;
// }
// if (item.name.startsWith("⮕")) {
// arg.portal.out[item.name] = meta;
// }
// if (arg.each) arg.each(meta);
// p.meta[item.id] = meta;
if (item_comp.props) {
for (const [k, mprop] of Object.entries(item_comp.props)) {
if (mprop.meta?.type === "content-element" && mprop.content) {
walkMap(p, {
isLayout: arg.isLayout,
item: mprop.content,
parent_item: { id: item.id },
portal: arg.portal,
parent_comp: { id: item.id, comp_id: item_comp.id },
each: arg.each,
});
}
}
}
// if (item_comp.props) {
// for (const [k, mprop] of Object.entries(item_comp.props)) {
// if (mprop.meta?.type === "content-element" && mprop.content) {
// walkMap(p, {
// isLayout: arg.isLayout,
// item: mprop.content,
// parent_item: { id: item.id },
// portal: arg.portal,
// parent_comp: { id: item.id, comp_id: item_comp.id },
// each: arg.each,
// });
// }
// }
// }
for (const c of mcomp.childs) {
walkMap(p, {
isLayout: arg.isLayout,
item: c,
parent_item: { id: item.id },
portal: arg.portal,
parent_comp: { id: item.id, comp_id: item_comp.id },
each: arg.each,
});
}
}
return;
}
// for (const c of mcomp.childs) {
// walkMap(p, {
// isLayout: arg.isLayout,
// item: c,
// parent_item: { id: item.id },
// portal: arg.portal,
// parent_comp: { id: item.id, comp_id: item_comp.id },
// each: arg.each,
// });
// }
// }
// return;
// }
const meta: EdMeta = {
item,
parent_item,
idexed_scope: {},
parent_comp,
is_layout: arg.isLayout,
};
if (item.name.startsWith("⬅")) {
arg.portal.in[item.name] = meta;
}
if (item.name.startsWith("⮕")) {
arg.portal.out[item.name] = meta;
}
if (arg.each) arg.each(meta);
p.meta[item.id] = meta;
// const meta: EdMeta = {
// item,
// parent_item,
// idexed_scope: {},
// parent_comp,
// is_layout: arg.isLayout,
// };
// if (item.name.startsWith("⬅")) {
// arg.portal.in[item.name] = meta;
// }
// if (item.name.startsWith("⮕")) {
// arg.portal.out[item.name] = meta;
// }
// if (arg.each) arg.each(meta);
// p.meta[item.id] = meta;
if (item.type !== "text") {
for (const c of item.childs) {
if (c) {
walkMap(p, {
isLayout: arg.isLayout,
item: c,
parent_item: { id: item.id },
portal: arg.portal,
parent_comp,
each: arg.each,
});
}
}
}
};
// if (item.type !== "text") {
// for (const c of item.childs) {
// if (c) {
// walkMap(p, {
// isLayout: arg.isLayout,
// item: c,
// parent_item: { id: item.id },
// portal: arg.portal,
// parent_comp,
// each: arg.each,
// });
// }
// }
// }
// };

15
app/web/src/nova/ed/logic/tree/sync-walk.tsx
View File

@ -1,20 +1,17 @@
import { NodeModel } from "@minoru/react-dnd-treeview";
import { createId } from "@paralleldrive/cuid2";
import { compress, decompress } from "wasm-gzip";
import { TypedArray } from "yjs-types";
import { MContent } from "../../../../utils/types/general";
import { IItem, MItem } from "../../../../utils/types/item";
import { FNCompDef, FNComponent } from "../../../../utils/types/meta-fn";
import { DComp } from "../../../../utils/types/root";
import { MSection } from "../../../../utils/types/section";
import { EdMeta, IScope, PG, active } from "../ed-global";
import { EdMeta, PG } from "../ed-global";
import { loadCompSnapshot } from "./sync-walk-comp";
import {
ensureMItemProps,
ensureMProp,
ensurePropContent,
} from "./sync-walk-utils";
import { treeRebuild } from "./build";
import { loadCompSnapshot } from "./sync-walk-comp";
export const syncWalkLoad = async (
p: PG,
@ -115,6 +112,7 @@ export const syncWalkMap = (
mapItem(mitem, item);
if (override_id) {
if (!item.originalId) item.originalId = item.id;
item.id = override_id;
}
@ -157,7 +155,7 @@ export const syncWalkMap = (
mitem: mitem as MItem,
parent_item,
parent_mcomp: parent_mcomp,
idexed_scope: {},
indexed_scope: {},
is_layout: arg.is_layout,
};
if (item.name.startsWith("⬅")) {
@ -201,7 +199,6 @@ export const syncWalkMap = (
mitem: mcontent,
is_jsx_prop: true,
parent_item: { id: item.id, mitem: mitem as MItem },
parent_mcomp: { mitem: mitem as MItem, mcomp },
portal: arg.portal,
skip_add_tree: skip_tree_child,
each: arg.each,
@ -241,7 +238,7 @@ export const syncWalkMap = (
parent_item,
is_jsx_prop: arg.is_jsx_prop,
parent_mcomp: parent_mcomp,
idexed_scope: {},
indexed_scope: {},
};
if (item.name.startsWith("⬅")) {
@ -269,6 +266,7 @@ export const syncWalkMap = (
is_layout: arg.is_layout,
tree_root_id: arg.tree_root_id,
mitem: e,
is_jsx_prop: arg.is_jsx_prop,
parent_item: { id: item.id, mitem: mitem as MItem },
parent_mcomp: arg.parent_mcomp,
portal: arg.portal,
@ -299,7 +297,6 @@ export const loadComponent = async (
resolve(true);
return;
}
console.log("loading", id_comp);
loadcomp.pending.add(id_comp);
clearTimeout(loadcomp.timeout);
loadcomp.timeout = setTimeout(async () => {

55
app/web/src/nova/ed/panel/popup/script/scope.tsx
View File

@ -45,6 +45,22 @@ export const declareScope = async (
existing[name] = arg;
});
// for (const id of s.p) {
// const meta = p.page.meta[id];
// const ss = p.page.scope[id];
// if (meta) {
// let sc = null as any;
// if (meta.parent_mcomp) {
// const comp_id = meta.parent_mcomp.mitem.get('component')?.get('id');
// if (comp_id && p.comp.list[comp_id]) {
// sc = p.comp.list[comp_id].scope
// }
// }
// console.log(meta.item.name, meta.item.originalId, ss, sc);
// }
// }
spreadScope(p, s, (arg) => {
let { prev } = arg;
if (arg.type !== "local") {
@ -122,37 +138,39 @@ const spreadScope = (
const mergeScopes = (
parents: string[],
each: (arg: IEachArgScope) => void,
arg: { comp_id?: string; prev?: { comp_id: string; item_id: string } }
arg: { prev?: { comp_id: string; item_id: string } }
) => {
let { comp_id, prev } = arg;
let { prev } = arg;
for (const parent_id of parents) {
if (parent_id === "root") continue;
let item = null as null | ISingleScope;
const meta = p.page.meta[parent_id];
if (layout && layout_scope[layout_id]) {
const scope = layout_scope[layout_id];
if (scope.p.includes(parent_id) || comp_id) {
if (scope.p.includes(parent_id)) {
item = layout.scope[parent_id];
}
}
if (!item) {
if (comp_id) {
item = p.comp.list[comp_id].scope[parent_id];
} else if (active.comp_id && p.comp.list[active.comp_id]) {
item = p.comp.list[active.comp_id].scope[parent_id];
} else {
item = p.page.scope[parent_id];
let comp_id = "";
if (!item) {
if (meta) {
if (meta.parent_mcomp) {
comp_id = meta.parent_mcomp.mitem.get("component")?.get("id") || "";
if (comp_id) {
const scope = p.comp.list[comp_id].scope;
item = scope[meta.item.originalId || meta.item.id];
}
}
if (!item) {
item = p.page.scope[parent_id];
}
}
}
if (item) {
if (item.c) {
comp_id = item.c;
mergeScopes(item.p, each, {
comp_id: item.c,
prev: { item_id: parent_id, comp_id: arg.comp_id || "" },
});
}
const scope = item.s;
if (scope) {
if (scope.local)
@ -201,6 +219,7 @@ const spreadScope = (
}
};
console.clear();
mergeScopes(parents, each, {});
};

13
app/web/src/nova/ed/panel/tree/body.tsx
View File

@ -43,8 +43,17 @@ export const EdTreeBody = () => {
useEffect(() => {
if (local.tree) {
let parents: string[] = [];
if (active.comp_id && p.comp.list[local.comp_id].scope[active.item_id]) {
parents = p.comp.list[local.comp_id].scope[active.item_id].p;
if (active.comp_id && p.comp.list[active.comp_id].scope[active.item_id]) {
parents = p.comp.list[active.comp_id].scope[active.item_id].p.map(
(e) => {
if (e === "root") return "root";
const meta = p.page.meta[e];
if (meta && meta.item.originalId) {
return meta.item.originalId;
}
return e;
}
);
} else if (p.page.scope[active.item_id]) {
parents = p.page.scope[active.item_id].p;
}

2
app/web/src/nova/ed/panel/tree/node/item/name.tsx
View File

@ -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>

8
app/web/src/nova/view/render/meta/script/create-local.tsx
View File

@ -41,11 +41,11 @@ export const createLocal = (
}
scope = meta.scope;
} else {
if (!meta.idexed_scope) {
meta.idexed_scope = {};
if (!meta.indexed_scope) {
meta.indexed_scope = {};
}
if (!meta.idexed_scope[local_id]) meta.idexed_scope[local_id] = {};
scope = meta.idexed_scope[local_id];
if (!meta.indexed_scope[local_id]) meta.indexed_scope[local_id] = {};
scope = meta.indexed_scope[local_id];
}
const render = () => {

4
app/web/src/nova/view/render/meta/script/create-pass-prop.tsx
View File

@ -11,11 +11,11 @@ export const createPassProp = (
const meta = v.meta[id];
if (typeof arg.idx !== "undefined" && meta && meta.item && meta.item.id) {
meta.idexed_scope[arg.idx] = {};
meta.indexed_scope[arg.idx] = {};
for (const [k, v] of Object.entries(arg)) {
if (k === "children") continue;
meta.idexed_scope[arg.idx][k] = v;
meta.indexed_scope[arg.idx][k] = v;
}
const scopeIndex = { ...existingScopeIndex, [meta.item.id]: arg.idx };

6
app/web/src/nova/view/render/meta/script/merge-upward.tsx
View File

@ -21,11 +21,11 @@ export const mergeScopeUpwards = (
let indexedScope = null;
if (cur.idexed_scope && scopeIndex) {
if (cur.indexed_scope && scopeIndex) {
const idx = scopeIndex[cur.item.id];
if (typeof idx !== "undefined" && cur.idexed_scope[idx]) {
indexedScope = cur.idexed_scope[idx];
if (typeof idx !== "undefined" && cur.indexed_scope[idx]) {
indexedScope = cur.indexed_scope[idx];
}
}

6
app/web/src/utils/script/mount.tsx
View File

@ -68,11 +68,13 @@ export const jsMount = async (editor: MonacoEditor, monaco: Monaco, p: PG) => {
meta = p.comp.list[active.comp_id].meta[id];
}
active.instance.comp_id = prev_comp_id;
active.instance.item_id = prev_item_id;
active.instance.comp_id = active.comp_id;
active.instance.item_id = active.item_id;
if (meta && meta.item.originalId) {
active.item_id = meta.item.originalId;
} else {
active.item_id = id;
}
active.comp_id = comp_id;
} else {