feat: app-usage Prometheus metrics + Grafana dashboard + Helm scrape

grafana/maps-playground-dashboard.json

@@ -0,0 +1,95 @@
+{
+	"title": "Maps Playground",
+	"uid": "maps-playground",
+	"schemaVersion": 39,
+	"editable": true,
+	"time": { "from": "now-6h", "to": "now" },
+	"templating": {
+		"list": [
+			{
+				"name": "datasource",
+				"type": "datasource",
+				"query": "prometheus",
+				"current": {}
+			}
+		]
+	},
+	"panels": [
+		{
+			"id": 1,
+			"title": "Request rate by route",
+			"type": "timeseries",
+			"datasource": { "type": "prometheus", "uid": "${datasource}" },
+			"gridPos": { "h": 8, "w": 12, "x": 0, "y": 0 },
+			"targets": [
+				{
+					"expr": "sum by (route) (rate(http_requests_total[5m]))",
+					"legendFormat": "{{route}}"
+				}
+			]
+		},
+		{
+			"id": 2,
+			"title": "Latency p50 / p95 (s)",
+			"type": "timeseries",
+			"datasource": { "type": "prometheus", "uid": "${datasource}" },
+			"gridPos": { "h": 8, "w": 12, "x": 12, "y": 0 },
+			"targets": [
+				{
+					"expr": "histogram_quantile(0.50, sum by (le) (rate(http_request_duration_seconds_bucket[5m])))",
+					"legendFormat": "p50"
+				},
+				{
+					"expr": "histogram_quantile(0.95, sum by (le) (rate(http_request_duration_seconds_bucket[5m])))",
+					"legendFormat": "p95"
+				}
+			]
+		},
+		{
+			"id": 3,
+			"title": "Error ratio (4xx+5xx)",
+			"type": "timeseries",
+			"datasource": { "type": "prometheus", "uid": "${datasource}" },
+			"gridPos": { "h": 8, "w": 12, "x": 0, "y": 8 },
+			"targets": [
+				{
+					"expr": "sum(rate(http_requests_total{status_code=~\"4..|5..\"}[5m])) / sum(rate(http_requests_total[5m]))",
+					"legendFormat": "error ratio"
+				}
+			]
+		},
+		{
+			"id": 4,
+			"title": "Top demos",
+			"type": "timeseries",
+			"datasource": { "type": "prometheus", "uid": "${datasource}" },
+			"gridPos": { "h": 8, "w": 12, "x": 12, "y": 8 },
+			"targets": [
+				{
+					"expr": "topk(10, sum by (client, name) (rate(demo_views_total[15m])))",
+					"legendFormat": "{{client}}/{{name}}"
+				}
+			]
+		},
+		{
+			"id": 5,
+			"title": "Process memory (bytes)",
+			"type": "timeseries",
+			"datasource": { "type": "prometheus", "uid": "${datasource}" },
+			"gridPos": { "h": 8, "w": 12, "x": 0, "y": 16 },
+			"targets": [
+				{ "expr": "process_resident_memory_bytes", "legendFormat": "rss" }
+			]
+		},
+		{
+			"id": 6,
+			"title": "Process CPU (cores)",
+			"type": "timeseries",
+			"datasource": { "type": "prometheus", "uid": "${datasource}" },
+			"gridPos": { "h": 8, "w": 12, "x": 12, "y": 16 },
+			"targets": [
+				{ "expr": "rate(process_cpu_seconds_total[5m])", "legendFormat": "cpu" }
+			]
+		}
+	]
+}

helm/Chart.lock

@@ -0,0 +1,6 @@
+dependencies:
+- name: mclabels
+  repository: oci://acrarolibotnonprod.azurecr.io/helm/infra
+  version: 1.0.1
+digest: sha256:a97237cd8966ab9d4f8c0b8dda2ad110fbff5d485da868124fdce2a5dbbfa208
+generated: "2026-07-21T16:25:15.223597776+03:00"

helm/Chart.yaml

@@ -4,3 +4,7 @@ description: A Helm chart for developer-portal
 type: application
 version: 1.2.0
 appVersion: 1.2.0
+dependencies:
+  - name: mclabels
+    version: 1.0.1
+    repository: oci://acrarolibotnonprod.azurecr.io/helm/infra

helm/grafana/dashboard-sync.test.ts

@@ -0,0 +1,11 @@
+// @vitest-environment node
+import { readFileSync } from 'node:fs';
+import { describe, it, expect } from 'vitest';
+
+describe('grafana dashboard copies stay in sync', () => {
+	it('repo-root and chart copies are byte-identical', () => {
+		const root = readFileSync('grafana/maps-playground-dashboard.json', 'utf8');
+		const chart = readFileSync('helm/grafana/maps-playground-dashboard.json', 'utf8');
+		expect(chart).toBe(root);
+	});
+});

helm/grafana/maps-playground-dashboard.json

