1.16.x

.github/workflows/release.yml

@@ -11,10 +11,10 @@ jobs:
       - uses: actions/checkout@v2.3.4
         with:
           fetch-depth: 0
-      - name: Node 16.x
+      - name: Node 22.x
         uses: actions/setup-node@v3
         with:
-          node-version: 16
+          node-version: 22
       - name: Setup JDK
         uses: actions/setup-java@v4
         with:
@@ -29,8 +29,38 @@ jobs:
           passphrase: ${{ secrets.PGP_PASSPHRASE }}
       - name: List keys
         run: gpg -K
+      - id: tag
+        run: |
+          if [[ "${GITHUB_REF#refs/tags/}" != "$GITHUB_REF" ]]; then
+          tag=${GITHUB_REF#refs/tags/}
+          else
+          tag=$(git tag --points-at "$GITHUB_SHA" | head -n1)
+          fi
+          # strip a single leading v if present
+          tag=${tag#v}
+          echo $tag
+          echo "tag=$tag" >> "$GITHUB_OUTPUT"
+      - name: Export VITE_BOX_VERSION
+        run: echo "VITE_BOX_VERSION=${{ steps.tag.outputs.tag }}" >> $GITHUB_ENV
+      - name: Install node dependencies
+        env:
+          SBT_OPTS: -XX:+UseG1GC -Xmx4G -Xss10M -XX:MaxInlineLevel=20
+        run: |
+          cd client
+          npm install
+          cd ..
+      - name: Import TS Types
+        env:
+          SBT_OPTS: -XX:+UseG1GC -Xmx4G -Xss10M -XX:MaxInlineLevel=20
+        run: |
+          sbt client/generateScalaTypes
       - name: Build bundle
-        run: sbt -J-Xmx4G -J-XX:MaxMetaspaceSize=1G  -J-Xss10m client/fullOptJS::webpack
+        env:
+          SBT_OPTS: -XX:+UseG1GC -Xmx4G -Xss10M -XX:MaxInlineLevel=20
+        run: |
+          cd client
+          npm run build
+          cd ..
       - name: Version info
         run: |
           sbt server/version

.gitignore

@@ -74,4 +74,5 @@ node_modules
 LOCAL_README.md
 
 #let sbt handle the depenencies
-client/package-lock.json
+client/package-lock.json
+client/dist

build.sbt

@@ -1,8 +1,10 @@
 import com.jsuereth.sbtpgp.PgpKeys.publishSigned
+import org.scalablytyped.converter.internal.Json
+import org.scalablytyped.converter.internal.ts.PackageJson
 //import xerial.sbt.Sonatype.sonatypeCentralHost
 import locales.LocalesFilter
 import org.scalajs.jsenv.Input.Script
-import scalajsbundler.util.JSON
+import org.scalajs.linker.interface.ModuleSplitStyle
 
 val publishSettings = List(
   Global / scalaJSStage := FullOptStage,
@@ -74,31 +76,14 @@ lazy val server: Project  = project
     Compile / packageBin / mainClass := Some("ch.wsl.box.rest.Boot"),
     Compile / run / mainClass := Some("ch.wsl.box.rest.Boot"),
     Compile / resourceDirectory := baseDirectory.value / "../resources",
+    Compile / resourceDirectory := baseDirectory.value / "../client/dist",
     Test / unmanagedResourceDirectories += baseDirectory.value / "../db",
     Test / unmanagedSourceDirectories += baseDirectory.value / "../db",
     Test / fork := true,
     Test / parallelExecution := false,
     buildInfoKeys := Seq[BuildInfoKey](version),
     buildInfoPackage := "boxInfo",
     buildInfoObject := "BoxBuildInfo",
-    Compile / compile := ((Compile / compile) dependsOn scalaJSPipeline).value,
-    Runtime / managedClasspath += (Assets / packageBin).value,
-    Assets / WebKeys.packagePrefix := "public/",
-    //Comment this to avoid errors in importing project, i.e. when changing libraries
-    Assets / pipelineStages := Seq(scalaJSPipeline),
-    Assets / scalaJSStage := FullOptStage,
-    scalaJSProjects := {
-      if (sys.env.contains("DEV_SERVER") || sys.env.contains("RUNNING_TEST")) Seq() else Seq(client)
-    },
-//    scalaJSProjects := Seq(client),
-    webpackBundlingMode := BundlingMode.Application,
-    Seq("jquery","ol","bootstrap","flatpickr","quill","@fontsource/open-sans","@fortawesome/fontawesome-free","choices.js","gridstack","jspreadsheet-ce","jsuites","toolcool-range-slider","@electric-sql/pglite","@electric-sql/pglite-repl").map{ p =>
-      if (!sys.env.contains("RUNNING_TEST"))
-        npmAssets ++= NpmAssets.ofProject(client) { nodeModules =>
-          (nodeModules / p).allPaths
-        }.value
-      else npmAssets := Seq()
-    },
     Test / testOptions ++= Seq(
       Tests.Argument(TestFrameworks.ScalaTest, "-u", "target/test-reports"),
       Tests.Argument(TestFrameworks.ScalaTest, "-h", "target/test-reports"),
@@ -109,7 +94,6 @@ lazy val server: Project  = project
   .enablePlugins(
     GitVersioning,
     BuildInfoPlugin,
-    WebScalaJSBundlerPlugin,
     SbtTwirl
   )
   .dependsOn(sharedJVM)
@@ -129,90 +113,26 @@ lazy val serverCacheRedis  = (project in file("server-cache-redis")).settings(
 
 lazy val client: Project = (project in file("client"))
   .settings(
-    name := "client",
+    name := "box-client",
     scalaVersion := Settings.versions.scala213,
     scalacOptions ++= Settings.scalacOptions,
     resolvers += Resolver.jcenterRepo,
     libraryDependencies ++= Settings.scalajsDependencies.value,
-    // yes, we want to package JS dependencies
-    packageJSDependencies / skip := false,
+
     // use Scala.js provided launcher code to start the client app
     scalaJSUseMainModuleInitializer := true,
     scalaJSStage := FullOptStage,
-    Compile / npmDependencies ++= Seq(
-      "ol" -> "8.1.0",
-      "proj4" -> "2.9.1",
-      "@types/proj4" -> "2.5.3",
-      "ol-ext" -> "4.0.11",
-      //"@siedlerchr/types-ol-ext" -> "3.2.4",
-      "jsts" -> "2.7.1",
-      "@types/jsts" -> "0.17.13",
-      "jquery" -> "3.4.1",
-      "@types/jquery" -> "3.5.6",
-      "popper.js" -> "1.16.1",
-      "bootstrap" -> "4.1.3",
-      "@types/bootstrap" -> "4.1.3",
-      "@fortawesome/fontawesome-free" -> "5.15.4",
-      "flatpickr" -> "4.6.3",
-      "monaco-editor" -> "0.34.0",
-      "quill" -> "1.3.7",
-      "@types/quill" -> "1.3.10",
-      "@fontsource/open-sans" -> "5.0.15",
-      "file-saver" -> "2.0.5",
-      "@types/file-saver" -> "2.0.1",
-      "js-md5" -> "0.7.3",
-      "@types/js-md5" -> "0.4.2",
-      "striptags" -> "3.2.0",
-      "toolcool-range-slider" -> "4.0.28",
-      "hotkeys-js" -> "3.10.0",
-      "crypto-browserify" -> "3.12.0",
-      "buffer" -> "6.0.3",
-      "stream-browserify" -> "3.0.0",
-      "choices.js" -> "11.1.0",
-      "autocompleter" -> "7.0.1",
-      "xlsx-js-style" -> "1.2.0",
-      "jspdf" -> "2.5.1",
-      "jspdf-autotable" -> "3.5.28",
-      "gridstack" -> "12.2.2",
-      "jspreadsheet-ce" -> "git://github.com/jspreadsheet/ce.git#2e7389f8f6a84d260603bbac06f00bb404e1ba49", //v5.0.0
-      "jsuites" -> "5.9.1",
-      "@electric-sql/pglite" -> "0.2.17",
-      "@electric-sql/pglite-repl" -> "0.2.17",
-      "compressorjs" -> "1.2.1",
-      "shapefile" -> "0.6.6",
-      "@types/shapefile" -> "0.6.4",
-    ),
-    stIgnore += "@fontsource/open-sans",
-    stIgnore += "redux",
-    stIgnore += "node",
-    stIgnore += "crypto-browserify",
-    stIgnore += "ol-ext",
-    stIgnore += "@fortawesome/fontawesome-free",
-    stIgnore += "stream-browserify",
-    stIgnore += "toolcool-range-slider",
-    stTypescriptVersion := "4.2.4",
-    stOutputPackage := "ch.wsl.typings",
-    // Use library mode for fastOptJS
-    //Compile / additionalNpmConfig := Map("sideEffects" -> JSON.bool(false)),
-    fastOptJS / webpackBundlingMode := BundlingMode.Application,
-    fastOptJS / webpackConfigFile := Some(baseDirectory.value / ".." / "dev.config.js"),
-    // Use application model mode for fullOptJS
-    fullOptJS / webpackBundlingMode := BundlingMode.Application,
-    fullOptJS / webpackConfigFile := Some(baseDirectory.value / ".." / "prod.config.js"),
-    Test / webpackConfigFile  := Some(baseDirectory.value / ".." / "test.config.js"),
-    Compile / npmDevDependencies ++= Seq(
-      "html-webpack-plugin" -> "5.5.0",
-      "webpack-merge" -> "5.8.0",
-      "style-loader" -> "3.3.1",
-      "css-loader" -> "6.7.1",
-      "mini-css-extract-plugin" -> "2.6.1",
-      "monaco-editor-webpack-plugin" -> "7.0.1",
-      "file-loader" -> "6.2.0",
-    ),
 
-    webpack / version := "5.89.0",
-    webpackCliVersion := "5.1.4",
-    installJsdom / version := "20.0.0",
+//    Compile / sourceGenerators += Def.task {
+//      generateScalaTypesTask.value
+//    },
+
+    Compile / unmanagedSourceDirectories += baseDirectory.value / "target" / "scala-2.13" / "src_scalablytypes" / "main",
+
+    generateScalaTypes := generateScalaTypesTask.value,
+
+    scalaJSLinkerConfig ~= (_.withModuleKind(ModuleKind.ESModule).withModuleSplitStyle(ModuleSplitStyle.FewestModules)),
+
 
     //To use jsdom headless browser uncomment the following lines
     Test / requireJsDomEnv := true,
@@ -244,12 +164,13 @@ lazy val client: Project = (project in file("client"))
       Tags.limit(Tags.Test,5) //browserstack limit
     ),
     localesFilter := LocalesFilter.Selection("en", "de", "fr", "it"),
-    publishTo := sonatypeCentralPublishToBundle.value
+    publishTo := sonatypeCentralPublishToBundle.value,
+    Compile / doc / sources := Seq()
+
   )
   .settings(publishSettings)
   .enablePlugins(
     ScalaJSPlugin,
-    ScalablyTypedConverterGenSourcePlugin,
     LocalesPlugin
   )
   .dependsOn(sharedJS)
@@ -348,15 +269,14 @@ lazy val box = (project in file("."))
 lazy val publishAll = taskKey[Unit]("Publish all modules")
 lazy val publishAllTask = {
   Def.sequential(
-    (client / clean),
     (server / clean),
     (serverCacheRedis / clean),
     (serverServices / clean),
     (codegen / clean),
-    (client / Compile / fullOptJS / webpack),
-    (client / Compile / fullOptJS),
     (codegen / Compile / compile),
     (sharedJVM / publishSigned),
+    (sharedJS / publishSigned),
+    (client / publishSigned),
     (codegen / publishSigned),
     (server / publishSigned),
     (serverCacheRedis / publishSigned),
@@ -368,8 +288,6 @@ lazy val publishAllTask = {
 lazy val publishAllLocal = taskKey[Unit]("Publish all modules")
 lazy val publishAllLocalTask = {
   Def.sequential(
-    (client / Compile / fullOptJS / webpack),
-    (codegen / Compile / compile),
     (sharedJVM / publishLocal),
     (codegen / publishLocal),
     (server / publishLocal),
@@ -397,3 +315,5 @@ lazy val dropBoxTask = Def.sequential(
   }
 )
 
+lazy val generateScalaTypes = taskKey[Unit]("generateScalaTypes")
+lazy val generateScalaTypesTask = BoxScalablyTypes.generateSJSFromTS(baseDirectory)

client/index.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite App</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script>
+      window.boxVersion = "dev"
+      window.boxUiModule = "prod"
+      window.boxFrontendUrl = "http://localhost:5173/"
+    </script>
+    <script type="module" src="/main.js"></script>
+  </body>
+</html>

client/libraries.css

@@ -0,0 +1,12 @@
+@import "bootstrap";
+
+@import "choices.js/src/styles/choices";
+
+@import "flatpickr/dist/flatpickr.min.css";
+@import "flatpickr/dist/themes/dark.css";
+
+@import "quill/dist/quill.snow.css";
+
+@import "ol/ol.css";
+
+@import "gridstack/dist/gridstack.min.css";

client/main.js

@@ -0,0 +1,12 @@
+import 'scalajs:main.js'
+import './libraries.css';
+import './style.scss'
+import * as bootstrap from 'bootstrap'
+import '@fortawesome/fontawesome-free/js/all.min.js'
+import '@fontsource/open-sans';
+import '@fontsource/open-sans/400.css';
+import '@fontsource/open-sans/600.css';
+import '@fontsource/open-sans/700.css';
+import '@fontsource/open-sans/400-italic.css';
+import '@fontsource/open-sans/600-italic.css';
+import '@fontsource/open-sans/700-italic.css';

client/package.json

@@ -0,0 +1,69 @@
+{
+  "name": "box-client",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "npm run dev:app & npm run dev:worker-build & npm run dev:worker-serve",
+    "dev:app": "vite --config vite.config.app.js",
+    "dev:worker-build": "VITE_BOX_VERSION=dev vite build --config vite.config.worker.js --watch",
+    "dev:worker-serve": "http-server ./dist/ui/workers -c-1 -p 5174 --cors --base-path /ui/workers -a 0.0.0.0",
+    "build:app": "vite build --config vite.config.app.js",
+    "build:worker": "vite build --config vite.config.worker.js",
+    "build": "npm run build:worker && npm run build:app",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@electric-sql/pglite": "0.4.2",
+    "@electric-sql/pglite-repl": "0.3.2",
+    "@fontsource/open-sans": "^5.0.15",
+    "@fortawesome/fontawesome-free": "5.15.4",
+    "@tailwindcss/vite": "^4.1.18",
+    "@types/bootstrap": "4.1.3",
+    "@types/file-saver": "2.0.1",
+    "@types/jquery": "3.5.6",
+    "@types/js-md5": "0.8.0",
+    "@types/jsts": "0.17.13",
+    "@types/proj4": "2.5.3",
+    "@types/quill": "1.3.10",
+    "@types/shapefile": "0.6.4",
+    "autocompleter": "7.0.1",
+    "bootstrap": "4.1.3",
+    "buffer": "6.0.3",
+    "choices.js": "11.1.0",
+    "compressorjs": "1.2.1",
+    "crypto-browserify": "3.12.0",
+    "file-saver": "2.0.5",
+    "flatpickr": "4.6.3",
+    "gridstack": "12.2.2",
+    "hotkeys-js": "3.10.0",
+    "is-blob": "3.0.0",
+    "jquery": "3.4.1",
+    "js-md5": "0.8.3",
+    "jspdf": "4.2.1",
+    "jspdf-autotable": "5.0.7",
+    "jspreadsheet-ce": "git://github.com/jspreadsheet/ce.git#2e7389f8f6a84d260603bbac06f00bb404e1ba49",
+    "jsts": "2.7.1",
+    "jsuites": "5.9.1",
+    "monaco-editor": "0.34.0",
+    "ol": "8.1.0",
+    "ol-ext": "4.0.11",
+    "popper.js": "1.16.1",
+    "proj4": "2.9.1",
+    "quill": "1.3.7",
+    "shapefile": "0.6.6",
+    "stream-browserify": "3.0.0",
+    "string-strip-html": "13.5.3",
+    "tailwindcss": "^4.1.18",
+    "toolcool-range-slider": "4.0.28",
+    "xlsx-js-style": "1.2.0"
+  },
+  "devDependencies": {
+    "@scala-js/vite-plugin-scalajs": "^1.1.0",
+    "http-server": "^14.1.1",
+    "sass-embedded": "^1.93.2",
+    "typescript": "^4.1.6",
+    "vite": "^7.1.9",
+    "vite-plugin-static-copy": "^4.0.0"
+  }
+}