This commit is contained in:
Rizky 2024-04-18 08:43:53 +07:00
parent c5f8baddab
commit 6a133b8f8e
11 changed files with 88 additions and 46 deletions

File diff suppressed because one or more lines are too long

View File

@ -13,7 +13,7 @@ import { MobileQRButton } from "./panel/side/style/tools/mobile-qr";
import { EdFileBrowser } from "./panel/file/file-browser";
export const EdMid: FC<{}> = () => {
const p = useGlobal(EDGlobal, "EDITORF");
const p = useGlobal(EDGlobal, "EDITOR");
return (
<div className="flex flex-col">
<div
@ -64,7 +64,7 @@ export const EdMid: FC<{}> = () => {
<div className=" text-slate-400 flex items-center pr-1 ">
<ResponsiveToggle />
</div>
<a href={`/prod/${params.site_id}/${params.page_id}`} target="_blank">
<a href={`/prod/${params.site_id}${p.page.cur.url}`} target="_blank">
<TopBtn style="slim" className="font-mono text-[9px]">
PREVIEW
</TopBtn>

View File

@ -219,7 +219,7 @@ export const Root = () => {
})
).json()) as Record<string, IItem>;
for (const [id, item] of Object.entries(res)) {
comp.pending.delete(id);
delete comp.pending[id];
comp.list[id] = item;
await setkv(`comp-${id}`, item);

View File

@ -27,7 +27,8 @@ export const viParts = (
},
meta: IMeta,
is_layout: boolean,
passprop: any
passprop: any,
depth: number
) => {
const item = meta.item;
@ -69,7 +70,8 @@ export const viParts = (
key={id}
meta={meta}
is_layout={is_layout}
passprop={passprop}
passprop={{ ...passprop }}
depth={depth + 1}
/>
);
});

View File

