feat(ui): add commit details to index.html file using vite plugin system (#4334)

ui/build.gradle

@@ -36,16 +36,4 @@ final linterTask = tasks.register('lintFrontend', RunNpm) {
     script = 'run test:lint'
 }
 
-check.dependsOn linterTask
-
-task addCommitInfo(type: Exec) {
-    dependsOn assembleFrontend
-    group = 'Frontend'
-    description = 'Adds the comment with commit details at the beginning of index.html'
-
-    commandLine 'node', 'scripts/commits.js'
-    
-    workingDir = projectDir
-}
-
-assembleFrontend.finalizedBy addCommitInfo
+check.dependsOn linterTask

ui/plugins/details.ts

@@ -0,0 +1,29 @@
+import type {Plugin} from "vite";
+import {execSync} from "child_process";
+
+const comment = (hash: string, date: string): string => {
+    return `
+<!--
+
+    Last Commit: 
+      
+    URL: https://github.com/kestra-io/kestra/commit/${hash}
+    Date: ${date}
+
+-->`;
+};
+
+export const details = (): Plugin => {
+    const hash: string = execSync("git rev-parse --short HEAD").toString().trim();
+    const date: string = execSync("git log -1 --format=%cd").toString().trim();
+
+    return {
+        name: "details",
+        transformIndexHtml: {
+            enforce: "pre",
+            transform(html: string): string {
+                return comment(hash, date) + html;
+            },
+        },
+    };
+};

ui/scripts/commits.js

@@ -1,25 +0,0 @@
-const fs = require("fs");
-const {execSync} = require("child_process");
-
-// Get the last commit hash and date details
-const hash = execSync("git rev-parse HEAD").toString().trim();
-const date = execSync("git log -1 --format=%cd").toString().trim();
-
-// Prepare the comment to add to the file
-const comment = `
-<!--
-  Commit: ${hash}
-  Date: ${date}
--->
-`;
-
-// Define the path to the index.html file
-const path = "../webserver/src/main/resources/ui/index.html";
-
-// Read the content of index.html
-const content = fs.readFileSync(path, "utf8");
-
-// Write the comment at the beginning of index.html
-fs.writeFileSync(path, comment + content);
-
-console.log(`Added commit details to ${path}`);

ui/vite.config.js

@@ -5,6 +5,7 @@ import {visualizer} from "rollup-plugin-visualizer";
 import eslintPlugin from "vite-plugin-eslint";
 
 import {filename} from "./plugins/filename"
+import {details} from "./plugins/details"
 
 export default defineConfig({
     base: "",
@@ -24,8 +25,9 @@ export default defineConfig({
         eslintPlugin({
             failOnWarning: true,
             failOnError: true
-        }),        
+        }),
         filename(),
+        details()
     ],
     assetsInclude: ["**/*.md"],
     css: {