From 9da42d52c355044a81ed9d15ff866f80f19e0b11 Mon Sep 17 00:00:00 2001
From: Claude <claude@webklar.local>
Date: Tue, 6 Oct 2026 09:17:45 +0000
Subject: [PATCH] Projekte: Tonabbildung fuer Preview-, Analyse- und
 Projektstatus

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
---
 src/components/projectTones.js   | 55 ++++++++++++++++++++++++++++++++
 tests/unit/projectTones.test.mjs | 19 +++++++++++
 2 files changed, 74 insertions(+)
 create mode 100644 src/components/projectTones.js
 create mode 100644 tests/unit/projectTones.test.mjs

diff --git a/src/components/projectTones.js b/src/components/projectTones.js
new file mode 100644
index 0000000..da7d71f
--- /dev/null
+++ b/src/components/projectTones.js
@@ -0,0 +1,55 @@
+/* Tonabbildung der Projekt-Bausteine: reine Zuordnung, ohne JSX (Test: tests/unit/projectTones.test.mjs).
+   Die Töne sind die Namen der Logik aus Badge.jsx: ok, warn, info, danger, muted, plain.
+   Jede Zuordnung ist eine Map, kein Objekt: sonst liefert ein Schlüssel wie 'constructor' eine Funktion. */
+
+// previewStatus().color (lib/previewView.js)
+const PREVIEW_COLOR_TONES = new Map([
+  ['green', 'ok'],
+  ['yellow', 'warn'],
+  ['red', 'danger'],
+  ['grey', 'plain'],
+])
+
+// previewState der Services-Antwort (online, building, starting, sleeping, failed, off)
+const PREVIEW_STATE_TONES = new Map([
+  ['online', 'ok'],
+  ['building', 'warn'],
+  ['starting', 'warn'],
+  ['sleeping', 'warn'],
+  ['failed', 'danger'],
+])
+
+// analyseStatus().color (lib/analyseView.js)
+const ANALYSE_COLOR_TONES = new Map([
+  ['green', 'ok'],
+  ['red', 'danger'],
+])
+
+// status und provisioningStatus eines Projekts, wie die Farbtabelle STATUS_COLORS in AssignedProjectCard heute.
+// 'deployed' ist absichtlich nicht dabei: es blieb dort in der Standardfarbe (grau).
+const STATUS_VALUE_TONES = new Map([
+  ['ready', 'ok'],
+  ['live', 'ok'],
+  ['online', 'ok'],
+  ['provisioning', 'warn'],
+  ['pending', 'warn'],
+  ['building', 'info'],
+  ['error', 'danger'],
+  ['failed', 'danger'],
+])
+
+export function previewColorTone(color) {
+  return PREVIEW_COLOR_TONES.get(color) ?? 'plain'
+}
+
+export function previewStateTone(state) {
+  return PREVIEW_STATE_TONES.get(state) ?? 'plain'
+}
+
+export function analyseColorTone(color) {
+  return ANALYSE_COLOR_TONES.get(color) ?? 'muted'
+}
+
+export function statusValueTone(value) {
+  return STATUS_VALUE_TONES.get(String(value ?? '').toLowerCase()) ?? 'muted'
+}
diff --git a/tests/unit/projectTones.test.mjs b/tests/unit/projectTones.test.mjs
new file mode 100644
index 0000000..c9e035e
--- /dev/null
+++ b/tests/unit/projectTones.test.mjs
@@ -0,0 +1,19 @@
+import test from 'node:test'
+import assert from 'node:assert/strict'
+import { loadModule } from './load.mjs'
+
+const { previewColorTone, previewStateTone, analyseColorTone, statusValueTone } = await loadModule('src/components/projectTones.js')
+
+test('previewColorTone', () => {
+  assert.deepEqual(['green', 'yellow', 'red', 'grey', undefined].map(previewColorTone), ['ok', 'warn', 'danger', 'plain', 'plain'])
+})
+test('previewStateTone', () => {
+  assert.deepEqual(['online', 'building', 'starting', 'sleeping', 'failed', 'off', undefined, 'constructor'].map(previewStateTone), ['ok', 'warn', 'warn', 'warn', 'danger', 'plain', 'plain', 'plain'])
+})
+test('analyseColorTone', () => {
+  assert.deepEqual(['green', 'red', 'grey', undefined].map(analyseColorTone), ['ok', 'danger', 'muted', 'muted'])
+})
+test('statusValueTone: wie die Farben in AssignedProjectCard heute', () => {
+  assert.deepEqual(['ready', 'LIVE', 'online', 'provisioning', 'pending', 'building', 'error', 'failed'].map(statusValueTone), ['ok', 'ok', 'ok', 'warn', 'warn', 'info', 'danger', 'danger'])
+  assert.deepEqual(['deployed', '', undefined, 'irgendwas'].map(statusValueTone), ['muted', 'muted', 'muted', 'muted'])
+})