From c5ced0d9046613ee87828ad1aaccc85294eb940f Mon Sep 17 00:00:00 2001
From: "alexei.dolgolyov" <dolgolyov.alexei@gmail.com>
Date: Fri, 20 Feb 2026 19:43:26 +0300
Subject: [PATCH] Dashboard: show color strip source type in target subtitle

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 .../static/js/features/dashboard.js              | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/server/src/wled_controller/static/js/features/dashboard.js b/server/src/wled_controller/static/js/features/dashboard.js
index 29a212b..64b397f 100644
--- a/server/src/wled_controller/static/js/features/dashboard.js
+++ b/server/src/wled_controller/static/js/features/dashboard.js
@@ -295,10 +295,11 @@ export async function loadDashboard(forceFullRender = false) {
     if (!container) { set_dashboardLoading(false); return; }
 
     try {
-        const [targetsResp, profilesResp, devicesResp] = await Promise.all([
+        const [targetsResp, profilesResp, devicesResp, cssResp] = await Promise.all([
             fetchWithAuth('/picture-targets'),
             fetchWithAuth('/profiles').catch(() => null),
             fetchWithAuth('/devices').catch(() => null),
+            fetchWithAuth('/color-strip-sources').catch(() => null),
         ]);
 
         const targetsData = await targetsResp.json();
@@ -308,6 +309,9 @@ export async function loadDashboard(forceFullRender = false) {
         const devicesData = devicesResp && devicesResp.ok ? await devicesResp.json() : { devices: [] };
         const devicesMap = {};
         for (const d of (devicesData.devices || [])) { devicesMap[d.id] = d; }
+        const cssData = cssResp && cssResp.ok ? await cssResp.json() : { sources: [] };
+        const cssSourceMap = {};
+        for (const s of (cssData.sources || [])) { cssSourceMap[s.id] = s; }
 
         // Build dynamic HTML (targets, profiles)
         let dynamicHtml = '';
@@ -367,7 +371,7 @@ export async function loadDashboard(forceFullRender = false) {
                 if (running.length > 0) {
                     runningIds = running.map(t => t.id);
                     const stopAllBtn = `<button class="btn btn-sm btn-danger dashboard-stop-all" onclick="event.stopPropagation(); dashboardStopAll()" title="${t('dashboard.stop_all')}">⏹️ ${t('dashboard.stop_all')}</button>`;
-                    const runningItems = running.map(target => renderDashboardTarget(target, true, devicesMap)).join('');
+                    const runningItems = running.map(target => renderDashboardTarget(target, true, devicesMap, cssSourceMap)).join('');
 
                     targetsInner += `<div class="dashboard-subsection">
                         ${_sectionHeader('running', t('dashboard.section.running'), running.length, stopAllBtn)}
@@ -376,7 +380,7 @@ export async function loadDashboard(forceFullRender = false) {
                 }
 
                 if (stopped.length > 0) {
-                    const stoppedItems = stopped.map(target => renderDashboardTarget(target, false, devicesMap)).join('');
+                    const stoppedItems = stopped.map(target => renderDashboardTarget(target, false, devicesMap, cssSourceMap)).join('');
 
                     targetsInner += `<div class="dashboard-subsection">
                         ${_sectionHeader('stopped', t('dashboard.section.stopped'), stopped.length)}
@@ -421,7 +425,7 @@ export async function loadDashboard(forceFullRender = false) {
     }
 }
 
-function renderDashboardTarget(target, isRunning, devicesMap = {}) {
+function renderDashboardTarget(target, isRunning, devicesMap = {}, cssSourceMap = {}) {
     const state = target.state || {};
     const metrics = target.metrics || {};
     const isLed = target.target_type === 'led' || target.target_type === 'wled';
@@ -434,6 +438,10 @@ function renderDashboardTarget(target, isRunning, devicesMap = {}) {
         if (device) {
             subtitleParts.push((device.device_type || '').toUpperCase());
         }
+        const cssSource = target.color_strip_source_id ? cssSourceMap[target.color_strip_source_id] : null;
+        if (cssSource) {
+            subtitleParts.push(t(`color_strip.type.${cssSource.source_type}`) || cssSource.source_type);
+        }
     }
 
     if (isRunning) {