From cf69cf87d6e1a033a4965226932d3939b2ce17b6 Mon Sep 17 00:00:00 2001
From: MrCoder <eagle.xiao@gmail.com>
Date: Tue, 17 Dec 2024 14:05:29 +1100
Subject: [PATCH] feat(core): add version exposure and control

- Add version.ts to expose package version
- Include version in ZenUml class and main.ts
- Update types to include version information
- Modify vite config files to inject version during build
---
 src/core.ts        | 3 +++
 src/main.ts        | 4 ++++
 src/version.ts     | 1 +
 vite.config.js     | 9 +++++++++
 vite.config.lib.js | 8 ++++++++
 5 files changed, 25 insertions(+)
 create mode 100644 src/version.ts

diff --git a/src/core.ts b/src/core.ts
index 93657f4db..9485e349a 100644
--- a/src/core.ts
+++ b/src/core.ts
@@ -6,6 +6,7 @@ import Store, { RenderMode } from "./store/Store";
 import DiagramFrame from "./components/DiagramFrame/DiagramFrame.vue";
 // @ts-ignore
 import SeqDiagram from "./components/DiagramFrame/SeqDiagram/SeqDiagram.vue";
+import { VERSION } from "./version";
 
 import "./assets/tailwind.css";
 import "./assets/tailwind-preflight.less";
@@ -46,6 +47,8 @@ interface IZenUml {
 }
 
 export default class ZenUml implements IZenUml {
+  static readonly version = VERSION;
+
   private readonly el: Element;
   private _code: string | undefined;
   private _theme: string | undefined;
diff --git a/src/main.ts b/src/main.ts
index 7e9a1c68b..c4f404604 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -8,6 +8,9 @@ const elm = document.querySelector("pre.zenuml");
 // @ts-ignore
 const zenUml = new ZenUml(elm);
 
+// Expose ZenUML version to window for easy access in developer console
+// @ts-ignore
+window.ZENUML_VERSION = ZenUml.version;
 // @ts-ignore
 window.zenUml = zenUml;
 zenUml
@@ -20,6 +23,7 @@ zenUml
   })
   .then((r) => {
     logger.debug("render resolved", r);
+    console.log("ZenUML Core Version:", ZenUml.version);
   });
 // @ts-ignore
 window.parentLogger = parentLogger;
diff --git a/src/version.ts b/src/version.ts
new file mode 100644
index 000000000..41d2b44a0
--- /dev/null
+++ b/src/version.ts
@@ -0,0 +1 @@
+export const VERSION = import.meta.env.PACKAGE_VERSION;
diff --git a/vite.config.js b/vite.config.js
index 21c8288c8..901dc74dd 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -3,6 +3,7 @@ import { defineConfig } from "vite";
 import createVuePlugin from "@vitejs/plugin-vue";
 import { execSync } from "child_process";
 import svgLoader from "vite-svg-loader";
+import { readFileSync } from "fs";
 
 process.env.VITE_APP_GIT_HASH = process.env.DOCKER
   ? ""
@@ -11,6 +12,11 @@ process.env.VITE_APP_GIT_BRANCH = process.env.DOCKER
   ? ""
   : execSync("git branch --show-current").toString().trim();
 
+// Read version from package.json
+const packageJson = JSON.parse(
+  readFileSync(resolve(__dirname, "package.json"), "utf-8"),
+);
+
 function getCypressHtmlFiles() {
   const cypressFolder = resolve(__dirname, "cy");
   const strings = execSync(`find ${cypressFolder} -name '*.html'`)
@@ -49,6 +55,9 @@ export default defineConfig(({ mode }) => ({
     }),
     svgLoader(),
   ],
+  define: {
+    "import.meta.env.PACKAGE_VERSION": JSON.stringify(packageJson.version),
+  },
   test: {
     // used by vitest: https://vitest.dev/guide/#configuring-vitest
     environment: "jsdom",
diff --git a/vite.config.lib.js b/vite.config.lib.js
index 2fb88332a..74e74b0d3 100644
--- a/vite.config.lib.js
+++ b/vite.config.lib.js
@@ -4,6 +4,12 @@ import { defineConfig } from "vite";
 import createVuePlugin from "@vitejs/plugin-vue";
 import cssInjectedByJsPlugin from "vite-plugin-css-injected-by-js";
 import svgLoader from "vite-svg-loader";
+import { readFileSync } from "fs";
+
+// Read version from package.json
+const packageJson = JSON.parse(
+  readFileSync(resolve(__dirname, "package.json"), "utf-8"),
+);
 
 export default defineConfig({
   build: {
@@ -57,5 +63,7 @@ export default defineConfig({
   ],
   define: {
     "process.env.NODE_ENV": '"production"',
+    // Replace version placeholder during build
+    "import.meta.env.PACKAGE_VERSION": JSON.stringify(packageJson.version),
   },
 });