Add frontend build

.github/workflows/action.yml

@@ -33,6 +33,11 @@ jobs:
           curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh -s -- --default-toolchain stable -y
           echo "$HOME/.cargo/bin" >> $GITHUB_PATH
 
+      - name: Install build dependencies - Bun
+        uses: oven-sh/setup-bun@v2
+        with:
+          bun-version: 1.1.22
+
       - name: Check style
         run: cargo fmt --check
 
@@ -42,8 +47,31 @@ jobs:
       - name: Build
         run: cargo build --verbose
 
+  build-frontend:
+    runs-on: ubuntu-22.04
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Bun
+        uses: oven-sh/setup-bun@v2
+        with:
+          bun-version: 1.1.22
+
+      - name: Install dependencies and build Bun project
+        run: |
+          cd ping-viewer-next-frontend
+          bun install --frozen-lockfile
+          bun run build
+
+      - name: Upload dist folder
+        uses: actions/[email protected]
+        with:
+          name: dist
+          path: ./ping-viewer-next-frontend/dist
+
   build:
-          needs: quick-tests
+          needs: [quick-tests, build-frontend]
           runs-on: ${{ matrix.os }}
           strategy:
             fail-fast: false
@@ -73,11 +101,18 @@ jobs:
             run: echo "${{ matrix.TARGET }}"
 
           - uses: actions/checkout@master
+
+          - name: Download frontend build
+            uses: actions/[email protected]
+            with:
+              name: dist
+              path: ./ping-viewer-next-frontend/dist
+
           - name: Build
             uses: houseabsolute/[email protected]
             with:
               target: ${{ matrix.TARGET }}
-              args: "--release"
+              args: "--release --features embed-frontend"
 
           - name: Rename
             run: cp target/${{ matrix.TARGET }}/release/${{ github.event.repository.name }}${{ matrix.EXTENSION }} ${{ github.event.repository.name }}-${{ matrix.TARGET }}${{ matrix.EXTENSION }}

Cargo.toml

@@ -51,3 +51,5 @@ path = "src/main.rs"
 [features]
 default = []
 desktop-app = ["tauri"]
+build-frontend = ["embed-frontend"]
+embed-frontend =[]

build.rs

