From 67d141b75b57cc6c4fecd54d5ef4cd6a9ab167c5 Mon Sep 17 00:00:00 2001
From: "alexei.dolgolyov" <dolgolyov.alexei@gmail.com>
Date: Sat, 21 Feb 2026 02:55:02 +0300
Subject: [PATCH] Show pipeline timing breakdown for non-picture source targets

Non-picture sources (static, gradient, color_cycle) returned empty
timing from get_last_timing(), causing timing_total_ms to be null and
hiding the entire timing section in the UI. Now timing_total_ms falls
back to send_ms when no CSS pipeline timing exists. Frontend timing
bar/legend segments are conditionally rendered to avoid null labels.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 .../core/processing/wled_target_processor.py         | 11 +++++++----
 .../wled_controller/static/js/features/targets.js    | 12 ++++++------
 2 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/server/src/wled_controller/core/processing/wled_target_processor.py b/server/src/wled_controller/core/processing/wled_target_processor.py
index 7b12d86..0a507b0 100644
--- a/server/src/wled_controller/core/processing/wled_target_processor.py
+++ b/server/src/wled_controller/core/processing/wled_target_processor.py
@@ -245,10 +245,13 @@ class WledTargetProcessor(TargetProcessor):
         extract_ms = round(css_timing.get("extract_ms", 0), 1) if css_timing else None
         map_ms = round(css_timing.get("map_leds_ms", 0), 1) if css_timing else None
         smooth_ms = round(css_timing.get("smooth_ms", 0), 1) if css_timing else None
-        total_ms = (
-            round(css_timing.get("total_ms", 0) + metrics.timing_send_ms, 1)
-            if css_timing else None
-        )
+        if css_timing:
+            total_ms = round(css_timing.get("total_ms", 0) + metrics.timing_send_ms, 1)
+        elif self._is_running and send_ms is not None:
+            # Non-picture sources have no CSS pipeline timing — total = send only
+            total_ms = send_ms
+        else:
+            total_ms = None
 
         return {
             "target_id": self._target_id,
diff --git a/server/src/wled_controller/static/js/features/targets.js b/server/src/wled_controller/static/js/features/targets.js
index d8fe479..9f4b22d 100644
--- a/server/src/wled_controller/static/js/features/targets.js
+++ b/server/src/wled_controller/static/js/features/targets.js
@@ -486,15 +486,15 @@ export function createTargetCard(target, deviceMap, colorStripSourceMap) {
                         <div class="timing-total"><strong>${state.timing_total_ms}ms</strong></div>
                     </div>
                     <div class="timing-bar">
-                        <span class="timing-seg timing-extract" style="flex:${state.timing_extract_ms}" title="extract ${state.timing_extract_ms}ms"></span>
-                        <span class="timing-seg timing-map" style="flex:${state.timing_map_leds_ms}" title="map ${state.timing_map_leds_ms}ms"></span>
-                        <span class="timing-seg timing-smooth" style="flex:${state.timing_smooth_ms || 0.1}" title="smooth ${state.timing_smooth_ms}ms"></span>
+                        ${state.timing_extract_ms != null ? `<span class="timing-seg timing-extract" style="flex:${state.timing_extract_ms}" title="extract ${state.timing_extract_ms}ms"></span>` : ''}
+                        ${state.timing_map_leds_ms != null ? `<span class="timing-seg timing-map" style="flex:${state.timing_map_leds_ms}" title="map ${state.timing_map_leds_ms}ms"></span>` : ''}
+                        ${state.timing_smooth_ms != null ? `<span class="timing-seg timing-smooth" style="flex:${state.timing_smooth_ms || 0.1}" title="smooth ${state.timing_smooth_ms}ms"></span>` : ''}
                         <span class="timing-seg timing-send" style="flex:${state.timing_send_ms}" title="send ${state.timing_send_ms}ms"></span>
                     </div>
                     <div class="timing-legend">
-                        <span class="timing-legend-item"><span class="timing-dot timing-extract"></span>extract ${state.timing_extract_ms}ms</span>
-                        <span class="timing-legend-item"><span class="timing-dot timing-map"></span>map ${state.timing_map_leds_ms}ms</span>
-                        <span class="timing-legend-item"><span class="timing-dot timing-smooth"></span>smooth ${state.timing_smooth_ms}ms</span>
+                        ${state.timing_extract_ms != null ? `<span class="timing-legend-item"><span class="timing-dot timing-extract"></span>extract ${state.timing_extract_ms}ms</span>` : ''}
+                        ${state.timing_map_leds_ms != null ? `<span class="timing-legend-item"><span class="timing-dot timing-map"></span>map ${state.timing_map_leds_ms}ms</span>` : ''}
+                        ${state.timing_smooth_ms != null ? `<span class="timing-legend-item"><span class="timing-dot timing-smooth"></span>smooth ${state.timing_smooth_ms}ms</span>` : ''}
                         <span class="timing-legend-item"><span class="timing-dot timing-send"></span>send ${state.timing_send_ms}ms</span>
                     </div>
                 </div>