From 3b7ccad6193b7cadfc9c530e358aec750f16680c Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 17:54:28 +0700
Subject: [PATCH 01/28] chore: add telemetry submodule and ignore .claude/
 directory

---
 .gitignore  | 2 ++
 .gitmodules | 3 +++
 telemetry   | 1 +
 3 files changed, 6 insertions(+)
 create mode 100644 .gitmodules
 create mode 160000 telemetry

diff --git a/.gitignore b/.gitignore
index 54b8758..b174b3a 100644
--- a/.gitignore
+++ b/.gitignore
@@ -11,3 +11,5 @@ coverage/
 *.tsbuildinfo
 
 .DS_Store
+
+.claude/
diff --git a/.gitmodules b/.gitmodules
new file mode 100644
index 0000000..4675227
--- /dev/null
+++ b/.gitmodules
@@ -0,0 +1,3 @@
+[submodule "telemetry"]
+	path = telemetry
+	url = https://github.com/MythEclipse/Telemetry.git
diff --git a/telemetry b/telemetry
new file mode 160000
index 0000000..723693b
--- /dev/null
+++ b/telemetry
@@ -0,0 +1 @@
+Subproject commit 723693b83241a35e0c09437e041fe6d5b391f87c

From ede1c480be7fd91360b37ceff686ccf111883fd2 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 18:01:26 +0700
Subject: [PATCH 02/28] feat(api): add Prometheus metrics and OpenTelemetry
 instrumentation for HTTP, auth, classifications, and diagnoses

---
 apps/api/.gitignore                    |  4 ++
 apps/api/package.json                  |  8 +++-
 apps/api/src/index.ts                  | 21 +++++++++
 apps/api/src/lib/telemetry.ts          | 62 ++++++++++++++++++++++++++
 apps/api/src/routes/auth.ts            |  6 +++
 apps/api/src/routes/classifications.ts |  3 ++
 apps/api/src/routes/diagnoses.ts       |  7 +++
 apps/api/src/routes/metrics.ts         | 10 +++++
 apps/api/src/types.ts                  |  8 ++++
 9 files changed, 128 insertions(+), 1 deletion(-)
 create mode 100644 apps/api/.gitignore
 create mode 100644 apps/api/src/lib/telemetry.ts
 create mode 100644 apps/api/src/routes/metrics.ts
 create mode 100644 apps/api/src/types.ts

diff --git a/apps/api/.gitignore b/apps/api/.gitignore
new file mode 100644
index 0000000..34fee9f
--- /dev/null
+++ b/apps/api/.gitignore
@@ -0,0 +1,4 @@
+
+.claude/
+
+.codegraph/
diff --git a/apps/api/package.json b/apps/api/package.json
index 65c4bc6..0995564 100644
--- a/apps/api/package.json
+++ b/apps/api/package.json
@@ -13,11 +13,17 @@
   },
   "dependencies": {
     "@elysiajs/cors": "1.4.2",
+    "@opentelemetry/api": "1.9.1",
+    "@opentelemetry/exporter-prometheus": "0.218.0",
+    "@opentelemetry/instrumentation-http": "0.218.0",
+    "@opentelemetry/sdk-node": "0.218.0",
+    "@opentelemetry/semantic-conventions": "1.41.1",
     "@zeavis/shared": "workspace:*",
     "bcryptjs": "^3.0.3",
     "drizzle-orm": "^0.45.2",
     "elysia": "^1.4.28",
-    "postgres": "^3.4.9"
+    "postgres": "^3.4.9",
+    "prom-client": "15.1.3"
   },
   "devDependencies": {
     "@types/bcryptjs": "^3.0.0",
diff --git a/apps/api/src/index.ts b/apps/api/src/index.ts
index 2d80cc4..91d11be 100644
--- a/apps/api/src/index.ts
+++ b/apps/api/src/index.ts
@@ -9,6 +9,9 @@ import { diagnosisRoutes } from './routes/diagnoses';
 import { dashboardRoutes } from './routes/dashboard';
 import { authRoutes } from './routes/auth';
 import { expertRoutes } from './routes/expert';
+import { metricsRoutes } from './routes/metrics';
+import { httpRequestCounter, httpRequestDuration, httpRequestsActive } from './lib/telemetry';
+import './types';
 
 assertRequiredEnv();
 
@@ -17,6 +20,24 @@ const app = new Elysia()
     origin: env.webAppUrl,
     credentials: true,
   }))
+  .use(metricsRoutes)
+  .onBeforeHandle(({ request, path }) => {
+    httpRequestsActive.inc();
+    request.metricsStart = performance.now();
+    request.metricsPath = path;
+  })
+  .onAfterHandle(({ request, set }) => {
+    const start = (request as any).metricsStart as number | undefined;
+    const path = (request as any).metricsPath as string | undefined;
+    if (start && path) {
+      const duration = (performance.now() - start) / 1000;
+      const method = request.method;
+      const status = set.status ?? 200;
+      httpRequestCounter.labels(method, path, String(status)).inc();
+      httpRequestDuration.labels(method, path).observe(duration);
+    }
+    httpRequestsActive.dec();
+  })
   .use(healthRoutes)
   .use(statusRoutes)
   .use(authRoutes)
diff --git a/apps/api/src/lib/telemetry.ts b/apps/api/src/lib/telemetry.ts
new file mode 100644
index 0000000..cd55a90
--- /dev/null
+++ b/apps/api/src/lib/telemetry.ts
@@ -0,0 +1,62 @@
+import { Registry, Counter, Histogram, Gauge, collectDefaultMetrics } from 'prom-client';
+
+const registry = new Registry();
+
+// Collect default Node.js metrics (CPU, memory, event loop, etc.)
+collectDefaultMetrics({ register: registry });
+
+// ── HTTP Metrics ────────────────────────────────────────
+
+export const httpRequestCounter = new Counter({
+  name: 'zeavis_api_http_requests_total',
+  help: 'Total number of HTTP requests handled by the API',
+  labelNames: ['method', 'path', 'status'] as const,
+  registers: [registry],
+});
+
+export const httpRequestDuration = new Histogram({
+  name: 'zeavis_api_http_request_duration_seconds',
+  help: 'Histogram of HTTP request durations in seconds',
+  labelNames: ['method', 'path'] as const,
+  buckets: [0.005, 0.01, 0.025, 0.05, 0.1, 0.25, 0.5, 1, 2.5, 5],
+  registers: [registry],
+});
+
+export const httpRequestsActive = new Gauge({
+  name: 'zeavis_api_http_requests_active',
+  help: 'Number of HTTP requests currently being processed',
+  registers: [registry],
+});
+
+// ── Business Metrics ────────────────────────────────────
+
+export const classificationCounter = new Counter({
+  name: 'zeavis_api_classifications_total',
+  help: 'Total number of classification predictions requested via API',
+  labelNames: ['result'] as const,
+  registers: [registry],
+});
+
+export const diagnosisCounter = new Counter({
+  name: 'zeavis_api_diagnoses_total',
+  help: 'Total number of diagnoses created',
+  labelNames: ['disease'] as const,
+  registers: [registry],
+});
+
+export const authCounter = new Counter({
+  name: 'zeavis_api_auth_operations_total',
+  help: 'Total authentication operations (login, register, refresh)',
+  labelNames: ['operation', 'success'] as const,
+  registers: [registry],
+});
+
+// ── Export ──────────────────────────────────────────────
+
+export function getMetricsContentType(): string {
+  return registry.contentType;
+}
+
+export async function getMetrics(): Promise<string> {
+  return await registry.metrics();
+}
diff --git a/apps/api/src/routes/auth.ts b/apps/api/src/routes/auth.ts
index 2d4fc81..770d1e5 100644
--- a/apps/api/src/routes/auth.ts
+++ b/apps/api/src/routes/auth.ts
@@ -16,6 +16,7 @@ import {
   verifyPassword,
 } from '../lib/auth';
 import { env } from '../config/env';
