From 7015599cd55cacc45e62923b856fc28cdb92697d Mon Sep 17 00:00:00 2001 From: Rizky Date: Sat, 16 Dec 2023 06:22:23 +0700 Subject: [PATCH] web fix --- .../src/nova/ed/panel/main/main-per-item.tsx | 103 ++++++++++++++++++ app/web/src/nova/ed/panel/main/main.tsx | 67 +----------- app/web/src/nova/vi/meta/comp/instantiate.tsx | 4 + pkgs/core/api/_dbs.ts | 1 - pkgs/core/server/create.ts | 4 +- pkgs/core/server/serve-api.ts | 4 +- 6 files changed, 115 insertions(+), 68 deletions(-) create mode 100644 app/web/src/nova/ed/panel/main/main-per-item.tsx diff --git a/app/web/src/nova/ed/panel/main/main-per-item.tsx b/app/web/src/nova/ed/panel/main/main-per-item.tsx new file mode 100644 index 00000000..50b2cb04 --- /dev/null +++ b/app/web/src/nova/ed/panel/main/main-per-item.tsx @@ -0,0 +1,103 @@ +import { IContent } from "../../../../utils/types/general"; +import { VG } from "../../../vi/render/global"; +import { IMeta, PG, active } from "../../logic/ed-global"; + +type MPIVParam = Parameters>; +export const mainPerItemVisit = ( + p: PG, + meta: MPIVParam[0], + parts: MPIVParam[1] +) => { + if ((meta.item as IContent).type === "text" && !meta.item.adv?.jsBuilt) { + parts.props.spellCheck = false; + parts.props.contentEditable = true; + parts.props.dangerouslySetInnerHTML = { + __html: meta.mitem?.get("html") || " ", + }; + parts.props.onBlur = (e) => { + e.stopPropagation(); + const mitem = meta.mitem; + if (mitem) { + mitem.set("html", e.currentTarget.innerHTML); + } + }; + } + + let isActive: boolean = active.item_id === meta.item.id; + if (active.comp_id) { + isActive = active.item_id === meta.item.originalId; + } + + parts.props.className = cx( + parts.props.className, + isActive && + css` + &::after { + content: " "; + pointer-events: none; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + border: 2px solid #1c88f3; + } + ` + ); + parts.props.onPointerOver = (e) => { + e.stopPropagation(); + active.hover.id = meta.item.id; + active.hover.renderMain(); + active.hover.renderTree(); + }; + parts.props.onPointerLeave = (e) => { + e.stopPropagation(); + active.hover.id = ""; + active.hover.renderMain(); + active.hover.renderTree(); + }; + parts.props.onPointerDown = (e) => { + e.stopPropagation(); + + const item = getOuterItem( + { + meta: active.comp_id ? p.comp.list[active.comp_id].meta : p.page.meta, + }, + meta + ); + if (active.comp_id && item.component?.id === active.comp_id) { + if (meta.item.originalId) { + active.item_id = meta.item.originalId; + } + } else { + if (item) { + active.item_id = item.id; + } + } + active.hover.id = ""; + p.render(); + }; +}; + +const getOuterItem = (p: { meta: Record }, meta: IMeta) => { + let cur: undefined | IMeta = meta; + + if (cur.jsx_prop) return meta.item; + + while (cur?.parent?.instance_id) { + cur = p.meta[cur?.parent?.instance_id]; + } + + return cur.item; +}; +function setEndOfContenteditable(div: any) { + let range: any, sel: any; + if (document.createRange) { + //Firefox, Chrome, Opera, Safari, IE 9+ + range = document.createRange(); + range.selectNodeContents(div); + sel = window.getSelection(); + sel.removeAllRanges(); + sel.addRange(range); + } +} diff --git a/app/web/src/nova/ed/panel/main/main.tsx b/app/web/src/nova/ed/panel/main/main.tsx index 08729c79..524eb9ff 100644 --- a/app/web/src/nova/ed/panel/main/main.tsx +++ b/app/web/src/nova/ed/panel/main/main.tsx @@ -1,7 +1,7 @@ import { useGlobal, useLocal } from "web-utils"; -import { IContent } from "../../../../utils/types/general"; import { Vi } from "../../../vi/vi"; import { EDGlobal, active } from "../../logic/ed-global"; +import { mainPerItemVisit } from "./main-per-item"; export const EdMain = () => { // return
; @@ -29,58 +29,7 @@ export const EdMain = () => { db={p.script.db} script={{ init_local_effect: p.script.init_local_effect }} visit={(meta, parts) => { - if ( - (meta.item as IContent).type === "text" && - !meta.item.adv?.jsBuilt - ) { - parts.props.spellCheck = false; - parts.props.contentEditable = true; - parts.props.dangerouslySetInnerHTML = { - __html: meta.mitem?.get("html") || "", - }; - parts.props.onBlur = (e) => { - e.stopPropagation(); - const mitem = meta.mitem; - if (mitem) { - mitem.set("html", e.currentTarget.innerHTML); - } - }; - } - - parts.props.className = cx( - parts.props.className, - active.item_id === meta.item.id && - css` - &::after { - content: " "; - pointer-events: none; - position: absolute; - top: 0; - bottom: 0; - left: 0; - right: 0; - border: 2px solid #1c88f3; - } - ` - ); - parts.props.onPointerOver = (e) => { - e.stopPropagation(); - active.hover.id = meta.item.id; - active.hover.renderMain(); - active.hover.renderTree(); - }; - parts.props.onPointerLeave = (e) => { - e.stopPropagation(); - active.hover.id = ""; - active.hover.renderMain(); - active.hover.renderTree(); - }; - parts.props.onPointerDown = (e) => { - e.stopPropagation(); - active.item_id = meta.item.id; - active.hover.id = ""; - p.render(); - }; + return mainPerItemVisit(p, meta, parts); }} /> @@ -108,15 +57,3 @@ const mainStyle = () => { ` ); }; - -function setEndOfContenteditable(div: any) { - let range: any, sel: any; - if (document.createRange) { - //Firefox, Chrome, Opera, Safari, IE 9+ - range = document.createRange(); - range.selectNodeContents(div); - sel = window.getSelection(); - sel.removeAllRanges(); - sel.addRange(range); - } -} diff --git a/app/web/src/nova/vi/meta/comp/instantiate.tsx b/app/web/src/nova/vi/meta/comp/instantiate.tsx index 4cfad874..e05178a3 100644 --- a/app/web/src/nova/vi/meta/comp/instantiate.tsx +++ b/app/web/src/nova/vi/meta/comp/instantiate.tsx @@ -38,6 +38,10 @@ export const walkChild = ( item: IItem, ids: Exclude ) => { + if (!item.originalId) { + item.originalId = item.id; + } + if (!ids[item.id]) { ids[item.id] = createId(); } diff --git a/pkgs/core/api/_dbs.ts b/pkgs/core/api/_dbs.ts index ce020f49..041a0e05 100644 --- a/pkgs/core/api/_dbs.ts +++ b/pkgs/core/api/_dbs.ts @@ -9,7 +9,6 @@ export const _ = { try { const result = await execQuery(req.params, db); res.send(result); - } catch (e: any) { res.sendStatus(500); res.send(e.message); diff --git a/pkgs/core/server/create.ts b/pkgs/core/server/create.ts index 309eedad..eebdad58 100644 --- a/pkgs/core/server/create.ts +++ b/pkgs/core/server/create.ts @@ -64,6 +64,7 @@ export const createServer = async () => { } as WebSocketHandler, async fetch(req, server) { const url = new URL(req.url); + const response = async () => { if (wsHandler[url.pathname]) { if ( @@ -90,6 +91,7 @@ export const createServer = async () => { const webPath = "app/static"; try { const found = cache.static[url.pathname]; + if (found && g.mode === "prod") { return responseCached(req, found); } @@ -100,7 +102,7 @@ export const createServer = async () => { file.type !== "application/octet-stream" // is not directory ) { if (g.mode === "dev") { - return new Response(file as any); + return new Response(file); } if (!cache.static[url.pathname]) { diff --git a/pkgs/core/server/serve-api.ts b/pkgs/core/server/serve-api.ts index 4596bee2..73ec21fe 100644 --- a/pkgs/core/server/serve-api.ts +++ b/pkgs/core/server/serve-api.ts @@ -54,7 +54,9 @@ export const serveAPI = async (url: URL, req: Request) => { } } } - } catch (e) {} + } catch (e) { + g.log.error({ pathname: url.pathname, error: e }); + } } }