Add: Ping1D widget

.github/workflows/action.yml

@@ -28,6 +28,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
 
@@ -37,8 +42,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
@@ -68,11 +96,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

@@ -44,3 +44,7 @@ path = "src/lib.rs"
 [[bin]]
 name = "ping-viewer-next"
 path = "src/main.rs"
+
+[features]
+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/.editorconfig

@@ -0,0 +1,5 @@
+[*.{js,jsx,ts,tsx,vue}]
+indent_style = space
+indent_size = 2
+trim_trailing_whitespace = true
+insert_final_newline = true

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,
+		"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,
+		"useLink": true,
+		"useRoute": true,
+		"useRouter": true,
+		"useSlots": true,
+		"watch": true,
+		"watchEffect": true,
+		"watchPostEffect": true,
+		"watchSyncEffect": true,
+		"onWatcherCleanup": true,
+		"useId": true,
+		"useModel": true,
+		"useTemplateRef": 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,22 @@
+.DS_Store
+node_modules
+/dist
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

ping-viewer-next-frontend/README.md

@@ -0,0 +1,79 @@
+# Vuetify (Default)
+
+This is the official scaffolding tool for Vuetify, designed to give you a head start in building your new Vuetify application. It sets up a base template with all the necessary configurations and standard directory structure, enabling you to begin development without the hassle of setting up the project from scratch.
+
+## ❗️ Important Links
+
+- 📄 [Docs](https://vuetifyjs.com/)
+- 🚨 [Issues](https://issues.vuetifyjs.com/)
+- 🏬 [Store](https://store.vuetifyjs.com/)
+- 🎮 [Playground](https://play.vuetifyjs.com/)
+- 💬 [Discord](https://community.vuetifyjs.com)
+
+## 💿 Install
+
+Set up your project using your preferred package manager. Use the corresponding command to install the dependencies:
+
+| Package Manager                                                | Command        |
+|---------------------------------------------------------------|----------------|
+| [yarn](https://yarnpkg.com/getting-started)                   | `yarn install` |
+| [npm](https://docs.npmjs.com/cli/v7/commands/npm-install)     | `npm install`  |
+| [pnpm](https://pnpm.io/installation)                          | `pnpm install` |
+| [bun](https://bun.sh/#getting-started)                        | `bun install`  |
+
+After completing the installation, your environment is ready for Vuetify development.
+
+## ✨ Features
+
+- 🖼️ **Optimized Front-End Stack**: Leverage the latest Vue 3 and Vuetify 3 for a modern, reactive UI development experience. [Vue 3](https://v3.vuejs.org/) | [Vuetify 3](https://vuetifyjs.com/en/)
+- 🗃️ **State Management**: Integrated with [Pinia](https://pinia.vuejs.org/), the intuitive, modular state management solution for Vue.
+- 🚦 **Routing and Layouts**: Utilizes Vue Router for SPA navigation and vite-plugin-vue-layouts for organizing Vue file layouts. [Vue Router](https://router.vuejs.org/) | [vite-plugin-vue-layouts](https://github.com/JohnCampionJr/vite-plugin-vue-layouts)
+- ⚡ **Next-Gen Tooling**: Powered by Vite, experience fast cold starts and instant HMR (Hot Module Replacement). [Vite](https://vitejs.dev/)
+- 🧩 **Automated Component Importing**: Streamline your workflow with unplugin-vue-components, automatically importing components as you use them. [unplugin-vue-components](https://github.com/antfu/unplugin-vue-components)
+
+These features are curated to provide a seamless development experience from setup to deployment, ensuring that your Vuetify application is both powerful and maintainable.
+
+## 💡 Usage
+
+This section covers how to start the development server and build your project for production.
+
+### Starting the Development Server
+
+To start the development server with hot-reload, run the following command. The server will be accessible at [http://localhost:3000](http://localhost:3000):
+
+```bash
+yarn dev
+```
+
+(Repeat for npm, pnpm, and bun with respective commands.)
+
+> Add NODE_OPTIONS='--no-warnings' to suppress the JSON import warnings that happen as part of the Vuetify import mapping. If you are on Node [v21.3.0](https://nodejs.org/en/blog/release/v21.3.0) or higher, you can change this to NODE_OPTIONS='--disable-warning=5401'. If you don't mind the warning, you can remove this from your package.json dev script.
+
+### Building for Production
+
+To build your project for production, use:
+
+```bash
+yarn build
+```
+
+(Repeat for npm, pnpm, and bun with respective commands.)
+
+Once the build process is completed, your application will be ready for deployment in a production environment.
+
+## 💪 Support Vuetify Development
+
+This project is built with [Vuetify](https://vuetifyjs.com/en/), a UI Library with a comprehensive collection of Vue components. Vuetify is an MIT licensed Open Source project that has been made possible due to the generous contributions by our [sponsors and backers](https://vuetifyjs.com/introduction/sponsors-and-backers/). If you are interested in supporting this project, please consider:
+
+- [Requesting Enterprise Support](https://support.vuetifyjs.com/)
+- [Sponsoring John on Github](https://github.com/users/johnleider/sponsorship)
+- [Sponsoring Kael on Github](https://github.com/users/kaelwd/sponsorship)
+- [Supporting the team on Open Collective](https://opencollective.com/vuetify)
+- [Becoming a sponsor on Patreon](https://www.patreon.com/vuetify)
+- [Becoming a subscriber on Tidelift](https://tidelift.com/subscription/npm/vuetify)
+- [Making a one-time donation with Paypal](https://paypal.me/vuetify)
+
+## 📑 License
+[MIT](http://opensource.org/licenses/MIT)
+
+Copyright (c) 2016-present Vuetify, LLC

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,16 @@
+<!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>Welcome to Vuetify 3</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,13 @@
+{
+	"compilerOptions": {
+		"allowJs": true,
+		"target": "es5",
+		"module": "esnext",
+		"baseUrl": "./",
+		"moduleResolution": "bundler",
+		"paths": {
+			"@/*": ["src/*"]
+		},
+		"lib": ["esnext", "dom", "dom.iterable", "scripthost"]
+	}
+}