using vite for static bundling to solve external package's react resolution

2026-03-16 04:27:21 +00:00 · 2025-01-14 07:51:14 +01:00
parent b1a32f3705
commit 6855e6f7e9
10 changed files with 153 additions and 456 deletions
--- a/tmp/lazy_codemirror.patch
+++ b/tmp/lazy_codemirror.patch
@@ -0,0 +1,125 @@
+Subject: [PATCH] lazy codemirror
+---
+Index: app/src/ui/components/code/LiquidJsEditor.tsx
+IDEA additional info:
+Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP
+<+>UTF-8
+===================================================================
+diff --git a/app/src/ui/components/code/LiquidJsEditor.tsx b/app/src/ui/components/code/LiquidJsEditor.tsx
+--- a/app/src/ui/components/code/LiquidJsEditor.tsx	(revision b1a32f370565aded3a34b79ffd254c3c45d1085c)
+++ b/app/src/ui/components/code/LiquidJsEditor.tsx	(date 1736687726081)
+@@ -1,7 +1,7 @@
+-import { liquid } from "@codemirror/lang-liquid";
+-import type { ReactCodeMirrorProps } from "@uiw/react-codemirror";
+ import { Suspense, lazy } from "react";
+ import { twMerge } from "tailwind-merge";
+
+import type { CodeEditorProps } from "./CodeEditor";
+ const CodeEditor = lazy(() => import("./CodeEditor"));
+ 
+ const filters = [
+@@ -106,7 +106,7 @@
+    { label: "when" }
+ ];
+ 
+-export function LiquidJsEditor({ editable, ...props }: ReactCodeMirrorProps) {
+export function LiquidJsEditor({ editable, ...props }: CodeEditorProps) {
+    return (
+       <Suspense fallback={null}>
+          <CodeEditor
+@@ -115,7 +115,9 @@
+                !editable && "opacity-70"
+             )}
+             editable={editable}
+-            extensions={[liquid({ filters, tags })]}
+            _extensions={{
+               liquid: { filters, tags }
+            }}
+             {...props}
+          />
+       </Suspense>
+Index: app/src/ui/components/code/CodeEditor.tsx
+IDEA additional info:
+Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP
+<+>UTF-8
+===================================================================
+diff --git a/app/src/ui/components/code/CodeEditor.tsx b/app/src/ui/components/code/CodeEditor.tsx
+--- a/app/src/ui/components/code/CodeEditor.tsx	(revision b1a32f370565aded3a34b79ffd254c3c45d1085c)
+++ b/app/src/ui/components/code/CodeEditor.tsx	(date 1736687634668)
+@@ -1,8 +1,22 @@
+ import { default as CodeMirror, type ReactCodeMirrorProps } from "@uiw/react-codemirror";
+-
+ import { useBknd } from "ui/client/bknd";
+ 
+-export default function CodeEditor({ editable, basicSetup, ...props }: ReactCodeMirrorProps) {
+import { json } from "@codemirror/lang-json";
+import { type LiquidCompletionConfig, liquid } from "@codemirror/lang-liquid";
+
+export type CodeEditorProps = ReactCodeMirrorProps & {
+   _extensions?: Partial<{
+      json: boolean;
+      liquid: LiquidCompletionConfig;
+   }>;
+};
+
+export default function CodeEditor({
+   editable,
+   basicSetup,
+   _extensions = {},
+   ...props
+}: CodeEditorProps) {
+    const b = useBknd();
+    const theme = b.app.getAdminConfig().color_scheme;
+    const _basicSetup: Partial<ReactCodeMirrorProps["basicSetup"]> = !editable
+@@ -13,11 +27,21 @@
+         }
+       : basicSetup;
+ 
+   const extensions = Object.entries(_extensions ?? {}).map(([ext, config]: any) => {
+      switch (ext) {
+         case "json":
+            return json();
+         case "liquid":
+            return liquid(config);
+      }
+   });
+
+    return (
+       <CodeMirror
+          theme={theme === "dark" ? "dark" : "light"}
+          editable={editable}
+          basicSetup={_basicSetup}
+         extensions={extensions}
+          {...props}
+       />
+    );
+Index: app/src/ui/components/code/JsonEditor.tsx
+IDEA additional info:
+Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP
+<+>UTF-8
+===================================================================
+diff --git a/app/src/ui/components/code/JsonEditor.tsx b/app/src/ui/components/code/JsonEditor.tsx
+--- a/app/src/ui/components/code/JsonEditor.tsx	(revision b1a32f370565aded3a34b79ffd254c3c45d1085c)
+++ b/app/src/ui/components/code/JsonEditor.tsx	(date 1736687681965)
+@@ -1,10 +1,9 @@
+-import { json } from "@codemirror/lang-json";
+-import type { ReactCodeMirrorProps } from "@uiw/react-codemirror";
+ import { Suspense, lazy } from "react";
+ import { twMerge } from "tailwind-merge";
+import type { CodeEditorProps } from "./CodeEditor";
+ const CodeEditor = lazy(() => import("./CodeEditor"));
+ 
+-export function JsonEditor({ editable, className, ...props }: ReactCodeMirrorProps) {
+export function JsonEditor({ editable, className, ...props }: CodeEditorProps) {
+    return (
+       <Suspense fallback={null}>
+          <CodeEditor
+@@ -14,7 +13,7 @@
+                className
+             )}
+             editable={editable}
+-            extensions={[json()]}
+            _extensions={{ json: true }}
+             {...props}
+          />
+       </Suspense>