From 5640ebe08a17e6ee96a6e6e2b4ef61dab8975376 Mon Sep 17 00:00:00 2001 From: Rizky Date: Wed, 3 Jan 2024 20:40:11 +0700 Subject: [PATCH] wip fix jprop --- .../src/nova/ed/panel/popup/script/monaco.tsx | 32 +++++----- .../ed/panel/popup/script/scope/add-scope.tsx | 12 ++-- .../popup/script/scope/extract-export.tsx | 1 + .../ed/panel/popup/script/scope/scope.tsx | 58 +++++++++++++++---- .../src/nova/ed/panel/tree/node/item/name.tsx | 4 +- 5 files changed, 75 insertions(+), 32 deletions(-) diff --git a/app/web/src/nova/ed/panel/popup/script/monaco.tsx b/app/web/src/nova/ed/panel/popup/script/monaco.tsx index 4c7187e3..0b029c31 100644 --- a/app/web/src/nova/ed/panel/popup/script/monaco.tsx +++ b/app/web/src/nova/ed/panel/popup/script/monaco.tsx @@ -97,7 +97,7 @@ export const EdScriptMonaco: FC<{}> = () => { if (meta) { const imports = declareScope(p, meta, monaco); - let cur = "page"; + let cur = active.comp_id ? active.comp_id : "page"; monaco.editor.getModels().forEach((model) => { if ( model.uri.path === `/${cur}_${active.item_id}_src_src.tsx` @@ -106,15 +106,21 @@ export const EdScriptMonaco: FC<{}> = () => { } }); + const model = editor.getModel(); + if (!model) { + const nmodel = monaco.editor.createModel( + val, + "typescript", + monaco.Uri.parse("file:///active.tsx") + ); + + editor.setModel(nmodel); + } + if (imports) { local.imports = imports; - - const range = new monaco.Range( - 1, - 0, - imports.split("\n").length + 1, - 0 - ); + const end = imports.split("\n").length + 1; + const range = new monaco.Range(1, 0, end, 0); (editor as any).setHiddenAreas([range]); } @@ -156,8 +162,8 @@ export const EdScriptMonaco: FC<{}> = () => { ?.getValue() .replace(/\{\s*children\s*\}/gi, newval); - if (curval.includes("/** IMPORT BOUNDARY **/")) { - curval = curval.split("/** IMPORT BOUNDARY **/\n").pop() || ""; + if (curval.includes("/** IMPORT MODULE **/")) { + curval = curval.split("/** IMPORT MODULE **/\n").pop() || ""; } const text = trim( @@ -170,7 +176,7 @@ export const EdScriptMonaco: FC<{}> = () => { let final_src = text; if (local.imports) { - final_src = `${local.imports}\n/** IMPORT BOUNDARY **/\n${text}`; + final_src = `${local.imports}\n/** IMPORT MODULE **/\n${text}`; } local.editor.executeEdits(null, [ { @@ -218,8 +224,8 @@ export const EdScriptMonaco: FC<{}> = () => { { css: "scss", js: "typescript", html: "html" }[p.ui.popup.script.mode] } onChange={(value) => { - if ((value || "").includes("/** IMPORT BOUNDARY **/")) { - const valparts = (value || "").split("/** IMPORT BOUNDARY **/\n"); + if ((value || "").includes("/** IMPORT MODULE **/")) { + const valparts = (value || "").split("/** IMPORT MODULE **/\n"); if (valparts.length === 2) local.value = valparts[1]; } else { local.value = value || ""; diff --git a/app/web/src/nova/ed/panel/popup/script/scope/add-scope.tsx b/app/web/src/nova/ed/panel/popup/script/scope/add-scope.tsx index ceffb518..5037f026 100644 --- a/app/web/src/nova/ed/panel/popup/script/scope/add-scope.tsx +++ b/app/web/src/nova/ed/panel/popup/script/scope/add-scope.tsx @@ -1,6 +1,6 @@ import { extractLoc } from "../../../../../../utils/script/mount"; -import { PG } from "../../../../logic/ed-global"; -import { CodeLoc, Monaco } from "./type"; +import { PG, active } from "../../../../logic/ed-global"; +import { Monaco } from "./type"; export const addScope = ( p: PG, @@ -20,9 +20,11 @@ export const addScope = ( const arg = extractLoc(uri.path.split("_"), p); model.onDidChangeContent((e) => { - const text = model.getValue(); - console.log(arg); - console.warn(text); + if (arg.id !== active.item_id) { + const text = model.getValue(); + console.log(arg); + console.warn(text); + } }); } }; diff --git a/app/web/src/nova/ed/panel/popup/script/scope/extract-export.tsx b/app/web/src/nova/ed/panel/popup/script/scope/extract-export.tsx index 86e47f79..bc9541f0 100644 --- a/app/web/src/nova/ed/panel/popup/script/scope/extract-export.tsx +++ b/app/web/src/nova/ed/panel/popup/script/scope/extract-export.tsx @@ -26,6 +26,7 @@ export const extractExport = (p: PG, m: IMeta) => { if (script?.passprop) { for (const [k, v] of Object.entries(script.passprop)) { + if (k === "key") continue; result[k] = { type: "passprop", id: m.item.id, diff --git a/app/web/src/nova/ed/panel/popup/script/scope/scope.tsx b/app/web/src/nova/ed/panel/popup/script/scope/scope.tsx index 998b31a4..484d5628 100644 --- a/app/web/src/nova/ed/panel/popup/script/scope/scope.tsx +++ b/app/web/src/nova/ed/panel/popup/script/scope/scope.tsx @@ -1,9 +1,8 @@ import type { OnMount } from "@monaco-editor/react"; -import hash_sum from "hash-sum"; import { IContent } from "../../../../../../utils/types/general"; import { IMeta, PG, active } from "../../../../logic/ed-global"; -import { extractExport } from "./extract-export"; import { addScope } from "./add-scope"; +import { extractExport } from "./extract-export"; type Monaco = Parameters[1]; export type MonacoEditor = Parameters[0]; @@ -18,10 +17,11 @@ export const declareScope = (p: PG, meta: IMeta, monaco: Monaco) => { const paths: IMeta[][] = []; - map_childs(metas, entry, paths); + map_childs(p, metas, entry, paths); - let cur = "page"; + let cur = active.comp_id ? active.comp_id : "page"; const import_map = extract_import_map(cur, paths, meta, p, monaco); + gen_content(cur, p, paths, import_map, monaco); return import_map[active.item_id]; }; @@ -45,12 +45,11 @@ const gen_content = ( } else { last_import = import_map[m.item.id]; } - if (!added.has(m.item.id) && m.item.adv?.js) { added.add(m.item.id); const content = `\ ${last_import} -/** IMPORT BOUNDARY **/ +/** IMPORT MODULE **/ ${m.item.adv.js} `; @@ -99,7 +98,7 @@ export const ${k}: typeof _local & { render: ()=>void } = _local; `file:///${cur}_${v.id}_${v.type}_${k}.tsx`, `\ ${[...imports].join("\n")} -/** IMPORT BOUNDARY **/ +/** IMPORT MODULE **/ ${src}` ); } @@ -120,7 +119,17 @@ ${src}` return import_map; }; +const comp_map = {} as Record< + string, + { + paths: IMeta[][]; + prop_imports: Record; + exports: Record>; + } +>; + const map_childs = ( + p: PG, metas: Record, childs: IContent[], paths: IMeta[][], @@ -135,16 +144,41 @@ const map_childs = ( meta.item.component?.id && meta.item.component?.id !== active.comp_id ) { - if (meta.item.component?.props) { - for (const [_, p] of Object.entries(meta.item.component.props)) { - if (p.meta?.type === "content-element" && p.content) { - // map_childs(metas, [p.content], paths, [...(curpath || []), meta]); + const comp_id = meta.item.component.id; + let jprop = comp_map[comp_id]; + if (!jprop) { + const comp_metas = p.comp.list[comp_id].meta; + comp_map[meta.item.component.id] = { + paths: [], + prop_imports: {}, + exports: {}, + }; + const id = p.comp.list[comp_id].doc + .getMap("map") + .get("root") + ?.get("id"); + + if (id) { + map_childs( + p, + comp_metas, + [comp_metas[id].item], + comp_map[meta.item.component.id].paths + ); + + jprop = comp_map[meta.item.component.id]; + for (const path of jprop.paths) { + for (const m of path) { + if (!jprop.exports[m.item.id]) { + jprop.exports[m.item.id] = extractExport(p, m); + } + } } } } } else { if (Array.isArray(meta.item.childs)) { - map_childs(metas, meta.item.childs, paths, [ + map_childs(p, metas, meta.item.childs, paths, [ ...(curpath || []), meta, ]); diff --git a/app/web/src/nova/ed/panel/tree/node/item/name.tsx b/app/web/src/nova/ed/panel/tree/node/item/name.tsx index 4cb669cd..98525003 100644 --- a/app/web/src/nova/ed/panel/tree/node/item/name.tsx +++ b/app/web/src/nova/ed/panel/tree/node/item/name.tsx @@ -104,9 +104,9 @@ export const EdTreeName = ({ ) : (
- {/*
+
{node.id} - {item.originalId} -
*/} +
)}