@@ -1,6 +1,15 @@
 use vergen_gix::{BuildBuilder, CargoBuilder, DependencyKind, GixBuilder};
 
 fn main() -> Result<(), Box<dyn std::error::Error>> {
+    generate_build_details()?;
+
+    #[cfg(feature = "build-frontend")]
+    build_web();
+
+    Ok(())
+}
+
+fn generate_build_details() -> Result<(), Box<dyn std::error::Error>> {
     vergen_gix::Emitter::default()
         .add_instructions(&BuildBuilder::all_build()?)?
         .add_instructions(&GixBuilder::all_git()?)?
@@ -10,3 +19,33 @@ fn main() -> Result<(), Box<dyn std::error::Error>> {
         .emit()?;
     Ok(())
 }
+
+#[cfg(feature = "build-frontend")]
+fn build_web() {
+    use std::{path::Path, process::Command};
+
+    // Note that as we are not watching all files, sometimes we'd need to force this build
+    println!("cargo:rerun-if-changed=./ping-viewer-next-frontend/dist");
+
+    let frontend_dir = Path::new("./ping-viewer-next-frontend/");
+    frontend_dir
+        .try_exists()
+        .expect("Frontend directory does not exist");
+
+    Command::new("bun")
+        .args(["--version"])
+        .status()
+        .expect("Failed to build frontend, `bun` appears to be not installed.");
+
+    Command::new("bun")
+        .args(["install", "--frozen-lockfile"])
+        .current_dir(frontend_dir)
+        .status()
+        .expect("Bun install failed!");
+
+    Command::new("bun")
+        .args(["run", "build"])
+        .current_dir(frontend_dir)
+        .status()
+        .expect("Bun build failed!");
+}

ping-viewer-next-frontend/.browserslistrc

@@ -0,0 +1,4 @@
+> 1%
+last 2 versions
+not dead
+not ie 11

ping-viewer-next-frontend/.eslintrc-auto-import.json

@@ -0,0 +1,76 @@
+{
+  "globals": {
+    "Component": true,
+    "ComponentPublicInstance": true,
+    "ComputedRef": true,
+    "EffectScope": true,
+    "ExtractDefaultPropTypes": true,
+    "ExtractPropTypes": true,
+    "ExtractPublicPropTypes": true,
+    "InjectionKey": true,
+    "PropType": true,
+    "Ref": true,
+    "VNode": true,
+    "WritableComputedRef": true,
+    "computed": true,
+    "createApp": true,
+    "customRef": true,
+    "defineAsyncComponent": true,
+    "defineComponent": true,
+    "effectScope": true,
+    "getCurrentInstance": true,
+    "getCurrentScope": true,
+    "h": true,
+    "inject": true,
+    "isProxy": true,
+    "isReactive": true,
+    "isReadonly": true,
+    "isRef": true,
+    "markRaw": true,
+    "nextTick": true,
+    "onActivated": true,
+    "onBeforeMount": true,
+    "onBeforeRouteLeave": true,
+    "onBeforeRouteUpdate": true,
+    "onBeforeUnmount": true,
+    "onBeforeUpdate": true,
+    "onDeactivated": true,
+    "onErrorCaptured": true,
+    "onMounted": true,
+    "onRenderTracked": true,
+    "onRenderTriggered": true,
+    "onScopeDispose": true,
+    "onServerPrefetch": true,
+    "onUnmounted": true,
+    "onUpdated": true,
+    "onWatcherCleanup": true,
+    "provide": true,
+    "reactive": true,
+    "readonly": true,
+    "ref": true,
+    "resolveComponent": true,
+    "shallowReactive": true,
+    "shallowReadonly": true,
+    "shallowRef": true,
+    "toRaw": true,
+    "toRef": true,
+    "toRefs": true,
+    "toValue": true,
+    "triggerRef": true,
+    "unref": true,
+    "useAttrs": true,
+    "useCssModule": true,
+    "useCssVars": true,
+    "useId": true,
+    "useLink": true,
+    "useModel": true,
+    "useRoute": true,
+    "useRouter": true,
+    "useSlots": true,
+    "useTemplateRef": true,
+    "watch": true,
+    "watchEffect": true,
+    "watchPostEffect": true,
+    "watchSyncEffect": true
+  }
+}

ping-viewer-next-frontend/.eslintrc.js

@@ -0,0 +1,16 @@
+/**
+ * .eslint.js
+ *
+ * ESLint configuration file.
+ */
+
+module.exports = {
+	root: true,
+	env: {
+		node: true,
+	},
+	extends: ["vuetify", "./.eslintrc-auto-import.json"],
+	rules: {
+		"vue/multi-word-component-names": "off",
+	},
+};

ping-viewer-next-frontend/.gitignore

@@ -0,0 +1,5 @@
+node_modules
+/dist
+
+# Editor directories and files
+.vscode

ping-viewer-next-frontend/.vite/deps/_metadata.json

@@ -0,0 +1,8 @@
+{
+  "hash": "f30e6af8",
+  "configHash": "616d5c86",
+  "lockfileHash": "e3b0c442",
+  "browserHash": "b5f1b234",
+  "optimized": {},
+  "chunks": {}
+}

ping-viewer-next-frontend/.vite/deps/package.json

@@ -0,0 +1,3 @@
+{
+  "type": "module"
+}

ping-viewer-next-frontend/biome.json

@@ -0,0 +1,30 @@
+{
+	"$schema": "https://biomejs.dev/schemas/1.9.2/schema.json",
+	"vcs": {
+		"enabled": false,
+		"clientKind": "git",
+		"useIgnoreFile": false
+	},
+	"files": {
+		"ignoreUnknown": false,
+		"ignore": []
+	},
+	"formatter": {
+		"enabled": true,
+		"indentStyle": "tab"
+	},
+	"organizeImports": {
+		"enabled": true
+	},
+	"linter": {
+		"enabled": true,
+		"rules": {
+			"recommended": true
+		}
+	},
+	"javascript": {
+		"formatter": {
+			"quoteStyle": "double"
+		}
+	}
+}

ping-viewer-next-frontend/index.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Ping Viewer Next</title>
+  </head>
+
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.js"></script>
+  </body>
+</html>

ping-viewer-next-frontend/jsconfig.json

@@ -0,0 +1,14 @@
+{
+	"compilerOptions": {
+		"allowJs": true,
+		"target": "es5",
+		"module": "esnext",
+		"baseUrl": "./",
+		"moduleResolution": "bundler",
+		"paths": {
+			"@/*": ["src/*"],
+			"@components/*": ["src/components/*"]
+		},
+		"lib": ["esnext", "dom", "dom.iterable", "scripthost"]
+	}
+}