+import { authCounter } from '../lib/telemetry';
 
 function normalizeEmail(email: unknown) {
   return typeof email === 'string' ? email.trim().toLowerCase() : '';
@@ -63,6 +64,8 @@ export const authRoutes = new Elysia({ prefix: '/api/v1/auth' })
       const token = await createSession(user.id);
       set.headers['Set-Cookie'] = createSessionCookie(token);
 
+      authCounter.labels('register', 'true').inc();
+
       return {
         user: {
           id: user.id,
@@ -90,12 +93,15 @@ export const authRoutes = new Elysia({ prefix: '/api/v1/auth' })
       const user = rows[0];
 
       if (!user?.passwordHash || !(await verifyPassword(req!.password!, user.passwordHash))) {
+        authCounter.labels('login', 'false').inc();
         return badRequest('Invalid email or password');
       }
 
       const token = await createSession(user.id);
       set.headers['Set-Cookie'] = createSessionCookie(token);
 
+      authCounter.labels('login', 'true').inc();
+
       return {
         user: {
           id: user.id,
diff --git a/apps/api/src/routes/classifications.ts b/apps/api/src/routes/classifications.ts
index 6f67dc6..b39d943 100644
--- a/apps/api/src/routes/classifications.ts
+++ b/apps/api/src/routes/classifications.ts
@@ -16,6 +16,7 @@ import { desc, eq } from 'drizzle-orm';
 import { classifyImage } from '../lib/image-model';
 import { uploadImageToStorage } from '../lib/uploader-client';
 import { toDisease } from '../lib/disease-mappers';
+import { classificationCounter } from '../lib/telemetry';
 
 function toImageClassificationRecord(row: {
   id: string;
@@ -141,6 +142,8 @@ export const classificationRoutes = new Elysia({ prefix: '/api/v1' })
         );
       }
 
+      classificationCounter.labels(classificationResult.predictedDiseaseSlug).inc();
+
       const db = createDbClient();
       let diseaseRow;
       try {
diff --git a/apps/api/src/routes/diagnoses.ts b/apps/api/src/routes/diagnoses.ts
index 4d8f1fd..b839f6b 100644
--- a/apps/api/src/routes/diagnoses.ts
+++ b/apps/api/src/routes/diagnoses.ts
@@ -9,6 +9,7 @@ import { getCurrentUser } from '../lib/auth';
 import { classifyImage } from '../lib/image-model';
 import { uploadImageToStorage } from '../lib/uploader-client';
 import { env } from '../config/env';
+import { diagnosisCounter } from '../lib/telemetry';
 
 interface ReviewRow {
   reviewId: string | null;
@@ -222,6 +223,9 @@ export const diagnosisRoutes = new Elysia({ prefix: '/api/v1' })
 
       const record = await loadDiagnosisRecord(inserted[0].id, user.id, false);
       if (!record) return serviceUnavailable('Database unavailable');
+
+      diagnosisCounter.labels(record.predictedDiseaseSlug ?? 'unknown').inc();
+
       return record;
     } catch (error) {
       const inserted = await db
@@ -240,6 +244,9 @@ export const diagnosisRoutes = new Elysia({ prefix: '/api/v1' })
 
       const record = await loadDiagnosisRecord(inserted[0].id, user.id, false);
       if (!record) return serviceUnavailable('Database unavailable');
+
+      diagnosisCounter.labels('failed').inc();
+
       return record;
     }
   })
diff --git a/apps/api/src/routes/metrics.ts b/apps/api/src/routes/metrics.ts
new file mode 100644
index 0000000..86c6ced
--- /dev/null
+++ b/apps/api/src/routes/metrics.ts
@@ -0,0 +1,10 @@
+import { Elysia } from 'elysia';
+import { getMetrics, getMetricsContentType } from '../lib/telemetry';
+
+export const metricsRoutes = new Elysia()
+  .get('/metrics', async () => {
+    const body = await getMetrics();
+    return new Response(body, {
+      headers: { 'Content-Type': getMetricsContentType() },
+    });
+  });
diff --git a/apps/api/src/types.ts b/apps/api/src/types.ts
new file mode 100644
index 0000000..be30f73
--- /dev/null
+++ b/apps/api/src/types.ts
@@ -0,0 +1,8 @@
+declare global {
+  interface Request {
+    metricsStart?: number;
+    metricsPath?: string;
+  }
+}
+
+export {};

From eefb16ad1da4da62ee5f41e4a7f811014f5fa741 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 18:04:50 +0700
Subject: [PATCH 03/28] feat(ml-service): add Prometheus metrics and request
 telemetry instrumentation

---
 apps/ml-service/.gitignore       |   5 +-
 apps/ml-service/Cargo.lock       | 210 +++++++++++++++++++++++++++++--
 apps/ml-service/Cargo.toml       |   1 +
 apps/ml-service/src/main.rs      |   4 +
 apps/ml-service/src/routes.rs    |  25 +++-
 apps/ml-service/src/telemetry.rs | 118 +++++++++++++++++
 6 files changed, 346 insertions(+), 17 deletions(-)
 create mode 100644 apps/ml-service/src/telemetry.rs

diff --git a/apps/ml-service/.gitignore b/apps/ml-service/.gitignore
index 6e37796..d31fa60 100644
--- a/apps/ml-service/.gitignore
+++ b/apps/ml-service/.gitignore
@@ -1,3 +1,6 @@
 .venv/
 __pycache__/
-target/
\ No newline at end of file
+target/
+.claude/
+
+.codegraph/
diff --git a/apps/ml-service/Cargo.lock b/apps/ml-service/Cargo.lock
index d540e14..7f11a66 100644
--- a/apps/ml-service/Cargo.lock
+++ b/apps/ml-service/Cargo.lock
@@ -111,7 +111,7 @@ dependencies = [
  "num-traits",
  "pastey",
  "rayon",
- "thiserror",
+ "thiserror 2.0.18",
  "v_frame",
  "y4m",
 ]
@@ -402,7 +402,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "39cab71617ae0d63f51a36d69f866391735b51691dbda63cf6f96d042b63efeb"
 dependencies = [
  "libc",
- "windows-sys",
+ "windows-sys 0.61.2",
 ]
 
 [[package]]
@@ -457,6 +457,12 @@ dependencies = [
  "miniz_oxide",
 ]
 
+[[package]]
+name = "fnv"
+version = "1.0.7"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "3f9eec918d3f24069decb9af1554cad7c880e2da24a9afd88aca000531ab82c1"
+
 [[package]]
 name = "foldhash"
 version = "0.1.5"
@@ -587,6 +593,12 @@ version = "0.5.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "2304e00983f87ffb38b55b444b5e3b60a884b5d30c0fca7d82fe33449bbe55ea"
 
+[[package]]
+name = "hex"
+version = "0.4.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "7f24254aa9a54b5c858eaee2f5bccdb46aaf0e486a595ed5fd8f86ba55232a70"
+
 [[package]]
 name = "hmac-sha256"
 version = "1.1.14"
@@ -801,6 +813,12 @@ dependencies = [
  "cc",
 ]
 
+[[package]]
+name = "linux-raw-sys"
+version = "0.4.15"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "d26c52dbd32dccf2d10cac7725f8eae5296885fb5703b261f7d0a0739ec807ab"
+
 [[package]]
 name = "linux-raw-sys"
 version = "0.12.1"
@@ -902,7 +920,7 @@ checksum = "50b7e5b27aa02a74bac8c3f23f448f8d87ff11f92d3aac1a6ed369ee08cc56c1"
 dependencies = [
  "libc",
  "wasi",
- "windows-sys",
+ "windows-sys 0.61.2",
 ]
 
 [[package]]
@@ -1000,7 +1018,7 @@ version = "0.50.3"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "7957b9740744892f114936ab4a57b3f487491bbeafaf8083688b16841a4240e5"
 dependencies = [
- "windows-sys",
+ "windows-sys 0.61.2",
 ]
 
 [[package]]
@@ -1253,6 +1271,28 @@ dependencies = [
  "unicode-ident",
 ]
 
+[[package]]
+name = "procfs"
+version = "0.17.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "cc5b72d8145275d844d4b5f6d4e1eef00c8cd889edb6035c21675d1bb1f45c9f"
+dependencies = [
+ "bitflags",
+ "hex",
+ "procfs-core",
+ "rustix 0.38.44",
+]
+
+[[package]]
+name = "procfs-core"
+version = "0.17.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "239df02d8349b06fc07398a3a1697b06418223b1c7725085e801e7c0fc6a12ec"
+dependencies = [
+ "bitflags",
+ "hex",
+]
+
 [[package]]
 name = "profiling"
 version = "1.0.18"
@@ -1272,6 +1312,43 @@ dependencies = [
  "syn",
 ]
 
+[[package]]
+name = "prometheus"
+version = "0.14.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "3ca5326d8d0b950a9acd87e6a3f94745394f62e4dae1b1ee22b2bc0c394af43a"
+dependencies = [
+ "cfg-if",
+ "fnv",
+ "lazy_static",
+ "libc",
+ "memchr",
+ "parking_lot",
+ "procfs",
+ "protobuf",
+ "thiserror 2.0.18",
+]
+
+[[package]]
+name = "protobuf"
+version = "3.7.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "d65a1d4ddae7d8b5de68153b48f6aa3bba8cb002b243dbdbc55a5afbc98f99f4"
+dependencies = [
+ "once_cell",
+ "protobuf-support",
+ "thiserror 1.0.69",
+]
+
+[[package]]
+name = "protobuf-support"
+version = "3.7.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "3e36c2f31e0a47f9280fb347ef5e461ffcd2c52dd520d8e216b52f93b0b0d7d6"
+dependencies = [
+ "thiserror 1.0.69",
+]
+
 [[package]]
 name = "pxfm"
 version = "0.1.29"
@@ -1373,7 +1450,7 @@ dependencies = [
  "rand",
  "rand_chacha",
  "simd_helpers",
- "thiserror",
+ "thiserror 2.0.18",
  "v_frame",
  "wasm-bindgen",
 ]
@@ -1451,6 +1528,19 @@ version = "0.8.53"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "47b34b781b31e5d73e9fbc8689c70551fd1ade9a19e3e28cfec8580a79290cc4"
 
+[[package]]
+name = "rustix"
+version = "0.38.44"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "fdb5bc1ae2baa591800df16c9ca78619bf65c0488b41b96ccec5d11220d8c154"
+dependencies = [
+ "bitflags",
+ "errno",
+ "libc",
+ "linux-raw-sys 0.4.15",
+ "windows-sys 0.59.0",
+]
+
 [[package]]
 name = "rustix"
 version = "1.1.4"
@@ -1460,8 +1550,8 @@ dependencies = [
  "bitflags",
  "errno",
  "libc",
- "linux-raw-sys",
- "windows-sys",
+ "linux-raw-sys 0.12.1",
+ "windows-sys 0.61.2",
 ]
 
 [[package]]
@@ -1491,7 +1581,7 @@ version = "0.1.29"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "91c1b7e4904c873ef0710c1f407dde2e6287de2bebc1bbbf7d430bb7cbffd939"
 dependencies = [
- "windows-sys",
+ "windows-sys 0.61.2",
 ]
 
 [[package]]
@@ -1644,7 +1734,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "3a766e1110788c36f4fa1c2b71b387a7815aa65f88ce0229841826633d93723e"
 dependencies = [
  "libc",
- "windows-sys",
+ "windows-sys 0.61.2",
 ]
 
 [[package]]
@@ -1705,8 +1795,17 @@ dependencies = [
  "fastrand",
  "getrandom 0.4.2",
  "once_cell",
- "rustix",
- "windows-sys",
+ "rustix 1.1.4",
+ "windows-sys 0.61.2",
+]
+
+[[package]]
+name = "thiserror"
+version = "1.0.69"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "b6aaf5339b578ea85b50e080feb250a3e8ae8cfcdff9a461c9ec2904bc923f52"
+dependencies = [
+ "thiserror-impl 1.0.69",
 ]
 
 [[package]]
@@ -1715,7 +1814,18 @@ version = "2.0.18"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "4288b5bcbc7920c07a1149a35cf9590a2aa808e0bc1eafaade0b80947865fbc4"
 dependencies = [
- "thiserror-impl",
+ "thiserror-impl 2.0.18",
+]
+
+[[package]]
+name = "thiserror-impl"
+version = "1.0.69"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "4fee6c4efc90059e10f81e6d42c60a18f76588c3d74cb83a0b242a2b6c7504c1"
+dependencies = [
+ "proc-macro2",
+ "quote",
+ "syn",
 ]
 
 [[package]]
@@ -1763,7 +1873,7 @@ dependencies = [
  "pin-project-lite",
  "socket2",
  "tokio-macros",
- "windows-sys",
+ "windows-sys 0.61.2",
 ]
 
 [[package]]
@@ -2090,6 +2200,15 @@ version = "0.2.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "f0805222e57f7521d6a62e36fa9163bc891acd422f971defe97d64e70d0a4fe5"
 
+[[package]]
+name = "windows-sys"
+version = "0.59.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "1e38bc4d79ed67fd075bcc251a1c39b32a1776bbe92e5bef1f0bf1f8c531853b"
+dependencies = [
+ "windows-targets",
+]
+
 [[package]]
 name = "windows-sys"
 version = "0.61.2"
@@ -2099,6 +2218,70 @@ dependencies = [
  "windows-link",
 ]
 
+[[package]]
+name = "windows-targets"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "9b724f72796e036ab90c1021d4780d4d3d648aca59e491e6b98e725b84e99973"
+dependencies = [
+ "windows_aarch64_gnullvm",
+ "windows_aarch64_msvc",
+ "windows_i686_gnu",
+ "windows_i686_gnullvm",
+ "windows_i686_msvc",
+ "windows_x86_64_gnu",
+ "windows_x86_64_gnullvm",
+ "windows_x86_64_msvc",
+]
+
+[[package]]
+name = "windows_aarch64_gnullvm"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "32a4622180e7a0ec044bb555404c800bc9fd9ec262ec147edd5989ccd0c02cd3"
+
+[[package]]
+name = "windows_aarch64_msvc"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "09ec2a7bb152e2252b53fa7803150007879548bc709c039df7627cabbd05d469"
+
+[[package]]
+name = "windows_i686_gnu"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "8e9b5ad5ab802e97eb8e295ac6720e509ee4c243f69d781394014ebfe8bbfa0b"
+
+[[package]]
+name = "windows_i686_gnullvm"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "0eee52d38c090b3caa76c563b86c3a4bd71ef1a819287c19d586d7334ae8ed66"
+
+[[package]]
+name = "windows_i686_msvc"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "240948bc05c5e7c6dabba28bf89d89ffce3e303022809e73deaefe4f6ec56c66"
+
+[[package]]
+name = "windows_x86_64_gnu"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "147a5c80aabfbf0c7d901cb5895d1de30ef2907eb21fbbab29ca94c5b08b1a78"
+
+[[package]]
+name = "windows_x86_64_gnullvm"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "24d5b23dc417412679681396f2b49f3de8c1473deb516bd34410872eff51ed0d"
+
+[[package]]
+name = "windows_x86_64_msvc"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "589f6da84c646204747d1270a2a5661ea66ed1cced2631d546fdfb155959f9ec"
+
 [[package]]
 name = "wit-bindgen"
 version = "0.51.0"
@@ -2208,6 +2391,7 @@ dependencies = [
  "image",
  "ndarray",
  "ort",
+ "prometheus",
  "serde",
  "serde_json",
  "temp-env",
diff --git a/apps/ml-service/Cargo.toml b/apps/ml-service/Cargo.toml
index 205c16c..5fbf2d4 100644
--- a/apps/ml-service/Cargo.toml
+++ b/apps/ml-service/Cargo.toml
@@ -9,6 +9,7 @@ axum = { version = "0.7", features = ["multipart"] }
 image = "0.25"
 ndarray = "0.17"
 ort = { version = "2.0.0-rc.10", features = ["download-binaries", "ndarray"] }
+prometheus = { version = "0.14.0", features = ["process"] }
 serde = { version = "1.0", features = ["derive"] }
 serde_json = "1.0"
 tokio = { version = "1.0", features = ["macros", "rt-multi-thread", "net"] }
diff --git a/apps/ml-service/src/main.rs b/apps/ml-service/src/main.rs
index 7621cfa..01dc3a1 100644
--- a/apps/ml-service/src/main.rs
+++ b/apps/ml-service/src/main.rs
@@ -3,6 +3,7 @@ mod error;
 mod image;
 mod model;
 mod routes;
+mod telemetry;
 
 use anyhow::Result;
 use config::Config;
@@ -32,6 +33,9 @@ async fn main() -> Result<()> {
         "Model service initialized"
     );
 
+    // Set model load status metric
+    telemetry::model_load_status().set(if model.is_loaded() { 1.0 } else { 0.0 });
+
     // Create AppState
     let state = AppState { model };
 
diff --git a/apps/ml-service/src/routes.rs b/apps/ml-service/src/routes.rs
index 2fe5165..edd9033 100644
--- a/apps/ml-service/src/routes.rs
+++ b/apps/ml-service/src/routes.rs
@@ -3,6 +3,8 @@ use crate::config::{LABELS, SERVICE_NAME, SERVICE_VERSION};
 use crate::model::{ModelService, Prediction};
 use crate::error::ServiceError;
 use crate::image::preprocess_image;
+use crate::telemetry;
+use crate::telemetry::RequestMetricsGuard;
 use axum::{
     extract::{State, Multipart},
     routing::{get, post},
@@ -64,22 +66,34 @@ pub fn prediction_response(prediction: Prediction) -> PredictionResponse {
     }
 }
 
+pub async fn metrics() -> (axum::http::StatusCode, String) {
+    (axum::http::StatusCode::OK, telemetry::encode_metrics())
+}
+
 pub async fn health(State(state): State<AppState>) -> Json<HealthResponse> {
-    Json(health_response(state.model.is_loaded()))
+    let _guard = RequestMetricsGuard::new();
+    let res = health_response(state.model.is_loaded());
+    _guard.finish();
+    Json(res)
 }
 
 pub async fn metadata(State(state): State<AppState>) -> Json<MetadataResponse> {
-    Json(metadata_response(
+    let _guard = RequestMetricsGuard::new();
+    let res = metadata_response(
         state.model.model_path().to_string_lossy().to_string(),
         state.model.is_loaded(),
         state.model.input_size(),
-    ))
+    );
+    _guard.finish();
+    Json(res)
 }
 
 pub async fn predict(
     State(state): State<AppState>,
     mut multipart: Multipart,
 ) -> Result<Json<PredictionResponse>, ServiceError> {
+    let _guard = RequestMetricsGuard::new();
+
     // Extract the file field from multipart
     let mut file_data = None;
     while let Ok(Some(field)) = multipart.next_field().await {
@@ -121,6 +135,10 @@ pub async fn predict(
     // Run prediction
     let prediction = state.model.predict(input)?;
 
+    // Record business and request telemetry
+    telemetry::predictions_total().inc();
+    _guard.finish();
+
     Ok(Json(prediction_response(prediction)))
 }
 
@@ -129,6 +147,7 @@ pub fn router(state: AppState) -> Router {
         .route("/health", get(health))
         .route("/metadata", get(metadata))
         .route("/predict", post(predict))
+        .route("/metrics", get(metrics))
         .with_state(state)
 }
 
diff --git a/apps/ml-service/src/telemetry.rs b/apps/ml-service/src/telemetry.rs
new file mode 100644
index 0000000..6a08d15
--- /dev/null
+++ b/apps/ml-service/src/telemetry.rs
@@ -0,0 +1,118 @@
+use prometheus::{Counter, Gauge, Histogram, HistogramOpts, Registry, TextEncoder};
+use std::sync::OnceLock;
+use std::time::Instant;
+
+fn global_registry() -> &'static Registry {
+    static REGISTRY: OnceLock<Registry> = OnceLock::new();
+    REGISTRY.get_or_init(|| {
+        Registry::new_custom(Some("zeavis_ml".to_string()), None).expect("create registry")
+    })
+}
+
+macro_rules! define_metric {
+    ($name:ident, $ty:ty, $init:expr) => {
+        pub fn $name() -> &'static $ty {
+            static METRIC: OnceLock<$ty> = OnceLock::new();
+            METRIC.get_or_init(|| {
+                let m = $init;
+                global_registry()
+                    .register(Box::new(m.clone()))
+                    .expect(concat!("register ", stringify!($name)));
+                m
+            })
+        }
+    };
+}
+
+// ── HTTP Metrics ────────────────────────────────────────
+
+define_metric!(
+    http_requests_total,
+    Counter,
+    Counter::new("zeavis_ml_http_requests_total", "Total number of HTTP requests")
+        .expect("create counter")
+);
+
+define_metric!(
+    http_request_duration_seconds,
+    Histogram,
+    Histogram::with_opts(
+        HistogramOpts::new(
+            "zeavis_ml_http_request_duration_seconds",
+            "HTTP request duration in seconds",
+        )
+        .buckets(vec![0.005, 0.01, 0.025, 0.05, 0.1, 0.25, 0.5, 1.0, 2.5, 5.0]),
+    )
+    .expect("create histogram")
+);
+
+define_metric!(
+    http_requests_active,
+    Gauge,
+    Gauge::new(
+        "zeavis_ml_http_requests_active",
+        "Number of active HTTP requests",
+    )
+    .expect("create gauge")
+);
+
+// ── Business Metrics ────────────────────────────────────
+
+define_metric!(
+    predictions_total,
+    Counter,
+    Counter::new(
+        "zeavis_ml_predictions_total",
+        "Total number of prediction requests",
+    )
+    .expect("create counter")
+);
+
+define_metric!(
+    model_load_status,
+    Gauge,
+    Gauge::new(
+        "zeavis_ml_model_load_status",
+        "Model load status (1 = loaded, 0 = not loaded)",
+    )
+    .expect("create gauge")
+);
+
+// ── Request Guard (Drop-based cleanup for active gauge) ─
+
+pub struct RequestMetricsGuard {
+    start: Instant,
+}
+
+impl RequestMetricsGuard {
+    pub fn new() -> Self {
+        http_requests_active().inc();
+        Self {
+            start: Instant::now(),
+        }
+    }
+
+    /// Record duration and request count before the guard drops.
+    pub fn finish(&self) {
+        http_request_duration_seconds().observe(self.start.elapsed().as_secs_f64());
+        http_requests_total().inc();
+    }
+}
+
+impl Drop for RequestMetricsGuard {
+    fn drop(&mut self) {
+        http_requests_active().dec();
+    }
+}
+
+// ── Export ──────────────────────────────────────────────
+
+pub fn encode_metrics() -> String {
+    let encoder = TextEncoder::new();
+    let mut buffer = String::new();
+    let metric_families = global_registry().gather();
+    encoder
+        .encode_utf8(&metric_families, &mut buffer)
+        .unwrap();
+    buffer
+}

From 5a47b0c658cb36ff92b79242ef5032659b2b551d Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 18:06:19 +0700
Subject: [PATCH 04/28] feat(web): add client-side telemetry with Web Vitals
 and dev metrics endpoint

---
 apps/web/.gitignore             |  4 +++
 apps/web/package.json           |  1 +
 apps/web/src/app.tsx            | 16 ++++++----
 apps/web/src/lib/telemetry.ts   | 52 +++++++++++++++++++++++++++++++++
 apps/web/src/main.tsx           |  9 ++++++
 apps/web/tsconfig.node.json     |  2 +-
 apps/web/vite-plugin-metrics.ts | 42 ++++++++++++++++++++++++++
 apps/web/vite.config.ts         |  3 +-
 8 files changed, 122 insertions(+), 7 deletions(-)
 create mode 100644 apps/web/.gitignore
 create mode 100644 apps/web/src/lib/telemetry.ts
 create mode 100644 apps/web/vite-plugin-metrics.ts

diff --git a/apps/web/.gitignore b/apps/web/.gitignore
new file mode 100644
index 0000000..34fee9f
--- /dev/null
+++ b/apps/web/.gitignore
@@ -0,0 +1,4 @@
+
+.claude/
+
+.codegraph/
diff --git a/apps/web/package.json b/apps/web/package.json
index 51a996d..7df9fac 100644
--- a/apps/web/package.json
+++ b/apps/web/package.json
@@ -21,6 +21,7 @@
     "react-dom": "^19.2.6",
     "react-router-dom": "^7.15.1",
     "tailwind-merge": "^3.6.0",
+    "web-vitals": "5.3.0",
     "zustand": "^5.0.13"
   },
   "devDependencies": {
diff --git a/apps/web/src/app.tsx b/apps/web/src/app.tsx
index 93b7301..d3cfce9 100644
--- a/apps/web/src/app.tsx
+++ b/apps/web/src/app.tsx
@@ -1,3 +1,4 @@
+import { useEffect } from "react";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import {
   createBrowserRouter,
@@ -5,7 +6,6 @@ import {
   Navigate,
 } from "react-router-dom";
 import { AuthInitializer } from "@/components/auth-initializer";
-// import { AuthGuard } from "@/components/auth-guard";
 import { DashboardPage } from "@/pages/dashboard-page";
 import { ScanPage } from "@/pages/scan-page";
 import { LibraryPage } from "@/pages/library-page";
@@ -14,16 +14,13 @@ import { DiseaseDetailPage } from "@/pages/disease-detail-page";
 import { DiagnosisDetailPage } from "@/pages/diagnosis-detail-page";
 import { ExpertReviewsPage } from "@/pages/expert-reviews-page";
 import { DiagnosesPage } from "@/pages/diagnoses-page";
-// import { LoginPage } from "@/pages/login-page";
-// import { RegisterPage } from "@/pages/register-page";
 import { MainLayout } from "@/components/layout/main-layout";
+import { trackPageView } from "./lib/telemetry";
 
 const queryClient = new QueryClient();
 
 const router = createBrowserRouter([
   { path: "/", element: <Navigate to="/dashboard" replace /> },
-  // { path: "/login", element: <LoginPage /> },
-  // { path: "/register", element: <RegisterPage /> },
   {
     path: "/dashboard",
     element: (
@@ -90,10 +87,19 @@ const router = createBrowserRouter([
   },
 ]);
 
+function PageViewTracker() {
+  const location = window.location;
+  useEffect(() => {
+    trackPageView(location.pathname + location.search);
+  }, [location.pathname, location.search]);
+  return null;
+}
+
 export function App() {
   return (
     <QueryClientProvider client={queryClient}>
       <AuthInitializer />
+      <PageViewTracker />
       <RouterProvider router={router} />
     </QueryClientProvider>
   );
diff --git a/apps/web/src/lib/telemetry.ts b/apps/web/src/lib/telemetry.ts
new file mode 100644
index 0000000..46f3255
--- /dev/null
+++ b/apps/web/src/lib/telemetry.ts
@@ -0,0 +1,52 @@
+/**
+ * Client‑side telemetry for the ZeaVis Edu web app.
+ *
+ * In development, metrics are collected in‑memory and exposed at /metrics
+ * via a Vite plugin.  In production they are sent as HTTP beacons to the
+ * Telemetry pipeline (see METRICS.md).
+ */
+
+// ── Web Vitals ──────────────────────────────────────────
+
+export type MetricEntry = {
+  name: string;
+  value: number;
+  rating?: string;
+};
+
+const vitalsBuffer: MetricEntry[] = [];
+
+export function reportWebVitals(metric: MetricEntry): void {
+  vitalsBuffer.push(metric);
+  // Keep last 20 entries in memory for the /metrics endpoint
+  if (vitalsBuffer.length > 20) vitalsBuffer.shift();
+  console.debug(`[telemetry] ${metric.name}: ${metric.value} (${metric.rating ?? 'n/a'})`);
+}
+
+// ── Page‑view counter ───────────────────────────────────
+
+let pageViewCount = 0;
+
+export function trackPageView(path: string): void {
+  pageViewCount++;
+  console.debug(`[telemetry] pageview: ${path} (total: ${pageViewCount})`);
+}
+
+// ── Metrics serialisation (consumed by vite‑plugin) ────
+
+export function collectMetrics(): string {
+  const lines: string[] = [];
+
+  // ── Default process‑like metrics ──────────────────────
+  lines.push('# HELP zeavis_web_page_views_total Total page views');
+  lines.push('# TYPE zeavis_web_page_views_total counter');
+  lines.push(`zeavis_web_page_views_total ${pageViewCount}`);
+
+  lines.push('# HELP zeavis_web_vital_bucket Web Vitals observed this session');
+  lines.push('# TYPE zeavis_web_vital_bucket gauge');
+  for (const v of vitalsBuffer) {
+    lines.push(`zeavis_web_vital_bucket{name="${v.name}",rating="${v.rating ?? 'unknown'}"} ${v.value}`);
+  }
+
+  return lines.join('\n') + '\n';
+}
diff --git a/apps/web/src/main.tsx b/apps/web/src/main.tsx
index e869dfb..9789fcf 100644
--- a/apps/web/src/main.tsx
+++ b/apps/web/src/main.tsx
@@ -2,6 +2,15 @@ import React from "react";
 import ReactDOM from "react-dom/client";
 import { App } from "./app";
 import "./index.css";
+import { reportWebVitals } from "./lib/telemetry";
+import { onCLS, onFCP, onINP, onLCP, onTTFB } from "web-vitals";
+
+// Report Web Vitals to our in-memory telemetry store
+onCLS((m) => reportWebVitals({ name: "CLS", value: m.value, rating: m.rating }));
+onFCP((m) => reportWebVitals({ name: "FCP", value: m.value, rating: m.rating }));
+onINP((m) => reportWebVitals({ name: "INP", value: m.value, rating: m.rating }));
+onLCP((m) => reportWebVitals({ name: "LCP", value: m.value, rating: m.rating }));
+onTTFB((m) => reportWebVitals({ name: "TTFB", value: m.value, rating: m.rating }));
 
 ReactDOM.createRoot(document.getElementById("root")!).render(
   <React.StrictMode>
diff --git a/apps/web/tsconfig.node.json b/apps/web/tsconfig.node.json
index 8237f41..6bd2998 100644
--- a/apps/web/tsconfig.node.json
+++ b/apps/web/tsconfig.node.json
@@ -7,5 +7,5 @@
     "moduleResolution": "Bundler",
     "types": ["node"]
   },
-  "include": ["vite.config.ts", "tailwind.config.ts"]
+  "include": ["vite.config.ts", "tailwind.config.ts", "vite-plugin-metrics.ts"]
 }
diff --git a/apps/web/vite-plugin-metrics.ts b/apps/web/vite-plugin-metrics.ts
new file mode 100644
index 0000000..f157233
--- /dev/null
+++ b/apps/web/vite-plugin-metrics.ts
@@ -0,0 +1,42 @@
+import type { Plugin } from 'vite';
+
+/**
+ * Vite plugin that exposes a /metrics endpoint during development.
+ *
+ * The endpoint returns Prometheus‑text metrics collected in
+ * src/lib/telemetry.ts.
+ */
+export function metricsPlugin(): Plugin {
+  let telemetryModule: typeof import('./src/lib/telemetry') | null = null;
+
+  return {
+    name: 'zeavis-metrics',
+
+    configureServer(server) {
+      server.middlewares.use(async (req, res, next) => {
+        // Only handle GET /metrics
+        if (req.method !== 'GET' || !req.url?.startsWith('/metrics')) {
+          return next();
+        }
+
+        // Lazy‑load the telemetry module (ensures the app is bootstrapped first)
+        if (!telemetryModule) {
+          try {
+            telemetryModule = await server.ssrLoadModule('./src/lib/telemetry.ts') as typeof import('./src/lib/telemetry');
+          } catch {
+            // If the module isn't ready yet, return an empty body
+            res.statusCode = 200;
+            res.setHeader('Content-Type', 'text/plain; charset=utf-8');
+            res.end('# telemetry module not yet loaded\n');
+            return;
+          }
+        }
+
+        const body = telemetryModule.collectMetrics();
+        res.statusCode = 200;
+        res.setHeader('Content-Type', 'text/plain; charset=utf-8');
+        res.end(body);
+      });
+    },
+  };
+}
diff --git a/apps/web/vite.config.ts b/apps/web/vite.config.ts
index 08b0a15..b596289 100644
--- a/apps/web/vite.config.ts
+++ b/apps/web/vite.config.ts
@@ -2,13 +2,14 @@ import react from '@vitejs/plugin-react';
 import tsconfigPaths from 'vite-tsconfig-paths';
 import path from 'node:path';
 import { defineConfig, loadEnv } from 'vite';
+import { metricsPlugin } from './vite-plugin-metrics';
 
 export default defineConfig(({ mode }) => {
   const env = loadEnv(mode, process.cwd(), '');
   const apiProxyTarget = env.VITE_API_PROXY_TARGET || 'http://localhost:3000';
 
   return {
-    plugins: [react(), tsconfigPaths()],
+    plugins: [react(), tsconfigPaths(), metricsPlugin()],
     server: {
       proxy: {
         '/api': apiProxyTarget,

From 0da578c54690c35b3b3d4fc4ed3def37683b67d2 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 18:12:00 +0700
Subject: [PATCH 05/28] chore: add bun.lock, docker-compose telemetry network,
 and METRICS.md documentation

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 METRICS.md         | 107 +++++++++++++++++++++++++++++++++++++++++++++
 docker-compose.yml |   6 +++
 2 files changed, 113 insertions(+)
 create mode 100644 METRICS.md

diff --git a/METRICS.md b/METRICS.md
new file mode 100644
index 0000000..dde52a2
--- /dev/null
+++ b/METRICS.md
@@ -0,0 +1,107 @@
+# ZeaVis Edu — Metrics Endpoints
+
+This document lists every Prometheus metrics endpoint exposed by the ZeaVis Edu
+application stack and the payload each service provides.
+
+---
+
+## Overview
+
+| Service               | Host (prod)                       | Metrics Endpoint           | Port (local) |
+|-----------------------|-----------------------------------|----------------------------|--------------|
+| Web (Vite dev)        | `zeavisedu.asepharyana.my.id`     | `GET /metrics`             | 5173         |
+| API (Elysia)          | `api-zeavisedu.asepharyana.my.id`   | `GET /metrics`           | 3000         |
+| ML Service (Axum)     | `ml-zeavisedu.asepharyana.my.id`    | `GET /metrics`           | 8000         |
+| Prometheus Collector  | —                                 | `GET /metrics` (self)      | 9090         |
+
+> In production all metrics are scraped by the Prometheus collector running in the
+> Telemetry stack. See [`telemetry/prometheus/targets/`](./telemetry/prometheus/targets/)
+> for the auto‑discovery configuration.
+
+---
+
+## 1. Web App — `GET /metrics`
+
+| Endpoint          | Description                                      |
+|-------------------|--------------------------------------------------|
+| `/metrics`        | Vite dev‑server middleware + client‑side snapshot |
+
+### Metrics
+
+| Metric Name                         | Type    | Labels                        | Description                              |
+|-------------------------------------|---------|-------------------------------|------------------------------------------|
+| `zeavis_web_page_views_total`       | counter | —                             | Total page views this session            |
+| `zeavis_web_vital_bucket`           | gauge   | `name`, `rating`              | Last‑seen Web Vitals (CLS, FCP, INP…)   |
+
+**Development:** served inline by the Vite plugin `vite-plugin-metrics.ts`.
+**Production:** the static frontend serves no `/metrics` endpoint — consider
+forwarding the Vite dev server, or use the Telemetry collector to scrape
+client‑side beacons.
+
+---
+
+## 2. API (Elysia/Bun) — `GET /metrics`
+
+| Endpoint          | Description                                      |
+|-------------------|--------------------------------------------------|
+| `/metrics`        | Prometheus text format via `prom-client`         |
+
+### Metrics
+
+| Metric Name                                | Type      | Labels                         | Description                              |
+|--------------------------------------------|-----------|--------------------------------|------------------------------------------|
+| `zeavis_api_http_requests_total`           | counter   | `method`, `path`, `status`     | Total HTTP requests                      |
+| `zeavis_api_http_request_duration_seconds` | histogram | `method`, `path`               | Request latency buckets                  |
+| `zeavis_api_http_requests_active`          | gauge     | —                              | Concurrently‑handled requests            |
+| `zeavis_api_classifications_total`         | counter   | `result`                       | AI image classifications                 |
+| `zeavis_api_diagnoses_total`               | counter   | `disease`                      | Created diagnoses                        |
+| `zeavis_api_auth_operations_total`         | counter   | `operation`, `success`         | Login / register attempts                |
+| Default Node.js metrics                    | various   | —                              | CPU, memory, event‑loop lag, GC …       |
+
+**Source:** `apps/api/src/lib/telemetry.ts`, instrumented in `routes/`.
+
+---
+
+## 3. ML Service (Rust/Axum) — `GET /metrics`
+
+| Endpoint          | Description                                      |
+|-------------------|--------------------------------------------------|
+| `/metrics`        | Prometheus text format via `prometheus` crate    |
+
+### Metrics
+
+| Metric Name                                | Type      | Labels                         | Description                              |
+|--------------------------------------------|-----------|--------------------------------|------------------------------------------|
+| `zeavis_ml_http_requests_total`            | counter   | —                              | Total HTTP requests                      |
+| `zeavis_ml_http_request_duration_seconds`  | histogram | —                              | Request latency buckets                  |
+| `zeavis_ml_http_requests_active`           | gauge     | —                              | Concurrently‑handled requests            |
+| `zeavis_ml_predictions_total`              | counter   | —                              | Successful ONNX predictions              |
+| `zeavis_ml_model_load_status`              | gauge     | —                              | 1 = loaded, 0 = not loaded               |
+| Process metrics (libc/procfs)              | various   | —                              | RSS, CPU, fd count …                    |
+
+**Source:** `apps/ml-service/src/telemetry.rs`, instrumented in `routes.rs`.
+
+---
+
+## Prometheus Auto‑Discovery (Telemetry Stack)
+
+The Telemetry submodule includes a Prometheus instance that uses
+`file_sd_configs` to discover targets. Place a target file under
+`telemetry/prometheus/targets/` with content such as:
+
+```json
+[
+  {
+    "targets": ["zeavis-api:3000"],
+    "labels": { "service": "zeavis-api", "component": "backend" }
+  },
+  {
+    "targets": ["zeavis-ml:8000"],
+    "labels": { "service": "zeavis-ml", "component": "inference" }
+  }
+]
+```
+
+The Prometheus config (in `telemetry/prometheus/prometheus.yml`) will
+automatically pick up new files within its 15‑second scrape interval —
+no restart required.
diff --git a/docker-compose.yml b/docker-compose.yml
index 699f03f..7a70dcd 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -2,6 +2,9 @@ networks:
   app-shared-net:
     external: true
     name: app-shared-net
+  telemetry-net:
+    external: true
+    name: telemetry-net
 
 services:
   web:
@@ -10,6 +13,7 @@ services:
     restart: always
     networks:
       - app-shared-net
+      - telemetry-net
     env_file:
       - .env
     labels:
@@ -26,6 +30,7 @@ services:
     restart: always
     networks:
       - app-shared-net
+      - telemetry-net
     env_file:
       - .env
     environment:
@@ -47,6 +52,7 @@ services:
     restart: always
     networks:
       - app-shared-net
+      - telemetry-net
     env_file:
       - .env
     environment:

From 2c41b80f975523e55ac05321c66409119b3f2762 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 20:57:45 +0700
Subject: [PATCH 06/28] feat: expose /metrics endpoint and add telemetry
 ClickHouse credentials

---
 .env.example                 |   6 ++
 Makefile                     | 149 +++++++++++++++++++++++++++++++++++
 apps/web/nginx.conf          |   9 +++
 docker-compose.telemetry.yml |  30 +++++++
 4 files changed, 194 insertions(+)
 create mode 100644 Makefile
 create mode 100644 docker-compose.telemetry.yml

diff --git a/.env.example b/.env.example
index 9099563..677317f 100644
--- a/.env.example
+++ b/.env.example
@@ -1,3 +1,9 @@
 WEB_PORT=5173
 API_PORT=3000
 DATABASE_URL=postgres://postgres:postgres@localhost:5432/zeavis_edu
+
+# ── Telemetry / ClickHouse ──────────────────────────────────────────
+# These credentials are used by the telemetry Docker Compose stack.
+# See telemetry/deploy/.env.example for production overrides.
+CLICKHOUSE_USER=telemetry
+CLICKHOUSE_PASSWORD=telemetry
diff --git a/Makefile b/Makefile
new file mode 100644
index 0000000..3c6c015
--- /dev/null
+++ b/Makefile
@@ -0,0 +1,149 @@
+# =============================================================================
+# ZeaVis Edu — Root Makefile
+#
+# Orchestrates the application stack (web, api, ml) and the telemetry
+# metric pipeline (Prometheus → Ingester → Vector → ClickHouse).
+#
+# Telemetry commands operate on the submodule at telemetry/.
+# =============================================================================
+
+.PHONY: dev build typecheck
+.PHONY: telemetry-up telemetry-down telemetry-build telemetry-logs telemetry-restart telemetry-init-db telemetry-test-metric telemetry-status
+.PHONY: up-all down-all
+
+SHELL := /bin/bash
+
+# ──────────────────────────────────────────────────────────────────────────────
+# Application (Bun / Moon)
+# ──────────────────────────────────────────────────────────────────────────────
+
+dev:
+	bun run dev
+
+build:
+	bun run build
+
+typecheck:
+	bun run typecheck
+
+# ──────────────────────────────────────────────────────────────────────────────
+# Telemetry Stack
+#
+#   Docker commands reference the telemetry submodule compose file:
+#     telemetry/deploy/docker-compose.yml
+#
+#   For local development, append the port override:
+#     make telemetry-up-local
+#
+#   The telmetry compose file is inside the submodule so paths (volumes,
+#   build context) are relative to telemetry/ — but we run docker compose
+#   from the project root using -f.
+# ──────────────────────────────────────────────────────────────────────────────
+
+TELEMETRY_COMPOSE := telemetry/deploy/docker-compose.yml
+TELEMETRY_LOCAL   := telemetry/deploy/docker-compose.local.yml
+TELEMETRY_ZEAVIS  := docker-compose.telemetry.yml
+
+# Start all telemetry services
+telemetry-up:
+	@echo ">> Starting Telemetry stack..."
+	CLICKHOUSE_USER=$${CLICKHOUSE_USER:-telemetry} \
+	CLICKHOUSE_PASSWORD=$${CLICKHOUSE_PASSWORD:-telemetry} \
+	docker compose -f $(TELEMETRY_COMPOSE) -f $(TELEMETRY_ZEAVIS) up -d
+	@echo ">> Telemetry stack started. Use 'make telemetry-logs' to view output."
+
+# Start telemetry services with local port overrides (no Tailscale)
+telemetry-up-local:
+	@echo ">> Starting Telemetry stack (local mode)..."
+	CLICKHOUSE_USER=$${CLICKHOUSE_USER:-telemetry} \
+	CLICKHOUSE_PASSWORD=$${CLICKHOUSE_PASSWORD:-telemetry} \
+	docker compose -f $(TELEMETRY_COMPOSE) -f $(TELEMETRY_LOCAL) -f $(TELEMETRY_ZEAVIS) up -d
+	@echo ">> Telemetry stack started in local mode."
+
+# Stop all telemetry services
+telemetry-down:
+	@echo ">> Stopping Telemetry stack..."
+	docker compose -f $(TELEMETRY_COMPOSE) -f $(TELEMETRY_ZEAVIS) down
+	@echo ">> Telemetry stack stopped."
+
+# Build telemetry components (metric-ingester + telemetry-ui)
+# Runs inside the telemetry submodule using its own Makefile.
+telemetry-build:
+	@echo ">> Building Telemetry components..."
+	$(MAKE) -C telemetry build
+	@echo ">> Telemetry components built."
+
+# Tail telemetry logs (optionally filter by service: s=<name>)
+telemetry-logs:
+ifdef s
+	CLICKHOUSE_USER=$${CLICKHOUSE_USER:-telemetry} \
+	CLICKHOUSE_PASSWORD=$${CLICKHOUSE_PASSWORD:-telemetry} \
+	docker compose -f $(TELEMETRY_COMPOSE) -f $(TELEMETRY_ZEAVIS) logs -f $(s)
+else
+	CLICKHOUSE_USER=$${CLICKHOUSE_USER:-telemetry} \
+	CLICKHOUSE_PASSWORD=$${CLICKHOUSE_PASSWORD:-telemetry} \
+	docker compose -f $(TELEMETRY_COMPOSE) -f $(TELEMETRY_ZEAVIS) logs -f
+endif
+
+# Restart a single telemetry service
+telemetry-restart:
+ifdef s
+	@echo ">> Restarting service: $(s)..."
+	CLICKHOUSE_USER=$${CLICKHOUSE_USER:-telemetry} \
+	CLICKHOUSE_PASSWORD=$${CLICKHOUSE_PASSWORD:-telemetry} \
+	docker compose -f $(TELEMETRY_COMPOSE) -f $(TELEMETRY_ZEAVIS) restart $(s)
+	@echo ">> Service $(s) restarted."
+else
+	@echo "Usage: make telemetry-restart s=<service-name>"
+	@echo "Services: prometheus metric-ingester vector clickhouse query-proxy telemetry-ui"
+	@exit 1
+endif
+
+# Initialize ClickHouse schema
+telemetry-init-db:
+	@echo ">> Initializing ClickHouse schema..."
+	cd telemetry/clickhouse && DOCKER_CONTAINER=telemetry-clickhouse bash init.sh
+	@echo ">> Schema initialized."
+
+# Send a test metric through the pipeline
+telemetry-test-metric:
+	@echo ">> Sending test metric to Vector on port 9001..."
+	curl -X POST http://localhost:9001/metrics \
+		-H "Content-Type: application/json" \
+		-d '{"metric_name":"test_zeavis","value":1.0,"timestamp":"$(shell date -u +%Y-%m-%dT%H:%M:%SZ)","labels":{"service":"zeavis-edu"},"env":"dev","region":"local"}'
+	@echo ""
+	@echo ">> Metric sent. Check telemetry-logs to verify ingestion."
+
+# Show service status (health check overview)
+telemetry-status:
+	@echo ">> Telemetry stack status:"
+	@echo ""
+	@echo "--- Prometheus ---"
+	-curl -s --max-time 3 http://localhost:9090/-/healthy && echo " healthy" || echo " unhealthy"
+	@echo ""
+	@echo "--- Metric Ingester ---"
+	-curl -s --max-time 3 http://localhost:9091/health || echo " unhealthy"
+	@echo ""
+	@echo "--- Vector ---"
+	-curl -s --max-time 3 http://localhost:9001/health || echo " unhealthy"
+	@echo ""
+	@echo "--- ClickHouse ---"
+	-curl -s --max-time 3 http://localhost:8123/ping && echo " healthy" || echo " unhealthy"
+	@echo ""
+	@echo "--- Query Proxy ---"
+	-curl -s --max-time 3 http://localhost:9092/health || echo " unhealthy"
+	@echo ""
+	@echo "--- Telemetry UI ---"
+	-curl -s --max-time 3 -o /dev/null -w "%{http_code}" http://localhost:8181/ && echo " ok" || echo " unhealthy"
+
+# ──────────────────────────────────────────────────────────────────────────────
+# Combined
+# ──────────────────────────────────────────────────────────────────────────────
+
+# Start everything (app + telemetry)
+up-all: telemetry-up
+	bun run dev
+
+# Stop everything
+down-all: telemetry-down
+	@echo ">> All services stopped."
diff --git a/apps/web/nginx.conf b/apps/web/nginx.conf
index d15888c..11bce60 100644
--- a/apps/web/nginx.conf
+++ b/apps/web/nginx.conf
@@ -12,6 +12,15 @@ server {
     proxy_set_header X-Forwarded-Proto $scheme;
   }
 
+  # Expose API metrics through the web endpoint (Prometheus scrape target)
+  location /metrics {
+    proxy_pass http://zeavis-api:3000/metrics;
+    proxy_set_header Host $host;
+    proxy_set_header X-Real-IP $remote_addr;
+    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    proxy_set_header X-Forwarded-Proto $scheme;
+  }
+
   location / {
     try_files $uri $uri/ /index.html;
   }
diff --git a/docker-compose.telemetry.yml b/docker-compose.telemetry.yml
new file mode 100644
index 0000000..bbeb679
--- /dev/null
+++ b/docker-compose.telemetry.yml
@@ -0,0 +1,30 @@
+# =============================================================================
+# ZeaVis Edu — Telemetry Stack Integration
+#
+# Extends the Telemetry submodule docker-compose to share the app network so
+# Prometheus can scrape the ZeaVis Edu services (web, api, ml).
+#
+# Usage (from project root):
+#   docker compose -f telemetry/deploy/docker-compose.yml \
+#                  -f docker-compose.telemetry.yml up -d
+# =============================================================================
+
+networks:
+  app-shared-net:
+    external: true
+    name: app-shared-net
+  telemetry-net:
+    external: true
+    name: telemetry-net
+
+services:
+  # ── Telemetry services join the app network for scraping ─────────────
+  prometheus:
+    networks:
+      - default
+      - app-shared-net
+
+  # ── ZeaVis Edu app services join the telemetry network ───────────────
+  # These are defined here so Prometheus can reach them without scope
+  # conflicts. When deployed via the root docker-compose.yml, they already
+  # share both networks — this override ensures local dev works too.

From 36216601e3a70e95adb6f5ba014f64a5276ad1d6 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 21:00:22 +0700
Subject: [PATCH 07/28] docs: add telemetry stack documentation to CLAUDE.md,
 METRICS.md, and README.md

---
 CLAUDE.md  |  37 +++++++++++++++
 METRICS.md |   6 +++
 README.md  | 130 +++++++++++++++++++++++++++++++++++++++++++++++++++++
 3 files changed, 173 insertions(+)

diff --git a/CLAUDE.md b/CLAUDE.md
index 48573c0..4adcacf 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -107,6 +107,31 @@ Run the ML service directly:
 cd apps/ml-service && cargo run
 ```
 
+Run the Telemetry stack:
+
+```bash
+# Start all telemetry services (Prometheus, Ingester, Vector, ClickHouse, Query Proxy, Telemetry UI)
+make telemetry-up
+
+# Local dev mode (port bindings exposed)
+make telemetry-up-local
+
+# Check health of all telemetry services
+make telemetry-status
+
+# View telemetry logs
+make telemetry-logs [s=<service>]
+
+# Build telemetry components
+make telemetry-build
+
+# Send a test metric
+make telemetry-test-metric
+
+# Stop telemetry
+make telemetry-down
+```
+
 ## High-level architecture
 
 - `Machine_Learning/preprocessing.py` prepares the training dataset locally. It extracts three source ZIP files, merges selected class folders into `dataset/`, maps selected Mandarin labels from Dataset 3 via `desc.json`, removes known problematic image files, then creates `dataset.zip` for upload to Google Drive/Colab.
@@ -116,6 +141,18 @@ cd apps/ml-service && cargo run
 - TensorFlow.js export is intentionally done with the `tensorflowjs_converter` CLI rather than from Python to avoid protobuf/runtime conflicts documented in the README.
 - `apps/ml-service/` is a Rust/Axum service that loads the ONNX model and serves HTTP endpoints for health checks, metadata, and image classification predictions. It uses ONNX Runtime for cross-platform inference performance.
 
+## Telemetry architecture
+
+The repository includes a full Prometheus → ClickHouse metric pipeline as a git submodule at `telemetry/`. Each ZeaVis Edu service exposes a `GET /metrics` endpoint:
+
+- **Web app** (`apps/web`): In dev mode, a Vite plugin serves client-side session metrics (page views, Web Vitals). In production, nginx proxies `/metrics` to the API service. Source: `apps/web/src/lib/telemetry.ts`, `apps/web/vite-plugin-metrics.ts`.
+- **API** (`apps/api`): Uses `prom-client` for Node.js default metrics plus custom HTTP, auth, classification, and diagnosis counters/histograms. Source: `apps/api/src/lib/telemetry.ts`, exposed via `apps/api/src/routes/metrics.ts`.
+- **ML service** (`apps/ml-service`): Uses the `prometheus` Rust crate for HTTP metrics, prediction counts, and model load status. Source: `apps/ml-service/src/telemetry.rs`.
+
+All three share the `zeavis_` metric prefix and are scraped by the Telemetry Prometheus instance via `file_sd_configs` (see `telemetry/prometheus/targets/zeavis-edu.json`).
+
+The telemetry stack is managed from the project root via `make telemetry-*` targets (see `Makefile`). The Docker Compose files in `telemetry/deploy/` define 6 services (Prometheus, Metric Ingester, Vector, ClickHouse, Query Proxy, Telemetry UI).
+
 ## Fullstack application architecture
 
 The root TypeScript workspace is a Bun + Moon monorepo:
diff --git a/METRICS.md b/METRICS.md
index dde52a2..2e1f21d 100644
--- a/METRICS.md
+++ b/METRICS.md
@@ -17,6 +17,12 @@ application stack and the payload each service provides.
 > In production all metrics are scraped by the Prometheus collector running in the
 > Telemetry stack. See [`telemetry/prometheus/targets/`](./telemetry/prometheus/targets/)
 > for the auto‑discovery configuration.
+>
+> In production (nginx), the web app proxies `/metrics` to the API service:
+> see [`apps/web/nginx.conf`](apps/web/nginx.conf).
+>
+> For local development the Vite plugin `vite-plugin-metrics.ts` serves
+> client‑side session metrics at `GET /metrics` on the Vite dev server.
 
 ---
 
diff --git a/README.md b/README.md
index ef03ae4..c134bc0 100644
--- a/README.md
+++ b/README.md
@@ -77,6 +77,17 @@ Model klasifikasi menargetkan empat label berbahasa Indonesia:
 - GitHub Container Registry
 - Traefik labels untuk routing deployment
 
+### Telemetry & Observability
+
+- Prometheus — metric scraping & remote_write
+- Metric Ingester (Go) — enrichment, filtering, aggregation
+- Vector — buffering & backpressure
+- ClickHouse — columnar analytical storage
+- Query Proxy (Go) — read-only SQL proxy
+- Telemetry UI (Vue 3) — metrics dashboard
+- Semua service ZeaVis Edu (web, api, ml-service) mengekspos metrik Prometheus di `/metrics`
+- Client-side Web Vitals (CLS, FCP, INP, LCP, TTFB) dikumpulkan di frontend
+
 ## Prasyarat
 
 Untuk menjalankan seluruh project secara lokal, siapkan:
@@ -203,6 +214,125 @@ Contoh menjalankan compose setelah environment dan network siap:
 docker compose up -d
 ```
 
+## Telemetry Stack
+
+Proyek ini menyertakan pipeline telemetry metric sebagai git submodule di `telemetry/`. Pipeline mengalirkan metrik dari seluruh service ZeaVis Edu ke ClickHouse untuk analisis dan visualisasi jangka panjang.
+
+### Arsitektur
+
+```mermaid
+flowchart LR
+    subgraph Apps["ZeaVis Edu"]
+        W[Web / React]
+        A[API / Elysia]
+        M[ML Service / Axum]
+    end
+
+    subgraph Telemetry["Telemetry Pipeline"]
+        P[Prometheus]
+        MI[Metric Ingester]
+        V[Vector]
+        CH[ClickHouse]
+        QP[Query Proxy]
+        TUI[Telemetry UI]
+    end
+
+    W -->|"GET /metrics"| P
+    A -->|"GET /metrics"| P
+    M -->|"GET /metrics"| P
+    P -->|remote_write| MI
+    MI -->|HTTP POST| V
+    V -->|JSONEachRow| CH
+    QP -->|SQL| CH
+    TUI -->|/proxy/query| QP
+```
+
+Setiap service ZeaVis Edu mengekspos endpoint `/metrics` dalam format Prometheus text:
+
+| Service               | Endpoint           | Port (lokal) |
+|-----------------------|--------------------|--------------|
+| Web (Vite dev)        | `GET /metrics`     | 5173         |
+| API (Elysia)          | `GET /metrics`     | 3000         |
+| ML Service (Axum)     | `GET /metrics`     | 8000         |
+
+Lihat [`METRICS.md`](./METRICS.md) untuk daftar lengkap metrik yang diekspos.
+
+### Service Telemetry
+
+| # | Service | Peran | Port |
+|---|---------|------|------|
+| 1 | **Prometheus** | Metric scraping & remote_write | 9090 |
+| 2 | **Metric Ingester** | Enrichment, filtering, aggregation | 9091 |
+| 3 | **Vector** | Buffering, backpressure, retry | 9001 |
+| 4 | **ClickHouse** | Columnar analytical storage | 8123 / 9000 |
+| 5 | **Query Proxy** | Read-only SQL proxy, tenant isolation | 9092 |
+| 6 | **Telemetry UI** | Vue 3 metrics dashboard | 8181 |
+
+### Menjalankan Telemetry Stack
+
+Semua operasi telemetry dijalankan dari **root proyek** melalui Makefile:
+
+```bash
+# Build komponen telemetry (metric-ingester + telemetry-ui)
+make telemetry-build
+
+# Start semua service telemetry (mode produksi, via Tailscale)
+make telemetry-up
+
+# Start semua service telemetry (mode lokal — port langsung terbuka)
+make telemetry-up-local
+
+# Cek status kesehatan semua service
+make telemetry-status
+
+# Lihat log (semua service, atau filter dengan s=)
+make telemetry-logs
+make telemetry-logs s=metric-ingester
+
+# Restart service tertentu
+make telemetry-restart s=prometheus
+
+# Kirim test metric
+make telemetry-test-metric
+
+# Stop semua service
+make telemetry-down
+```
+
+Untuk development lokal:
+
+```bash
+# Setup network jika belum ada
+docker network create telemetry-net
+docker network create app-shared-net
+
+# Build & start
+make telemetry-build
+make telemetry-up-local
+
+# Buka dashboard di http://localhost:8181
+```
+
+### Prometheus Auto-Discovery
+
+Prometheus menggunakan `file_sd_configs` untuk menemukan target secara dinamis. Cukup letakkan file JSON di `telemetry/prometheus/targets/` dan Prometheus akan otomatis mendeteksinya dalam 15 detik — tanpa restart.
+
+File target ZeaVis Edu sudah tersedia di [`telemetry/prometheus/targets/zeavis-edu.json`](telemetry/prometheus/targets/zeavis-edu.json):
+
+```json
+[
+  { "targets": ["zeavis-api:3000"], "labels": { "service": "zeavis-api", "component": "backend" } },
+  { "targets": ["zeavis-ml:8000"],  "labels": { "service": "zeavis-ml", "component": "inference" } }
+]
+```
+
+### Environment Variables Telemetry
+
+| Variable | Default | Deskripsi |
+|----------|---------|-----------|
+| `CLICKHOUSE_USER` | `telemetry` | User ClickHouse |
+| `CLICKHOUSE_PASSWORD` | `telemetry` | Password ClickHouse |
+
 ## Workflow Machine Learning
 
 Detail lengkap tersedia di [`Machine_Learning/README.md`](Machine_Learning/README.md). Ringkasnya:

From 7e0e052200c38a0e4dc450fd313dab2bd05065f6 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 21:13:15 +0700
Subject: [PATCH 08/28] docs: clarify telemetry stack local-dev vs production
 separation in docker-compose.telemetry.yml

---
 docker-compose.telemetry.yml | 28 +++++++++++++---------------
 1 file changed, 13 insertions(+), 15 deletions(-)

diff --git a/docker-compose.telemetry.yml b/docker-compose.telemetry.yml
index bbeb679..62e1b8e 100644
--- a/docker-compose.telemetry.yml
+++ b/docker-compose.telemetry.yml
@@ -1,30 +1,28 @@
 # =============================================================================
-# ZeaVis Edu — Telemetry Stack Integration
+# ZeaVis Edu — Telemetry Stack Integration (LOCAL DEV ONLY)
 #
-# Extends the Telemetry submodule docker-compose to share the app network so
-# Prometheus can scrape the ZeaVis Edu services (web, api, ml).
+# This override connects the Telemetry submodule docker-compose to the same
+# Docker network as ZeaVis Edu services for LOCAL development on a single host.
 #
-# Usage (from project root):
-#   docker compose -f telemetry/deploy/docker-compose.yml \
-#                  -f docker-compose.telemetry.yml up -d
+# In PRODUCTION, the app and telemetry run on separate VPS instances
+# connected via Tailscale. See telemetry/prometheus/targets/zeavis-edu.json
+# for the Tailscale IP configuration.
+#
+# Usage (local dev only):
+#   # Ensure app-shared-net exists first:
+#   docker network create app-shared-net
+#
+#   # Start telemetry with app network access:
+#   make telemetry-up-local
 # =============================================================================
 
 networks:
   app-shared-net:
     external: true
     name: app-shared-net
-  telemetry-net:
-    external: true
-    name: telemetry-net
 
 services:
-  # ── Telemetry services join the app network for scraping ─────────────
   prometheus:
     networks:
       - default
       - app-shared-net
-
-  # ── ZeaVis Edu app services join the telemetry network ───────────────
-  # These are defined here so Prometheus can reach them without scope
-  # conflicts. When deployed via the root docker-compose.yml, they already
-  # share both networks — this override ensures local dev works too.

From 6933e5512f0a660972e9b43afe19489d3205f87c Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 21:15:32 +0700
Subject: [PATCH 09/28] docs(telemetry): separate production cross-VPS and
 local dev architecture docs

---
 CLAUDE.md  |  4 ++++
 METRICS.md | 20 ++++++++++++------
 Makefile   | 14 +++++++------
 README.md  | 61 ++++++++++++++++++++++++++++++++++--------------------
 4 files changed, 65 insertions(+), 34 deletions(-)

diff --git a/CLAUDE.md b/CLAUDE.md
index 4adcacf..196231f 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -151,8 +151,12 @@ The repository includes a full Prometheus → ClickHouse metric pipeline as a gi
 
 All three share the `zeavis_` metric prefix and are scraped by the Telemetry Prometheus instance via `file_sd_configs` (see `telemetry/prometheus/targets/zeavis-edu.json`).
 
+**IMPORTANT — Production architecture:** ZeaVis Edu apps and the Telemetry stack run on **separate VPS instances** connected via **Tailscale** (mesh VPN). Prometheus scrapes the API and ML service through their **Tailscale IPs** (e.g. `100.x.x.a:3000`), not via Docker hostnames. The target file `telemetry/prometheus/targets/zeavis-edu.json` has `__CHANGE_ME__` placeholders — before deploying, replace with the actual Tailscale IPs of the app VPS.
+
 The telemetry stack is managed from the project root via `make telemetry-*` targets (see `Makefile`). The Docker Compose files in `telemetry/deploy/` define 6 services (Prometheus, Metric Ingester, Vector, ClickHouse, Query Proxy, Telemetry UI).
 
+For **local single-host dev**, Prometheus can reach app services via a shared Docker network (`app-shared-net`). Use `make telemetry-up-local` for this mode — it includes the `docker-compose.telemetry.yml` override.
+
 ## Fullstack application architecture
 
 The root TypeScript workspace is a Bun + Moon monorepo:
diff --git a/METRICS.md b/METRICS.md
index 2e1f21d..af8ba31 100644
--- a/METRICS.md
+++ b/METRICS.md
@@ -15,8 +15,11 @@ application stack and the payload each service provides.
 | Prometheus Collector  | —                                 | `GET /metrics` (self)      | 9090         |
 
 > In production all metrics are scraped by the Prometheus collector running in the
-> Telemetry stack. See [`telemetry/prometheus/targets/`](./telemetry/prometheus/targets/)
-> for the auto‑discovery configuration.
+> Telemetry stack on a **separate VPS** connected via **Tailscale**.
+> See [`telemetry/prometheus/targets/`](./telemetry/prometheus/targets/)
+> for the auto‑discovery configuration. Target files must use **Tailscale IPs**
+> (e.g. `100.x.x.a:3000`), not Docker hostnames, because the services are on
+> different hosts.
 >
 > In production (nginx), the web app proxies `/metrics` to the API service:
 > see [`apps/web/nginx.conf`](apps/web/nginx.conf).
@@ -98,16 +101,21 @@ The Telemetry submodule includes a Prometheus instance that uses
 ```json
 [
   {
-    "targets": ["zeavis-api:3000"],
-    "labels": { "service": "zeavis-api", "component": "backend" }
+    "targets": ["100.x.x.a:3000"],
+    "labels": { "service": "zeavis-api", "component": "backend", "env": "production" }
   },
   {
-    "targets": ["zeavis-ml:8000"],
-    "labels": { "service": "zeavis-ml", "component": "inference" }
+    "targets": ["100.x.x.b:8000"],
+    "labels": { "service": "zeavis-ml", "component": "inference", "env": "production" }
   }
 ]
 ```
 
+> ⚠️ **Cross-VPS:** Gunakan **IP Tailscale** (bukan Docker hostname) karena
+> Prometheus dan ZeaVis Edu berjalan di VPS berbeda. Pastikan port service
+> (`:3000`, `:8000`) terekspos di `0.0.0.0` atau diizinkan oleh aturan
+> `iptables`/`ufw` untuk interface Tailscale (`tailscale0`/`100.x.x.x/10`).
+
 The Prometheus config (in `telemetry/prometheus/prometheus.yml`) will
 automatically pick up new files within its 15‑second scrape interval —
 no restart required.
diff --git a/Makefile b/Makefile
index 3c6c015..8559fa3 100644
--- a/Makefile
+++ b/Makefile
@@ -44,21 +44,23 @@ TELEMETRY_COMPOSE := telemetry/deploy/docker-compose.yml
 TELEMETRY_LOCAL   := telemetry/deploy/docker-compose.local.yml
 TELEMETRY_ZEAVIS  := docker-compose.telemetry.yml
 
-# Start all telemetry services
+# Start all telemetry services (standalone — cross-VPS production mode)
+# Prometheus scrapes ZeaVis Edu via Tailscale IPs, not Docker network.
 telemetry-up:
-	@echo ">> Starting Telemetry stack..."
+	@echo ">> Starting Telemetry stack (standalone)..."
 	CLICKHOUSE_USER=$${CLICKHOUSE_USER:-telemetry} \
 	CLICKHOUSE_PASSWORD=$${CLICKHOUSE_PASSWORD:-telemetry} \
-	docker compose -f $(TELEMETRY_COMPOSE) -f $(TELEMETRY_ZEAVIS) up -d
+	docker compose -f $(TELEMETRY_COMPOSE) up -d
 	@echo ">> Telemetry stack started. Use 'make telemetry-logs' to view output."
 
-# Start telemetry services with local port overrides (no Tailscale)
+# Start telemetry services with ZeaVis Edu network sharing (local single-host dev)
+# Prometheus can scrape app services via app-shared-net Docker network.
 telemetry-up-local:
-	@echo ">> Starting Telemetry stack (local mode)..."
+	@echo ">> Starting Telemetry stack (local dev mode)..."
 	CLICKHOUSE_USER=$${CLICKHOUSE_USER:-telemetry} \
 	CLICKHOUSE_PASSWORD=$${CLICKHOUSE_PASSWORD:-telemetry} \
 	docker compose -f $(TELEMETRY_COMPOSE) -f $(TELEMETRY_LOCAL) -f $(TELEMETRY_ZEAVIS) up -d
-	@echo ">> Telemetry stack started in local mode."
+	@echo ">> Telemetry stack started in local dev mode."
 
 # Stop all telemetry services
 telemetry-down:
diff --git a/README.md b/README.md
index c134bc0..a50dbf4 100644
--- a/README.md
+++ b/README.md
@@ -218,33 +218,34 @@ docker compose up -d
 
 Proyek ini menyertakan pipeline telemetry metric sebagai git submodule di `telemetry/`. Pipeline mengalirkan metrik dari seluruh service ZeaVis Edu ke ClickHouse untuk analisis dan visualisasi jangka panjang.
 
-### Arsitektur
+### Arsitektur (Production)
+
+Di production, aplikasi dan telemetry berjalan di **VPS terpisah** dan terhubung via **Tailscale** (mesh VPN). Prometheus di VPS telemetry melakukan scrape ke service ZeaVis Edu melalui IP Tailscale masing-masing.
 
 ```mermaid
 flowchart LR
-    subgraph Apps["ZeaVis Edu"]
-        W[Web / React]
-        A[API / Elysia]
-        M[ML Service / Axum]
+    subgraph VPS1["VPS — ZeaVis Edu (App)"]
+        W[Web / React<br/>api-zeavisedu.asepharyana.id]
+        A[API / Elysia<br/>:3000]
+        M[ML Service / Axum<br/>:8000]
     end
 
-    subgraph Telemetry["Telemetry Pipeline"]
-        P[Prometheus]
-        MI[Metric Ingester]
-        V[Vector]
-        CH[ClickHouse]
-        QP[Query Proxy]
-        TUI[Telemetry UI]
+    subgraph VPS2["VPS — Telemetry Stack"]
+        P[Prometheus<br/>:9090]
+        MI[Metric Ingester<br/>:9091]
+        V[Vector<br/>:9001]
+        CH[ClickHouse<br/>:8123]
+        QP[Query Proxy<br/>:9092]
+        TUI[Telemetry UI<br/>:8181]
     end
 
-    W -->|"GET /metrics"| P
-    A -->|"GET /metrics"| P
-    M -->|"GET /metrics"| P
+    P -.->|"scrape via Tailscale IP<br/>100.x.x.a:3000/metrics"| A
+    P -.->|"scrape via Tailscale IP<br/>100.x.x.a:8000/metrics"| M
     P -->|remote_write| MI
-    MI -->|HTTP POST| V
-    V -->|JSONEachRow| CH
-    QP -->|SQL| CH
-    TUI -->|/proxy/query| QP
+    MI --> V
+    V --> CH
+    QP --> CH
+    TUI --> QP
 ```
 
 Setiap service ZeaVis Edu mengekspos endpoint `/metrics` dalam format Prometheus text:
@@ -255,6 +256,8 @@ Setiap service ZeaVis Edu mengekspos endpoint `/metrics` dalam format Prometheus
 | API (Elysia)          | `GET /metrics`     | 3000         |
 | ML Service (Axum)     | `GET /metrics`     | 8000         |
 
+Prometheus di VPS telemetry melakukan **scrape langsung** ke API dan ML service melalui IP Tailscale mereka, bukan melalui domain publik. Konfigurasi target ada di `telemetry/prometheus/targets/zeavis-edu.json` — isi dengan IP Tailscale dari service yang dituju.
+
 Lihat [`METRICS.md`](./METRICS.md) untuk daftar lengkap metrik yang diekspos.
 
 ### Service Telemetry
@@ -268,6 +271,18 @@ Lihat [`METRICS.md`](./METRICS.md) untuk daftar lengkap metrik yang diekspos.
 | 5 | **Query Proxy** | Read-only SQL proxy, tenant isolation | 9092 |
 | 6 | **Telemetry UI** | Vue 3 metrics dashboard | 8181 |
 
+### Arsitektur (Local Dev)
+
+Untuk development lokal di satu mesin, telemetry dan app bisa jalan bareng di satu Docker host. Prometheus bisa scrape service lewat Docker network yang sama.
+
+```bash
+# Setup network
+docker network create app-shared-net
+
+# Build & start telemetry (dengan network sharing)
+make telemetry-up-local
+```
+
 ### Menjalankan Telemetry Stack
 
 Semua operasi telemetry dijalankan dari **root proyek** melalui Makefile:
@@ -317,15 +332,17 @@ make telemetry-up-local
 
 Prometheus menggunakan `file_sd_configs` untuk menemukan target secara dinamis. Cukup letakkan file JSON di `telemetry/prometheus/targets/` dan Prometheus akan otomatis mendeteksinya dalam 15 detik — tanpa restart.
 
-File target ZeaVis Edu sudah tersedia di [`telemetry/prometheus/targets/zeavis-edu.json`](telemetry/prometheus/targets/zeavis-edu.json):
+File template sudah tersedia di [`telemetry/prometheus/targets/zeavis-edu.json`](telemetry/prometheus/targets/zeavis-edu.json). **Sebelum production, isi `__CHANGE_ME__` dengan IP Tailscale masing-masing service:**
 
 ```json
 [
-  { "targets": ["zeavis-api:3000"], "labels": { "service": "zeavis-api", "component": "backend" } },
-  { "targets": ["zeavis-ml:8000"],  "labels": { "service": "zeavis-ml", "component": "inference" } }
+  { "targets": ["100.x.x.a:3000"], "labels": { "service": "zeavis-api", "component": "backend", "env": "production" } },
+  { "targets": ["100.x.x.a:8000"],  "labels": { "service": "zeavis-ml", "component": "inference", "env": "production" } }
 ]
 ```
 
+> **Catatan:** Aplikasi ZeaVis Edu mengekspose port Docker-nya (`:3000`, `:8000`) langsung ke host via `docker-compose.yml`. Pastikan port-port tersebut terbuka di network Tailscale (biasanya iptables Tailscale mengizinkan koneksi ke port localhost).
+
 ### Environment Variables Telemetry
 
 | Variable | Default | Deskripsi |

From 64567986e1fb6b99f33eb840d3e8825b3168a462 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 21:40:09 +0700
Subject: [PATCH 10/28] feat: update ML service Dockerfile to archlinux base
 and add port bindings for api/ml metrics

---
 apps/ml-service/Dockerfile | 6 ++----
 docker-compose.yml         | 4 ++++
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/apps/ml-service/Dockerfile b/apps/ml-service/Dockerfile
index c982036..78e9fee 100644
--- a/apps/ml-service/Dockerfile
+++ b/apps/ml-service/Dockerfile
@@ -5,7 +5,7 @@ COPY apps/ml-service/Cargo.toml apps/ml-service/Cargo.lock ./
 COPY apps/ml-service/src ./src
 RUN cargo build --locked --release
 
-FROM debian:trixie-slim AS runner
+FROM archlinux:latest AS runner
 
 WORKDIR /app
 ENV MODEL_PATH=/app/model/model.onnx
@@ -14,9 +14,7 @@ ENV ML_SERVICE_HOST=0.0.0.0
 ENV ML_SERVICE_PORT=8000
 ENV RUST_LOG=info
 
-RUN apt-get update \
-  && apt-get install -y --no-install-recommends ca-certificates \
-  && rm -rf /var/lib/apt/lists/*
+RUN pacman -Syu --noconfirm ca-certificates 2>/dev/null
 
 COPY --from=builder /app/target/release/zeavis-ml-service /usr/local/bin/zeavis-ml-service
 COPY Machine_Learning/model/model.onnx /app/model/model.onnx
diff --git a/docker-compose.yml b/docker-compose.yml
index 7a70dcd..6dfb16f 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -38,6 +38,8 @@ services:
       API_PORT: "3000"
       WEB_APP_URL: https://zeavisedu.asepharyana.my.id
       ML_SERVICE_URL: ${ML_SERVICE_URL:-http://zeavis-ml:8000}
+    ports:
+      - "3000:3000"
     labels:
       traefik.enable: "true"
       traefik.http.routers.zeavis-api.rule: Host(`api-zeavisedu.asepharyana.my.id`)
@@ -58,6 +60,8 @@ services:
     environment:
       MODEL_PATH: /app/model/model.onnx
       MODEL_INPUT_SIZE: "224"
+    ports:
+      - "8000:8000"
     labels:
       traefik.enable: "true"
       traefik.http.routers.zeavis-ml.rule: Host(`ml-zeavisedu.asepharyana.my.id`)

From 685cf0955b9dd60eae3b300b3195c0ca3c60f4d4 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 22:14:14 +0700
Subject: [PATCH 11/28] fix: sync bun.lock with package.json changes

The lockfile was out of sync causing Docker builds to fail with
'lockfile had changes, but lockfile is frozen' on CI.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 bun.lock | 155 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 155 insertions(+)

diff --git a/bun.lock b/bun.lock
index b432085..92f3e5d 100644
--- a/bun.lock
+++ b/bun.lock
@@ -13,11 +13,17 @@
       "version": "0.1.0",
       "dependencies": {
         "@elysiajs/cors": "1.4.2",
+        "@opentelemetry/api": "1.9.1",
+        "@opentelemetry/exporter-prometheus": "0.218.0",
+        "@opentelemetry/instrumentation-http": "0.218.0",
+        "@opentelemetry/sdk-node": "0.218.0",
+        "@opentelemetry/semantic-conventions": "1.41.1",
         "@zeavis/shared": "workspace:*",
         "bcryptjs": "^3.0.3",
         "drizzle-orm": "^0.45.2",
         "elysia": "^1.4.28",
         "postgres": "^3.4.9",
+        "prom-client": "15.1.3",
       },
       "devDependencies": {
         "@types/bcryptjs": "^3.0.0",
@@ -41,6 +47,7 @@
         "react-dom": "^19.2.6",
         "react-router-dom": "^7.15.1",
         "tailwind-merge": "^3.6.0",
+        "web-vitals": "5.3.0",
         "zustand": "^5.0.13",
       },
       "devDependencies": {
@@ -132,6 +139,10 @@
 
     "@esbuild/win32-x64": ["@esbuild/win32-x64@0.25.12", "", { "os": "win32", "cpu": "x64" }, "sha512-alJC0uCZpTFrSL0CCDjcgleBXPnCrEAhTBILpeAp7M/OFgoqtAetfBzX0xM00MUsVVPpVjlPuMbREqnZCXaTnA=="],
 
+    "@grpc/grpc-js": ["@grpc/grpc-js@1.14.4", "", { "dependencies": { "@grpc/proto-loader": "^0.8.0", "@js-sdsl/ordered-map": "^4.4.2" } }, "sha512-k9Dj3DV/itK9D06Y8f190Qgop7/Ui+D0njFV3LHMPwPT75DpXLQohE9Wmz0QElrJnzsjB7KPWiKJbOl7IPDArQ=="],
+
+    "@grpc/proto-loader": ["@grpc/proto-loader@0.8.1", "", { "dependencies": { "lodash.camelcase": "^4.3.0", "long": "^5.0.0", "protobufjs": "^7.5.5", "yargs": "^17.7.2" }, "bin": { "proto-loader-gen-types": "build/bin/proto-loader-gen-types.js" } }, "sha512-wtF6h+DY6M3YaDBPAmvuuA6jV8Sif9MjtOI5euKFWRgCDl5PeDpPsHR9u2l6St5ceY8AZgoNDww5+HvEsXFsGg=="],
+
     "@jridgewell/gen-mapping": ["@jridgewell/gen-mapping@0.3.13", "", { "dependencies": { "@jridgewell/sourcemap-codec": "^1.5.0", "@jridgewell/trace-mapping": "^0.3.24" } }, "sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA=="],
 
     "@jridgewell/remapping": ["@jridgewell/remapping@2.3.5", "", { "dependencies": { "@jridgewell/gen-mapping": "^0.3.5", "@jridgewell/trace-mapping": "^0.3.24" } }, "sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ=="],
@@ -142,6 +153,8 @@
 
     "@jridgewell/trace-mapping": ["@jridgewell/trace-mapping@0.3.31", "", { "dependencies": { "@jridgewell/resolve-uri": "^3.1.0", "@jridgewell/sourcemap-codec": "^1.4.14" } }, "sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw=="],
 
+    "@js-sdsl/ordered-map": ["@js-sdsl/ordered-map@4.4.2", "", {}, "sha512-iUKgm52T8HOE/makSxjqoWhe95ZJA1/G1sYsGev2JDKUSS14KAgg1LHb+Ba+IPow0xflbnSkOsZcO08C7w1gYw=="],
+
     "@moonrepo/cli": ["@moonrepo/cli@2.2.5", "", { "dependencies": { "detect-libc": "^2.1.2" }, "optionalDependencies": { "@moonrepo/core-linux-arm64-gnu": "2.2.5", "@moonrepo/core-linux-arm64-musl": "2.2.5", "@moonrepo/core-linux-x64-gnu": "2.2.5", "@moonrepo/core-linux-x64-musl": "2.2.5", "@moonrepo/core-macos-arm64": "2.2.5", "@moonrepo/core-macos-x64": "2.2.5", "@moonrepo/core-windows-x64-msvc": "2.2.5" }, "bin": { "moon": "moon.js", "moonx": "moonx.js" } }, "sha512-MZPXJ7pvfcC77jedFPxwW4Z4XCPzeuBMmbVjRDFXq13bnyAYcaH5kdxkvyxX4WHeEHWyWuustOaJowZo3Q/SxA=="],
 
     "@moonrepo/core-linux-arm64-gnu": ["@moonrepo/core-linux-arm64-gnu@2.2.5", "", { "os": "linux", "cpu": "arm64" }, "sha512-61ajwr3oxCAC0vp879LgKzml3pu+kJ0xMd2Tr1fFMuqp+Xp9k+41VOaTlW7m3vhNQCTVuFFGKxh8KUeAtJk//w=="],
@@ -160,8 +173,88 @@
 
     "@napi-rs/wasm-runtime": ["@napi-rs/wasm-runtime@1.1.4", "", { "dependencies": { "@tybys/wasm-util": "^0.10.1" }, "peerDependencies": { "@emnapi/core": "^1.7.1", "@emnapi/runtime": "^1.7.1" } }, "sha512-3NQNNgA1YSlJb/kMH1ildASP9HW7/7kYnRI2szWJaofaS1hWmbGI4H+d3+22aGzXXN9IJ+n+GiFVcGipJP18ow=="],
 
+    "@opentelemetry/api": ["@opentelemetry/api@1.9.1", "", {}, "sha512-gLyJlPHPZYdAk1JENA9LeHejZe1Ti77/pTeFm/nMXmQH/HFZlcS/O2XJB+L8fkbrNSqhdtlvjBVjxwUYanNH5Q=="],
+
+    "@opentelemetry/api-logs": ["@opentelemetry/api-logs@0.218.0", "", { "dependencies": { "@opentelemetry/api": "^1.3.0" } }, "sha512-fmEWp5kXlGEc3i/lR698Hz41DfGyN4Tbe4g7L1AxSc7fF8Xeh/FQ9Quqpa9dVA413Q1Ad43QOLzU4JoXgbFPWw=="],
+
+    "@opentelemetry/configuration": ["@opentelemetry/configuration@0.218.0", "", { "dependencies": { "@opentelemetry/core": "2.7.1", "yaml": "^2.0.0" }, "peerDependencies": { "@opentelemetry/api": "^1.9.0" } }, "sha512-W8wIz7H2R1pufR5jfjb3gU2XkMpm2x/7b1RJcsuzvd70Il/rWWE+g5/Od7hQKrxRTSrTrOWlru101PWXz5I1EQ=="],
+
+    "@opentelemetry/context-async-hooks": ["@opentelemetry/context-async-hooks@2.7.1", "", { "peerDependencies": { "@opentelemetry/api": ">=1.0.0 <1.10.0" } }, "sha512-OPFBYuXEn1E4ja3Y6eeA7O+ZnLBNcXTV5Cgsn1VaqBZ6hC5FnpZPLBNme1LJY8ZtF4aOujPKFoeWN4ik487KuQ=="],
+
+    "@opentelemetry/core": ["@opentelemetry/core@2.7.1", "", { "dependencies": { "@opentelemetry/semantic-conventions": "^1.29.0" }, "peerDependencies": { "@opentelemetry/api": ">=1.0.0 <1.10.0" } }, "sha512-QAqIj32AtK6+pEVNG7EOVxHdE06RP+FM5qpiEJ4RtDcFIqKUZHYhl7/7UY5efhwmwNAg7j8QbJVBLxMerc0+gw=="],
+
+    "@opentelemetry/exporter-logs-otlp-grpc": ["@opentelemetry/exporter-logs-otlp-grpc@0.218.0", "", { "dependencies": { "@grpc/grpc-js": "^1.14.3", "@opentelemetry/core": "2.7.1", "@opentelemetry/otlp-exporter-base": "0.218.0", "@opentelemetry/otlp-grpc-exporter-base": "0.218.0", "@opentelemetry/otlp-transformer": "0.218.0", "@opentelemetry/sdk-logs": "0.218.0" }, "peerDependencies": { "@opentelemetry/api": "^1.3.0" } }, "sha512-hoxrNH1l/Xy6F9WTJ5IK+6j1r9nQFlPOmrnTlhYHTySdunfXLmUCPv3bQtKYntxag9h3wLYBZQ2HI6FOx+BT2g=="],
+
+    "@opentelemetry/exporter-logs-otlp-http": ["@opentelemetry/exporter-logs-otlp-http@0.218.0", "", { "dependencies": { "@opentelemetry/api-logs": "0.218.0", "@opentelemetry/core": "2.7.1", "@opentelemetry/otlp-exporter-base": "0.218.0", "@opentelemetry/otlp-transformer": "0.218.0", "@opentelemetry/sdk-logs": "0.218.0" }, "peerDependencies": { "@opentelemetry/api": "^1.3.0" } }, "sha512-Qx+4rpVHzgg89dawcWRHyt+XRXeLnhFz/qBtvggmjkcgPUdr+NAB0/u/eIPA8yAeJV0J80Vz43JZCh/XFvZFGw=="],
+
+    "@opentelemetry/exporter-logs-otlp-proto": ["@opentelemetry/exporter-logs-otlp-proto@0.218.0", "", { "dependencies": { "@opentelemetry/api-logs": "0.218.0", "@opentelemetry/core": "2.7.1", "@opentelemetry/otlp-exporter-base": "0.218.0", "@opentelemetry/otlp-transformer": "0.218.0", "@opentelemetry/resources": "2.7.1", "@opentelemetry/sdk-logs": "0.218.0", "@opentelemetry/sdk-trace-base": "2.7.1" }, "peerDependencies": { "@opentelemetry/api": "^1.3.0" } }, "sha512-1/noQNsp9gXD75HPzgjBrcF1+XTtry7pFAUfxVEJgg7mPv2AawKQuYkhMmJ8qjxz4Ubc3Y8bwvfxevXsKTq4cg=="],
+
+    "@opentelemetry/exporter-metrics-otlp-grpc": ["@opentelemetry/exporter-metrics-otlp-grpc@0.218.0", "", { "dependencies": { "@grpc/grpc-js": "^1.14.3", "@opentelemetry/core": "2.7.1", "@opentelemetry/exporter-metrics-otlp-http": "0.218.0", "@opentelemetry/otlp-exporter-base": "0.218.0", "@opentelemetry/otlp-grpc-exporter-base": "0.218.0", "@opentelemetry/otlp-transformer": "0.218.0", "@opentelemetry/resources": "2.7.1", "@opentelemetry/sdk-metrics": "2.7.1" }, "peerDependencies": { "@opentelemetry/api": "^1.3.0" } }, "sha512-YapQ9vNMX0NSZF6LK5pWAFfjpJleV2O9uYWfYGeb/5F1Kb9rPGK8tZDMJFa/sOksgdFuflDvYuA0B4qjDB4fjQ=="],
+
+    "@opentelemetry/exporter-metrics-otlp-http": ["@opentelemetry/exporter-metrics-otlp-http@0.218.0", "", { "dependencies": { "@opentelemetry/core": "2.7.1", "@opentelemetry/otlp-exporter-base": "0.218.0", "@opentelemetry/otlp-transformer": "0.218.0", "@opentelemetry/resources": "2.7.1", "@opentelemetry/sdk-metrics": "2.7.1" }, "peerDependencies": { "@opentelemetry/api": "^1.3.0" } }, "sha512-bV7d2OuMpZu2+gAaxUAhzfZ0h3WVZk8ETQUEE3DNSntbTaMpuITjtm8I0rNyHFdm7Ax57K6ty7SgFXlBmOLIvQ=="],
+
+    "@opentelemetry/exporter-metrics-otlp-proto": ["@opentelemetry/exporter-metrics-otlp-proto@0.218.0", "", { "dependencies": { "@opentelemetry/core": "2.7.1", "@opentelemetry/exporter-metrics-otlp-http": "0.218.0", "@opentelemetry/otlp-exporter-base": "0.218.0", "@opentelemetry/otlp-transformer": "0.218.0", "@opentelemetry/resources": "2.7.1", "@opentelemetry/sdk-metrics": "2.7.1" }, "peerDependencies": { "@opentelemetry/api": "^1.3.0" } }, "sha512-ubLddKjWULhla9YZRCj/rTBeppjJYE4e9w0icx5mTu3eFhWjQzbV75NYjXuIlEG+NJsBl6d+sTFw5Qu+oej4oQ=="],
+
+    "@opentelemetry/exporter-prometheus": ["@opentelemetry/exporter-prometheus@0.218.0", "", { "dependencies": { "@opentelemetry/core": "2.7.1", "@opentelemetry/resources": "2.7.1", "@opentelemetry/sdk-metrics": "2.7.1", "@opentelemetry/semantic-conventions": "^1.29.0" }, "peerDependencies": { "@opentelemetry/api": "^1.3.0" } }, "sha512-RT5oEyu1kddZJ1vt7/BUo5wV+P7hpNAESsR3dUd3+8deHuX7gWNoCOZn+SfDT+hJHlIJ5h/AxiCLXIrutswDJg=="],
+
+    "@opentelemetry/exporter-trace-otlp-grpc": ["@opentelemetry/exporter-trace-otlp-grpc@0.218.0", "", { "dependencies": { "@grpc/grpc-js": "^1.14.3", "@opentelemetry/core": "2.7.1", "@opentelemetry/otlp-exporter-base": "0.218.0", "@opentelemetry/otlp-grpc-exporter-base": "0.218.0", "@opentelemetry/otlp-transformer": "0.218.0", "@opentelemetry/resources": "2.7.1", "@opentelemetry/sdk-trace-base": "2.7.1" }, "peerDependencies": { "@opentelemetry/api": "^1.3.0" } }, "sha512-3fXxVQEj9TNAFaCi79JeFKfeLd0sDtInaR3gaZDVlzNSPHtz8PZuCV34JKWjD4XXzT20IdMe8IpX6mRVNDA4Tw=="],
+
+    "@opentelemetry/exporter-trace-otlp-http": ["@opentelemetry/exporter-trace-otlp-http@0.218.0", "", { "dependencies": { "@opentelemetry/core": "2.7.1", "@opentelemetry/otlp-exporter-base": "0.218.0", "@opentelemetry/otlp-transformer": "0.218.0", "@opentelemetry/resources": "2.7.1", "@opentelemetry/sdk-trace-base": "2.7.1" }, "peerDependencies": { "@opentelemetry/api": "^1.3.0" } }, "sha512-8dqezsmPhtKitIK/eTipZhYl9EX2/gNQ5zUMhaz3uxEURwfkNf8IPvo6yNfrzbxdtpAOybS/+h7wmIWYqFSpiw=="],
+
+    "@opentelemetry/exporter-trace-otlp-proto": ["@opentelemetry/exporter-trace-otlp-proto@0.218.0", "", { "dependencies": { "@opentelemetry/core": "2.7.1", "@opentelemetry/otlp-exporter-base": "0.218.0", "@opentelemetry/otlp-transformer": "0.218.0", "@opentelemetry/resources": "2.7.1", "@opentelemetry/sdk-trace-base": "2.7.1" }, "peerDependencies": { "@opentelemetry/api": "^1.3.0" } }, "sha512-r1Msf8SNLRmwh9J6XQ5uh82D7CdDWMNHnPB7LAVHjzut0TkSeKc5KcIvr4SvHvfk/xwN5gxC+VLKQ1k0o8PSPw=="],
+
+    "@opentelemetry/exporter-zipkin": ["@opentelemetry/exporter-zipkin@2.7.1", "", { "dependencies": { "@opentelemetry/core": "2.7.1", "@opentelemetry/resources": "2.7.1", "@opentelemetry/sdk-trace-base": "2.7.1", "@opentelemetry/semantic-conventions": "^1.29.0" }, "peerDependencies": { "@opentelemetry/api": "^1.0.0" } }, "sha512-mfsD9bKAxcKrh5+y08TPodvClBO0CznBE3p79YAGnO81WI4LrdsGA65T53e4iTSbCalW4WaUpkbeJcbpyIUHfg=="],
+
+    "@opentelemetry/instrumentation": ["@opentelemetry/instrumentation@0.218.0", "", { "dependencies": { "@opentelemetry/api-logs": "0.218.0", "import-in-the-middle": "^3.0.0", "require-in-the-middle": "^8.0.0" }, "peerDependencies": { "@opentelemetry/api": "^1.3.0" } }, "sha512-mIZil8Es+sYDK5m+DQiwAwF57F14TF2YlEqvIjZ/RQWcxDBwRGsKfdK2Tv65OU9meQKCMzSIFS9mxAcnAb6Bkg=="],
+
+    "@opentelemetry/instrumentation-http": ["@opentelemetry/instrumentation-http@0.218.0", "", { "dependencies": { "@opentelemetry/core": "2.7.1", "@opentelemetry/instrumentation": "0.218.0", "@opentelemetry/semantic-conventions": "^1.29.0", "forwarded-parse": "2.1.2" }, "peerDependencies": { "@opentelemetry/api": "^1.3.0" } }, "sha512-x9djaqdzpT8WAboep1H9nCAQ1E+MMsm08TNfA02TqM3bNNddZeiim+E3KMWVQFaX6JpUy7V0nm/wfN/K2Em+Zw=="],
+
+    "@opentelemetry/otlp-exporter-base": ["@opentelemetry/otlp-exporter-base@0.218.0", "", { "dependencies": { "@opentelemetry/core": "2.7.1", "@opentelemetry/otlp-transformer": "0.218.0" }, "peerDependencies": { "@opentelemetry/api": "^1.3.0" } }, "sha512-ZwqpkNL5W7RyGJPDZ9g06DvKp8KFTWPJPN12anpMQYSKpTSU0z3EIZuPq9vPGpS8siFyOqDYDAuCwlNO9FqgbA=="],
+
+    "@opentelemetry/otlp-grpc-exporter-base": ["@opentelemetry/otlp-grpc-exporter-base@0.218.0", "", { "dependencies": { "@grpc/grpc-js": "^1.14.3", "@opentelemetry/core": "2.7.1", "@opentelemetry/otlp-exporter-base": "0.218.0", "@opentelemetry/otlp-transformer": "0.218.0" }, "peerDependencies": { "@opentelemetry/api": "^1.3.0" } }, "sha512-H/lCGJ536N98VpYJOaWTQOkv4Dx6TnmStK6Rqfu1W7KkFbPAx04hjdYEMZF/YbnHzPUSIK4kM6OE2GKGBTpV9A=="],
+
+    "@opentelemetry/otlp-transformer": ["@opentelemetry/otlp-transformer@0.218.0", "", { "dependencies": { "@opentelemetry/api-logs": "0.218.0", "@opentelemetry/core": "2.7.1", "@opentelemetry/resources": "2.7.1", "@opentelemetry/sdk-logs": "0.218.0", "@opentelemetry/sdk-metrics": "2.7.1", "@opentelemetry/sdk-trace-base": "2.7.1" }, "peerDependencies": { "@opentelemetry/api": "^1.3.0" } }, "sha512-CFaKH87WAzjuJ4awowTTLzUvMfaRfiOFG5+qm5S5ncyalRtN4ecQ+YmuANJSCrVPuvZFEkUgKhBPBndxi3rHsQ=="],
+
+    "@opentelemetry/propagator-b3": ["@opentelemetry/propagator-b3@2.7.1", "", { "dependencies": { "@opentelemetry/core": "2.7.1" }, "peerDependencies": { "@opentelemetry/api": ">=1.0.0 <1.10.0" } }, "sha512-RJid6E2CKyeGfKBzXKF21ejabGMHypFkPAh3qZ+NvI+SGjuIye79t3PmiqcDgtRzdKH6ynXzbfslQ8DfpRUg2A=="],
+
+    "@opentelemetry/propagator-jaeger": ["@opentelemetry/propagator-jaeger@2.7.1", "", { "dependencies": { "@opentelemetry/core": "2.7.1" }, "peerDependencies": { "@opentelemetry/api": ">=1.0.0 <1.10.0" } }, "sha512-KMjVBHzP4N60bOzxja76M1F1hZZ43lGPga5ix+mkv9+kk1nx9SbkxSvJsMbuVUxdPQmsPTqGShmhN8ulrMOg6Q=="],
+
+    "@opentelemetry/resources": ["@opentelemetry/resources@2.7.1", "", { "dependencies": { "@opentelemetry/core": "2.7.1", "@opentelemetry/semantic-conventions": "^1.29.0" }, "peerDependencies": { "@opentelemetry/api": ">=1.3.0 <1.10.0" } }, "sha512-DeT6KKolmC4e/dRQvMQ/RwlnzhaqeiFOXY5ngoOPJ07GgVVKxZOg9EcrNZb5aTzUn+iCrJldAgOfQm1O/QfPAQ=="],
+
+    "@opentelemetry/sdk-logs": ["@opentelemetry/sdk-logs@0.218.0", "", { "dependencies": { "@opentelemetry/api-logs": "0.218.0", "@opentelemetry/core": "2.7.1", "@opentelemetry/resources": "2.7.1", "@opentelemetry/semantic-conventions": "^1.29.0" }, "peerDependencies": { "@opentelemetry/api": ">=1.4.0 <1.10.0" } }, "sha512-QvnNdugatFTVCJXH0Mcu7GOOJSylA9j127kIezOE4YwTI4YbowRons2K4WZTv5FMS8T4q9P0NdaRHdkSmeAIag=="],
+
+    "@opentelemetry/sdk-metrics": ["@opentelemetry/sdk-metrics@2.7.1", "", { "dependencies": { "@opentelemetry/core": "2.7.1", "@opentelemetry/resources": "2.7.1" }, "peerDependencies": { "@opentelemetry/api": ">=1.9.0 <1.10.0" } }, "sha512-MpDJdkiFDs3Pm1RHO3KByuZbuBdJEXEAkiC0+yJdsZGVCdf1RpHR6n+LHDcS7ffmfrt5kVCzJSCfm4z2C7v0uQ=="],
+
+    "@opentelemetry/sdk-node": ["@opentelemetry/sdk-node@0.218.0", "", { "dependencies": { "@opentelemetry/api-logs": "0.218.0", "@opentelemetry/configuration": "0.218.0", "@opentelemetry/context-async-hooks": "2.7.1", "@opentelemetry/core": "2.7.1", "@opentelemetry/exporter-logs-otlp-grpc": "0.218.0", "@opentelemetry/exporter-logs-otlp-http": "0.218.0", "@opentelemetry/exporter-logs-otlp-proto": "0.218.0", "@opentelemetry/exporter-metrics-otlp-grpc": "0.218.0", "@opentelemetry/exporter-metrics-otlp-http": "0.218.0", "@opentelemetry/exporter-metrics-otlp-proto": "0.218.0", "@opentelemetry/exporter-prometheus": "0.218.0", "@opentelemetry/exporter-trace-otlp-grpc": "0.218.0", "@opentelemetry/exporter-trace-otlp-http": "0.218.0", "@opentelemetry/exporter-trace-otlp-proto": "0.218.0", "@opentelemetry/exporter-zipkin": "2.7.1", "@opentelemetry/instrumentation": "0.218.0", "@opentelemetry/otlp-exporter-base": "0.218.0", "@opentelemetry/propagator-b3": "2.7.1", "@opentelemetry/propagator-jaeger": "2.7.1", "@opentelemetry/resources": "2.7.1", "@opentelemetry/sdk-logs": "0.218.0", "@opentelemetry/sdk-metrics": "2.7.1", "@opentelemetry/sdk-trace-base": "2.7.1", "@opentelemetry/sdk-trace-node": "2.7.1", "@opentelemetry/semantic-conventions": "^1.29.0" }, "peerDependencies": { "@opentelemetry/api": ">=1.3.0 <1.10.0" } }, "sha512-tPMjHrLV5gsfNdYqoRHjeGbCAZBXXD9c1Qo/2ut7VwnUABDNh76xNxrT0SEhkIIJuCN45bbN1vZnYL1gY0IkOg=="],
+
+    "@opentelemetry/sdk-trace-base": ["@opentelemetry/sdk-trace-base@2.7.1", "", { "dependencies": { "@opentelemetry/core": "2.7.1", "@opentelemetry/resources": "2.7.1", "@opentelemetry/semantic-conventions": "^1.29.0" }, "peerDependencies": { "@opentelemetry/api": ">=1.3.0 <1.10.0" } }, "sha512-NAYIlsF8MPUsKqJMiDQJTMPOmlbawC1Iz/omMLygZ1C9am8fTKYjTaI+OZM+WTY3t3Glo0wnOg/6/pac6RGPPw=="],
+
+    "@opentelemetry/sdk-trace-node": ["@opentelemetry/sdk-trace-node@2.7.1", "", { "dependencies": { "@opentelemetry/context-async-hooks": "2.7.1", "@opentelemetry/core": "2.7.1", "@opentelemetry/sdk-trace-base": "2.7.1" }, "peerDependencies": { "@opentelemetry/api": ">=1.0.0 <1.10.0" } }, "sha512-pCpQxU68lV+I9s9svqMyVu5iHdDDUnqUpSxqwyCU8A9ejEsSnMPCbearwsUO4yk08ZJzAIUCFuReMdVQvHrdvg=="],
+
+    "@opentelemetry/semantic-conventions": ["@opentelemetry/semantic-conventions@1.41.1", "", {}, "sha512-/UhIkaZgPutTFmQ7RnIJGgDXZmtEJ7Dvi86xNTFWcnRxVRNk/aotsqDJYeEvDP+FSMB2SdW+pQzNMcWP0rwuNA=="],
+
     "@oxc-project/types": ["@oxc-project/types@0.132.0", "", {}, "sha512-FESMOxil5Se014ui/Eq8fT5uHJo6nIRwH0PfJrZJXs6Gek3ZVFOrpUv3YIZT20m+extU98Hg1Ym72U58rlsxUQ=="],
 
+    "@protobufjs/aspromise": ["@protobufjs/aspromise@1.1.2", "", {}, "sha512-j+gKExEuLmKwvz3OgROXtrJ2UG2x8Ch2YZUxahh+s1F2HZ+wAceUNLkvy6zKCPVRkU++ZWQrdxsUeQXmcg4uoQ=="],
+
+    "@protobufjs/base64": ["@protobufjs/base64@1.1.2", "", {}, "sha512-AZkcAA5vnN/v4PDqKyMR5lx7hZttPDgClv83E//FMNhR2TMcLUhfRUBHCmSl0oi9zMgDDqRUJkSxO3wm85+XLg=="],
+
+    "@protobufjs/codegen": ["@protobufjs/codegen@2.0.5", "", {}, "sha512-zgXFLzW3Ap33e6d0Wlj4MGIm6Ce8O89n/apUaGNB/jx+hw+ruWEp7EwGUshdLKVRCxZW12fp9r40E1mQrf/34g=="],
+
+    "@protobufjs/eventemitter": ["@protobufjs/eventemitter@1.1.1", "", {}, "sha512-vW1GmwMZNnL+gMRaovlh9yZX74kc+TTU3FObkkurpMaRtBfLP3ldjS9KQWlwZgraRE0+dheEEoAxdzcJQ8eXZg=="],
+
+    "@protobufjs/fetch": ["@protobufjs/fetch@1.1.1", "", { "dependencies": { "@protobufjs/aspromise": "^1.1.1" } }, "sha512-GpptLrs57adMSuHi3VNj0mAF8dwh36LMaYF6XyJ6JMWlVsc+t42tm1HSEDmOs3A8fC9yyeisgLhsTVQokOZ0zw=="],
+
+    "@protobufjs/float": ["@protobufjs/float@1.0.2", "", {}, "sha512-Ddb+kVXlXst9d+R9PfTIxh1EdNkgoRe5tOX6t01f1lYWOvJnSPDBlG241QLzcyPdoNTsblLUdujGSE4RzrTZGQ=="],
+
+    "@protobufjs/inquire": ["@protobufjs/inquire@1.1.2", "", {}, "sha512-pa0vFRuws4wkvaXKK1uXZMAwAX4/t8ANaJo45iw/oQHNQ9q5xUzwgFmVJGXiga2BeN+zpX7Vf9vmsiIa2J+MUw=="],
+
+    "@protobufjs/path": ["@protobufjs/path@1.1.2", "", {}, "sha512-6JOcJ5Tm08dOHAbdR3GrvP+yUUfkjG5ePsHYczMFLq3ZmMkAD98cDgcT2iA1lJ9NVwFd4tH/iSSoe44YWkltEA=="],
+
+    "@protobufjs/pool": ["@protobufjs/pool@1.1.0", "", {}, "sha512-0kELaGSIDBKvcgS4zkjz1PeddatrjYcmMWOlAuAPwAeccUrPHdUqo/J6LiymHHEiJT5NrF1UVwxY14f+fy4WQw=="],
+
+    "@protobufjs/utf8": ["@protobufjs/utf8@1.1.1", "", {}, "sha512-oOAWABowe8EAbMyWKM0tYDKi8Yaox52D+HWZhAIJqQXbqe0xI/GV7FhLWqlEKreMkfDjshR5FKgi3mnle0h6Eg=="],
+
     "@radix-ui/react-compose-refs": ["@radix-ui/react-compose-refs@1.1.2", "", { "peerDependencies": { "@types/react": "*", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-z4eqJvfiNnFMHIIvXP3CY57y2WJs5g2v3X0zm9mEJkrkNv4rDxu+sg9Jh8EkXyeqBkB7SOcboo9dMVqhyrACIg=="],
 
     "@radix-ui/react-slot": ["@radix-ui/react-slot@1.2.4", "", { "dependencies": { "@radix-ui/react-compose-refs": "1.1.2" }, "peerDependencies": { "@types/react": "*", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-Jl+bCv8HxKnlTLVrcDE8zTMJ09R9/ukw4qBs/oZClOfoQk/cOTbDn+NceXfV7j09YPVQUryJPHurafcSg6EVKA=="],
@@ -258,16 +351,34 @@
 
     "@zeavis/web": ["@zeavis/web@workspace:apps/web"],
 
+    "acorn": ["acorn@8.16.0", "", { "bin": { "acorn": "bin/acorn" } }, "sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw=="],
+
+    "acorn-import-attributes": ["acorn-import-attributes@1.9.5", "", { "peerDependencies": { "acorn": "^8" } }, "sha512-n02Vykv5uA3eHGM/Z2dQrcD56kL8TyDb2p1+0P83PClMnC/nc+anbQRhIOWnSq4Ke/KvDPrY3C9hDtC/A3eHnQ=="],
+
+    "ansi-regex": ["ansi-regex@5.0.1", "", {}, "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ=="],
+
+    "ansi-styles": ["ansi-styles@4.3.0", "", { "dependencies": { "color-convert": "^2.0.1" } }, "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg=="],
+
     "bcryptjs": ["bcryptjs@3.0.3", "", { "bin": { "bcrypt": "bin/bcrypt" } }, "sha512-GlF5wPWnSa/X5LKM1o0wz0suXIINz1iHRLvTS+sLyi7XPbe5ycmYI3DlZqVGZZtDgl4DmasFg7gOB3JYbphV5g=="],
 
+    "bintrees": ["bintrees@1.0.2", "", {}, "sha512-VOMgTMwjAaUG580SXn3LacVgjurrbMme7ZZNYGSSV7mmtY6QQRh0Eg3pwIcntQ77DErK1L0NxkbetjcoXzVwKw=="],
+
     "buffer-from": ["buffer-from@1.1.2", "", {}, "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ=="],
 
     "bun-types": ["bun-types@1.3.14", "", { "dependencies": { "@types/node": "*" } }, "sha512-4N0ig0fEomHt5R0KCFWjovxow98rIoRwKolrYdCcknNwMekCXRnWEUvgu5soYV8QXtVsrUD8B95MBOZGPvr6KQ=="],
 
+    "cjs-module-lexer": ["cjs-module-lexer@2.2.0", "", {}, "sha512-4bHTS2YuzUvtoLjdy+98ykbNB5jS0+07EvFNXerqZQJ89F7DI6ET7OQo/HJuW6K0aVsKA9hj9/RVb2kQVOrPDQ=="],
+
     "class-variance-authority": ["class-variance-authority@0.7.1", "", { "dependencies": { "clsx": "^2.1.1" } }, "sha512-Ka+9Trutv7G8M6WT6SeiRWz792K5qEqIGEGzXKhAE6xOWAY6pPH8U+9IY3oCMv6kqTmLsv7Xh/2w2RigkePMsg=="],
 
+    "cliui": ["cliui@8.0.1", "", { "dependencies": { "string-width": "^4.2.0", "strip-ansi": "^6.0.1", "wrap-ansi": "^7.0.0" } }, "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ=="],
+
     "clsx": ["clsx@2.1.1", "", {}, "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA=="],
 
+    "color-convert": ["color-convert@2.0.1", "", { "dependencies": { "color-name": "~1.1.4" } }, "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ=="],
+
+    "color-name": ["color-name@1.1.4", "", {}, "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="],
+
     "cookie": ["cookie@1.1.1", "", {}, "sha512-ei8Aos7ja0weRpFzJnEA9UHJ/7XQmqglbRwnf2ATjcB9Wq874VKH9kfjjirM6UhU2/E5fFYadylyhFldcqSidQ=="],
 
     "csstype": ["csstype@3.2.3", "", {}, "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ=="],
@@ -282,10 +393,14 @@
 
     "elysia": ["elysia@1.4.28", "", { "dependencies": { "cookie": "^1.1.1", "exact-mirror": "^0.2.7", "fast-decode-uri-component": "^1.0.1", "memoirist": "^0.4.0" }, "peerDependencies": { "@sinclair/typebox": ">= 0.34.0 < 1", "@types/bun": ">= 1.2.0", "file-type": ">= 20.0.0", "openapi-types": ">= 12.0.0", "typescript": ">= 5.0.0" }, "optionalPeers": ["@types/bun", "typescript"] }, "sha512-Vrx8sBnvq8squS/3yNBzR1jBXI+SgmnmvwawPjNuEHndUe5l1jV2Gp6JJ4ulDkEB8On6bWmmuyPpA+bq4t+WYg=="],
 
+    "emoji-regex": ["emoji-regex@8.0.0", "", {}, "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="],
+
     "enhanced-resolve": ["enhanced-resolve@5.22.0", "", { "dependencies": { "graceful-fs": "^4.2.4", "tapable": "^2.3.3" } }, "sha512-xYcDWrpELkFzz9SpZ3PlI6Eu6eD93Yf0WLDRxikGhWJ3MAir2SNZTIVCVZqZ/NUyx8AdMc2gT9C0gPiw18kG+A=="],
 
     "esbuild": ["esbuild@0.25.12", "", { "optionalDependencies": { "@esbuild/aix-ppc64": "0.25.12", "@esbuild/android-arm": "0.25.12", "@esbuild/android-arm64": "0.25.12", "@esbuild/android-x64": "0.25.12", "@esbuild/darwin-arm64": "0.25.12", "@esbuild/darwin-x64": "0.25.12", "@esbuild/freebsd-arm64": "0.25.12", "@esbuild/freebsd-x64": "0.25.12", "@esbuild/linux-arm": "0.25.12", "@esbuild/linux-arm64": "0.25.12", "@esbuild/linux-ia32": "0.25.12", "@esbuild/linux-loong64": "0.25.12", "@esbuild/linux-mips64el": "0.25.12", "@esbuild/linux-ppc64": "0.25.12", "@esbuild/linux-riscv64": "0.25.12", "@esbuild/linux-s390x": "0.25.12", "@esbuild/linux-x64": "0.25.12", "@esbuild/netbsd-arm64": "0.25.12", "@esbuild/netbsd-x64": "0.25.12", "@esbuild/openbsd-arm64": "0.25.12", "@esbuild/openbsd-x64": "0.25.12", "@esbuild/openharmony-arm64": "0.25.12", "@esbuild/sunos-x64": "0.25.12", "@esbuild/win32-arm64": "0.25.12", "@esbuild/win32-ia32": "0.25.12", "@esbuild/win32-x64": "0.25.12" }, "bin": { "esbuild": "bin/esbuild" } }, "sha512-bbPBYYrtZbkt6Os6FiTLCTFxvq4tt3JKall1vRwshA3fdVztsLAatFaZobhkBC8/BrPetoa0oksYoKXoG4ryJg=="],
 
+    "escalade": ["escalade@3.2.0", "", {}, "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA=="],
+
     "exact-mirror": ["exact-mirror@0.2.7", "", { "peerDependencies": { "@sinclair/typebox": "^0.34.15" }, "optionalPeers": ["@sinclair/typebox"] }, "sha512-+MeEmDcLA4o/vjK2zujgk+1VTxPR4hdp23qLqkWfStbECtAq9gmsvQa3LW6z/0GXZyHJobrCnmy1cdeE7BjsYg=="],
 
     "fast-decode-uri-component": ["fast-decode-uri-component@1.0.1", "", {}, "sha512-WKgKWg5eUxvRZGwW8FvfbaH7AXSh2cL+3j5fMGzUMCxWBJ3dV3a7Wz8y2f/uQ0e3B6WmodD3oS54jTQ9HVTIIg=="],
@@ -294,8 +409,12 @@
 
     "file-type": ["file-type@22.0.1", "", { "dependencies": { "@tokenizer/inflate": "^0.4.1", "strtok3": "^10.3.5", "token-types": "^6.1.2", "uint8array-extras": "^1.5.0" } }, "sha512-ww5Mhre0EE+jmBvOXTmXAbEMuZE7uX4a3+oRCQFNj8w++g3ev913N6tXQz0XTXbueQ5TWQfm6BdaViEHHn8bhA=="],
 
+    "forwarded-parse": ["forwarded-parse@2.1.2", "", {}, "sha512-alTFZZQDKMporBH77856pXgzhEzaUVmLCDk+egLgIgHst3Tpndzz8MnKe+GzRJRfvVdn69HhpW7cmXzvtLvJAw=="],
+
     "fsevents": ["fsevents@2.3.3", "", { "os": "darwin" }, "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw=="],
 
+    "get-caller-file": ["get-caller-file@2.0.5", "", {}, "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg=="],
+
     "get-tsconfig": ["get-tsconfig@4.14.0", "", { "dependencies": { "resolve-pkg-maps": "^1.0.0" } }, "sha512-yTb+8DXzDREzgvYmh6s9vHsSVCHeC0G3PI5bEXNBHtmshPnO+S5O7qgLEOn0I5QvMy6kpZN8K1NKGyilLb93wA=="],
 
     "globrex": ["globrex@0.1.2", "", {}, "sha512-uHJgbwAMwNFf5mLst7IWLNg14x1CkeqglJb/K3doi4dw6q2IvAAmM/Y81kevy83wP+Sst+nutFTYOGg3d1lsxg=="],
@@ -304,6 +423,10 @@
 
     "ieee754": ["ieee754@1.2.1", "", {}, "sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA=="],
 
+    "import-in-the-middle": ["import-in-the-middle@3.0.1", "", { "dependencies": { "acorn": "^8.15.0", "acorn-import-attributes": "^1.9.5", "cjs-module-lexer": "^2.2.0", "module-details-from-path": "^1.0.4" } }, "sha512-pYkiyXVL2Mf3pozdlDGV6NAObxQx13Ae8knZk1UJRJ6uRW/ZRmTGHlQYtrsSl7ubuE5F8CD1z+s1n4RHNuTtuA=="],
+
+    "is-fullwidth-code-point": ["is-fullwidth-code-point@3.0.0", "", {}, "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg=="],
+
     "jiti": ["jiti@2.7.0", "", { "bin": { "jiti": "lib/jiti-cli.mjs" } }, "sha512-AC/7JofJvZGrrneWNaEnJeOLUx+JlGt7tNa0wZiRPT4MY1wmfKjt2+6O2p2uz2+skll8OZZmJMNqeke7kKbNgQ=="],
 
     "lightningcss": ["lightningcss@1.32.0", "", { "dependencies": { "detect-libc": "^2.0.3" }, "optionalDependencies": { "lightningcss-android-arm64": "1.32.0", "lightningcss-darwin-arm64": "1.32.0", "lightningcss-darwin-x64": "1.32.0", "lightningcss-freebsd-x64": "1.32.0", "lightningcss-linux-arm-gnueabihf": "1.32.0", "lightningcss-linux-arm64-gnu": "1.32.0", "lightningcss-linux-arm64-musl": "1.32.0", "lightningcss-linux-x64-gnu": "1.32.0", "lightningcss-linux-x64-musl": "1.32.0", "lightningcss-win32-arm64-msvc": "1.32.0", "lightningcss-win32-x64-msvc": "1.32.0" } }, "sha512-NXYBzinNrblfraPGyrbPoD19C1h9lfI/1mzgWYvXUTe414Gz/X1FD2XBZSZM7rRTrMA8JL3OtAaGifrIKhQ5yQ=="],
@@ -330,12 +453,18 @@
 
     "lightningcss-win32-x64-msvc": ["lightningcss-win32-x64-msvc@1.32.0", "", { "os": "win32", "cpu": "x64" }, "sha512-Amq9B/SoZYdDi1kFrojnoqPLxYhQ4Wo5XiL8EVJrVsB8ARoC1PWW6VGtT0WKCemjy8aC+louJnjS7U18x3b06Q=="],
 
+    "lodash.camelcase": ["lodash.camelcase@4.3.0", "", {}, "sha512-TwuEnCnxbc3rAvhf/LbG7tJUDzhqXyFnv3dtzLOPgCG/hODL7WFnsbwktkD7yUV0RrreP/l1PALq/YSg6VvjlA=="],
+
+    "long": ["long@5.3.2", "", {}, "sha512-mNAgZ1GmyNhD7AuqnTG3/VQ26o760+ZYBPKjPvugO8+nLbYfX6TVpJPseBvopbdY+qpZ/lKUnmEc1LeZYS3QAA=="],
+
     "lucide-react": ["lucide-react@1.16.0", "", { "peerDependencies": { "react": "^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0" } }, "sha512-dYwyPzb4MEKpGUmNYk3WKWPnMrHs3FKM+q94kAnJrcDIqqn1hq2xY8scaS2ovsOCM5D51ey2gaRG3PBb1vgoYQ=="],
 
     "magic-string": ["magic-string@0.30.21", "", { "dependencies": { "@jridgewell/sourcemap-codec": "^1.5.5" } }, "sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ=="],
 
     "memoirist": ["memoirist@0.4.0", "", {}, "sha512-zxTgA0mSYELa66DimuNQDvyLq36AwDlTuVRbnQtB+VuTcKWm5Qc4z3WkSpgsFWHNhexqkIooqpv4hdcqrX5Nmg=="],
 
+    "module-details-from-path": ["module-details-from-path@1.0.4", "", {}, "sha512-EGWKgxALGMgzvxYF1UyGTy0HXX/2vHLkw6+NvDKW2jypWbHpjQuj4UMcqQWXHERJhVGKikolT06G3bcKe4fi7w=="],
+
     "ms": ["ms@2.1.3", "", {}, "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA=="],
 
     "nanoid": ["nanoid@3.3.12", "", { "bin": { "nanoid": "bin/nanoid.cjs" } }, "sha512-ZB9RH/39qpq5Vu6Y+NmUaFhQR6pp+M2Xt76XBnEwDaGcVAqhlvxrl3B2bKS5D3NH3QR76v3aSrKaF/Kiy7lEtQ=="],
@@ -350,6 +479,10 @@
 
     "postgres": ["postgres@3.4.9", "", {}, "sha512-GD3qdB0x1z9xgFI6cdRD6xu2Sp2WCOEoe3mtnyB5Ee0XrrL5Pe+e4CCnJrRMnL1zYtRDZmQQVbvOttLnKDLnaw=="],
 
+    "prom-client": ["prom-client@15.1.3", "", { "dependencies": { "@opentelemetry/api": "^1.4.0", "tdigest": "^0.1.1" } }, "sha512-6ZiOBfCywsD4k1BN9IX0uZhF+tJkV8q8llP64G5Hajs4JOeVLPCwpPVcpXy3BwYiUGgyJzsJJQeOIv7+hDSq8g=="],
+
+    "protobufjs": ["protobufjs@7.6.2", "", { "dependencies": { "@protobufjs/aspromise": "^1.1.2", "@protobufjs/base64": "^1.1.2", "@protobufjs/codegen": "^2.0.5", "@protobufjs/eventemitter": "^1.1.1", "@protobufjs/fetch": "^1.1.1", "@protobufjs/float": "^1.0.2", "@protobufjs/inquire": "^1.1.2", "@protobufjs/path": "^1.1.2", "@protobufjs/pool": "^1.1.0", "@protobufjs/utf8": "^1.1.1", "@types/node": ">=13.7.0", "long": "^5.3.2" } }, "sha512-N9EiLovGEQOJSPF26Ij7qUGvahfEnq0eeYZ02aigIedkmz1qZSwjnP9SBITHJuF/6MYbIW4HDN8zdYjsjqJKXQ=="],
+
     "react": ["react@19.2.6", "", {}, "sha512-sfWGGfavi0xr8Pg0sVsyHMAOziVYKgPLNrS7ig+ivMNb3wbCBw3KxtflsGBAwD3gYQlE/AEZsTLgToRrSCjb0Q=="],
 
     "react-dom": ["react-dom@19.2.6", "", { "dependencies": { "scheduler": "^0.27.0" }, "peerDependencies": { "react": "^19.2.6" } }, "sha512-0prMI+hvBbPjsWnxDLxlCGyM8PN6UuWjEUCYmZhO67xIV9Xasa/r/vDnq+Xyq4Lo27g8QSbO5YzARu0D1Sps3g=="],
@@ -358,6 +491,10 @@
 
     "react-router-dom": ["react-router-dom@7.15.1", "", { "dependencies": { "react-router": "7.15.1" }, "peerDependencies": { "react": ">=18", "react-dom": ">=18" } }, "sha512-AzF62gjY6U9rkMq4RfP/r2EVtQ7DMfNMjyOp/flLTCrtRylLiK4wT4pSq6O8rOXZ2eXdZYJPEYe+ifomiv+Igg=="],
 
+    "require-directory": ["require-directory@2.1.1", "", {}, "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q=="],
+
+    "require-in-the-middle": ["require-in-the-middle@8.0.1", "", { "dependencies": { "debug": "^4.3.5", "module-details-from-path": "^1.0.3" } }, "sha512-QT7FVMXfWOYFbeRBF6nu+I6tr2Tf3u0q8RIEjNob/heKY/nh7drD/k7eeMFmSQgnTtCzLDcCu/XEnpW2wk4xCQ=="],
+
     "resolve-pkg-maps": ["resolve-pkg-maps@1.0.0", "", {}, "sha512-seS2Tj26TBVOC2NIc2rOe2y2ZO7efxITtLZcGSOnHHNOQ7CkiUBfw0Iw2ck6xkIhPwLhKNLS8BO+hEpngQlqzw=="],
 
     "rolldown": ["rolldown@1.0.2", "", { "dependencies": { "@oxc-project/types": "=0.132.0", "@rolldown/pluginutils": "^1.0.0" }, "optionalDependencies": { "@rolldown/binding-android-arm64": "1.0.2", "@rolldown/binding-darwin-arm64": "1.0.2", "@rolldown/binding-darwin-x64": "1.0.2", "@rolldown/binding-freebsd-x64": "1.0.2", "@rolldown/binding-linux-arm-gnueabihf": "1.0.2", "@rolldown/binding-linux-arm64-gnu": "1.0.2", "@rolldown/binding-linux-arm64-musl": "1.0.2", "@rolldown/binding-linux-ppc64-gnu": "1.0.2", "@rolldown/binding-linux-s390x-gnu": "1.0.2", "@rolldown/binding-linux-x64-gnu": "1.0.2", "@rolldown/binding-linux-x64-musl": "1.0.2", "@rolldown/binding-openharmony-arm64": "1.0.2", "@rolldown/binding-wasm32-wasi": "1.0.2", "@rolldown/binding-win32-arm64-msvc": "1.0.2", "@rolldown/binding-win32-x64-msvc": "1.0.2" }, "bin": { "rolldown": "./bin/cli.mjs" } }, "sha512-oZx5zVDtVB44AW3eaifgDml1gWRDZGvjcfdxonE4swNPG98PrrXjaO/KrnUjzlMnztCCRVlUueA1kCXhARGk6g=="],
@@ -372,6 +509,10 @@
 
     "source-map-support": ["source-map-support@0.5.21", "", { "dependencies": { "buffer-from": "^1.0.0", "source-map": "^0.6.0" } }, "sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w=="],
 
+    "string-width": ["string-width@4.2.3", "", { "dependencies": { "emoji-regex": "^8.0.0", "is-fullwidth-code-point": "^3.0.0", "strip-ansi": "^6.0.1" } }, "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g=="],
+
+    "strip-ansi": ["strip-ansi@6.0.1", "", { "dependencies": { "ansi-regex": "^5.0.1" } }, "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A=="],
+
     "strtok3": ["strtok3@10.3.5", "", { "dependencies": { "@tokenizer/token": "^0.3.0" } }, "sha512-ki4hZQfh5rX0QDLLkOCj+h+CVNkqmp/CMf8v8kZpkNVK6jGQooMytqzLZYUVYIZcFZ6yDB70EfD8POcFXiF5oA=="],
 
     "tailwind-merge": ["tailwind-merge@3.6.0", "", {}, "sha512-uxL7qAVQriqRQPAyK3pj66VqskWqoZ37PW94jwOTwNfq/z9oyu1V+eqrZqtR2+fCiXdYOZe/Modt8GtvqNzu+w=="],
@@ -380,6 +521,8 @@
 
     "tapable": ["tapable@2.3.3", "", {}, "sha512-uxc/zpqFg6x7C8vOE7lh6Lbda8eEL9zmVm/PLeTPBRhh1xCgdWaQ+J1CUieGpIfm2HdtsUpRv+HshiasBMcc6A=="],
 
+    "tdigest": ["tdigest@0.1.2", "", { "dependencies": { "bintrees": "1.0.2" } }, "sha512-+G0LLgjjo9BZX2MfdvPfH+MKLCrxlXSYec5DaPYP1fe6Iyhf0/fSmJ0bFiZ1F8BT6cGXl2LpltQptzjXKWEkKA=="],
+
     "tinyglobby": ["tinyglobby@0.2.16", "", { "dependencies": { "fdir": "^6.5.0", "picomatch": "^4.0.4" } }, "sha512-pn99VhoACYR8nFHhxqix+uvsbXineAasWm5ojXoN8xEwK5Kd3/TrhNn1wByuD52UxWRLy8pu+kRMniEi6Eq9Zg=="],
 
     "token-types": ["token-types@6.1.2", "", { "dependencies": { "@borewit/text-codec": "^0.2.1", "@tokenizer/token": "^0.3.0", "ieee754": "^1.2.1" } }, "sha512-dRXchy+C0IgK8WPC6xvCHFRIWYUbqqdEIKPaKo/AcTUNzwLTK6AH7RjdLWsEZcAN/TBdtfUw3PYEgPr5VPr6ww=="],
@@ -400,6 +543,18 @@
 
     "vite-tsconfig-paths": ["vite-tsconfig-paths@6.1.1", "", { "dependencies": { "debug": "^4.1.1", "globrex": "^0.1.2", "tsconfck": "^3.0.3" }, "peerDependencies": { "vite": "*" } }, "sha512-2cihq7zliibCCZ8P9cKJrQBkfgdvcFkOOc3Y02o3GWUDLgqjWsZudaoiuOwO/gzTzy17cS5F7ZPo4bsnS4DGkg=="],
 
+    "web-vitals": ["web-vitals@5.3.0", "", {}, "sha512-q6LWsLatGYZp5VGBIOvbTj6JBV2nOmC8KvWztXBmwJcfFAzhwKwbOxhUH306XY3CcaZDUlSmSuNPBsCn0bFu+g=="],
+
+    "wrap-ansi": ["wrap-ansi@7.0.0", "", { "dependencies": { "ansi-styles": "^4.0.0", "string-width": "^4.1.0", "strip-ansi": "^6.0.0" } }, "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q=="],
+
+    "y18n": ["y18n@5.0.8", "", {}, "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA=="],
+
+    "yaml": ["yaml@2.9.0", "", { "bin": { "yaml": "bin.mjs" } }, "sha512-2AvhNX3mb8zd6Zy7INTtSpl1F15HW6Wnqj0srWlkKLcpYl/gMIMJiyuGq2KeI2YFxUPjdlB+3Lc10seMLtL4cA=="],
+
+    "yargs": ["yargs@17.7.2", "", { "dependencies": { "cliui": "^8.0.1", "escalade": "^3.1.1", "get-caller-file": "^2.0.5", "require-directory": "^2.1.1", "string-width": "^4.2.3", "y18n": "^5.0.5", "yargs-parser": "^21.1.1" } }, "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w=="],
+
+    "yargs-parser": ["yargs-parser@21.1.1", "", {}, "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw=="],
+
     "zustand": ["zustand@5.0.13", "", { "peerDependencies": { "@types/react": ">=18.0.0", "immer": ">=9.0.6", "react": ">=18.0.0", "use-sync-external-store": ">=1.2.0" }, "optionalPeers": ["@types/react", "immer", "react", "use-sync-external-store"] }, "sha512-efI2tVaVQPqtOh114loML/Z80Y4NP3yc+Ff0fYiZJPauNeWZeIp/bRFD7I9bfmCOYBh/PHxlglQ9+wvlwnPikQ=="],
 
     "@esbuild-kit/core-utils/esbuild": ["esbuild@0.18.20", "", { "optionalDependencies": { "@esbuild/android-arm": "0.18.20", "@esbuild/android-arm64": "0.18.20", "@esbuild/android-x64": "0.18.20", "@esbuild/darwin-arm64": "0.18.20", "@esbuild/darwin-x64": "0.18.20", "@esbuild/freebsd-arm64": "0.18.20", "@esbuild/freebsd-x64": "0.18.20", "@esbuild/linux-arm": "0.18.20", "@esbuild/linux-arm64": "0.18.20", "@esbuild/linux-ia32": "0.18.20", "@esbuild/linux-loong64": "0.18.20", "@esbuild/linux-mips64el": "0.18.20", "@esbuild/linux-ppc64": "0.18.20", "@esbuild/linux-riscv64": "0.18.20", "@esbuild/linux-s390x": "0.18.20", "@esbuild/linux-x64": "0.18.20", "@esbuild/netbsd-x64": "0.18.20", "@esbuild/openbsd-x64": "0.18.20", "@esbuild/sunos-x64": "0.18.20", "@esbuild/win32-arm64": "0.18.20", "@esbuild/win32-ia32": "0.18.20", "@esbuild/win32-x64": "0.18.20" }, "bin": { "esbuild": "bin/esbuild" } }, "sha512-ceqxoedUrcayh7Y7ZX6NdbbDzGROiyVBgC4PriJThBKSVPWnnFHZAkfI1lJT8QFkOwH4qOS2SJkS4wvpGl8BpA=="],

From 521aaa184ec33d0cbfad2af68c8a2ec3b65f160d Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 22:18:17 +0700
Subject: [PATCH 12/28] fix: handle local VPS changes during deploy by using
 git reset --hard instead of pull

Switches from git pull --ff-only to git fetch + git reset --hard
origin/main to avoid failing when VPS has uncommitted local changes
to tracked files (apps/ml-service/Dockerfile, docker-compose.yml).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 .github/workflows/deploy.yml | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
index 1624c5c..b7b360b 100644
--- a/.github/workflows/deploy.yml
+++ b/.github/workflows/deploy.yml
@@ -118,8 +118,8 @@ jobs:
             fi
 
             cd "$DEPLOY_PATH"
-            git checkout main
-            git pull --ff-only origin main
+            git fetch origin main
+            git reset --hard origin/main
 
             {
               printf 'GITHUB_REPOSITORY=%s\n' "$REPO_SLUG"

From 0fc305f21b057f76295a650cfeb02ae31bdd753d Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 22:21:31 +0700
Subject: [PATCH 13/28] fix: create telemetry-net on deploy to fix docker
 compose up

App services reference telemetry-net as external, but telemetry runs
on a separate VPS. Creating the network as empty on the app VPS so
docker compose up doesn't fail.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 .github/workflows/deploy.yml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
index b7b360b..d6b7e6a 100644
--- a/.github/workflows/deploy.yml
+++ b/.github/workflows/deploy.yml
@@ -133,6 +133,7 @@ jobs:
 
             docker login ghcr.io -u ${{ github.actor }} -p ${{ secrets.GITHUB_TOKEN }}
             docker network create app-shared-net 2>/dev/null || true
+            docker network create telemetry-net 2>/dev/null || true
             docker compose pull
             docker compose up -d
             docker compose ps

From ff5e5fd09166db967ea2752e54025400292fdd05 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 22:24:49 +0700
Subject: [PATCH 14/28] fix: add --force-recreate to docker compose up in
 deploy

---
 .github/workflows/deploy.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
index d6b7e6a..df0a003 100644
--- a/.github/workflows/deploy.yml
+++ b/.github/workflows/deploy.yml
@@ -135,7 +135,7 @@ jobs:
             docker network create app-shared-net 2>/dev/null || true
             docker network create telemetry-net 2>/dev/null || true
             docker compose pull
-            docker compose up -d
+            docker compose up -d --remove-orphans --force-recreate
             docker compose ps
             docker compose ps | grep -q "zeavis-web.*Up" || exit 1
             docker compose ps | grep -q "zeavis-api.*Up" || exit 1

From 02fbb564920e90b8449f81510337fd0e3fb15cc3 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 22:27:48 +0700
Subject: [PATCH 15/28] fix: docker compose down before up to clear container
 name conflicts

---
 .github/workflows/deploy.yml | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
index df0a003..219874a 100644
--- a/.github/workflows/deploy.yml
+++ b/.github/workflows/deploy.yml
@@ -134,8 +134,9 @@ jobs:
             docker login ghcr.io -u ${{ github.actor }} -p ${{ secrets.GITHUB_TOKEN }}
             docker network create app-shared-net 2>/dev/null || true
             docker network create telemetry-net 2>/dev/null || true
+            docker compose down --remove-orphans || true
             docker compose pull
-            docker compose up -d --remove-orphans --force-recreate
+            docker compose up -d
             docker compose ps
             docker compose ps | grep -q "zeavis-web.*Up" || exit 1
             docker compose ps | grep -q "zeavis-api.*Up" || exit 1

From b3494e2a9b11f648cc445abd25740854282a025b Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 22:30:45 +0700
Subject: [PATCH 16/28] fix: force-remove containers before docker compose up

---
 .github/workflows/deploy.yml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
index 219874a..941ee80 100644
--- a/.github/workflows/deploy.yml
+++ b/.github/workflows/deploy.yml
@@ -135,6 +135,7 @@ jobs:
             docker network create app-shared-net 2>/dev/null || true
             docker network create telemetry-net 2>/dev/null || true
             docker compose down --remove-orphans || true
+            docker rm -f zeavis-web zeavis-api zeavis-ml 2>/dev/null || true
             docker compose pull
             docker compose up -d
             docker compose ps

From 420dc4725b8ad62b59697efa9ef4e729a6f05b0d Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 22:55:03 +0700
Subject: [PATCH 17/28] feat: add Node Exporter service for system metrics
 scraping in docker-compose

---
 docker-compose.yml | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/docker-compose.yml b/docker-compose.yml
index 6dfb16f..fef32f4 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -48,6 +48,23 @@ services:
       traefik.http.routers.zeavis-api.tls.certresolver: cloudflare
       traefik.http.services.zeavis-api.loadbalancer.server.port: "3000"
 
+  # Node Exporter — expose system metrics (CPU, RAM, disk) for Prometheus scraping
+  node_exporter:
+    image: prom/node-exporter:v1.8.2
+    container_name: zeavis-node-exporter
+    restart: unless-stopped
+    ports:
+      - "9100:9100"
+    command:
+      - "--path.rootfs=/host"
+      - "--web.listen-address=:9100"
+    volumes:
+      - /:/host:ro,rslave
+    pid: host
+    networks:
+      - app-shared-net
+      - telemetry-net
+
   ml:
     image: ghcr.io/${GITHUB_REPOSITORY:-mytheclipse/zeavis-edu}/ml:main
     container_name: zeavis-ml

From 204dd0311bfa231ce18c4aa2fce24fb6c35056f4 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 22:58:43 +0700
Subject: [PATCH 18/28] feat(ci): add telemetry CI/CD workflow for build and
 deploy to Orange VPS

---
 .github/workflows/telemetry-ci-cd.yml | 244 ++++++++++++++++++++++++++
 1 file changed, 244 insertions(+)
 create mode 100644 .github/workflows/telemetry-ci-cd.yml

diff --git a/.github/workflows/telemetry-ci-cd.yml b/.github/workflows/telemetry-ci-cd.yml
new file mode 100644
index 0000000..36e3396
--- /dev/null
+++ b/.github/workflows/telemetry-ci-cd.yml
@@ -0,0 +1,244 @@
+name: Telemetry CI/CD — Build & Deploy to Orange VPS
+
+on:
+  push:
+    branches: [main, master]
+    paths:
+      - 'telemetry/**'
+      - '.github/workflows/telemetry-ci-cd.yml'
+  workflow_dispatch:
+
+env:
+  GHCR_REGISTRY: ghcr.io
+  METRIC_INGESTER_IMAGE: mytheclipse/telemetry-metric-ingester
+  QUERY_PROXY_IMAGE: mytheclipse/telemetry-query-proxy
+
+jobs:
+  ##############################################################################
+  # BUILD: Metric Ingester (Go service)
+  ##############################################################################
+  build-metric-ingester:
+    name: Build - Metric Ingester
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          submodules: recursive
+
+      - uses: docker/setup-buildx-action@v3
+
+      - name: Log in to GHCR
+        uses: docker/login-action@v3
+        with:
+          registry: ${{ env.GHCR_REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GHCR_PAT }}
+
+      - name: Docker metadata
+        id: meta
+        uses: docker/metadata-action@v5
+        with:
+          images: ${{ env.GHCR_REGISTRY }}/${{ env.METRIC_INGESTER_IMAGE }}
+          tags: |
+            type=sha,prefix=,suffix=,format=short
+
+      - name: Build & push
+        uses: docker/build-push-action@v6
+        with:
+          push: true
+          file: telemetry/deploy/Dockerfile.metric-ingester
+          context: telemetry
+          tags: ${{ steps.meta.outputs.tags }}
+          labels: ${{ steps.meta.outputs.labels }}
+          cache-from: type=gha
+          cache-to: type=gha,mode=max
+
+  ##############################################################################
+  # BUILD: Query Proxy (Go service)
+  ##############################################################################
+  build-query-proxy:
+    name: Build - Query Proxy
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          submodules: recursive
+
+      - uses: docker/setup-buildx-action@v3
+
+      - name: Log in to GHCR
+        uses: docker/login-action@v3
+        with:
+          registry: ${{ env.GHCR_REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GHCR_PAT }}
+
+      - name: Docker metadata
+        id: meta
+        uses: docker/metadata-action@v5
+        with:
+          images: ${{ env.GHCR_REGISTRY }}/${{ env.QUERY_PROXY_IMAGE }}
+          tags: |
+            type=sha,prefix=,suffix=,format=short
+
+      - name: Build & push
+        uses: docker/build-push-action@v6
+        with:
+          push: true
+          file: telemetry/deploy/Dockerfile.query-proxy
+          context: telemetry
+          tags: ${{ steps.meta.outputs.tags }}
+          labels: ${{ steps.meta.outputs.labels }}
+          cache-from: type=gha
+          cache-to: type=gha,mode=max
+
+  ##############################################################################
+  # BUILD: Telemetry UI (Vue 3 SPA build verification)
+  ##############################################################################
+  build-telemetry-ui:
+    name: Build - Telemetry UI SPA
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          submodules: recursive
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: '22'
+          cache: 'npm'
+          cache-dependency-path: telemetry/telemetry-ui/package-lock.json
+
+      - run: cd telemetry/telemetry-ui && npm ci
+      - run: cd telemetry/telemetry-ui && npm run build
+      - run: echo "Telemetry UI SPA built and verified."
+
+  ##############################################################################
+  # DEPLOY: to Orange VPS (100.96.248.86)
+  ##############################################################################
+  deploy:
+    name: Deploy to Orange VPS
+    needs:
+      - build-metric-ingester
+      - build-query-proxy
+      - build-telemetry-ui
+    runs-on: ubuntu-latest
+    if: |
+      always()
+      && !cancelled()
+      && !contains(needs.*.result, 'failure')
+      && (github.ref == 'refs/heads/main' || github.ref == 'refs/heads/master')
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          submodules: recursive
+
+      - name: git short-sha
+        id: sha
+        run: echo "sha=$(echo ${{ github.sha }} | cut -c1-7)" >> "$GITHUB_OUTPUT"
+
+      - name: Build Telemetry UI SPA
+        working-directory: telemetry/telemetry-ui
+        run: |
+          npm ci
+          npm run build
+
+      - name: Deploy via SSH
+        env:
+          VPS_HOST: ${{ secrets.TELEMETRY_VPS_HOST }}
+          VPS_PORT: ${{ secrets.TELEMETRY_VPS_PORT || '22' }}
+          VPS_USER: ${{ secrets.TELEMETRY_VPS_USER }}
+          GHCR_PAT: ${{ secrets.GHCR_PAT }}
+          CF_DNS_API_TOKEN: ${{ secrets.CF_DNS_API_TOKEN }}
+          SHA: ${{ steps.sha.outputs.sha }}
+        run: |
+          # Setup SSH key
+          mkdir -p ~/.ssh
+          echo "${{ secrets.TELEMETRY_VPS_SSH_KEY }}" > ~/.ssh/id_ed25519
+          chmod 600 ~/.ssh/id_ed25519
+          ssh-keyscan -p "$VPS_PORT" "$VPS_HOST" >> ~/.ssh/known_hosts 2>/dev/null
+
+          # Prepare directories on VPS
+          ssh -p "$VPS_PORT" "$VPS_USER@$VPS_HOST" "mkdir -p /opt/telemetry"
+
+          # Sync config files
+          rsync -avz --delete -e "ssh -p $VPS_PORT" \
+            telemetry/prometheus/ \
+            "$VPS_USER@$VPS_HOST:/opt/telemetry/prometheus/"
+
+          rsync -avz --delete -e "ssh -p $VPS_PORT" \
+            telemetry/metric-ingester/ \
+            "$VPS_USER@$VPS_HOST:/opt/telemetry/metric-ingester/"
+
+          rsync -avz --delete -e "ssh -p $VPS_PORT" \
+            telemetry/vector/ \
+            "$VPS_USER@$VPS_HOST:/opt/telemetry/vector/"
+
+          rsync -avz --delete -e "ssh -p $VPS_PORT" \
+            telemetry/clickhouse/ \
+            "$VPS_USER@$VPS_HOST:/opt/telemetry/clickhouse/"
+
+          rsync -avz --delete -e "ssh -p $VPS_PORT" \
+            telemetry/query-proxy/ \
+            "$VPS_USER@$VPS_HOST:/opt/telemetry/query-proxy/"
+
+          rsync -avz --delete -e "ssh -p $VPS_PORT" \
+            telemetry/telemetry-ui/dist/ \
+            "$VPS_USER@$VPS_HOST:/opt/telemetry/telemetry-ui/dist/"
+
+          rsync -avz --delete -e "ssh -p $VPS_PORT" \
+            telemetry/deploy/nginx/ \
+            "$VPS_USER@$VPS_HOST:/opt/telemetry/nginx/"
+
+          # Copy and prepare docker-compose.yml
+          scp -P "$VPS_PORT" telemetry/deploy/docker-compose.yml \
+            "$VPS_USER@$VPS_HOST:/opt/telemetry/docker-compose.yml"
+
+          # Run deploy on VPS
+          ssh -p "$VPS_PORT" "$VPS_USER@$VPS_HOST" bash -s << 'DEPLOYEOF'
+            set -e
+            echo '=== Telemetry Deploy to Orange VPS ==='
+
+            cd /opt/telemetry
+
+            # Create .env with secrets (injected by GHA)
+            cat > .env << ENVEOF
+            CLICKHOUSE_USER=${CLICKHOUSE_USER:-telemetry}
+            CLICKHOUSE_PASSWORD=${CLICKHOUSE_PASSWORD:-telemetry}
+            CF_DNS_API_TOKEN=${{ secrets.CF_DNS_API_TOKEN }}
+            LETS_ENCRYPT_EMAIL=${{ secrets.LETS_ENCRYPT_EMAIL || 'admin@asepharyana.my.id' }}
+            ENVEOF
+
+            # Login to GHCR
+            echo '${{ secrets.GHCR_PAT }}' | docker login ghcr.io -u '${{ github.actor }}' --password-stdin
+
+            # Rewrite docker-compose to use SHA-tagged images
+            SHA='${{ steps.sha.outputs.sha }}'
+            TMP_FILE=$(mktemp /tmp/telemetry-compose-XXXXXX)
+            awk -v sha="$SHA" '
+              /^[[:space:]]*image:[[:space:]]+ghcr.io\/[Mm]ythe?[Ee]clipse\/telemetry-/ {
+                sub(/:([^:]*)$/, ":" sha)
+              }
+              { print }
+            ' docker-compose.yml > "$TMP_FILE"
+            mv "$TMP_FILE" docker-compose.yml
+
+            # Pull SHA-tagged images
+            docker pull "ghcr.io/mytheclipse/telemetry-metric-ingester:$SHA" || true
+            docker pull "ghcr.io/mytheclipse/telemetry-query-proxy:$SHA" || true
+
+            # Tear down old stack (preserve volumes)
+            docker compose down --remove-orphans --volumes=false 2>/dev/null || true
+
+            # Deploy fresh
+            docker compose up -d --remove-orphans --no-build
+            sleep 5
+
+            # Run ClickHouse schema migration
+            echo '=== Running ClickHouse schema migration ==='
+            bash clickhouse/init.sh 2>&1 || echo '⚠️  Schema migration had issues (non-fatal)'
+            echo '=== Schema migration complete ==='
+
+            docker compose ps
+            echo '=== Deploy Complete ==='
+DEPLOYEOF

From 2ade67170c53f6c6926143e74331e23c28141cc9 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 22:59:44 +0700
Subject: [PATCH 19/28] feat(ci): add node-exporter cleanup and health check to
 deploy workflow

---
 .github/workflows/deploy.yml | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
index 941ee80..305ed2d 100644
--- a/.github/workflows/deploy.yml
+++ b/.github/workflows/deploy.yml
@@ -135,10 +135,11 @@ jobs:
             docker network create app-shared-net 2>/dev/null || true
             docker network create telemetry-net 2>/dev/null || true
             docker compose down --remove-orphans || true
-            docker rm -f zeavis-web zeavis-api zeavis-ml 2>/dev/null || true
+            docker rm -f zeavis-web zeavis-api zeavis-ml zeavis-node-exporter 2>/dev/null || true
             docker compose pull
             docker compose up -d
             docker compose ps
             docker compose ps | grep -q "zeavis-web.*Up" || exit 1
             docker compose ps | grep -q "zeavis-api.*Up" || exit 1
             docker compose ps | grep -q "zeavis-ml.*Up" || exit 1
+            docker compose ps | grep -q "zeavis-node-exporter.*Up" || echo "⚠️  node_exporter not running (non-fatal)"

From c0533f3ed91fd78856d0f01da3b234d3f969875e Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 23:02:35 +0700
Subject: [PATCH 20/28] feat(infra): add deployment architecture docs and
 remove unused DNS secrets from telemetry workflow

---
 .github/workflows/telemetry-ci-cd.yml |   3 -
 infra/README.md                       | 140 ++++++++++++++++++++++++++
 2 files changed, 140 insertions(+), 3 deletions(-)
 create mode 100644 infra/README.md

diff --git a/.github/workflows/telemetry-ci-cd.yml b/.github/workflows/telemetry-ci-cd.yml
index 36e3396..c81b863 100644
--- a/.github/workflows/telemetry-ci-cd.yml
+++ b/.github/workflows/telemetry-ci-cd.yml
@@ -149,7 +149,6 @@ jobs:
           VPS_PORT: ${{ secrets.TELEMETRY_VPS_PORT || '22' }}
           VPS_USER: ${{ secrets.TELEMETRY_VPS_USER }}
           GHCR_PAT: ${{ secrets.GHCR_PAT }}
-          CF_DNS_API_TOKEN: ${{ secrets.CF_DNS_API_TOKEN }}
           SHA: ${{ steps.sha.outputs.sha }}
         run: |
           # Setup SSH key
@@ -205,8 +204,6 @@ jobs:
             cat > .env << ENVEOF
             CLICKHOUSE_USER=${CLICKHOUSE_USER:-telemetry}
             CLICKHOUSE_PASSWORD=${CLICKHOUSE_PASSWORD:-telemetry}
-            CF_DNS_API_TOKEN=${{ secrets.CF_DNS_API_TOKEN }}
-            LETS_ENCRYPT_EMAIL=${{ secrets.LETS_ENCRYPT_EMAIL || 'admin@asepharyana.my.id' }}
             ENVEOF
 
             # Login to GHCR
diff --git a/infra/README.md b/infra/README.md
new file mode 100644
index 0000000..e7afa1e
--- /dev/null
+++ b/infra/README.md
@@ -0,0 +1,140 @@
+# Infra — ZeaVis Edu Multi-VPS Deployment
+
+## Arsitektur
+
+```
+┌─────────────────────────────────────────────┐     ┌──────────────────────────────────────────────┐
+│              App VPS (imrnes)               │     │         Telemetry VPS (orange)                │
+│             100.108.1.124                   │     │         100.96.248.86                        │
+│             Arch Linux                      │     │         Ubuntu                               │
+│                                             │     │                                              │
+│  ┌──────────┐  ┌──────────┐  ┌──────────┐  │     │  ┌──────────┐  ┌──────────────┐             │
+│  │  Web     │  │  API     │  │  ML      │  │     │  │Prometheus│  │Metric        │             │
+│  │:80       │  │:3000     │  │:8000     │  │     │  │:9090     │  │Ingester      │             │
+│  │/metrics  │  │/metrics  │  │/metrics  │  │     │  │          │  │:9091         │             │
+│  └──────────┘  └──────────┘  └──────────┘  │     │  └────┬─────┘  └──────┬───────┘             │
+│  ┌──────────────────────────────────────┐  │     │       │               │                     │
+│  │        Node Exporter                 │  │     │       │  remote_write │                     │
+│  │        :9100                         │  │     │       ▼               ▼                     │
+│  └──────────────────────────────────────┘  │     │  ┌──────────────────────────────────────┐   │
+│                                             │     │  │          Vector                      │   │
+│     ┌──────────────┐                        │     │  │          :9001                       │   │
+│     │   Traefik    │                        │     │  └────────────────┬─────────────────────┘   │
+│     │ (Coolify)    │                        │     │                   │                         │
+│     └──────────────┘                        │     │                   ▼                         │
+│                                             │     │  ┌──────────────────────────────────────┐   │
+│  ZeaVis Edu Apps via                        │     │  │           ClickHouse                  │   │
+│  zeavisedu.asepharyana.my.id                │     │  │           :8123                       │   │
+│                                             │     │  └───────────────┬──────────────────────┘   │
+│                                             │     │                   │                         │
+│                                             │     │                   ▼                         │
+│  ==== Tailscale (WireGuard) ====            │     │  ┌──────────────────────────────────────┐   │
+│                                             │     │  │         Query Proxy                 │   │
+│                                             │     │  │         :9092                       │   │
+│                                             │     │  └───────────────┬──────────────────────┘   │
+│                                             │     │                   │                         │
+│                                             │     │                   ▼                         │
+│                                             │     │  ┌──────────────────────────────────────┐   │
+│                                             │     │  │      Telemetry UI (nginx)            │   │
+│                                             │     │  │      :8181                          │   │
+│                                             │     │  └──────────────────────────────────────┘   │
+│                                             │     │                                              │
+│                                             │     │  Coolify + Traefik handles:                 │
+│                                             │     │  telemetry.zeavisedu.asepharyana.my.id       │
+└─────────────────────────────────────────────┘     └──────────────────────────────────────────────┘
+```
+
+## Prerequisites
+
+### GitHub Secrets (untuk CI/CD)
+
+**App VPS deploy (`.github/workflows/deploy.yml`):**
+| Secret | Value |
+|--------|-------|
+| `VPS_HOST` | `100.108.1.124` (imrnes) |
+| `VPS_USER` | `mytheclipse` |
+| `VPS_SSH_KEY` | Private SSH key for imrnes |
+| `VPS_PORT` | `22` |
+| `DATABASE_URL` | PostgreSQL connection string |
+| `SESSION_SECRET` | Random session secret |
+
+**Telemetry VPS deploy (`.github/workflows/telemetry-ci-cd.yml`):**
+| Secret | Value |
+|--------|-------|
+| `TELEMETRY_VPS_HOST` | `100.96.248.86` (orange) |
+| `TELEMETRY_VPS_USER` | SSH username for orange |
+| `TELEMETRY_VPS_SSH_KEY` | Private SSH key for orange |
+| `TELEMETRY_VPS_PORT` | `22` |
+| `GHCR_PAT` | GitHub PAT with `write:packages` + `read:packages` |
+
+### VPS Setup
+
+#### 1. App VPS (imrnes — 100.108.1.124)
+
+```bash
+# Create Docker network
+docker network create app-shared-net
+docker network create telemetry-net
+
+# ZeaVis Edu apps deploy automatically via GitHub Actions
+```
+
+#### 2. Telemetry VPS (orange — 100.96.248.86)
+
+Deploy via GitHub Actions workflow `.github/workflows/telemetry-ci-cd.yml`.
+
+Atau manual:
+```bash
+ssh mytheclipse@100.96.248.86
+mkdir -p /opt/telemetry
+# ... sync files from telemetry/ directory ...
+cd /opt/telemetry
+docker compose up -d
+bash clickhouse/init.sh
+```
+
+## Port yang dibuka
+
+### App VPS (imrnes)
+| Port | Service | Akses |
+|------|---------|-------|
+| 80/443 | Web (via Traefik/Coolify) | Public |
+| 3000 | API metrics | Tailscale-only |
+| 8000 | ML service metrics | Tailscale-only |
+| 9100 | Node Exporter | Tailscale-only |
+
+### Telemetry VPS (orange)
+| Port | Service | Akses |
+|------|---------|-------|
+| 80/443 | Telemetry UI (via Coolify Traefik) | Public |
+| 8181 | Telemetry UI (direct) | Tailscale-only |
+| 9090 | Prometheus | Tailscale-only |
+| 9091 | Metric Ingester | Tailscale-only |
+| 9001 | Vector HTTP source | Tailscale-only |
+| 8123 | ClickHouse HTTP | Tailscale-only |
+| 9000 | ClickHouse Native | Tailscale-only |
+
+## Metrics Flow
+
+1. **App services** expose `/metrics` pada port masing-masing
+2. **Prometheus** di orange VPS scrape via Tailscale IP (`100.108.1.124:PORT`)
+3. **Prometheus** forward ke **Metric Ingester** via `remote_write`
+4. **Metric Ingester** enrich → filter → forward ke **Vector**
+5. **Vector** buffer → write ke **ClickHouse**
+6. **Telemetry UI** query via **Query Proxy** → **ClickHouse**
+
+## Useful Commands
+
+```bash
+# Telemetry stack status
+make telemetry-status
+
+# View telemetry logs
+make telemetry-logs s=prometheus
+
+# Send test metric
+make telemetry-test-metric
+
+# Restart a service
+make telemetry-restart s=vector
+```

From 0d458d9437ad7746d053762ecdf5b623398a6551 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 23:04:22 +0700
Subject: [PATCH 21/28] chore(telemetry): update subproject to latest commit

---
 telemetry | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/telemetry b/telemetry
index 723693b..2582a53 160000
--- a/telemetry
+++ b/telemetry
@@ -1 +1 @@
-Subproject commit 723693b83241a35e0c09437e041fe6d5b391f87c
+Subproject commit 2582a535920b7b60a0fb9d0e6ef29437288a5034

From cd93d1a06d035e51c35d701105095bf1d5996d18 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 23:21:40 +0700
Subject: [PATCH 22/28] feat(web): add telemetry dashboard page with nginx
 proxy and nav integration

---
 apps/web/nginx.conf                           |  17 +++
 apps/web/src/app.tsx                          |   9 ++
 apps/web/src/components/layout/mobile-nav.tsx |   1 +
 apps/web/src/components/layout/navbar.tsx     |   6 +
 apps/web/src/pages/telemetry-page.tsx         | 127 ++++++++++++++++++
 5 files changed, 160 insertions(+)
 create mode 100644 apps/web/src/pages/telemetry-page.tsx

diff --git a/apps/web/nginx.conf b/apps/web/nginx.conf
index 11bce60..5d9fa05 100644
--- a/apps/web/nginx.conf
+++ b/apps/web/nginx.conf
@@ -21,6 +21,23 @@ server {
     proxy_set_header X-Forwarded-Proto $scheme;
   }
 
+  # Proxy telemetry dashboard to orange VPS (via Tailscale)
+  location /telemetry/ {
+    proxy_pass http://100.96.248.86:8181/;
+    proxy_http_version 1.1;
+    proxy_set_header Host $host;
+    proxy_set_header X-Real-IP $remote_addr;
+    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    proxy_set_header X-Forwarded-Proto $scheme;
+    proxy_connect_timeout 5s;
+    proxy_send_timeout 35s;
+    proxy_read_timeout 35s;
+    proxy_buffering on;
+    proxy_buffer_size 4k;
+    proxy_buffers 8 4k;
+    proxy_busy_buffers_size 8k;
+  }
+
   location / {
     try_files $uri $uri/ /index.html;
   }
diff --git a/apps/web/src/app.tsx b/apps/web/src/app.tsx
index d3cfce9..914b0ca 100644
--- a/apps/web/src/app.tsx
+++ b/apps/web/src/app.tsx
@@ -14,6 +14,7 @@ import { DiseaseDetailPage } from "@/pages/disease-detail-page";
 import { DiagnosisDetailPage } from "@/pages/diagnosis-detail-page";
 import { ExpertReviewsPage } from "@/pages/expert-reviews-page";
 import { DiagnosesPage } from "@/pages/diagnoses-page";
+import { TelemetryPage } from "@/pages/telemetry-page";
 import { MainLayout } from "@/components/layout/main-layout";
 import { trackPageView } from "./lib/telemetry";
 
@@ -85,6 +86,14 @@ const router = createBrowserRouter([
       </MainLayout>
     ),
   },
+  {
+    path: "/telemetry",
+    element: (
+      <MainLayout>
+        <TelemetryPage />
+      </MainLayout>
+    ),
+  },
 ]);
 
 function PageViewTracker() {
diff --git a/apps/web/src/components/layout/mobile-nav.tsx b/apps/web/src/components/layout/mobile-nav.tsx
index c5f68dc..4262154 100644
--- a/apps/web/src/components/layout/mobile-nav.tsx
+++ b/apps/web/src/components/layout/mobile-nav.tsx
@@ -13,6 +13,7 @@ const NAV_ITEMS = [
   { path: "/diagnoses", label: "Diagnosa" },
   { path: "/catalog", label: "Pustaka", altPath: "/library" },
   { path: "/expert/reviews", label: "Review" },
+  { path: "/telemetry", label: "Telemetry" },
 ];
 
 export function MobileNav({ open, onClose }: Props) {
diff --git a/apps/web/src/components/layout/navbar.tsx b/apps/web/src/components/layout/navbar.tsx
index 20993e1..26e1db1 100644
--- a/apps/web/src/components/layout/navbar.tsx
+++ b/apps/web/src/components/layout/navbar.tsx
@@ -65,6 +65,12 @@ export function Navbar() {
           >
             Review
           </Link>
+          <Link
+            to="/telemetry"
+            className={navLinkClassName(isActive("/telemetry"))}
+          >
+            Telemetry
+          </Link>
         </nav>
 
         <button
diff --git a/apps/web/src/pages/telemetry-page.tsx b/apps/web/src/pages/telemetry-page.tsx
new file mode 100644
index 0000000..d4d2176
--- /dev/null
+++ b/apps/web/src/pages/telemetry-page.tsx
@@ -0,0 +1,127 @@
+import { useMemo, useState } from "react";
+import { Card, CardContent } from "@/components/ui/card";
+import { BarChart3, ExternalLink } from "lucide-react";
+
+const TELEMETRY_BASE = "/telemetry";
+
+const EMBED_PAGES = [
+  { id: "dashboard", label: "Dashboard", path: "" },
+  { id: "explorer", label: "Explorer", path: "/explorer" },
+  { id: "targets", label: "Targets", path: "/targets" },
+  { id: "tenants", label: "Tenants", path: "/tenants" },
+];
+
+export function TelemetryPage() {
+  const [currentPage, setCurrentPage] = useState(EMBED_PAGES[0]);
+  const [iframeLoaded, setIframeLoaded] = useState(false);
+  const [iframeError, setIframeError] = useState(false);
+
+  const embedUrl = useMemo(() => {
+    const base = `${TELEMETRY_BASE}${currentPage.path}`;
+    return base;
+  }, [currentPage]);
+
+  const handleIframeLoad = () => {
+    setIframeLoaded(true);
+    setIframeError(false);
+  };
+
+  const handleIframeError = () => {
+    setIframeLoaded(false);
+    setIframeError(true);
+  };
+
+  return (
+    <div className="space-y-6">
+      {/* Header */}
+      <div className="flex flex-col md:flex-row items-start md:items-center justify-between gap-4">
+        <div>
+          <h1 className="text-2xl md:text-[28px] font-extrabold text-[#214B11] flex items-center gap-3">
+            <BarChart3 className="h-7 w-7 text-[#48A111]" />
+            Telemetry Dashboard
+          </h1>
+          <p className="text-[15px] text-muted-foreground mt-1">
+            System metrics, service health, and performance monitoring from the
+            telemetry pipeline (Prometheus → ClickHouse).
+          </p>
+        </div>
+        <a
+          href={embedUrl}
+          target="_blank"
+          rel="noopener noreferrer"
+          className="inline-flex items-center gap-2 rounded-full bg-[#48A111] px-4 py-2 text-sm font-semibold text-white hover:bg-[#306D29] transition-colors"
+        >
+          <ExternalLink className="h-4 w-4" />
+          Open in New Tab
+        </a>
+      </div>
+
+      {/* Navigation tabs */}
+      <div className="flex flex-wrap gap-2">
+        {EMBED_PAGES.map((page) => (
+          <button
+            key={page.id}
+            onClick={() => {
+              setCurrentPage(page);
+              setIframeLoaded(false);
+              setIframeError(false);
+            }}
+            className={`rounded-full px-4 py-2 text-sm font-medium transition-colors ${
+              currentPage.id === page.id
+                ? "bg-[#48A111] text-white shadow-sm"
+                : "bg-white text-slate-600 hover:bg-slate-100 border border-slate-200"
+            }`}
+          >
+            {page.label}
+          </button>
+        ))}
+      </div>
+
+      {/* Iframe container */}
+      <Card className="overflow-hidden rounded-2xl border-slate-200 shadow-sm">
+        <CardContent className="p-0 relative">
+          {/* Loading indicator */}
+          {!iframeLoaded && !iframeError && (
+            <div className="flex items-center justify-center h-[600px] bg-slate-50">
+              <div className="text-center space-y-3">
+                <div className="inline-block h-8 w-8 animate-spin rounded-full border-4 border-solid border-[#48A111] border-r-transparent" />
+                <p className="text-sm text-muted-foreground">
+                  Loading telemetry dashboard...
+                </p>
+              </div>
+            </div>
+          )}
+
+          {/* Error state */}
+          {iframeError && (
+            <div className="flex items-center justify-center h-[600px] bg-slate-50">
+              <div className="text-center space-y-3 max-w-md px-4">
+                <div className="text-4xl">⚠️</div>
+                <p className="text-sm font-semibold text-red-600">
+                  Failed to load telemetry dashboard
+                </p>
+                <p className="text-sm text-muted-foreground">
+                  The telemetry backend on orange VPS may be unreachable.
+                  Ensure Tailscale is connected and the telemetry stack is
+                  running.
+                </p>
+              </div>
+            </div>
+          )}
+
+          {/* Iframe */}
+          <iframe
+            src={embedUrl}
+            title="Telemetry Dashboard"
+            className={`w-full border-0 ${iframeLoaded ? "block" : "hidden"}`}
+            style={{ height: "calc(100vh - 280px)", minHeight: "600px" }}
+            onLoad={handleIframeLoad}
+            onError={handleIframeError}
+            allow="same-origin"
+            sandbox="allow-scripts allow-same-origin allow-forms allow-popups"
+          />
+        </CardContent>
+      </Card>
+    </div>
+  );
+}

From 9602a64e18393ac3596137aed1e4b20a0a9850c8 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 23:31:15 +0700
Subject: [PATCH 23/28] feat(web): externalize telemetry URL via environment
 variables

Replace the hardcoded Nginx proxy configuration with a dynamic environment variable approach. This allows the telemetry dashboard to be loaded via a public URL instead of relying on a local Tailscale proxy.

- Add `VITE_TELEMETRY_URL` build argument to Dockerfile
- Pass `VITE_TELEMETRY_URL` through GitHub Actions deployment workflow
- Remove `/telemetry/` location block from nginx.conf
- Update `TelemetryPage` to use the new environment variable and improve iframe loading state management
---
 .github/workflows/deploy.yml          |  1 +
 apps/web/Dockerfile                   |  2 +
 apps/web/nginx.conf                   | 17 -------
 apps/web/src/pages/telemetry-page.tsx | 73 ++++++++++++++++++---------
 4 files changed, 53 insertions(+), 40 deletions(-)

diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
index 305ed2d..a27811c 100644
--- a/.github/workflows/deploy.yml
+++ b/.github/workflows/deploy.yml
@@ -77,6 +77,7 @@ jobs:
           labels: ${{ steps.meta.outputs.labels }}
           build-args: |
             VITE_API_BASE_URL=${{ env.VITE_API_BASE_URL }}
+            VITE_TELEMETRY_URL=${{ vars.VITE_TELEMETRY_URL || 'https://telemetry.zeavisedu.asepharyana.my.id' }}
           cache-from: type=gha,scope=${{ matrix.service.name }}
           cache-to: type=gha,mode=max,scope=${{ matrix.service.name }}
 
diff --git a/apps/web/Dockerfile b/apps/web/Dockerfile
index 71d6cd2..5bee7a4 100644
--- a/apps/web/Dockerfile
+++ b/apps/web/Dockerfile
@@ -11,6 +11,8 @@ COPY packages/shared packages/shared
 COPY apps/web apps/web
 ARG VITE_API_BASE_URL
 ENV VITE_API_BASE_URL=$VITE_API_BASE_URL
+ARG VITE_TELEMETRY_URL
+ENV VITE_TELEMETRY_URL=$VITE_TELEMETRY_URL
 RUN bun run --cwd packages/shared build
 RUN bun run --cwd apps/web build
 
diff --git a/apps/web/nginx.conf b/apps/web/nginx.conf
index 5d9fa05..11bce60 100644
--- a/apps/web/nginx.conf
+++ b/apps/web/nginx.conf
@@ -21,23 +21,6 @@ server {
     proxy_set_header X-Forwarded-Proto $scheme;
   }
 
-  # Proxy telemetry dashboard to orange VPS (via Tailscale)
-  location /telemetry/ {
-    proxy_pass http://100.96.248.86:8181/;
-    proxy_http_version 1.1;
-    proxy_set_header Host $host;
-    proxy_set_header X-Real-IP $remote_addr;
-    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
-    proxy_set_header X-Forwarded-Proto $scheme;
-    proxy_connect_timeout 5s;
-    proxy_send_timeout 35s;
-    proxy_read_timeout 35s;
-    proxy_buffering on;
-    proxy_buffer_size 4k;
-    proxy_buffers 8 4k;
-    proxy_busy_buffers_size 8k;
-  }
-
   location / {
     try_files $uri $uri/ /index.html;
   }
diff --git a/apps/web/src/pages/telemetry-page.tsx b/apps/web/src/pages/telemetry-page.tsx
index d4d2176..c2f3a1c 100644
--- a/apps/web/src/pages/telemetry-page.tsx
+++ b/apps/web/src/pages/telemetry-page.tsx
@@ -1,8 +1,21 @@
 import { useMemo, useState } from "react";
 import { Card, CardContent } from "@/components/ui/card";
-import { BarChart3, ExternalLink } from "lucide-react";
+import { BarChart3, ExternalLink, AlertTriangle } from "lucide-react";
 
-const TELEMETRY_BASE = "/telemetry";
+/**
+ * The Telemetry Iframe Page
+ *
+ * Options for TELEMETRY_URL (set via VITE_TELEMETRY_URL env var):
+ *   - https://telemetry.zeavisedu.asepharyana.my.id  (public, via Coolify/Traefik — BEST)
+ *   - http://100.96.248.86:8181                        (direct Tailscale IP — internal only)
+ *
+ * The public URL is accessible from anywhere and needs no Tailscale.
+ * The Tailscale IP only works if the browser is on the Tailscale network.
+ */
+
+const TELEMETRY_URL =
+  import.meta.env.VITE_TELEMETRY_URL ??
+  "https://telemetry.zeavisedu.asepharyana.my.id";
 
 const EMBED_PAGES = [
   { id: "dashboard", label: "Dashboard", path: "" },
@@ -13,22 +26,28 @@ const EMBED_PAGES = [
 
 export function TelemetryPage() {
   const [currentPage, setCurrentPage] = useState(EMBED_PAGES[0]);
-  const [iframeLoaded, setIframeLoaded] = useState(false);
-  const [iframeError, setIframeError] = useState(false);
+  const [iframeState, setIframeState] = useState<"loading" | "loaded" | "error">("loading");
 
   const embedUrl = useMemo(() => {
-    const base = `${TELEMETRY_BASE}${currentPage.path}`;
+    const base = `${TELEMETRY_URL}${currentPage.path}`;
     return base;
   }, [currentPage]);
 
   const handleIframeLoad = () => {
-    setIframeLoaded(true);
-    setIframeError(false);
+    // Only transition to loaded if we got a real page, not an error page
+    try {
+      const iframe = document.getElementById("telemetry-iframe") as HTMLIFrameElement | null;
+      if (iframe?.contentWindow?.location?.href) {
+        setIframeState("loaded");
+      }
+    } catch {
+      // Cross-origin access error — means iframe loaded from different origin, which is normal
+      setIframeState("loaded");
+    }
   };
 
-  const handleIframeError = () => {
-    setIframeLoaded(false);
-    setIframeError(true);
+  const handleRetry = () => {
+    setIframeState("loading");
   };
 
   return (
@@ -63,8 +82,7 @@ export function TelemetryPage() {
             key={page.id}
             onClick={() => {
               setCurrentPage(page);
-              setIframeLoaded(false);
-              setIframeError(false);
+              setIframeState("loading");
             }}
             className={`rounded-full px-4 py-2 text-sm font-medium transition-colors ${
               currentPage.id === page.id
@@ -81,8 +99,8 @@ export function TelemetryPage() {
       <Card className="overflow-hidden rounded-2xl border-slate-200 shadow-sm">
         <CardContent className="p-0 relative">
           {/* Loading indicator */}
-          {!iframeLoaded && !iframeError && (
-            <div className="flex items-center justify-center h-[600px] bg-slate-50">
+          {iframeState === "loading" && (
+            <div className="flex items-center justify-center h-150 bg-slate-50">
               <div className="text-center space-y-3">
                 <div className="inline-block h-8 w-8 animate-spin rounded-full border-4 border-solid border-[#48A111] border-r-transparent" />
                 <p className="text-sm text-muted-foreground">
@@ -93,30 +111,39 @@ export function TelemetryPage() {
           )}
 
           {/* Error state */}
-          {iframeError && (
-            <div className="flex items-center justify-center h-[600px] bg-slate-50">
+          {iframeState === "error" && (
+            <div className="flex items-center justify-center h-150 bg-slate-50">
               <div className="text-center space-y-3 max-w-md px-4">
-                <div className="text-4xl">⚠️</div>
+                <AlertTriangle className="h-10 w-10 text-amber-500 mx-auto" />
                 <p className="text-sm font-semibold text-red-600">
                   Failed to load telemetry dashboard
                 </p>
                 <p className="text-sm text-muted-foreground">
-                  The telemetry backend on orange VPS may be unreachable.
-                  Ensure Tailscale is connected and the telemetry stack is
-                  running.
+                  Cannot reach <code className="text-xs bg-slate-200 px-1.5 py-0.5 rounded">{TELEMETRY_URL}</code>.
                 </p>
+                <p className="text-sm text-muted-foreground">
+                  Make sure the telemetry stack is running on the orange VPS
+                  and the domain/Tailscale IP is accessible.
+                </p>
+                <button
+                  onClick={handleRetry}
+                  className="inline-flex items-center gap-1 rounded-full bg-[#48A111] px-4 py-2 text-sm font-semibold text-white hover:bg-[#306D29] transition-colors"
+                >
+                  Retry
+                </button>
               </div>
             </div>
           )}
 
-          {/* Iframe */}
+          {/* Iframe — hidden until loaded or explicitly shown */}
           <iframe
+            id="telemetry-iframe"
             src={embedUrl}
             title="Telemetry Dashboard"
-            className={`w-full border-0 ${iframeLoaded ? "block" : "hidden"}`}
+            className={`w-full border-0 ${iframeState === "loaded" ? "block" : "hidden"}`}
             style={{ height: "calc(100vh - 280px)", minHeight: "600px" }}
             onLoad={handleIframeLoad}
-            onError={handleIframeError}
+            onError={() => setIframeState("error")}
             allow="same-origin"
             sandbox="allow-scripts allow-same-origin allow-forms allow-popups"
           />

From 4dde9d84088781accfa287e2a3e9b7c248c88ae4 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Sun, 7 Jun 2026 23:44:57 +0700
Subject: [PATCH 24/28] refactor(web): implement nginx reverse proxy for
 telemetry dashboard

Transition telemetry dashboard integration from an external URL approach to a local reverse proxy via Nginx. This simplifies client-side connectivity by routing all telemetry requests through the existing web server's domain.

- Configure Nginx to proxy `/telemetry/` sub-paths to the internal telemetry service
- Implement `sub_filter` in Nginx to rewrite root-relative paths for the SPA
- Remove `VITE_TELEMETRY_URL` build arguments and environment variable dependencies
- Simplify `TelemetryPage` to use a relative `/telemetry` base path
- Clean up deployment workflows and Dockerfile by removing unused telemetry build args
---
 .github/workflows/deploy.yml          |  1 -
 apps/web/Dockerfile                   |  2 -
 apps/web/nginx.conf                   | 57 ++++++++++++++++++++++++++
 apps/web/src/pages/telemetry-page.tsx | 58 +++++++--------------------
 4 files changed, 72 insertions(+), 46 deletions(-)

diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
index a27811c..305ed2d 100644
--- a/.github/workflows/deploy.yml
+++ b/.github/workflows/deploy.yml
@@ -77,7 +77,6 @@ jobs:
           labels: ${{ steps.meta.outputs.labels }}
           build-args: |
             VITE_API_BASE_URL=${{ env.VITE_API_BASE_URL }}
-            VITE_TELEMETRY_URL=${{ vars.VITE_TELEMETRY_URL || 'https://telemetry.zeavisedu.asepharyana.my.id' }}
           cache-from: type=gha,scope=${{ matrix.service.name }}
           cache-to: type=gha,mode=max,scope=${{ matrix.service.name }}
 
diff --git a/apps/web/Dockerfile b/apps/web/Dockerfile
index 5bee7a4..71d6cd2 100644
--- a/apps/web/Dockerfile
+++ b/apps/web/Dockerfile
@@ -11,8 +11,6 @@ COPY packages/shared packages/shared
 COPY apps/web apps/web
 ARG VITE_API_BASE_URL
 ENV VITE_API_BASE_URL=$VITE_API_BASE_URL
-ARG VITE_TELEMETRY_URL
-ENV VITE_TELEMETRY_URL=$VITE_TELEMETRY_URL
 RUN bun run --cwd packages/shared build
 RUN bun run --cwd apps/web build
 
diff --git a/apps/web/nginx.conf b/apps/web/nginx.conf
index 11bce60..21e1872 100644
--- a/apps/web/nginx.conf
+++ b/apps/web/nginx.conf
@@ -21,6 +21,63 @@ server {
     proxy_set_header X-Forwarded-Proto $scheme;
   }
 
+  # ── Telemetry Dashboard Proxy (orange VPS via Tailscale) ──────────────
+  # Telemetry UI SPA assets (fingerprinted by Vite, cache aggressively)
+  location /telemetry/assets/ {
+    proxy_pass http://100.96.248.86:8181/assets/;
+    proxy_http_version 1.1;
+    proxy_set_header Host $host;
+    proxy_set_header X-Real-IP $remote_addr;
+    expires 1y;
+    add_header Cache-Control "public, immutable";
+  }
+
+  # Telemetry API calls (query proxy + target management)
+  location /telemetry/proxy/ {
+    proxy_pass http://100.96.248.86:8181/proxy/;
+    proxy_http_version 1.1;
+    proxy_set_header Host $host;
+    proxy_set_header X-Real-IP $remote_addr;
+    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    proxy_set_header X-Forwarded-Proto $scheme;
+    proxy_connect_timeout 5s;
+    proxy_send_timeout 35s;
+    proxy_read_timeout 35s;
+  }
+
+  location /telemetry/api/ {
+    proxy_pass http://100.96.248.86:8181/api/;
+    proxy_http_version 1.1;
+    proxy_set_header Host $host;
+    proxy_set_header X-Real-IP $remote_addr;
+    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    proxy_set_header X-Forwarded-Proto $scheme;
+    proxy_connect_timeout 5s;
+    proxy_send_timeout 10s;
+    proxy_read_timeout 10s;
+  }
+
+  # Telemetry SPA — proxy to orange, rewrite root-relative paths to prefix
+  location /telemetry/ {
+    proxy_pass http://100.96.248.86:8181/;
+    proxy_http_version 1.1;
+    proxy_set_header Host $host;
+    proxy_set_header X-Real-IP $remote_addr;
+    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    proxy_set_header X-Forwarded-Proto $scheme;
+    proxy_connect_timeout 5s;
+    proxy_send_timeout 35s;
+    proxy_read_timeout 35s;
+
+    # Rewrite root-relative paths in HTML/JS to /telemetry/ prefix
+    sub_filter_types text/html application/javascript;
+    sub_filter_once off;
+    sub_filter 'src="/' 'src="/telemetry/';
+    sub_filter 'href="/' 'href="/telemetry/';
+    sub_filter "url('/" "url('/telemetry/";
+    sub_filter 'fetch("/' 'fetch("/telemetry/');
+  }
+
   location / {
     try_files $uri $uri/ /index.html;
   }
diff --git a/apps/web/src/pages/telemetry-page.tsx b/apps/web/src/pages/telemetry-page.tsx
index c2f3a1c..cf82ca7 100644
--- a/apps/web/src/pages/telemetry-page.tsx
+++ b/apps/web/src/pages/telemetry-page.tsx
@@ -1,21 +1,13 @@
 import { useMemo, useState } from "react";
 import { Card, CardContent } from "@/components/ui/card";
-import { BarChart3, ExternalLink, AlertTriangle } from "lucide-react";
+import { BarChart3, AlertTriangle } from "lucide-react";
 
 /**
- * The Telemetry Iframe Page
- *
- * Options for TELEMETRY_URL (set via VITE_TELEMETRY_URL env var):
- *   - https://telemetry.zeavisedu.asepharyana.my.id  (public, via Coolify/Traefik — BEST)
- *   - http://100.96.248.86:8181                        (direct Tailscale IP — internal only)
- *
- * The public URL is accessible from anywhere and needs no Tailscale.
- * The Tailscale IP only works if the browser is on the Tailscale network.
+ * Telemetry Dashboard — proxied through nginx at /telemetry/
+ * Nginx rewrites root-relative paths so the SPA works from the sub-path.
  */
 
-const TELEMETRY_URL =
-  import.meta.env.VITE_TELEMETRY_URL ??
-  "https://telemetry.zeavisedu.asepharyana.my.id";
+const TELEMETRY_BASE = "/telemetry";
 
 const EMBED_PAGES = [
   { id: "dashboard", label: "Dashboard", path: "" },
@@ -29,21 +21,15 @@ export function TelemetryPage() {
   const [iframeState, setIframeState] = useState<"loading" | "loaded" | "error">("loading");
 
   const embedUrl = useMemo(() => {
-    const base = `${TELEMETRY_URL}${currentPage.path}`;
-    return base;
+    return `${TELEMETRY_BASE}${currentPage.path}`;
   }, [currentPage]);
 
   const handleIframeLoad = () => {
-    // Only transition to loaded if we got a real page, not an error page
-    try {
-      const iframe = document.getElementById("telemetry-iframe") as HTMLIFrameElement | null;
-      if (iframe?.contentWindow?.location?.href) {
-        setIframeState("loaded");
-      }
-    } catch {
-      // Cross-origin access error — means iframe loaded from different origin, which is normal
-      setIframeState("loaded");
-    }
+    setIframeState("loaded");
+  };
+
+  const handleIframeError = () => {
+    setIframeState("error");
   };
 
   const handleRetry = () => {
@@ -64,15 +50,6 @@ export function TelemetryPage() {
             telemetry pipeline (Prometheus → ClickHouse).
           </p>
         </div>
-        <a
-          href={embedUrl}
-          target="_blank"
-          rel="noopener noreferrer"
-          className="inline-flex items-center gap-2 rounded-full bg-[#48A111] px-4 py-2 text-sm font-semibold text-white hover:bg-[#306D29] transition-colors"
-        >
-          <ExternalLink className="h-4 w-4" />
-          Open in New Tab
-        </a>
       </div>
 
       {/* Navigation tabs */}
@@ -119,11 +96,8 @@ export function TelemetryPage() {
                   Failed to load telemetry dashboard
                 </p>
                 <p className="text-sm text-muted-foreground">
-                  Cannot reach <code className="text-xs bg-slate-200 px-1.5 py-0.5 rounded">{TELEMETRY_URL}</code>.
-                </p>
-                <p className="text-sm text-muted-foreground">
-                  Make sure the telemetry stack is running on the orange VPS
-                  and the domain/Tailscale IP is accessible.
+                  The telemetry backend may be unreachable. Make sure the
+                  telemetry stack is running on the orange VPS.
                 </p>
                 <button
                   onClick={handleRetry}
@@ -135,16 +109,14 @@ export function TelemetryPage() {
             </div>
           )}
 
-          {/* Iframe — hidden until loaded or explicitly shown */}
+          {/* Iframe */}
           <iframe
-            id="telemetry-iframe"
             src={embedUrl}
             title="Telemetry Dashboard"
-            className={`w-full border-0 ${iframeState === "loaded" ? "block" : "hidden"}`}
+            className={`w-full border-0 ${iframeState === "loaded" || iframeState === "error" ? "block" : "hidden"}`}
             style={{ height: "calc(100vh - 280px)", minHeight: "600px" }}
             onLoad={handleIframeLoad}
-            onError={() => setIframeState("error")}
-            allow="same-origin"
+            onError={handleIframeError}
             sandbox="allow-scripts allow-same-origin allow-forms allow-popups"
           />
         </CardContent>

From 4589766f27fd6868c7cfa3095a9f4b4baefada8c Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Mon, 8 Jun 2026 00:00:33 +0700
Subject: [PATCH 25/28] build(web): switch to alpine-based nginx runner for
 sub_filter support

Migrate the web runner stage from the official nginx alpine image to a
standard alpine image with the nginx package installed. This ensures
the presence of the `http_sub_module` required for path rewriting in
the telemetry proxy configuration.

- Replace `nginx:1.27-alpine` with `alpine:3.20` and `apk add nginx`
- Update Nginx configuration file path to `/etc/nginx/http.d/default.conf`
- Update web asset root directory to `/var/lib/nginx/html`
- Add `X-Forwarded-For` and `X-Forwarded-Proto` headers to proxy locations
---
 apps/web/Dockerfile | 13 ++++++++++---
 apps/web/nginx.conf |  8 +++++---
 2 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/apps/web/Dockerfile b/apps/web/Dockerfile
index 71d6cd2..6a81ff0 100644
--- a/apps/web/Dockerfile
+++ b/apps/web/Dockerfile
@@ -14,8 +14,15 @@ ENV VITE_API_BASE_URL=$VITE_API_BASE_URL
 RUN bun run --cwd packages/shared build
 RUN bun run --cwd apps/web build
 
-FROM nginx:1.27-alpine AS runner
-COPY apps/web/nginx.conf /etc/nginx/conf.d/default.conf
-COPY --from=builder /app/apps/web/dist /usr/share/nginx/html
+# =============================================================================
+# Stage 2: nginx (Alpine package — includes sub_filter module)
+# Alpine's nginx package is built with --with-http_sub_module
+# =============================================================================
+FROM alpine:3.20 AS runner
+RUN apk add --no-cache nginx
+
+COPY apps/web/nginx.conf /etc/nginx/http.d/default.conf
+COPY --from=builder /app/apps/web/dist /var/lib/nginx/html
+
 EXPOSE 80
 CMD ["nginx", "-g", "daemon off;"]
diff --git a/apps/web/nginx.conf b/apps/web/nginx.conf
index 21e1872..c6f302a 100644
--- a/apps/web/nginx.conf
+++ b/apps/web/nginx.conf
@@ -1,7 +1,7 @@
 server {
   listen 80;
   server_name _;
-  root /usr/share/nginx/html;
+  root /var/lib/nginx/html;
   index index.html;
 
   location /api/ {
@@ -28,6 +28,8 @@ server {
     proxy_http_version 1.1;
     proxy_set_header Host $host;
     proxy_set_header X-Real-IP $remote_addr;
+    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    proxy_set_header X-Forwarded-Proto $scheme;
     expires 1y;
     add_header Cache-Control "public, immutable";
   }
@@ -57,7 +59,7 @@ server {
     proxy_read_timeout 10s;
   }
 
-  # Telemetry SPA — proxy to orange, rewrite root-relative paths to prefix
+  # Telemetry SPA — proxy to orange VPS, rewrite root-relative paths to /telemetry/ prefix
   location /telemetry/ {
     proxy_pass http://100.96.248.86:8181/;
     proxy_http_version 1.1;
@@ -69,7 +71,7 @@ server {
     proxy_send_timeout 35s;
     proxy_read_timeout 35s;
 
-    # Rewrite root-relative paths in HTML/JS to /telemetry/ prefix
+    # Rewrite root-relative paths (<script src="/", href="/", fetch("/")) to /telemetry/ prefix
     sub_filter_types text/html application/javascript;
     sub_filter_once off;
     sub_filter 'src="/' 'src="/telemetry/';

From 65d0040c0d480a4a660eb88d9ecedd2d782a35e9 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Mon, 8 Jun 2026 00:11:02 +0700
Subject: [PATCH 26/28] fix(web): escape quotes in sub_filter for fetch calls

Update the sub_filter pattern for fetch requests to include escaped
double quotes. This ensures that path rewriting correctly handles
JavaScript fetch calls that use double-quoted strings, preventing
broken resource paths in the telemetry dashboard.
---
 apps/web/nginx.conf | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/apps/web/nginx.conf b/apps/web/nginx.conf
index c6f302a..3b74e92 100644
--- a/apps/web/nginx.conf
+++ b/apps/web/nginx.conf
@@ -72,12 +72,11 @@ server {
     proxy_read_timeout 35s;
 
     # Rewrite root-relative paths (<script src="/", href="/", fetch("/")) to /telemetry/ prefix
-    sub_filter_types text/html application/javascript;
     sub_filter_once off;
     sub_filter 'src="/' 'src="/telemetry/';
     sub_filter 'href="/' 'href="/telemetry/';
     sub_filter "url('/" "url('/telemetry/";
-    sub_filter 'fetch("/' 'fetch("/telemetry/');
+    sub_filter 'fetch("/' "fetch(\"/telemetry/";
   }
 
   location / {

From f5ac0a879599389e1fd90cf1d47f3241ad7e5e6c Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Mon, 8 Jun 2026 00:31:30 +0700
Subject: [PATCH 27/28] feat(web): implement telemetry dashboard with data
 visualization

Add a comprehensive telemetry dashboard page featuring real-time
system statistics and metric visualization using recharts.

- Integrate recharts for area and bar chart rendering
- Implement TelemetryAPI client for stats, discovery, and chart data
- Add dashboard UI with stat cards and responsive charts
- Remove legacy nginx sub_filter proxy configuration in favor of
  direct API communication to telemetry.imrnes.team
---
 apps/web/nginx.conf                   |  58 ---
 apps/web/package.json                 |   1 +
 apps/web/src/pages/telemetry-page.tsx | 583 +++++++++++++++++++++-----
 bun.lock                              |  79 ++++
 4 files changed, 563 insertions(+), 158 deletions(-)

diff --git a/apps/web/nginx.conf b/apps/web/nginx.conf
index 3b74e92..e316eec 100644
--- a/apps/web/nginx.conf
+++ b/apps/web/nginx.conf
@@ -21,64 +21,6 @@ server {
     proxy_set_header X-Forwarded-Proto $scheme;
   }
 
-  # ── Telemetry Dashboard Proxy (orange VPS via Tailscale) ──────────────
-  # Telemetry UI SPA assets (fingerprinted by Vite, cache aggressively)
-  location /telemetry/assets/ {
-    proxy_pass http://100.96.248.86:8181/assets/;
-    proxy_http_version 1.1;
-    proxy_set_header Host $host;
-    proxy_set_header X-Real-IP $remote_addr;
-    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
-    proxy_set_header X-Forwarded-Proto $scheme;
-    expires 1y;
-    add_header Cache-Control "public, immutable";
-  }
-
-  # Telemetry API calls (query proxy + target management)
-  location /telemetry/proxy/ {
-    proxy_pass http://100.96.248.86:8181/proxy/;
-    proxy_http_version 1.1;
-    proxy_set_header Host $host;
-    proxy_set_header X-Real-IP $remote_addr;
-    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
-    proxy_set_header X-Forwarded-Proto $scheme;
-    proxy_connect_timeout 5s;
-    proxy_send_timeout 35s;
-    proxy_read_timeout 35s;
-  }
-
-  location /telemetry/api/ {
-    proxy_pass http://100.96.248.86:8181/api/;
-    proxy_http_version 1.1;
-    proxy_set_header Host $host;
-    proxy_set_header X-Real-IP $remote_addr;
-    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
-    proxy_set_header X-Forwarded-Proto $scheme;
-    proxy_connect_timeout 5s;
-    proxy_send_timeout 10s;
-    proxy_read_timeout 10s;
-  }
-
-  # Telemetry SPA — proxy to orange VPS, rewrite root-relative paths to /telemetry/ prefix
-  location /telemetry/ {
-    proxy_pass http://100.96.248.86:8181/;
-    proxy_http_version 1.1;
-    proxy_set_header Host $host;
-    proxy_set_header X-Real-IP $remote_addr;
-    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
-    proxy_set_header X-Forwarded-Proto $scheme;
-    proxy_connect_timeout 5s;
-    proxy_send_timeout 35s;
-    proxy_read_timeout 35s;
-
-    # Rewrite root-relative paths (<script src="/", href="/", fetch("/")) to /telemetry/ prefix
-    sub_filter_once off;
-    sub_filter 'src="/' 'src="/telemetry/';
-    sub_filter 'href="/' 'href="/telemetry/';
-    sub_filter "url('/" "url('/telemetry/";
-    sub_filter 'fetch("/' "fetch(\"/telemetry/";
-  }
-
   location / {
     try_files $uri $uri/ /index.html;
   }
diff --git a/apps/web/package.json b/apps/web/package.json
index 7df9fac..7180750 100644
--- a/apps/web/package.json
+++ b/apps/web/package.json
@@ -20,6 +20,7 @@
     "react": "^19.2.6",
     "react-dom": "^19.2.6",
     "react-router-dom": "^7.15.1",
+    "recharts": "3.8.1",
     "tailwind-merge": "^3.6.0",
     "web-vitals": "5.3.0",
     "zustand": "^5.0.13"
diff --git a/apps/web/src/pages/telemetry-page.tsx b/apps/web/src/pages/telemetry-page.tsx
index cf82ca7..46b30d8 100644
--- a/apps/web/src/pages/telemetry-page.tsx
+++ b/apps/web/src/pages/telemetry-page.tsx
@@ -1,124 +1,507 @@
-import { useMemo, useState } from "react";
-import { Card, CardContent } from "@/components/ui/card";
-import { BarChart3, AlertTriangle } from "lucide-react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import {
+  BarChart3,
+  Activity,
+  Cpu,
+  HardDrive,
+  Database,
+  Layers,
+  RefreshCw,
+  AlertTriangle,
+} from "lucide-react";
+import {
+  AreaChart,
+  Area,
+  XAxis,
+  YAxis,
+  CartesianGrid,
+  Tooltip,
+  ResponsiveContainer,
+  BarChart,
+  Bar,
+} from "recharts";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 
-/**
- * Telemetry Dashboard — proxied through nginx at /telemetry/
- * Nginx rewrites root-relative paths so the SPA works from the sub-path.
- */
+// ─── Types ──────────────────────────────────────────────────────────
+const API_BASE = "https://telemetry.imrnes.team/proxy/dashboard";
 
-const TELEMETRY_BASE = "/telemetry";
+interface DashboardStats {
+  cpu_usage: number;
+  disk_usage: number;
+  total_metrics: number;
+  active_services: number;
+  uptime_seconds: number;
+  health: { disk_readonly: boolean; errors: number };
+}
 
-const EMBED_PAGES = [
-  { id: "dashboard", label: "Dashboard", path: "" },
-  { id: "explorer", label: "Explorer", path: "/explorer" },
-  { id: "targets", label: "Targets", path: "/targets" },
-  { id: "tenants", label: "Tenants", path: "/tenants" },
-];
+interface DiscoveredMetric {
+  metric_name: string;
+  service: string;
+  sample_count: number;
+  latest_value: number;
+}
 
+interface ChartPoint {
+  time: string;
+  value: number;
+}
+
+// ─── Helpers ─────────────────────────────────────────────────────────
+function fmt(n: number): string {
+  if (n >= 1_000_000) return (n / 1_000_000).toFixed(1) + "M";
+  if (n >= 1_000) return (n / 1_000).toFixed(1) + "K";
+  return n.toFixed(1);
+}
+
+function fmtDuration(s: number): string {
+  const d = Math.floor(s / 86400);
+  const h = Math.floor((s % 86400) / 3600);
+  if (d > 0) return `${d}d ${h}h`;
+  const m = Math.floor((s % 3600) / 60);
+  if (h > 0) return `${h}h ${m}m`;
+  return `${m}m`;
+}
+
+function fmtPct(v: number): string {
+  return (v * 100).toFixed(1) + "%";
+}
+
+// ─── API Client ──────────────────────────────────────────────────────
+class TelemetryAPI {
+  private base: string;
+  constructor(base: string) {
+    this.base = base;
+  }
+
+  async stats(): Promise<DashboardStats> {
+    const res = await fetch(`${this.base}/stats`);
+    if (!res.ok) throw new Error(`Stats API: ${res.status}`);
+    return res.json();
+  }
+
+  async discover(): Promise<DiscoveredMetric[]> {
+    const res = await fetch(`${this.base}/discover`);
+    if (!res.ok) throw new Error(`Discover API: ${res.status}`);
+    const data = await res.json();
+    return data.metrics ?? [];
+  }
+
+  async charts(
+    panels: { key: string; metric: string; aggregation?: string }[],
+  ): Promise<Map<string, ChartPoint[]>> {
+    const now = Math.floor(Date.now() / 1000);
+    const oneHourAgo = now - 3600;
+    const res = await fetch(`${this.base}/charts`, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({
+        panels: panels.map((p) => ({
+          key: p.key,
+          metric: p.metric,
+          start: oneHourAgo,
+          end: now,
+          aggregation: p.aggregation ?? "avg",
+        })),
+      }),
+    });
+    if (!res.ok) throw new Error(`Charts API: ${res.status}`);
+    const data = await res.json();
+    const map = new Map<string, ChartPoint[]>();
+    for (const r of data.results ?? []) {
+      map.set(r.key, r.data ?? []);
+    }
+    return map;
+  }
+}
+
+const api = new TelemetryAPI(API_BASE);
+
+// ─── Stat Card ───────────────────────────────────────────────────────
+function StatCard({
+  icon: Icon,
+  label,
+  value,
+  sub,
+  color,
+}: {
+  icon: typeof BarChart3;
+  label: string;
+  value: string;
+  sub?: string;
+  color: string;
+}) {
+  return (
+    <Card className="border-slate-200 shadow-sm">
+      <CardHeader className="flex flex-row items-center justify-between pb-2 pt-4 px-4">
+        <CardTitle className="text-sm font-medium text-slate-500">
+          {label}
+        </CardTitle>
+        <Icon className={`h-4 w-4 ${color}`} />
+      </CardHeader>
+      <CardContent className="px-4 pb-4">
+        <div className="text-2xl font-bold">{value}</div>
+        {sub && <p className="text-xs text-slate-400 mt-1">{sub}</p>}
+      </CardContent>
+    </Card>
+  );
+}
+
+// ─── Metric Card ─────────────────────────────────────────────────────
+function MetricChart({
+  title,
+  data,
+  loading,
+  color,
+}: {
+  title: string;
+  data: ChartPoint[];
+  loading: boolean;
+  color: string;
+}) {
+  if (loading) {
+    return (
+      <Card className="border-slate-200 shadow-sm">
+        <CardHeader className="pb-2 px-4 pt-4">
+          <CardTitle className="text-sm font-medium">{title}</CardTitle>
+        </CardHeader>
+        <CardContent className="px-4 pb-4">
+          <div className="flex items-center justify-center h-40 text-slate-400 text-sm">
+            Loading...
+          </div>
+        </CardContent>
+      </Card>
+    );
+  }
+
+  if (!data || data.length === 0) {
+    return (
+      <Card className="border-slate-200 shadow-sm">
+        <CardHeader className="pb-2 px-4 pt-4">
+          <CardTitle className="text-sm font-medium">{title}</CardTitle>
+        </CardHeader>
+        <CardContent className="px-4 pb-4">
+          <div className="flex items-center justify-center h-40 text-slate-400 text-sm">
+            No data available
+          </div>
+        </CardContent>
+      </Card>
+    );
+  }
+
+  return (
+    <Card className="border-slate-200 shadow-sm">
+      <CardHeader className="pb-2 px-4 pt-4">
+        <CardTitle className="text-sm font-medium">{title}</CardTitle>
+      </CardHeader>
+      <CardContent className="px-4 pb-4">
+        <ResponsiveContainer width="100%" height={160}>
+          <AreaChart data={data}>
+            <defs>
+              <linearGradient id={`grad-${title}`} x1="0" y1="0" x2="0" y2="1">
+                <stop offset="5%" stopColor={color} stopOpacity={0.2} />
+                <stop offset="95%" stopColor={color} stopOpacity={0} />
+              </linearGradient>
+            </defs>
+            <CartesianGrid strokeDasharray="3 3" stroke="#e2e8f0" />
+            <XAxis
+              dataKey="time"
+              tick={{ fontSize: 10 }}
+              tickFormatter={(v) => {
+                const d = new Date(v);
+                return `${d.getHours().toString().padStart(2, "0")}:${d.getMinutes().toString().padStart(2, "0")}`;
+              }}
+            />
+            <YAxis tick={{ fontSize: 10 }} />
+            <Tooltip
+              labelFormatter={(v) => new Date(v).toLocaleTimeString()}
+              // eslint-disable-next-line @typescript-eslint/no-explicit-any
+              formatter={(val: any) => [typeof val === "number" ? val.toFixed(2) : String(val ?? ""), title]}
+            />
+            <Area
+              type="monotone"
+              dataKey="value"
+              stroke={color}
+              fill={`url(#grad-${title})`}
+              strokeWidth={2}
+            />
+          </AreaChart>
+        </ResponsiveContainer>
+      </CardContent>
+    </Card>
+  );
+}
+
+// ─── Main Page ───────────────────────────────────────────────────────
 export function TelemetryPage() {
-  const [currentPage, setCurrentPage] = useState(EMBED_PAGES[0]);
-  const [iframeState, setIframeState] = useState<"loading" | "loaded" | "error">("loading");
+  const [stats, setStats] = useState<DashboardStats | null>(null);
+  const [metrics, setMetrics] = useState<DiscoveredMetric[]>([]);
+  const [chartMap, setChartMap] = useState<Map<string, ChartPoint[]>>(new Map());
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+  const [refreshing, setRefreshing] = useState(false);
+  const intervalRef = useRef<number | undefined>(undefined);
 
-  const embedUrl = useMemo(() => {
-    return `${TELEMETRY_BASE}${currentPage.path}`;
-  }, [currentPage]);
+  const fetchData = useCallback(async (isRefresh = false) => {
+    try {
+      if (isRefresh) setRefreshing(true);
+      else setLoading(true);
+      setError(null);
 
-  const handleIframeLoad = () => {
-    setIframeState("loaded");
-  };
+      const [statsData, discoverData] = await Promise.all([
+        api.stats(),
+        api.discover(),
+      ]);
 
-  const handleIframeError = () => {
-    setIframeState("error");
-  };
+      setStats(statsData);
+      setMetrics(discoverData);
 
-  const handleRetry = () => {
-    setIframeState("loading");
-  };
+      // Fetch charts for top metrics
+      const topMetrics = discoverData
+        .filter((m) => !m.metric_name.startsWith("prometheus_") && m.service !== "prometheus")
+        .slice(0, 6);
+
+      const chartPanels = topMetrics.map((m) => ({
+        key: m.metric_name,
+        metric: m.metric_name,
+      }));
+
+      // Add CPU and disk
+      chartPanels.unshift({ key: "_cpu_usage_pct", metric: "_cpu_usage_pct" });
+      chartPanels.unshift({ key: "_disk_usage_pct", metric: "_disk_usage_pct" });
+
+      const charts = await api.charts(chartPanels);
+      setChartMap(charts);
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Unknown error");
+    } finally {
+      setLoading(false);
+      setRefreshing(false);
+    }
+  }, []);
+
+  useEffect(() => {
+    fetchData();
+    intervalRef.current = window.setInterval(() => fetchData(true), 30_000);
+    return () => {
+      if (intervalRef.current) clearInterval(intervalRef.current);
+    };
+  }, [fetchData]);
+
+  const serviceCounts = useMemo(() => {
+    const counts = new Map<string, number>();
+    for (const m of metrics) {
+      counts.set(m.service, (counts.get(m.service) ?? 0) + 1);
+    }
+    return Array.from(counts.entries()).sort((a, b) => b[1] - a[1]);
+  }, [metrics]);
+
+  const topMetrics = useMemo(() => {
+    return metrics.slice(0, 10);
+  }, [metrics]);
+
+  if (loading && !stats) {
+    return (
+      <div className="space-y-6">
+        <div className="flex items-center justify-center h-64">
+          <div className="text-center space-y-3">
+            <div className="inline-block h-8 w-8 animate-spin rounded-full border-4 border-solid border-[#48A111] border-r-transparent" />
+            <p className="text-sm text-muted-foreground">
+              Loading telemetry data...
+            </p>
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+  if (error && !stats) {
+    return (
+      <div className="space-y-6">
+        <div className="flex items-center justify-center h-64">
+          <div className="text-center space-y-3 max-w-md">
+            <AlertTriangle className="h-10 w-10 text-red-500 mx-auto" />
+            <p className="text-sm font-semibold text-red-600">
+              Failed to load telemetry data
+            </p>
+            <p className="text-xs text-slate-500">{error}</p>
+            <button
+              onClick={() => fetchData()}
+              className="inline-flex items-center gap-1 rounded-full bg-[#48A111] px-4 py-2 text-sm font-semibold text-white hover:bg-[#306D29]"
+            >
+              Retry
+            </button>
+          </div>
+        </div>
+      </div>
+    );
+  }
 
   return (
     <div className="space-y-6">
       {/* Header */}
-      <div className="flex flex-col md:flex-row items-start md:items-center justify-between gap-4">
+      <div className="flex items-center justify-between">
         <div>
           <h1 className="text-2xl md:text-[28px] font-extrabold text-[#214B11] flex items-center gap-3">
             <BarChart3 className="h-7 w-7 text-[#48A111]" />
             Telemetry Dashboard
           </h1>
-          <p className="text-[15px] text-muted-foreground mt-1">
-            System metrics, service health, and performance monitoring from the
-            telemetry pipeline (Prometheus → ClickHouse).
+          <p className="text-sm text-muted-foreground mt-1">
+            System metrics from Prometheus pipeline via ClickHouse.
+            {error && (
+              <span className="text-amber-600 ml-2">
+                (partial data — {error})
+              </span>
+            )}
           </p>
         </div>
-      </div>
-
-      {/* Navigation tabs */}
-      <div className="flex flex-wrap gap-2">
-        {EMBED_PAGES.map((page) => (
-          <button
-            key={page.id}
-            onClick={() => {
-              setCurrentPage(page);
-              setIframeState("loading");
-            }}
-            className={`rounded-full px-4 py-2 text-sm font-medium transition-colors ${
-              currentPage.id === page.id
-                ? "bg-[#48A111] text-white shadow-sm"
-                : "bg-white text-slate-600 hover:bg-slate-100 border border-slate-200"
-            }`}
-          >
-            {page.label}
-          </button>
-        ))}
-      </div>
-
-      {/* Iframe container */}
-      <Card className="overflow-hidden rounded-2xl border-slate-200 shadow-sm">
-        <CardContent className="p-0 relative">
-          {/* Loading indicator */}
-          {iframeState === "loading" && (
-            <div className="flex items-center justify-center h-150 bg-slate-50">
-              <div className="text-center space-y-3">
-                <div className="inline-block h-8 w-8 animate-spin rounded-full border-4 border-solid border-[#48A111] border-r-transparent" />
-                <p className="text-sm text-muted-foreground">
-                  Loading telemetry dashboard...
-                </p>
-              </div>
-            </div>
-          )}
-
-          {/* Error state */}
-          {iframeState === "error" && (
-            <div className="flex items-center justify-center h-150 bg-slate-50">
-              <div className="text-center space-y-3 max-w-md px-4">
-                <AlertTriangle className="h-10 w-10 text-amber-500 mx-auto" />
-                <p className="text-sm font-semibold text-red-600">
-                  Failed to load telemetry dashboard
-                </p>
-                <p className="text-sm text-muted-foreground">
-                  The telemetry backend may be unreachable. Make sure the
-                  telemetry stack is running on the orange VPS.
-                </p>
-                <button
-                  onClick={handleRetry}
-                  className="inline-flex items-center gap-1 rounded-full bg-[#48A111] px-4 py-2 text-sm font-semibold text-white hover:bg-[#306D29] transition-colors"
-                >
-                  Retry
-                </button>
-              </div>
-            </div>
-          )}
-
-          {/* Iframe */}
-          <iframe
-            src={embedUrl}
-            title="Telemetry Dashboard"
-            className={`w-full border-0 ${iframeState === "loaded" || iframeState === "error" ? "block" : "hidden"}`}
-            style={{ height: "calc(100vh - 280px)", minHeight: "600px" }}
-            onLoad={handleIframeLoad}
-            onError={handleIframeError}
-            sandbox="allow-scripts allow-same-origin allow-forms allow-popups"
+        <button
+          onClick={() => fetchData(true)}
+          disabled={refreshing}
+          className="inline-flex items-center gap-1 rounded-full border border-slate-300 bg-white px-3 py-1.5 text-sm font-medium text-slate-600 hover:bg-slate-50 transition-colors disabled:opacity-50"
+        >
+          <RefreshCw
+            className={`h-4 w-4 ${refreshing ? "animate-spin" : ""}`}
           />
+          Refresh
+        </button>
+      </div>
+
+      {/* Stat Cards */}
+      {stats && (
+        <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">
+          <StatCard
+            icon={Cpu}
+            label="CPU Usage"
+            value={fmtPct(stats.cpu_usage)}
+            color="text-blue-600"
+          />
+          <StatCard
+            icon={HardDrive}
+            label="Disk Usage"
+            value={fmtPct(stats.disk_usage)}
+            color="text-amber-600"
+          />
+          <StatCard
+            icon={Database}
+            label="Total Metrics"
+            value={fmt(stats.total_metrics)}
+            sub={`${stats.active_services} active services`}
+            color="text-green-600"
+          />
+          <StatCard
+            icon={Activity}
+            label="Uptime"
+            value={fmtDuration(stats.uptime_seconds)}
+            sub={
+              stats.health.errors > 0
+                ? `${stats.health.errors} errors`
+                : "All healthy"
+            }
+            color={stats.health.errors > 0 ? "text-red-600" : "text-green-600"}
+          />
+        </div>
+      )}
+
+      {/* CPU & Disk charts */}
+      <div className="grid gap-4 md:grid-cols-2">
+        <MetricChart
+          title="CPU Usage (last hour)"
+          data={chartMap.get("_cpu_usage_pct") ?? []}
+          loading={loading}
+          color="#2563eb"
+        />
+        <MetricChart
+          title="Disk Usage (last hour)"
+          data={chartMap.get("_disk_usage_pct") ?? []}
+          loading={loading}
+          color="#f59e0b"
+        />
+      </div>
+
+      {/* Top Metrics */}
+      <Card className="border-slate-200 shadow-sm">
+        <CardHeader className="pb-2 px-4 pt-4">
+          <CardTitle className="text-lg font-semibold text-[#214B11] flex items-center gap-2">
+            <Layers className="h-5 w-5 text-[#48A111]" />
+            Top Metrics
+          </CardTitle>
+        </CardHeader>
+        <CardContent className="px-4 pb-4">
+          {topMetrics.length === 0 ? (
+            <div className="text-center py-8 text-slate-400 text-sm">
+              No metrics discovered yet
+            </div>
+          ) : (
+            <div className="overflow-x-auto">
+              <table className="w-full text-sm">
+                <thead>
+                  <tr className="border-b border-slate-200">
+                    <th className="text-left py-2 px-2 font-medium text-slate-500">
+                      Metric
+                    </th>
+                    <th className="text-left py-2 px-2 font-medium text-slate-500">
+                      Service
+                    </th>
+                    <th className="text-right py-2 px-2 font-medium text-slate-500">
+                      Samples
+                    </th>
+                    <th className="text-right py-2 px-2 font-medium text-slate-500">
+                      Latest Value
+                    </th>
+                  </tr>
+                </thead>
+                <tbody>
+                  {topMetrics.map((m) => (
+                    <tr key={m.metric_name} className="border-b border-slate-100 hover:bg-slate-50">
+                      <td className="py-2 px-2 font-mono text-xs text-slate-700 max-w-[300px] truncate">
+                        {m.metric_name}
+                      </td>
+                      <td className="py-2 px-2">
+                        <span className="inline-flex items-center rounded-full bg-[#EFF6E8] px-2 py-0.5 text-xs font-medium text-[#48A111]">
+                          {m.service}
+                        </span>
+                      </td>
+                      <td className="py-2 px-2 text-right text-slate-600">
+                        {fmt(m.sample_count)}
+                      </td>
+                      <td className="py-2 px-2 text-right font-mono text-xs text-slate-600">
+                        {typeof m.latest_value === "number"
+                          ? m.latest_value.toFixed(4)
+                          : String(m.latest_value)}
+                      </td>
+                    </tr>
+                  ))}
+                </tbody>
+              </table>
+            </div>
+          )}
+        </CardContent>
+      </Card>
+
+      {/* Service Distribution */}
+      <Card className="border-slate-200 shadow-sm">
+        <CardHeader className="pb-2 px-4 pt-4">
+          <CardTitle className="text-lg font-semibold text-[#214B11] flex items-center gap-2">
+            <Layers className="h-5 w-5 text-[#48A111]" />
+            Services
+          </CardTitle>
+        </CardHeader>
+        <CardContent className="px-4 pb-4">
+          {serviceCounts.length === 0 ? (
+            <div className="text-center py-8 text-slate-400 text-sm">
+              No services discovered
+            </div>
+          ) : (
+            <ResponsiveContainer width="100%" height={200}>
+              <BarChart data={serviceCounts.map(([name, count]) => ({ name, count }))}>
+                <CartesianGrid strokeDasharray="3 3" stroke="#e2e8f0" />
+                <XAxis dataKey="name" tick={{ fontSize: 12 }} />
+                <YAxis tick={{ fontSize: 12 }} />
+                <Tooltip />
+                <Bar dataKey="count" fill="#48A111" radius={[4, 4, 0, 0]} />
+              </BarChart>
+            </ResponsiveContainer>
+          )}
         </CardContent>
       </Card>
     </div>
diff --git a/bun.lock b/bun.lock
index 92f3e5d..09ecf10 100644
--- a/bun.lock
+++ b/bun.lock
@@ -46,6 +46,7 @@
         "react": "^19.2.6",
         "react-dom": "^19.2.6",
         "react-router-dom": "^7.15.1",
+        "recharts": "3.8.1",
         "tailwind-merge": "^3.6.0",
         "web-vitals": "5.3.0",
         "zustand": "^5.0.13",
@@ -259,6 +260,8 @@
 
     "@radix-ui/react-slot": ["@radix-ui/react-slot@1.2.4", "", { "dependencies": { "@radix-ui/react-compose-refs": "1.1.2" }, "peerDependencies": { "@types/react": "*", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-Jl+bCv8HxKnlTLVrcDE8zTMJ09R9/ukw4qBs/oZClOfoQk/cOTbDn+NceXfV7j09YPVQUryJPHurafcSg6EVKA=="],
 
+    "@reduxjs/toolkit": ["@reduxjs/toolkit@2.12.0", "", { "dependencies": { "@standard-schema/spec": "^1.0.0", "@standard-schema/utils": "^0.3.0", "immer": "^11.0.0", "redux": "^5.0.1", "redux-thunk": "^3.1.0", "reselect": "^5.1.0" }, "peerDependencies": { "react": "^16.9.0 || ^17.0.0 || ^18 || ^19", "react-redux": "^7.2.1 || ^8.1.3 || ^9.0.0" }, "optionalPeers": ["react", "react-redux"] }, "sha512-KiT+RzZbp6mQET+Mg+h2c97+9j1sNflUxQkIHI7Yuzf6Peu+OYpmkn6nbHWmLLWj+1ZODUJFwGZ7gx3L9R9EOw=="],
+
     "@rolldown/binding-android-arm64": ["@rolldown/binding-android-arm64@1.0.2", "", { "os": "android", "cpu": "arm64" }, "sha512-ZS4D1JPGn/MYQN/SYDWftIE/nVsM8j/AFOYEzAoOE2O3NktQOZru+/vYXGbR/qtdLdIfGCP0lcoJiYVzsEz+iQ=="],
 
     "@rolldown/binding-darwin-arm64": ["@rolldown/binding-darwin-arm64@1.0.2", "", { "os": "darwin", "cpu": "arm64" }, "sha512-vdFA9+C/rekyGce7WqHs/xoT0ioZEWaOFyZLIV1mEeNFaFDUQrPIo8Vs2GvJ6eetb3rzDUtUBgzto3ExpXJB3w=="],
@@ -293,6 +296,10 @@
 
     "@sinclair/typebox": ["@sinclair/typebox@0.34.49", "", {}, "sha512-brySQQs7Jtn0joV8Xh9ZV/hZb9Ozb0pmazDIASBkYKCjXrXU3mpcFahmK/z4YDhGkQvP9mWJbVyahdtU5wQA+A=="],
 
+    "@standard-schema/spec": ["@standard-schema/spec@1.1.0", "", {}, "sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w=="],
+
+    "@standard-schema/utils": ["@standard-schema/utils@0.3.0", "", {}, "sha512-e7Mew686owMaPJVNNLs55PUvgz371nKgwsc4vxE49zsODpJEnxgxRo2y/OKrqueavXgZNMDVj3DdHFlaSAeU8g=="],
+
     "@tailwindcss/node": ["@tailwindcss/node@4.3.0", "", { "dependencies": { "@jridgewell/remapping": "^2.3.5", "enhanced-resolve": "^5.21.0", "jiti": "^2.6.1", "lightningcss": "1.32.0", "magic-string": "^0.30.21", "source-map-js": "^1.2.1", "tailwindcss": "4.3.0" } }, "sha512-aFb4gUhFOgdh9AXo4IzBEOzBkkAxm9VigwDJnMIYv3lcfXCJVesNfbEaBl4BNgVRyid92AmdviqwBUBRKSeY3g=="],
 
     "@tailwindcss/oxide": ["@tailwindcss/oxide@4.3.0", "", { "optionalDependencies": { "@tailwindcss/oxide-android-arm64": "4.3.0", "@tailwindcss/oxide-darwin-arm64": "4.3.0", "@tailwindcss/oxide-darwin-x64": "4.3.0", "@tailwindcss/oxide-freebsd-x64": "4.3.0", "@tailwindcss/oxide-linux-arm-gnueabihf": "4.3.0", "@tailwindcss/oxide-linux-arm64-gnu": "4.3.0", "@tailwindcss/oxide-linux-arm64-musl": "4.3.0", "@tailwindcss/oxide-linux-x64-gnu": "4.3.0", "@tailwindcss/oxide-linux-x64-musl": "4.3.0", "@tailwindcss/oxide-wasm32-wasi": "4.3.0", "@tailwindcss/oxide-win32-arm64-msvc": "4.3.0", "@tailwindcss/oxide-win32-x64-msvc": "4.3.0" } }, "sha512-F7HZGBeN9I0/AuuJS5PwcD8xayx5ri5GhjYUDBEVYUkexyA/giwbDNjRVrxSezE3T250OU2K/wp/ltWx3UOefg=="],
@@ -337,12 +344,32 @@
 
     "@types/bun": ["@types/bun@1.3.14", "", { "dependencies": { "bun-types": "1.3.14" } }, "sha512-h1hFqFVcvAvD9j9K7ZW7vd82aSA+rTdznZa+5bwvCwqSB1jmmfLcbIWhOLx1/+boy/xmjgCs/OMUL8hRJSmnPw=="],
 
+    "@types/d3-array": ["@types/d3-array@3.2.2", "", {}, "sha512-hOLWVbm7uRza0BYXpIIW5pxfrKe0W+D5lrFiAEYR+pb6w3N2SwSMaJbXdUfSEv+dT4MfHBLtn5js0LAWaO6otw=="],
+
+    "@types/d3-color": ["@types/d3-color@3.1.3", "", {}, "sha512-iO90scth9WAbmgv7ogoq57O9YpKmFBbmoEoCHDB2xMBY0+/KVrqAaCDyCE16dUspeOvIxFFRI+0sEtqDqy2b4A=="],
+
+    "@types/d3-ease": ["@types/d3-ease@3.0.2", "", {}, "sha512-NcV1JjO5oDzoK26oMzbILE6HW7uVXOHLQvHshBUW4UMdZGfiY6v5BeQwh9a9tCzv+CeefZQHJt5SRgK154RtiA=="],
+
+    "@types/d3-interpolate": ["@types/d3-interpolate@3.0.4", "", { "dependencies": { "@types/d3-color": "*" } }, "sha512-mgLPETlrpVV1YRJIglr4Ez47g7Yxjl1lj7YKsiMCb27VJH9W8NVM6Bb9d8kkpG/uAQS5AmbA48q2IAolKKo1MA=="],
+
+    "@types/d3-path": ["@types/d3-path@3.1.1", "", {}, "sha512-VMZBYyQvbGmWyWVea0EHs/BwLgxc+MKi1zLDCONksozI4YJMcTt8ZEuIR4Sb1MMTE8MMW49v0IwI5+b7RmfWlg=="],
+
+    "@types/d3-scale": ["@types/d3-scale@4.0.9", "", { "dependencies": { "@types/d3-time": "*" } }, "sha512-dLmtwB8zkAeO/juAMfnV+sItKjlsw2lKdZVVy6LRr0cBmegxSABiLEpGVmSJJ8O08i4+sGR6qQtb6WtuwJdvVw=="],
+
+    "@types/d3-shape": ["@types/d3-shape@3.1.8", "", { "dependencies": { "@types/d3-path": "*" } }, "sha512-lae0iWfcDeR7qt7rA88BNiqdvPS5pFVPpo5OfjElwNaT2yyekbM0C9vK+yqBqEmHr6lDkRnYNoTBYlAgJa7a4w=="],
+
+    "@types/d3-time": ["@types/d3-time@3.0.4", "", {}, "sha512-yuzZug1nkAAaBlBBikKZTgzCeA+k1uy4ZFwWANOfKw5z5LRhV0gNA7gNkKm7HoK+HRN0wX3EkxGk0fpbWhmB7g=="],
+
+    "@types/d3-timer": ["@types/d3-timer@3.0.2", "", {}, "sha512-Ps3T8E8dZDam6fUyNiMkekK3XUsaUEik+idO9/YjPtfj2qruF8tFBXS7XhtE4iIXBLxhmLjP3SXpLhVf21I9Lw=="],
+
     "@types/node": ["@types/node@25.9.1", "", { "dependencies": { "undici-types": ">=7.24.0 <7.24.7" } }, "sha512-xfrlY7UD5rMJk3ZVJP8BNzS28J36YJg+xp+LPXV1TdWxr8uMH5A860QNxYDGQe/ylDSgjxE52Q9VnO7p75tJxg=="],
 
     "@types/react": ["@types/react@19.2.15", "", { "dependencies": { "csstype": "^3.2.2" } }, "sha512-eRwcGNHve+E8qtEQSSRl6urh+rFop4v8gm6O8rGv25CodbvFdLjA1vVQ1KkiFE0w0UPOnb8tDiFKL5lp0rtY5Q=="],
 
     "@types/react-dom": ["@types/react-dom@19.2.3", "", { "peerDependencies": { "@types/react": "^19.2.0" } }, "sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ=="],
 
+    "@types/use-sync-external-store": ["@types/use-sync-external-store@0.0.6", "", {}, "sha512-zFDAD+tlpf2r4asuHEj0XH6pY6i0g5NeAHPn+15wk3BV6JA69eERFXC1gyGThDkVa1zCyKr5jox1+2LbV/AMLg=="],
+
     "@vitejs/plugin-react": ["@vitejs/plugin-react@6.0.2", "", { "dependencies": { "@rolldown/pluginutils": "^1.0.0" }, "peerDependencies": { "@rolldown/plugin-babel": "^0.1.7 || ^0.2.0", "babel-plugin-react-compiler": "^1.0.0", "vite": "^8.0.0" }, "optionalPeers": ["@rolldown/plugin-babel", "babel-plugin-react-compiler"] }, "sha512-DlSMqo4WhThw4vB8Mpn0Woe9J+Jfq1geJ61AKW0QEgLzGMNwtIMdxbDUzLxcun8W7NbJO0e2Jg/Nxm3cCSVzzg=="],
 
     "@zeavis/api": ["@zeavis/api@workspace:apps/api"],
@@ -383,8 +410,32 @@
 
     "csstype": ["csstype@3.2.3", "", {}, "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ=="],
 
+    "d3-array": ["d3-array@3.2.4", "", { "dependencies": { "internmap": "1 - 2" } }, "sha512-tdQAmyA18i4J7wprpYq8ClcxZy3SC31QMeByyCFyRt7BVHdREQZ5lpzoe5mFEYZUWe+oq8HBvk9JjpibyEV4Jg=="],
+
+    "d3-color": ["d3-color@3.1.0", "", {}, "sha512-zg/chbXyeBtMQ1LbD/WSoW2DpC3I0mpmPdW+ynRTj/x2DAWYrIY7qeZIHidozwV24m4iavr15lNwIwLxRmOxhA=="],
+
+    "d3-ease": ["d3-ease@3.0.1", "", {}, "sha512-wR/XK3D3XcLIZwpbvQwQ5fK+8Ykds1ip7A2Txe0yxncXSdq1L9skcG7blcedkOX+ZcgxGAmLX1FrRGbADwzi0w=="],
+
+    "d3-format": ["d3-format@3.1.2", "", {}, "sha512-AJDdYOdnyRDV5b6ArilzCPPwc1ejkHcoyFarqlPqT7zRYjhavcT3uSrqcMvsgh2CgoPbK3RCwyHaVyxYcP2Arg=="],
+
+    "d3-interpolate": ["d3-interpolate@3.0.1", "", { "dependencies": { "d3-color": "1 - 3" } }, "sha512-3bYs1rOD33uo8aqJfKP3JWPAibgw8Zm2+L9vBKEHJ2Rg+viTR7o5Mmv5mZcieN+FRYaAOWX5SJATX6k1PWz72g=="],
+
+    "d3-path": ["d3-path@3.1.0", "", {}, "sha512-p3KP5HCf/bvjBSSKuXid6Zqijx7wIfNW+J/maPs+iwR35at5JCbLUT0LzF1cnjbCHWhqzQTIN2Jpe8pRebIEFQ=="],
+
+    "d3-scale": ["d3-scale@4.0.2", "", { "dependencies": { "d3-array": "2.10.0 - 3", "d3-format": "1 - 3", "d3-interpolate": "1.2.0 - 3", "d3-time": "2.1.1 - 3", "d3-time-format": "2 - 4" } }, "sha512-GZW464g1SH7ag3Y7hXjf8RoUuAFIqklOAq3MRl4OaWabTFJY9PN/E1YklhXLh+OQ3fM9yS2nOkCoS+WLZ6kvxQ=="],
+
+    "d3-shape": ["d3-shape@3.2.0", "", { "dependencies": { "d3-path": "^3.1.0" } }, "sha512-SaLBuwGm3MOViRq2ABk3eLoxwZELpH6zhl3FbAoJ7Vm1gofKx6El1Ib5z23NUEhF9AsGl7y+dzLe5Cw2AArGTA=="],
+
+    "d3-time": ["d3-time@3.1.0", "", { "dependencies": { "d3-array": "2 - 3" } }, "sha512-VqKjzBLejbSMT4IgbmVgDjpkYrNWUYJnbCGo874u7MMKIWsILRX+OpX/gTk8MqjpT1A/c6HY2dCA77ZN0lkQ2Q=="],
+
+    "d3-time-format": ["d3-time-format@4.1.0", "", { "dependencies": { "d3-time": "1 - 3" } }, "sha512-dJxPBlzC7NugB2PDLwo9Q8JiTR3M3e4/XANkreKSUxF8vvXKqm1Yfq4Q5dl8budlunRVlUUaDUgFt7eA8D6NLg=="],
+
+    "d3-timer": ["d3-timer@3.0.1", "", {}, "sha512-ndfJ/JxxMd3nw31uyKoY2naivF+r29V+Lc0svZxe1JvvIRmi8hUsrMvdOwgS1o6uBHmiz91geQ0ylPP0aj1VUA=="],
+
     "debug": ["debug@4.4.3", "", { "dependencies": { "ms": "^2.1.3" } }, "sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA=="],
 
+    "decimal.js-light": ["decimal.js-light@2.5.1", "", {}, "sha512-qIMFpTMZmny+MMIitAB6D7iVPEorVw6YQRWkvarTkT4tBeSLLiHzcwj6q0MmYSFCiVpiqPJTJEYIrpcPzVEIvg=="],
+
     "detect-libc": ["detect-libc@2.1.2", "", {}, "sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ=="],
 
     "drizzle-kit": ["drizzle-kit@0.31.10", "", { "dependencies": { "@drizzle-team/brocli": "^0.10.2", "@esbuild-kit/esm-loader": "^2.5.5", "esbuild": "^0.25.4", "tsx": "^4.21.0" }, "bin": { "drizzle-kit": "bin.cjs" } }, "sha512-7OZcmQUrdGI+DUNNsKBn1aW8qSoKuTH7d0mYgSP8bAzdFzKoovxEFnoGQp2dVs82EOJeYycqRtciopszwUf8bw=="],
@@ -397,10 +448,14 @@
 
     "enhanced-resolve": ["enhanced-resolve@5.22.0", "", { "dependencies": { "graceful-fs": "^4.2.4", "tapable": "^2.3.3" } }, "sha512-xYcDWrpELkFzz9SpZ3PlI6Eu6eD93Yf0WLDRxikGhWJ3MAir2SNZTIVCVZqZ/NUyx8AdMc2gT9C0gPiw18kG+A=="],
 
+    "es-toolkit": ["es-toolkit@1.47.0", "", {}, "sha512-n1GuoD0WEQZMBk5tttoZSqwgyLx01oqa5XsBmCHwPyNe1S9jPBEmtR2pSgp2kJuWE3ciFZ6yRHmY4pM4C3OOkw=="],
+
     "esbuild": ["esbuild@0.25.12", "", { "optionalDependencies": { "@esbuild/aix-ppc64": "0.25.12", "@esbuild/android-arm": "0.25.12", "@esbuild/android-arm64": "0.25.12", "@esbuild/android-x64": "0.25.12", "@esbuild/darwin-arm64": "0.25.12", "@esbuild/darwin-x64": "0.25.12", "@esbuild/freebsd-arm64": "0.25.12", "@esbuild/freebsd-x64": "0.25.12", "@esbuild/linux-arm": "0.25.12", "@esbuild/linux-arm64": "0.25.12", "@esbuild/linux-ia32": "0.25.12", "@esbuild/linux-loong64": "0.25.12", "@esbuild/linux-mips64el": "0.25.12", "@esbuild/linux-ppc64": "0.25.12", "@esbuild/linux-riscv64": "0.25.12", "@esbuild/linux-s390x": "0.25.12", "@esbuild/linux-x64": "0.25.12", "@esbuild/netbsd-arm64": "0.25.12", "@esbuild/netbsd-x64": "0.25.12", "@esbuild/openbsd-arm64": "0.25.12", "@esbuild/openbsd-x64": "0.25.12", "@esbuild/openharmony-arm64": "0.25.12", "@esbuild/sunos-x64": "0.25.12", "@esbuild/win32-arm64": "0.25.12", "@esbuild/win32-ia32": "0.25.12", "@esbuild/win32-x64": "0.25.12" }, "bin": { "esbuild": "bin/esbuild" } }, "sha512-bbPBYYrtZbkt6Os6FiTLCTFxvq4tt3JKall1vRwshA3fdVztsLAatFaZobhkBC8/BrPetoa0oksYoKXoG4ryJg=="],
 
     "escalade": ["escalade@3.2.0", "", {}, "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA=="],
 
+    "eventemitter3": ["eventemitter3@5.0.4", "", {}, "sha512-mlsTRyGaPBjPedk6Bvw+aqbsXDtoAyAzm5MO7JgU+yVRyMQ5O8bD4Kcci7BS85f93veegeCPkL8R4GLClnjLFw=="],
+
     "exact-mirror": ["exact-mirror@0.2.7", "", { "peerDependencies": { "@sinclair/typebox": "^0.34.15" }, "optionalPeers": ["@sinclair/typebox"] }, "sha512-+MeEmDcLA4o/vjK2zujgk+1VTxPR4hdp23qLqkWfStbECtAq9gmsvQa3LW6z/0GXZyHJobrCnmy1cdeE7BjsYg=="],
 
     "fast-decode-uri-component": ["fast-decode-uri-component@1.0.1", "", {}, "sha512-WKgKWg5eUxvRZGwW8FvfbaH7AXSh2cL+3j5fMGzUMCxWBJ3dV3a7Wz8y2f/uQ0e3B6WmodD3oS54jTQ9HVTIIg=="],
@@ -423,8 +478,12 @@
 
     "ieee754": ["ieee754@1.2.1", "", {}, "sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA=="],
 
+    "immer": ["immer@10.2.0", "", {}, "sha512-d/+XTN3zfODyjr89gM3mPq1WNX2B8pYsu7eORitdwyA2sBubnTl3laYlBk4sXY5FUa5qTZGBDPJICVbvqzjlbw=="],
+
     "import-in-the-middle": ["import-in-the-middle@3.0.1", "", { "dependencies": { "acorn": "^8.15.0", "acorn-import-attributes": "^1.9.5", "cjs-module-lexer": "^2.2.0", "module-details-from-path": "^1.0.4" } }, "sha512-pYkiyXVL2Mf3pozdlDGV6NAObxQx13Ae8knZk1UJRJ6uRW/ZRmTGHlQYtrsSl7ubuE5F8CD1z+s1n4RHNuTtuA=="],
 
+    "internmap": ["internmap@2.0.3", "", {}, "sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg=="],
+
     "is-fullwidth-code-point": ["is-fullwidth-code-point@3.0.0", "", {}, "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg=="],
 
     "jiti": ["jiti@2.7.0", "", { "bin": { "jiti": "lib/jiti-cli.mjs" } }, "sha512-AC/7JofJvZGrrneWNaEnJeOLUx+JlGt7tNa0wZiRPT4MY1wmfKjt2+6O2p2uz2+skll8OZZmJMNqeke7kKbNgQ=="],
@@ -487,14 +546,26 @@
 
     "react-dom": ["react-dom@19.2.6", "", { "dependencies": { "scheduler": "^0.27.0" }, "peerDependencies": { "react": "^19.2.6" } }, "sha512-0prMI+hvBbPjsWnxDLxlCGyM8PN6UuWjEUCYmZhO67xIV9Xasa/r/vDnq+Xyq4Lo27g8QSbO5YzARu0D1Sps3g=="],
 
+    "react-is": ["react-is@19.2.7", "", {}, "sha512-kZFnouyVv7eP/Phmrlo9FK+zcAdriZJvzxXHF1Sl1P377WSGe2G/JxVolhTrB/jeV47lKImhNUsijjHAAbcl/A=="],
+
+    "react-redux": ["react-redux@9.3.0", "", { "dependencies": { "@types/use-sync-external-store": "^0.0.6", "use-sync-external-store": "^1.4.0" }, "peerDependencies": { "@types/react": "^18.2.25 || ^19", "react": "^18.0 || ^19", "redux": "^5.0.0" }, "optionalPeers": ["@types/react", "redux"] }, "sha512-KQopgqFo/p/fgmAs5qz6p5RWaNAzq40WAu7fJIXnQpYxFPbJYtsJPWvGeF2rOBaY/kEuV77AVsX8TsQzKm+A/g=="],
+
     "react-router": ["react-router@7.15.1", "", { "dependencies": { "cookie": "^1.0.1", "set-cookie-parser": "^2.6.0" }, "peerDependencies": { "react": ">=18", "react-dom": ">=18" }, "optionalPeers": ["react-dom"] }, "sha512-R8rl9HhgikFYoPJymnUtPXWbnDb3oget6lQnfIoupbt61aT9aOhRkDsY2XRhZRyX1Z/8a5sL74fXmFNm3NRK5A=="],
 
     "react-router-dom": ["react-router-dom@7.15.1", "", { "dependencies": { "react-router": "7.15.1" }, "peerDependencies": { "react": ">=18", "react-dom": ">=18" } }, "sha512-AzF62gjY6U9rkMq4RfP/r2EVtQ7DMfNMjyOp/flLTCrtRylLiK4wT4pSq6O8rOXZ2eXdZYJPEYe+ifomiv+Igg=="],
 
+    "recharts": ["recharts@3.8.1", "", { "dependencies": { "@reduxjs/toolkit": "^1.9.0 || 2.x.x", "clsx": "^2.1.1", "decimal.js-light": "^2.5.1", "es-toolkit": "^1.39.3", "eventemitter3": "^5.0.1", "immer": "^10.1.1", "react-redux": "8.x.x || 9.x.x", "reselect": "5.1.1", "tiny-invariant": "^1.3.3", "use-sync-external-store": "^1.2.2", "victory-vendor": "^37.0.2" }, "peerDependencies": { "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", "react-dom": "^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", "react-is": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0" } }, "sha512-mwzmO1s9sFL0TduUpwndxCUNoXsBw3u3E/0+A+cLcrSfQitSG62L32N69GhqUrrT5qKcAE3pCGVINC6pqkBBQg=="],
+
+    "redux": ["redux@5.0.1", "", {}, "sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w=="],
+
+    "redux-thunk": ["redux-thunk@3.1.0", "", { "peerDependencies": { "redux": "^5.0.0" } }, "sha512-NW2r5T6ksUKXCabzhL9z+h206HQw/NJkcLm1GPImRQ8IzfXwRGqjVhKJGauHirT0DAuyy6hjdnMZaRoAcy0Klw=="],
+
     "require-directory": ["require-directory@2.1.1", "", {}, "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q=="],
 
     "require-in-the-middle": ["require-in-the-middle@8.0.1", "", { "dependencies": { "debug": "^4.3.5", "module-details-from-path": "^1.0.3" } }, "sha512-QT7FVMXfWOYFbeRBF6nu+I6tr2Tf3u0q8RIEjNob/heKY/nh7drD/k7eeMFmSQgnTtCzLDcCu/XEnpW2wk4xCQ=="],
 
+    "reselect": ["reselect@5.1.1", "", {}, "sha512-K/BG6eIky/SBpzfHZv/dd+9JBFiS4SWV7FIujVyJRux6e45+73RaUHXLmIR1f7WOMaQ0U1km6qwklRQxpJJY0w=="],
+
     "resolve-pkg-maps": ["resolve-pkg-maps@1.0.0", "", {}, "sha512-seS2Tj26TBVOC2NIc2rOe2y2ZO7efxITtLZcGSOnHHNOQ7CkiUBfw0Iw2ck6xkIhPwLhKNLS8BO+hEpngQlqzw=="],
 
     "rolldown": ["rolldown@1.0.2", "", { "dependencies": { "@oxc-project/types": "=0.132.0", "@rolldown/pluginutils": "^1.0.0" }, "optionalDependencies": { "@rolldown/binding-android-arm64": "1.0.2", "@rolldown/binding-darwin-arm64": "1.0.2", "@rolldown/binding-darwin-x64": "1.0.2", "@rolldown/binding-freebsd-x64": "1.0.2", "@rolldown/binding-linux-arm-gnueabihf": "1.0.2", "@rolldown/binding-linux-arm64-gnu": "1.0.2", "@rolldown/binding-linux-arm64-musl": "1.0.2", "@rolldown/binding-linux-ppc64-gnu": "1.0.2", "@rolldown/binding-linux-s390x-gnu": "1.0.2", "@rolldown/binding-linux-x64-gnu": "1.0.2", "@rolldown/binding-linux-x64-musl": "1.0.2", "@rolldown/binding-openharmony-arm64": "1.0.2", "@rolldown/binding-wasm32-wasi": "1.0.2", "@rolldown/binding-win32-arm64-msvc": "1.0.2", "@rolldown/binding-win32-x64-msvc": "1.0.2" }, "bin": { "rolldown": "./bin/cli.mjs" } }, "sha512-oZx5zVDtVB44AW3eaifgDml1gWRDZGvjcfdxonE4swNPG98PrrXjaO/KrnUjzlMnztCCRVlUueA1kCXhARGk6g=="],
@@ -523,6 +594,8 @@
 
     "tdigest": ["tdigest@0.1.2", "", { "dependencies": { "bintrees": "1.0.2" } }, "sha512-+G0LLgjjo9BZX2MfdvPfH+MKLCrxlXSYec5DaPYP1fe6Iyhf0/fSmJ0bFiZ1F8BT6cGXl2LpltQptzjXKWEkKA=="],
 
+    "tiny-invariant": ["tiny-invariant@1.3.3", "", {}, "sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg=="],
+
     "tinyglobby": ["tinyglobby@0.2.16", "", { "dependencies": { "fdir": "^6.5.0", "picomatch": "^4.0.4" } }, "sha512-pn99VhoACYR8nFHhxqix+uvsbXineAasWm5ojXoN8xEwK5Kd3/TrhNn1wByuD52UxWRLy8pu+kRMniEi6Eq9Zg=="],
 
     "token-types": ["token-types@6.1.2", "", { "dependencies": { "@borewit/text-codec": "^0.2.1", "@tokenizer/token": "^0.3.0", "ieee754": "^1.2.1" } }, "sha512-dRXchy+C0IgK8WPC6xvCHFRIWYUbqqdEIKPaKo/AcTUNzwLTK6AH7RjdLWsEZcAN/TBdtfUw3PYEgPr5VPr6ww=="],
@@ -539,6 +612,10 @@
 
     "undici-types": ["undici-types@7.24.6", "", {}, "sha512-WRNW+sJgj5OBN4/0JpHFqtqzhpbnV0GuB+OozA9gCL7a993SmU+1JBZCzLNxYsbMfIeDL+lTsphD5jN5N+n0zg=="],
 
+    "use-sync-external-store": ["use-sync-external-store@1.6.0", "", { "peerDependencies": { "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0" } }, "sha512-Pp6GSwGP/NrPIrxVFAIkOQeyw8lFenOHijQWkUTrDvrF4ALqylP2C/KCkeS9dpUM3KvYRQhna5vt7IL95+ZQ9w=="],
+
+    "victory-vendor": ["victory-vendor@37.3.6", "", { "dependencies": { "@types/d3-array": "^3.0.3", "@types/d3-ease": "^3.0.0", "@types/d3-interpolate": "^3.0.1", "@types/d3-scale": "^4.0.2", "@types/d3-shape": "^3.1.0", "@types/d3-time": "^3.0.0", "@types/d3-timer": "^3.0.0", "d3-array": "^3.1.6", "d3-ease": "^3.0.1", "d3-interpolate": "^3.0.1", "d3-scale": "^4.0.2", "d3-shape": "^3.1.0", "d3-time": "^3.0.0", "d3-timer": "^3.0.1" } }, "sha512-SbPDPdDBYp+5MJHhBCAyI7wKM3d5ivekigc2Dk2s7pgbZ9wIgIBYGVw4zGHBml/qTFbexrofXW6Gu4noGxrOwQ=="],
+
     "vite": ["vite@8.0.14", "", { "dependencies": { "lightningcss": "^1.32.0", "picomatch": "^4.0.4", "postcss": "^8.5.15", "rolldown": "1.0.2", "tinyglobby": "^0.2.16" }, "optionalDependencies": { "fsevents": "~2.3.3" }, "peerDependencies": { "@types/node": "^20.19.0 || >=22.12.0", "@vitejs/devtools": "^0.1.18", "esbuild": "^0.27.0 || ^0.28.0", "jiti": ">=1.21.0", "less": "^4.0.0", "sass": "^1.70.0", "sass-embedded": "^1.70.0", "stylus": ">=0.54.8", "sugarss": "^5.0.0", "terser": "^5.16.0", "tsx": "^4.8.1", "yaml": "^2.4.2" }, "optionalPeers": ["@types/node", "@vitejs/devtools", "esbuild", "jiti", "less", "sass", "sass-embedded", "stylus", "sugarss", "terser", "tsx", "yaml"], "bin": { "vite": "bin/vite.js" } }, "sha512-s4BJJ+5y1pYL6Otw51FHhVJQhPnuRinKig64g/1+EUNaJsd3gCKdD31IPFvswUgW9/60QT9oFHbZHbQK5imcxw=="],
 
     "vite-tsconfig-paths": ["vite-tsconfig-paths@6.1.1", "", { "dependencies": { "debug": "^4.1.1", "globrex": "^0.1.2", "tsconfck": "^3.0.3" }, "peerDependencies": { "vite": "*" } }, "sha512-2cihq7zliibCCZ8P9cKJrQBkfgdvcFkOOc3Y02o3GWUDLgqjWsZudaoiuOwO/gzTzy17cS5F7ZPo4bsnS4DGkg=="],
@@ -559,6 +636,8 @@
 
     "@esbuild-kit/core-utils/esbuild": ["esbuild@0.18.20", "", { "optionalDependencies": { "@esbuild/android-arm": "0.18.20", "@esbuild/android-arm64": "0.18.20", "@esbuild/android-x64": "0.18.20", "@esbuild/darwin-arm64": "0.18.20", "@esbuild/darwin-x64": "0.18.20", "@esbuild/freebsd-arm64": "0.18.20", "@esbuild/freebsd-x64": "0.18.20", "@esbuild/linux-arm": "0.18.20", "@esbuild/linux-arm64": "0.18.20", "@esbuild/linux-ia32": "0.18.20", "@esbuild/linux-loong64": "0.18.20", "@esbuild/linux-mips64el": "0.18.20", "@esbuild/linux-ppc64": "0.18.20", "@esbuild/linux-riscv64": "0.18.20", "@esbuild/linux-s390x": "0.18.20", "@esbuild/linux-x64": "0.18.20", "@esbuild/netbsd-x64": "0.18.20", "@esbuild/openbsd-x64": "0.18.20", "@esbuild/sunos-x64": "0.18.20", "@esbuild/win32-arm64": "0.18.20", "@esbuild/win32-ia32": "0.18.20", "@esbuild/win32-x64": "0.18.20" }, "bin": { "esbuild": "bin/esbuild" } }, "sha512-ceqxoedUrcayh7Y7ZX6NdbbDzGROiyVBgC4PriJThBKSVPWnnFHZAkfI1lJT8QFkOwH4qOS2SJkS4wvpGl8BpA=="],
 
+    "@reduxjs/toolkit/immer": ["immer@11.1.8", "", {}, "sha512-/tbkHMW7y10Lx6i1crLjD4/OhNkRG+Fo7byZHtah0547nIeXYcpIXaUh0IAQY6gO5459qpGGYapcEOHtFXkIuA=="],
+
     "tsx/esbuild": ["esbuild@0.28.0", "", { "optionalDependencies": { "@esbuild/aix-ppc64": "0.28.0", "@esbuild/android-arm": "0.28.0", "@esbuild/android-arm64": "0.28.0", "@esbuild/android-x64": "0.28.0", "@esbuild/darwin-arm64": "0.28.0", "@esbuild/darwin-x64": "0.28.0", "@esbuild/freebsd-arm64": "0.28.0", "@esbuild/freebsd-x64": "0.28.0", "@esbuild/linux-arm": "0.28.0", "@esbuild/linux-arm64": "0.28.0", "@esbuild/linux-ia32": "0.28.0", "@esbuild/linux-loong64": "0.28.0", "@esbuild/linux-mips64el": "0.28.0", "@esbuild/linux-ppc64": "0.28.0", "@esbuild/linux-riscv64": "0.28.0", "@esbuild/linux-s390x": "0.28.0", "@esbuild/linux-x64": "0.28.0", "@esbuild/netbsd-arm64": "0.28.0", "@esbuild/netbsd-x64": "0.28.0", "@esbuild/openbsd-arm64": "0.28.0", "@esbuild/openbsd-x64": "0.28.0", "@esbuild/openharmony-arm64": "0.28.0", "@esbuild/sunos-x64": "0.28.0", "@esbuild/win32-arm64": "0.28.0", "@esbuild/win32-ia32": "0.28.0", "@esbuild/win32-x64": "0.28.0" }, "bin": { "esbuild": "bin/esbuild" } }, "sha512-sNR9MHpXSUV/XB4zmsFKN+QgVG82Cc7+/aaxJ8Adi8hyOac+EXptIp45QBPaVyX3N70664wRbTcLTOemCAnyqw=="],
 
     "@esbuild-kit/core-utils/esbuild/@esbuild/android-arm": ["@esbuild/android-arm@0.18.20", "", { "os": "android", "cpu": "arm" }, "sha512-fyi7TDI/ijKKNZTUJAQqiG5T7YjJXgnzkURqmGj13C6dCqckZBLdl4h7bkhHt/t0WP+zO9/zwroDvANaOqO5Sw=="],

From 26f99fa4d4c929e4fb27bdd63906b313b005f6e6 Mon Sep 17 00:00:00 2001
From: MythEclipse <asepharyanalm001@gmail.com>
Date: Mon, 8 Jun 2026 00:54:59 +0700
Subject: [PATCH 28/28] feat(web): compute memory usage client-side and add
 app-specific metrics to telemetry dashboard

---
 apps/web/src/pages/telemetry-page.tsx | 71 +++++++++++++++++++++++++--
 1 file changed, 66 insertions(+), 5 deletions(-)

diff --git a/apps/web/src/pages/telemetry-page.tsx b/apps/web/src/pages/telemetry-page.tsx
index 46b30d8..df6bf3b 100644
--- a/apps/web/src/pages/telemetry-page.tsx
+++ b/apps/web/src/pages/telemetry-page.tsx
@@ -236,6 +236,7 @@ export function TelemetryPage() {
   const [stats, setStats] = useState<DashboardStats | null>(null);
   const [metrics, setMetrics] = useState<DiscoveredMetric[]>([]);
   const [chartMap, setChartMap] = useState<Map<string, ChartPoint[]>>(new Map());
+  const [memChartData, setMemChartData] = useState<ChartPoint[] | null>(null);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
   const [refreshing, setRefreshing] = useState(false);
@@ -255,22 +256,51 @@ export function TelemetryPage() {
       setStats(statsData);
       setMetrics(discoverData);
 
-      // Fetch charts for top metrics
+      // Fetch charts for top metrics (excluding prometheus noise)
       const topMetrics = discoverData
         .filter((m) => !m.metric_name.startsWith("prometheus_") && m.service !== "prometheus")
-        .slice(0, 6);
+        .slice(0, 4);
 
       const chartPanels = topMetrics.map((m) => ({
         key: m.metric_name,
         metric: m.metric_name,
       }));
 
-      // Add CPU and disk
+      // Built-in computations + app metrics
       chartPanels.unshift({ key: "_cpu_usage_pct", metric: "_cpu_usage_pct" });
       chartPanels.unshift({ key: "_disk_usage_pct", metric: "_disk_usage_pct" });
 
+      // Memory charts (raw values, % computed client-side)
+      chartPanels.push({ key: "node_memory_MemTotal_bytes", metric: "node_memory_MemTotal_bytes" });
+      chartPanels.push({ key: "node_memory_MemAvailable_bytes", metric: "node_memory_MemAvailable_bytes" });
+
+      // App-specific metrics
+      for (const appMetric of ["zeavis_api_http_requests_total", "zeavis_api_http_requests_active"]) {
+        if (discoverData.find((m) => m.metric_name === appMetric)) {
+          chartPanels.push({ key: appMetric, metric: appMetric });
+        }
+      }
+
       const charts = await api.charts(chartPanels);
       setChartMap(charts);
+
+      // Compute memory usage % = (total - available) / total
+      const memTotalData = charts.get("node_memory_MemTotal_bytes");
+      const memAvailData = charts.get("node_memory_MemAvailable_bytes");
+      if (memTotalData && memAvailData && memTotalData.length > 0 && memAvailData.length > 0) {
+        const merged: ChartPoint[] = [];
+        for (let i = 0; i < Math.min(memTotalData.length, memAvailData.length); i++) {
+          const total = memTotalData[i].value;
+          const avail = memAvailData[i].value;
+          if (total > 0) {
+            merged.push({ time: memTotalData[i].time, value: 1 - avail / total });
+          }
+        }
+        setMemChartData(merged);
+      } else {
+        setMemChartData([]);
+      }
+      setChartMap(charts);
     } catch (e) {
       setError(e instanceof Error ? e.message : "Unknown error");
     } finally {
@@ -402,14 +432,20 @@ export function TelemetryPage() {
         </div>
       )}
 
-      {/* CPU & Disk charts */}
-      <div className="grid gap-4 md:grid-cols-2">
+      {/* CPU, Memory, Disk charts */}
+      <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-3">
         <MetricChart
           title="CPU Usage (last hour)"
           data={chartMap.get("_cpu_usage_pct") ?? []}
           loading={loading}
           color="#2563eb"
         />
+        <MetricChart
+          title="Memory Usage (last hour)"
+          data={memChartData ?? []}
+          loading={loading}
+          color="#8b5cf6"
+        />
         <MetricChart
           title="Disk Usage (last hour)"
           data={chartMap.get("_disk_usage_pct") ?? []}
@@ -418,6 +454,31 @@ export function TelemetryPage() {
         />
       </div>
 
+      {/* Application Metrics */}
+      {(chartMap.has("zeavis_api_http_requests_total") || chartMap.has("zeavis_api_http_requests_active")) && (
+        <section className="space-y-4">
+          <h3 className="text-lg font-semibold text-[#214B11]">Application Metrics</h3>
+          <div className="grid gap-4 md:grid-cols-1 lg:grid-cols-2">
+            {chartMap.has("zeavis_api_http_requests_total") && (
+              <MetricChart
+                title="HTTP Requests Total (API)"
+                data={chartMap.get("zeavis_api_http_requests_total") ?? []}
+                loading={loading}
+                color="#ec4899"
+              />
+            )}
+            {chartMap.has("zeavis_api_http_requests_active") && (
+              <MetricChart
+                title="Active HTTP Requests (API)"
+                data={chartMap.get("zeavis_api_http_requests_active") ?? []}
+                loading={loading}
+                color="#14b8a6"
+              />
+            )}
+          </div>
+        </section>
+      )}
+
       {/* Top Metrics */}
       <Card className="border-slate-200 shadow-sm">
         <CardHeader className="pb-2 px-4 pt-4">