From 9ded811fb76c2a92b9f9c2117562ce7d844fc4b3 Mon Sep 17 00:00:00 2001 From: Rizky Date: Thu, 26 Oct 2023 18:33:55 +0700 Subject: [PATCH] fix npm bundle --- app/srv/api/npm-bundle.ts | 12 -- app/srv/api/npm.ts | 3 - app/srv/init.ts | 5 + app/srv/util/build-npm.ts | 1 + .../render/ed/panel/popup/npm/npm-import.tsx | 106 +++++++++++++++++- pkgs/core/index.ts | 2 + 6 files changed, 111 insertions(+), 18 deletions(-) create mode 100644 app/srv/init.ts diff --git a/app/srv/api/npm-bundle.ts b/app/srv/api/npm-bundle.ts index d409fa0e..c1f91968 100644 --- a/app/srv/api/npm-bundle.ts +++ b/app/srv/api/npm-bundle.ts @@ -1,16 +1,4 @@ -import globalExternals from "@fal-works/esbuild-plugin-global-externals"; -import { style } from "@hyrious/esbuild-plugin-style"; -import { npm_page, npm_site } from "dbgen"; -import { dir } from "dir"; -import { build } from "esbuild"; -import { $ } from "execa"; -import { dirAsync, writeAsync } from "fs-jetpack"; -import { stat } from "fs/promises"; import { apiContext } from "service-srv"; -import { g } from "utils/global"; -import { validate } from "uuid"; -import { glb } from "../global"; -import { eg } from "../ws/edit/edit-global"; import { buildNpm } from "../util/build-npm"; export const _ = { diff --git a/app/srv/api/npm.ts b/app/srv/api/npm.ts index f16e3652..93f1c787 100644 --- a/app/srv/api/npm.ts +++ b/app/srv/api/npm.ts @@ -12,9 +12,6 @@ export const _ = { const { req, res, mode: _mode } = apiContext(this); let path = dir.path(`${g.datadir}/npm/${mode}/${id}/${req.params._}`); - if (!glb.npm) { - glb.npm = { page: {}, site: {} }; - } const contentType = mime.lookup(path); if (contentType) res.setHeader("content-type", contentType); diff --git a/app/srv/init.ts b/app/srv/init.ts new file mode 100644 index 00000000..7a7ae211 --- /dev/null +++ b/app/srv/init.ts @@ -0,0 +1,5 @@ +import { glb } from "./global"; + +export const initSrv = async () => { + glb.npm = { page: {}, site: {} }; +}; diff --git a/app/srv/util/build-npm.ts b/app/srv/util/build-npm.ts index a39d774f..e9805716 100644 --- a/app/srv/util/build-npm.ts +++ b/app/srv/util/build-npm.ts @@ -189,6 +189,7 @@ packages: return s.size.toString(); } catch (e) { + console.error(e); return "-"; } }; diff --git a/app/web/src/render/ed/panel/popup/npm/npm-import.tsx b/app/web/src/render/ed/panel/popup/npm/npm-import.tsx index 04eae36e..72dab15a 100644 --- a/app/web/src/render/ed/panel/popup/npm/npm-import.tsx +++ b/app/web/src/render/ed/panel/popup/npm/npm-import.tsx @@ -5,10 +5,12 @@ import { EDGlobal } from "../../../logic/ed-global"; import { npm_page, npm_site } from "../../../../../../../db/db"; import { EdNpmItems } from "./npm-items"; import { AlgoliaResult, searchPackage } from "./npm-algolia"; +import { Popover } from "../../../../../utils/ui/popover"; export const EdNpmImport = ({ mode }: { mode: "page" | "site" }) => { const p = useGlobal(EDGlobal, "EDITOR"); const local = useLocal({ + bundling: false, search: { text: "", timeout: null as any, @@ -17,6 +19,7 @@ export const EdNpmImport = ({ mode }: { mode: "page" | "site" }) => { options: [] as { label: string; value: string }[], el: null as null | HTMLInputElement, }, + bundleError: "", status: "init" as "init" | "ready", size: 0, list: [] as (npm_page | npm_site)[], @@ -82,6 +85,36 @@ export const EdNpmImport = ({ mode }: { mode: "page" | "site" }) => { local.render(); }, 500); }} + onKeyDown={async (e) => { + if (e.key === "Enter" && local.search.options.length === 0) { + e.preventDefault(); + e.stopPropagation(); + + const name = local.search.text; + local.search.text = ""; + local.render(); + + if (mode === "page") { + await db.npm_page.create({ + data: { + id_page: p.page.cur.id, + module: name, + version: "1.0.0", + }, + }); + } else { + await db.npm_site.create({ + data: { + id_site: p.site.id, + module: name, + version: "1.0.0", + }, + }); + } + + reload(); + } + }} options={local.search.options} onChange={async (e) => { local.search.text = ""; @@ -116,9 +149,72 @@ export const EdNpmImport = ({ mode }: { mode: "page" | "site" }) => {
{local.status === "init" && <>Loading...} {local.status === "ready" && ( -
- Bundle -
+ +
{ + local.bundleError = ""; + local.render(); + }} + > + Close +
+
+ ERROR: +
+ {local.bundleError} +
+ + } + open={!!local.bundleError} + className={cx( + " cursor-pointer m-1 flex items-center text-white justify-center flex-1", + local.bundling + ? "bg-slate-500" + : "bg-green-800 hover:bg-green-600" + )} + > +
{ + if (local.bundling) return; + local.bundling = true; + local.render(); + + const res = (await api.npm_bundle( + mode, + mode === "site" + ? p.site.id || "" + : p.page + ? p.page.cur.id + : "" + )) as any; + + local.bundleError = ""; + if (typeof res === "object") { + if (res && res.errors && Array.isArray(res.errors)) { + const errors: string[] = []; + res.errors.forEach((e: any) => { + errors.push( + `${e.text}\n${e.location?.lineText || ""}` + ); + }); + local.bundleError = errors.join("\n\n"); + } + } else { + local.size = parseInt(res) || 0; + } + + local.bundling = false; + local.render(); + }} + > + {local.bundling ? "Bundling..." : "Bundle"} +
+ )}
@@ -159,6 +255,10 @@ const selectStyle = css` border-left: 1px solid #ececeb; border-right: 1px solid #ececeb; } + .sel__control--is-focused { + box-shadow: none !important; + border-bottom: 1px solid blue; + } .sel__menu { border-radius: 0px; background: white; diff --git a/pkgs/core/index.ts b/pkgs/core/index.ts index 519707b8..cbf9e932 100644 --- a/pkgs/core/index.ts +++ b/pkgs/core/index.ts @@ -11,6 +11,7 @@ import { preparePrisma } from "./utils/prisma"; import { syncActionDefinition } from "utils/sync-def"; import { user } from "../../app/srv/ws/sync/entity/user"; import { snapshot } from "../../app/srv/ws/sync/entity/snapshot"; +import { initSrv } from "../../app/srv/init"; g.status = "init"; @@ -38,6 +39,7 @@ if (g.db) { }); } +await initSrv(); await syncActionDefinition(); await generateAPIFrm(); await prepareApiRoutes();