@ -5,9 +5,13 @@ import { ErrorBox } from "../utils/error-box";
import { ViGlobal } from "./global";
import { viParts } from "./parts";
import { ViScript } from "./script";
import get from "lodash.get";
const MAX_RENDER_IN_SECOND = 70;
const JS_CONFIG = {
debug: !!localStorage.getItem("prasi-js-debug"),
};
export const render_stat = {
enabled: false,
meta: {} as Record<string, { last_render: number; count: number }>,
@ -18,7 +22,8 @@ export const ViRender: FC<{
passprop?: any;
is_layout: boolean;
parent_key?: any;
}> = ({ meta, passprop, is_layout, parent_key }) => {
depth: number;
}> = ({ meta, passprop, is_layout, parent_key, depth }) => {
if (render_stat.enabled) {
const rstat_meta = render_stat.meta;
@ -58,13 +63,20 @@ export const ViRender: FC<{
if (!meta) return null;
if (meta.item.hidden) return null;
if (JS_CONFIG.debug) {
let spaces = "";
for (let i = 0; i < depth; i++) spaces += ".";
console.log(spaces + meta.item.id, meta.item.name);
}
if (meta.item.adv?.js || meta.item.component?.id) {
return (
<ErrorBox meta={meta}>
<ViScript
meta={meta}
depth={depth}
is_layout={is_layout}
passprop={passprop}
passprop={{ ...passprop }}
parent_key={parent_key}
></ViScript>
</ErrorBox>
@ -74,7 +86,8 @@ export const ViRender: FC<{
<ErrorBox meta={meta}>
<ViChild
meta={meta}
passprop={passprop}
passprop={{ ...passprop }}
depth={depth}
is_layout={is_layout}
parent_key={parent_key}
></ViChild>
@ -87,7 +100,8 @@ export const ViChild: FC<{
is_layout: boolean;
passprop?: any;
parent_key?: any;
}> = ({ meta, passprop, is_layout, parent_key }) => {
depth: number;
}> = ({ meta, passprop, is_layout, parent_key, depth }) => {
const vi = useGlobal(ViGlobal, "VI");
if (is_layout && meta.item.name === "children") {
@ -101,13 +115,14 @@ export const ViChild: FC<{
<ViScript
meta={meta}
is_layout={false}
passprop={passprop}
passprop={{ ...passprop }}
parent_key={parent_key}
depth={depth + 1}
></ViScript>
</ErrorBox>
);
} else {
const parts = viParts(vi, meta, false, passprop);
const parts = viParts(vi, meta, false, passprop, depth);
if (vi.visit) vi.visit(meta, parts);
childs.push(<div {...parts.props} />);
}
@ -122,7 +137,7 @@ export const ViChild: FC<{
);
}
const parts = viParts(vi, meta, is_layout, passprop);
const parts = viParts(vi, meta, is_layout, passprop, depth);
if (vi.visit) vi.visit(meta, parts);
return <div {...parts.props} />;

View File

@ -9,9 +9,10 @@ import { viEvalScript } from "./script/eval-script";
export const ViScript: FC<{
meta: IMeta;
is_layout: boolean;
depth: number;
passprop?: any;
parent_key?: any;
}> = ({ meta, passprop, is_layout, parent_key }) => {
}> = ({ meta, passprop, is_layout, parent_key, depth }) => {
const vi = useGlobal(ViGlobal, "VI");
const [_, _set] = useState({});
meta.render = () => {
@ -21,17 +22,26 @@ export const ViScript: FC<{
let _pass = passprop;
if (meta.item.component?.id) {
if (!_pass) _pass = {};
viEvalProps(vi, meta, is_layout, _pass, parent_key);
viEvalProps(vi, meta, is_layout, _pass, depth, parent_key);
}
if (meta.item.adv?.html) {
return <ViChild meta={meta} passprop={_pass} is_layout={is_layout} />;
return (
<ViChild
meta={meta}
passprop={_pass}
is_layout={is_layout}
depth={depth}
/>
);
}
if (meta.item.adv?.js) {
viEvalScript(vi, meta, is_layout, _pass, parent_key);
viEvalScript(vi, meta, is_layout, _pass, depth, parent_key);
if (meta.script) return meta.script.result;
}
return <ViChild meta={meta} passprop={_pass} is_layout={is_layout} />;
return (
<ViChild meta={meta} passprop={_pass} is_layout={is_layout} depth={depth} />
);
};

View File

@ -22,6 +22,7 @@ export const viEvalProps = (
meta: IMeta,
is_layout: boolean,
passprop: any,
depth: number,
parent_key?: any
) => {
if (meta.item.component?.id) {
@ -109,6 +110,7 @@ export const viEvalProps = (
meta={m}
passprop={arg.passprop}
is_layout={is_layout}
depth={depth + 1}
/>
);
}

View File

@ -16,7 +16,6 @@ import { updatePropScope } from "./eval-prop";
import { extractNavigate } from "./extract-nav";
import { createViLocal } from "./local";
import { createViPassProp } from "./passprop";
import { isValid } from "date-fns";
export const viEvalScript = (
vi: {
page: VG["page"];
@ -32,9 +31,10 @@ export const viEvalScript = (
meta: IMeta,
is_layout: boolean,
passprop: any,
depth: number,
parent_key?: any
) => {
const parts = viParts(vi, meta, is_layout, passprop);
const parts = viParts(vi, meta, is_layout, passprop, depth);
if (vi.visit) vi.visit(meta, parts);
if (!meta.script) {
@ -146,7 +146,7 @@ export const viEvalScript = (
_jsx: true;
fn: (arg: { passprop: any; meta: IMeta }) => ReactNode;
};
arg[k] = <JsxProp fn={jprop.fn} passprop={passprop} meta={meta} />;
arg[k] = <JsxProp fn={jprop.fn} passprop={{ ...passprop }} meta={meta} />;
}
}
}
@ -157,6 +157,8 @@ export const viEvalScript = (
const js = meta.item.adv?.jsBuilt || "";
const src = replaceWithObject(js, replacement) || "";
try {
const fn = new Function(
...Object.keys(arg),
`// ${meta.item.name}: ${meta.item.id}
@ -164,6 +166,10 @@ ${src}
`
);
fn(...Object.values(arg));
} catch (e) {
console.warn(`Error at item ${meta.item.name}:`, meta.item.adv?.js);
console.error(e);
}
updatePropScope(vi, meta, passprop, parent_key);
};

View File

@ -25,6 +25,7 @@ export const createViLocal = (
hook?: (local: T) => void;
effect?: (local: T) => void | Promise<void>;
parent_key?: any;
deps?: any[];
}) => {
const isEditor =
["localhost", "prasi.avolut.com"].includes(location.hostname) &&
@ -79,7 +80,7 @@ export const createViLocal = (
}
return () => {};
}, [location.pathname]);
}, [...(arg.deps || []), location.pathname]);
useEffect(() => {
if (isEditor) {

View File

@ -34,7 +34,7 @@ export const ViRoot: FC<{}> = ({}) => {
if (Element) {
return (
<ErrorBox key={meta.item.id}>
<ViRender meta={meta} is_layout={is_layout} />
<ViRender meta={meta} is_layout={is_layout} depth={0} />
</ErrorBox>
);
}

View File

@ -27,6 +27,7 @@ w.debug = new Proxy(
get(target, p, receiver) {
if (p === "off") {
WS_CONFIG.debug = false;
localStorage.removeItem("prasi-js-debug");
localStorage.removeItem("prasi-ws-debug");
console.clear();
return ["WS DEBUG: Deactivated"];
@ -37,6 +38,11 @@ w.debug = new Proxy(
console.clear();
return ["WS DEBUG: Activated"];
}
if (p === "js") {
localStorage.setItem("prasi-js-debug", "1");
console.clear();
return ["JS DEBUG: Activated"];
}
},
}
) as any;