build(web/ui): Support building WebJar for OpenDC web UI

This change updates the build process to build a static WebJar out of
the OpenDC web UI module. This allows us to embed the UI inside the
development distribution of OpenDC for other users to readily deploy it.

2 files changed, 51 insertions, 21 deletions

diff --git a/opendc-web/opendc-web-ui/build.gradle.kts b/opendc-web/opendc-web-ui/build.gradle.kts
index 9063d0e3..62d71897 100644
--- a/opendc-web/opendc-web-ui/build.gradle.kts
+++ b/opendc-web/opendc-web-ui/build.gradle.kts
@@ -25,10 +25,19 @@ import com.github.gradle.node.yarn.task.YarnTask
 description = "Web interface for OpenDC"
 
 plugins {
-    java
+    `java-library-conventions`
     id("com.github.node-gradle.node")
 }
 
+sourceSets {
+    main {
+        java.srcDir("src")
+    }
+    test {
+        java.srcDir("test")
+    }
+}
+
 val lintTask = tasks.register<YarnTask>("lintNext") {
     args.set(listOf("lint"))
     dependsOn(tasks.yarn)
@@ -37,22 +46,35 @@ val lintTask = tasks.register<YarnTask>("lintNext") {
     outputs.upToDateWhen { true }
 }
 
-val buildTask = tasks.register<YarnTask>("buildNext") {
-    args.set(listOf("build"))
+tasks.register<YarnTask>("dev") {
+    args.set(listOf("dev"))
     dependsOn(tasks.yarn)
     inputs.dir(project.fileTree("src"))
     inputs.dir("node_modules")
     inputs.files("package.json", "next.config.js")
-    outputs.dir("${project.buildDir}/build")
+    outputs.upToDateWhen { true }
 }
 
-tasks.register<YarnTask>("dev") {
-    args.set(listOf("dev"))
+val buildTask = tasks.register<YarnTask>("buildNext") {
+    args.set(listOf("build"))
+
+    val env = listOf(
+        "NEXT_BASE_PATH",
+        "NEXT_PUBLIC_API_BASE_URL",
+        "NEXT_PUBLIC_SENTRY_DSN",
+        "NEXT_PUBLIC_AUTH0_DOMAIN",
+        "NEXT_PUBLIC_AUTH0_CLIENT_ID",
+        "NEXT_PUBLIC_AUTH0_AUDIENCE",
+    )
+    for (envvar in env) {
+        environment.put(envvar, "%%${envvar}%%")
+    }
+
     dependsOn(tasks.yarn)
     inputs.dir(project.fileTree("src"))
     inputs.dir("node_modules")
     inputs.files("package.json", "next.config.js")
-    outputs.upToDateWhen { true }
+    outputs.dir(layout.buildDirectory.dir("next"))
 }
 
 tasks.register<YarnTask>("start") {
@@ -64,19 +86,25 @@ tasks.register<YarnTask>("start") {
     outputs.upToDateWhen { true }
 }
 
-sourceSets {
-    java {
-        main {
-            java.srcDir("src")
-            resources.srcDir("public")
-        }
+tasks.processResources {
+    dependsOn(buildTask)
+    inputs.dir(project.fileTree("public"))
 
-        test {
-            java.srcDir("test")
-        }
+    from(layout.buildDirectory.dir("next")) {
+        include("routes-manifest.json")
+        into("META-INF/resources/${project.name}")
+    }
+
+    from(layout.buildDirectory.dir("next/static")) {
+        into("META-INF/resources/${project.name}/static/_next/static")
     }
-}
 
-tasks.test {
-    dependsOn(lintTask)
+    from(layout.buildDirectory.dir("next/server/pages")) {
+        include("**/*.html")
+        into("META-INF/resources/${project.name}/pages")
+    }
+
+    from(project.fileTree("public")) {
+        into("META-INF/resources/${project.name}/static")
+    }
 }
diff --git a/opendc-web/opendc-web-ui/next.config.js b/opendc-web/opendc-web-ui/next.config.js
index 59341b1f..d8029108 100644
--- a/opendc-web/opendc-web-ui/next.config.js
+++ b/opendc-web/opendc-web-ui/next.config.js
@@ -23,14 +23,16 @@
 // PatternFly 4 uses global CSS imports in its distribution files. Therefore,
 // we need to transpile the modules before we can use them.
 const { withGlobalCss } = require('next-global-css')
+const { PHASE_DEVELOPMENT_SERVER } = require("next/constants");
 const withConfig = withGlobalCss()
 
-module.exports = withConfig({
+module.exports = (phase) => withConfig({
+    basePath: process.env.NEXT_BASE_PATH && '/' + process.env.NEXT_BASE_PATH,
     reactStrictMode: true,
     experimental: {
         eslint: true
     },
-    distDir: 'build/next',
+    distDir: phase === PHASE_DEVELOPMENT_SERVER ? 'build/next-dev' : 'build/next',
     async redirects() {
         return [
             {