@@ -0,0 +1,95 @@
+{
+	"title": "Maps Playground",
+	"uid": "maps-playground",
+	"schemaVersion": 39,
+	"editable": true,
+	"time": { "from": "now-6h", "to": "now" },
+	"templating": {
+		"list": [
+			{
+				"name": "datasource",
+				"type": "datasource",
+				"query": "prometheus",
+				"current": {}
+			}
+		]
+	},
+	"panels": [
+		{
+			"id": 1,
+			"title": "Request rate by route",
+			"type": "timeseries",
+			"datasource": { "type": "prometheus", "uid": "${datasource}" },
+			"gridPos": { "h": 8, "w": 12, "x": 0, "y": 0 },
+			"targets": [
+				{
+					"expr": "sum by (route) (rate(http_requests_total[5m]))",
+					"legendFormat": "{{route}}"
+				}
+			]
+		},
+		{
+			"id": 2,
+			"title": "Latency p50 / p95 (s)",
+			"type": "timeseries",
+			"datasource": { "type": "prometheus", "uid": "${datasource}" },
+			"gridPos": { "h": 8, "w": 12, "x": 12, "y": 0 },
+			"targets": [
+				{
+					"expr": "histogram_quantile(0.50, sum by (le) (rate(http_request_duration_seconds_bucket[5m])))",
+					"legendFormat": "p50"
+				},
+				{
+					"expr": "histogram_quantile(0.95, sum by (le) (rate(http_request_duration_seconds_bucket[5m])))",
+					"legendFormat": "p95"
+				}
+			]
+		},
+		{
+			"id": 3,
+			"title": "Error ratio (4xx+5xx)",
+			"type": "timeseries",
+			"datasource": { "type": "prometheus", "uid": "${datasource}" },
+			"gridPos": { "h": 8, "w": 12, "x": 0, "y": 8 },
+			"targets": [
+				{
+					"expr": "sum(rate(http_requests_total{status_code=~\"4..|5..\"}[5m])) / sum(rate(http_requests_total[5m]))",
+					"legendFormat": "error ratio"
+				}
+			]
+		},
+		{
+			"id": 4,
+			"title": "Top demos",
+			"type": "timeseries",
+			"datasource": { "type": "prometheus", "uid": "${datasource}" },
+			"gridPos": { "h": 8, "w": 12, "x": 12, "y": 8 },
+			"targets": [
+				{
+					"expr": "topk(10, sum by (client, name) (rate(demo_views_total[15m])))",
+					"legendFormat": "{{client}}/{{name}}"
+				}
+			]
+		},
+		{
+			"id": 5,
+			"title": "Process memory (bytes)",
+			"type": "timeseries",
+			"datasource": { "type": "prometheus", "uid": "${datasource}" },
+			"gridPos": { "h": 8, "w": 12, "x": 0, "y": 16 },
+			"targets": [
+				{ "expr": "process_resident_memory_bytes", "legendFormat": "rss" }
+			]
+		},
+		{
+			"id": 6,
+			"title": "Process CPU (cores)",
+			"type": "timeseries",
+			"datasource": { "type": "prometheus", "uid": "${datasource}" },
+			"gridPos": { "h": 8, "w": 12, "x": 12, "y": 16 },
+			"targets": [
+				{ "expr": "rate(process_cpu_seconds_total[5m])", "legendFormat": "cpu" }
+			]
+		}
+	]
+}

helm/templates/_helpers.tpl

@@ -36,6 +36,7 @@ helm.sh/chart: {{ include "developer-portal.chart" . }}
 app.kubernetes.io/version: {{ .Chart.AppVersion | quote }}
 {{- end }}
 app.kubernetes.io/managed-by: {{ .Release.Service }}
+{{ include "mclabels.labels" . }}
 {{- end }}
 
 {{/*

helm/templates/deployment.yaml

@@ -30,10 +30,11 @@ spec:
         release: {{ $releaseName }}
         run: {{ $releaseName }}-{{ $chartName }}
         {{- include "developer-portal.selectorLabels" . | nindent 8 }}
-      {{- if .Values.resetOnConfigChange }}
       annotations:
+        {{- if .Values.resetOnConfigChange }}
         checksum/configmap: {{ include (print $.Template.BasePath "/configmap.yaml") . | sha256sum }}
-      {{- end }}
+        {{- end }}
+        {{- include "mclabels.annotations" . | trim | nindent 8 }}
     spec:
     {{- if $cloudProviderImagePullSecretName }}
       imagePullSecrets:

helm/templates/grafana-dashboard-configmap.yaml

@@ -0,0 +1,12 @@
+{{- if and .Values.enabled .Values.metrics.grafanaDashboard.enabled }}
+apiVersion: v1
+kind: ConfigMap
+metadata:
+  name: {{ .Release.Name }}-{{ include "developer-portal.name" . }}-grafana-dashboard
+  labels:
+    {{ .Values.metrics.grafanaDashboard.label }}: {{ .Values.metrics.grafanaDashboard.value | quote }}
+    {{- include "developer-portal.labels" . | nindent 4 }}
+data:
+  maps-playground-dashboard.json: |-
+    {{- .Files.Get "grafana/maps-playground-dashboard.json" | nindent 4 }}
+{{- end }}

helm/values.yaml

@@ -16,6 +16,23 @@ image:
   tag: 0.0.1-4
   imagePullPolicy: IfNotPresent
 
+mclabels:
+  environment: production
+  owner: common
+  partOf: maps-playground
+  component: frontend
+  prometheus:
+    enabled: true
+    port: 8080
+    path: /metrics
+  logScraping: false
+
+metrics:
+  grafanaDashboard:
+    enabled: true
+    label: grafana_dashboard
+    value: "1"
+
 s3:
   url: 'http://localhost:9000'
   bucket: 'temp'

package.json

@@ -55,6 +55,7 @@
 		"@popperjs/core": "^2.11.7",
 		"ajv": "^8.12.0",
 		"async-cache-dedupe": "^1.12.0",
-		"classnames": "^2.3.2"
+		"classnames": "^2.3.2",
+		"prom-client": "^15.1.3"
 	}
 }