feat(frontend): add static SvelteKit tooling and CI

Author: kimit0310

.github/workflows/test.yaml

@@ -103,4 +103,39 @@ jobs:
       with:
         only-dev: true
     - run: |-
-        uv run deptry ./src
+        uv run deptry ./src
+
+  frontend:
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@v5
+    - name: Setup Node
+      uses: actions/setup-node@v5
+      with:
+        node-version: '22'
+        cache: npm
+        cache-dependency-path: frontend/package-lock.json
+    - name: Install frontend dependencies
+      working-directory: frontend
+      run: npm ci
+    - name: Check frontend types
+      working-directory: frontend
+      run: npm run check
+    - name: Check frontend formatting
+      working-directory: frontend
+      run: npm run format:check
+    - name: Lint frontend
+      working-directory: frontend
+      run: npm run lint
+    - name: Run frontend unit tests
+      working-directory: frontend
+      run: npm run test:unit -- --run
+    - name: Install Playwright browser
+      working-directory: frontend
+      run: npx playwright install --with-deps chromium
+    - name: Run frontend E2E tests
+      working-directory: frontend
+      run: npm run test:e2e
+    - name: Build frontend static assets
+      working-directory: frontend
+      run: npm run build

frontend/.gitignore

@@ -7,6 +7,8 @@ node_modules
 .wrangler
 /.svelte-kit
 /build
+/playwright-report
+/test-results
 
 # OS
 .DS_Store

frontend/.oxlintrc.json

@@ -0,0 +1,13 @@
+{
+  "$schema": "./node_modules/oxlint/configuration_schema.json",
+  "plugins": ["unicorn", "typescript", "oxc"],
+  "categories": {
+    "correctness": "error",
+    "suspicious": "warn",
+    "pedantic": "off",
+    "style": "off"
+  },
+  "rules": {
+    "unicorn/require-module-specifiers": "off"
+  }
+}

frontend/.prettierignore

@@ -0,0 +1,5 @@
+.svelte-kit
+node_modules
+playwright-report
+test-results
+../src/MoBI_View/web/static

frontend/.prettierrc

@@ -0,0 +1,11 @@
+{
+  "plugins": ["prettier-plugin-svelte"],
+  "overrides": [
+    {
+      "files": "*.svelte",
+      "options": {
+        "parser": "svelte"
+      }
+    }
+  ]
+}

frontend/.vscode/extensions.json

@@ -1,3 +1,3 @@
 {
-	"recommendations": ["svelte.svelte-vscode"]
+  "recommendations": ["svelte.svelte-vscode"]
 }

frontend/README.md

@@ -1,42 +1,38 @@
-# sv
+# MoBI-View Frontend
 
-Everything you need to build a Svelte project, powered by [`sv`](https://github.com/sveltejs/cli).
+SvelteKit frontend for the MoBI-View browser UI.
 
-## Creating a project
+The app is built as static HTML, JavaScript, and CSS with `@sveltejs/adapter-static`.
+Production assets are emitted directly to `../src/MoBI_View/web/static`, which is
+the directory served by the Python WebSocket/HTTP server.
 
-If you're seeing this, you've probably already done this step. Congrats!
+## Commands
 
 ```sh
-# create a new project
-npx sv create my-app
+npm run dev
+npm run check
+npm run format:check
+npm run test:unit -- --run
+npm run test:e2e
+npm run build
 ```
 
-To recreate this project with the same configuration:
+## Backend Contract
 
-```sh
-# recreate this project
-npx sv@0.15.2 create --template minimal --types ts --install npm frontend
-```
+During local development, the frontend expects the Python server to be available at
+`ws://localhost:8765`.
 
-## Developing
+The current backend message contract is:
 
-Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
+- Send discovery command: `{"command":"discover"}`
+- Receive discovery response: `{"type":"discover_result","streams":[...]}`
+- Receive broadcast frame: `{"streams":[{"stream_name":"...","data":[...],"channel_labels":[...]}]}`
 
-```sh
-npm run dev
-
-# or start the server and open the app in a new browser tab
-npm run dev -- --open
-```
-
-## Building
-
-To create a production version of your app:
+## Static Build
 
 ```sh
 npm run build
 ```
 
-You can preview the production build with `npm run preview`.
-
-> To deploy your app, you may need to install an [adapter](https://svelte.dev/docs/kit/adapters) for your target environment.
+After building, run `uv run mobi-view` from the repository root and open
+`http://localhost:8765` to view the static frontend served by Python.