From 3be06269c2ddb4ca09208aedd68fc21a6ac2c836 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?dni=20=E2=9A=A1?= <office@dnilabs.com>
Date: Tue, 23 Dec 2025 10:42:00 +0100
Subject: [PATCH] build umd components

---
 lnbits/helpers.py                             |  1 -
 lnbits/static/components/main.js              |  3 ++
 lnbits/templates/base.html                    |  4 +--
 package.json                                  |  6 ++--
 .../unit/component_lnbits_error.spec.js       | 33 ++++++++++++++-----
 vite.config.ts                                | 26 +++++++++++++++
 vitest.config.ts                              |  9 -----
 7 files changed, 56 insertions(+), 26 deletions(-)
 create mode 100644 lnbits/static/components/main.js
 create mode 100644 vite.config.ts
 delete mode 100644 vitest.config.ts

diff --git a/lnbits/helpers.py b/lnbits/helpers.py
index 28bb68cb4..8780f0cc8 100644
--- a/lnbits/helpers.py
+++ b/lnbits/helpers.py
@@ -132,7 +132,6 @@ def template_renderer(additional_folders: list | None = None) -> Jinja2Templates
             t.env.globals["INCLUDED_JS"] = vendor_files["js"]
             t.env.globals["INCLUDED_CSS"] = vendor_files["css"]
             t.env.globals["INCLUDED_COMPONENTS"] = vendor_files["components"]
-            t.env.globals["INCLUDED_MODULES"] = vendor_files["modules"]
 
     return t
 
diff --git a/lnbits/static/components/main.js b/lnbits/static/components/main.js
new file mode 100644
index 000000000..98dd98e8d
--- /dev/null
+++ b/lnbits/static/components/main.js
@@ -0,0 +1,3 @@
+import LnbitsError from './lnbits-error.vue'
+
+window.LnbitsError = LnbitsError
diff --git a/lnbits/templates/base.html b/lnbits/templates/base.html
index 38fe17572..b084e60f7 100644
--- a/lnbits/templates/base.html
+++ b/lnbits/templates/base.html
@@ -95,9 +95,7 @@
     <!-- scripts from extensions -->
     {% block scripts %}{% endblock %}
     <!-- modules js -->
-    {% for url in INCLUDED_MODULES %}
-    <script type="module" src="{{ static_url_for('static', url) }}"></script>
-    {% endfor %}
+    <script src="{{ static_url_for('static', 'modules/components.umd.js') }}"></script>
     <!-- components js -->
     {% for url in INCLUDED_COMPONENTS %}
     <script src="{{ static_url_for('static', url) }}"></script>
diff --git a/package.json b/package.json
index c36b3e996..9bd3440a5 100644
--- a/package.json
+++ b/package.json
@@ -13,7 +13,8 @@
     "bundle": "npm run sass && npm run vendor_copy && npm run vendor_json && npm run vendor_bundle_css && npm run vendor_bundle_js && npm run vendor_bundle_components && npm run vendor_minify_css && npm run vendor_minify_js && npm run vendor_minify_components",
     "test": "npm run test:unit",
     "test:unit": "vitest --watch=false tests/frontend/unit",
-    "test:unit:watch": "vitest tests/frontend/unit"
+    "test:unit:watch": "vitest tests/frontend/unit",
+    "build": "vite build"
   },
   "devDependencies": {
     "@quasar/quasar-app-extension-testing-unit-vitest": "^1.2.4",
@@ -102,9 +103,6 @@
       "js/event-reactions.js",
       "js/bolt11-decoder.js"
     ],
-    "modules": [
-      "components/lnbits-error.vue"
-    ],
     "components": [
       "js/pages/error.js",
       "js/pages/home.js",
diff --git a/tests/frontend/unit/component_lnbits_error.spec.js b/tests/frontend/unit/component_lnbits_error.spec.js
index 89477bfd2..537ecf00b 100644
--- a/tests/frontend/unit/component_lnbits_error.spec.js
+++ b/tests/frontend/unit/component_lnbits_error.spec.js
@@ -1,22 +1,37 @@
-// import { installQuasarPlugin } from '@quasar/quasar-app-extension-testing-unit-vitest';
 import {mount} from '@vue/test-utils'
 import {expect, test} from 'vitest'
-import {createApp} from 'vue'
-import {Quasar} from 'quasar'
 import LnbitsError from '../../../lnbits/static/components/lnbits-error.vue'
 
+// installQuasarPlugin()
+export const quasarMock = {
+  global: {
+    mocks: {
+      g: {
+        isUserAuthorized: true
+      },
+      $q: {
+        platform: {},
+        screen: {},
+        dark: false
+      }
+    },
+    stubs: {
+      QCard: true,
+      QCardSection: true,
+      QIcon: true,
+      QBtn: true
+    }
+  }
+}
 test('displays message and code', () => {
-  const app = createApp({})
-  app.use(Quasar)
+  expect(LnbitsError).toBeTruthy()
 
   const wrapper = mount(LnbitsError, {
-    global: {
-      plugins: [Quasar]
-    },
     props: {
       message: 'Page not found!!!',
       code: 404
-    }
+    },
+    ...quasarMock
   })
   expect(wrapper.text()).toContain('Page not found!!!')
   expect(wrapper.text()).toContain('404')
diff --git a/vite.config.ts b/vite.config.ts
new file mode 100644
index 000000000..274110c3e
--- /dev/null
+++ b/vite.config.ts
@@ -0,0 +1,26 @@
+import {defineConfig} from 'vitest/config'
+import vue from '@vitejs/plugin-vue'
+export default defineConfig({
+  plugins: [vue()],
+  test: {
+    globals: true,
+    environment: 'jsdom'
+  },
+  define: {
+    'process.env': {}, // Replace process.env with an empty object for browser builds
+  },
+  build: {
+    lib: {
+      entry: 'lnbits/static/components/main.js',
+      name: 'LnbitsComponents',
+      fileName: 'components', // Output file name (build.js)
+      formats: ['umd']
+    },
+    minify: 'terser', // Optional: minify the output
+    rollupOptions: {
+      // If you have external dependencies, mark them here
+      external: []
+    },
+    outDir: 'lnbits/static/modules' // Output folder
+  }
+})
diff --git a/vitest.config.ts b/vitest.config.ts
deleted file mode 100644
index b2c6f4db7..000000000
--- a/vitest.config.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import {defineConfig} from 'vitest/config'
-import vue from '@vitejs/plugin-vue'
-export default defineConfig({
-  plugins: [vue()],
-  test: {
-    globals: true,
-    environment: 'jsdom'
-  }
-})