Fix SVG markup in select options, add missing name placeholders

Remove SVG icon function calls from <option> textContent — native
select elements render markup as literal text. Capture template options
now show "name (engine_type)", source options show just the name.

Add i18n placeholders to automation and scene editor name inputs.
Rename HAOS Scenes device from "{server_name} Scenes" to "Scenes".

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

custom_components/wled_screen_controller/__init__.py

@@ -87,7 +87,7 @@ async def async_setup_entry(hass: HomeAssistant, entry: ConfigEntry) -> bool:
         device_registry.async_get_or_create(
             config_entry_id=entry.entry_id,
             identifiers={scenes_identifier},
-            name=f"{server_name} Scenes",
+            name="Scenes",
             manufacturer=server_name,
             model="Scene Presets",
             configuration_url=server_url,

server/src/wled_controller/static/js/features/color-strips.js

@@ -750,7 +750,7 @@ export async function showCSSEditor(cssId = null, cloneData = null) {
             const opt = document.createElement('option');
             opt.value = s.id;
             opt.dataset.name = s.name;
-            opt.textContent = `${getPictureSourceIcon(s.stream_type)} ${s.name}`;
+            opt.textContent = s.name;
             sourceSelect.appendChild(opt);
         });
 

server/src/wled_controller/static/js/features/kc-targets.js

@@ -428,7 +428,7 @@ export async function showKCEditor(targetId = null, cloneData = null) {
             const opt = document.createElement('option');
             opt.value = s.id;
             opt.dataset.name = s.name;
-            opt.textContent = `${getPictureSourceIcon(s.stream_type)} ${s.name}`;
+            opt.textContent = s.name;
             sourceSelect.appendChild(opt);
         });
 

server/src/wled_controller/static/js/features/pattern-templates.js

@@ -81,7 +81,7 @@ export async function showPatternTemplateEditor(templateId = null, cloneData = n
         sources.forEach(s => {
             const opt = document.createElement('option');
             opt.value = s.id;
-            opt.textContent = `${getPictureSourceIcon(s.stream_type)} ${s.name}`;
+            opt.textContent = s.name;
             bgSelect.appendChild(opt);
         });
 

server/src/wled_controller/static/js/features/streams.js

@@ -282,7 +282,7 @@ async function loadAvailableEngines() {
         availableEngines.forEach(engine => {
             const option = document.createElement('option');
             option.value = engine.type;
-            option.textContent = `${getEngineIcon(engine.type)} ${engine.name}`;
+            option.textContent = engine.name;
             if (!engine.available) {
                 option.disabled = true;
                 option.textContent += ` (${t('templates.engine.unavailable')})`;
@@ -1563,7 +1563,7 @@ async function populateStreamModalDropdowns() {
             opt.value = tmpl.id;
             opt.dataset.name = tmpl.name;
             opt.dataset.engineType = tmpl.engine_type;
-            opt.textContent = `${getEngineIcon(tmpl.engine_type)} ${tmpl.name}`;
+            opt.textContent = `${tmpl.name} (${tmpl.engine_type})`;
             templateSelect.appendChild(opt);
         });
     }
@@ -1581,7 +1581,7 @@ async function populateStreamModalDropdowns() {
             const opt = document.createElement('option');
             opt.value = s.id;
             opt.dataset.name = s.name;
-            opt.textContent = `${getPictureSourceIcon(s.stream_type)} ${s.name}`;
+            opt.textContent = s.name;
             sourceSelect.appendChild(opt);
         });
     }

server/src/wled_controller/static/locales/en.json

@@ -551,6 +551,7 @@
   "automations.delete.confirm": "Delete automation \"{name}\"?",
   "automations.name": "Name:",
   "automations.name.hint": "A descriptive name for this automation",
+  "automations.name.placeholder": "My Automation",
   "automations.enabled": "Enabled:",
   "automations.enabled.hint": "Disabled automations won't activate even when conditions are met",
   "automations.condition_logic": "Condition Logic:",
@@ -626,6 +627,7 @@
   "scenes.edit": "Edit Scene",
   "scenes.name": "Name:",
   "scenes.name.hint": "A descriptive name for this scene preset",
+  "scenes.name.placeholder": "My Scene",
   "scenes.description": "Description:",
   "scenes.description.hint": "Optional description of what this scene does",
   "scenes.color": "Card Color:",

server/src/wled_controller/static/locales/ru.json

@@ -551,6 +551,7 @@
   "automations.delete.confirm": "Удалить автоматизацию \"{name}\"?",
   "automations.name": "Название:",
   "automations.name.hint": "Описательное имя для автоматизации",
+  "automations.name.placeholder": "Моя автоматизация",
   "automations.enabled": "Включена:",
   "automations.enabled.hint": "Отключённые автоматизации не активируются даже при выполнении условий",
   "automations.condition_logic": "Логика условий:",
@@ -626,6 +627,7 @@
   "scenes.edit": "Редактировать сцену",
   "scenes.name": "Название:",
   "scenes.name.hint": "Описательное имя для этого пресета сцены",
+  "scenes.name.placeholder": "Моя сцена",
   "scenes.description": "Описание:",
   "scenes.description.hint": "Необязательное описание назначения этой сцены",
   "scenes.color": "Цвет карточки:",

server/src/wled_controller/static/locales/zh.json

@@ -551,6 +551,7 @@
   "automations.delete.confirm": "删除自动化 \"{name}\"？",
   "automations.name": "名称：",
   "automations.name.hint": "此自动化的描述性名称",
+  "automations.name.placeholder": "我的自动化",
   "automations.enabled": "启用：",
   "automations.enabled.hint": "禁用的自动化即使满足条件也不会激活",
   "automations.condition_logic": "条件逻辑：",
@@ -626,6 +627,7 @@
   "scenes.edit": "编辑场景",
   "scenes.name": "名称：",
   "scenes.name.hint": "此场景预设的描述性名称",
+  "scenes.name.placeholder": "我的场景",
   "scenes.description": "描述：",
   "scenes.description.hint": "此场景功能的可选描述",
   "scenes.color": "卡片颜色：",

server/src/wled_controller/templates/modals/automation-editor.html

@@ -15,7 +15,7 @@
                         <button type="button" class="hint-toggle" onclick="toggleHint(this)" title="?">?</button>
                     </div>
                     <small class="input-hint" style="display:none" data-i18n="automations.name.hint">A descriptive name for this automation</small>
-                    <input type="text" id="automation-editor-name" required>
+                    <input type="text" id="automation-editor-name" data-i18n-placeholder="automations.name.placeholder" placeholder="My Automation" required>
                 </div>
 
                 <div class="form-group settings-toggle-group">

server/src/wled_controller/templates/modals/scene-preset-editor.html

@@ -15,7 +15,7 @@
                         <button type="button" class="hint-toggle" onclick="toggleHint(this)" title="?">?</button>
                     </div>
                     <small class="input-hint" style="display:none" data-i18n="scenes.name.hint">A descriptive name for this scene preset</small>
-                    <input type="text" id="scene-preset-editor-name" required>
+                    <input type="text" id="scene-preset-editor-name" data-i18n-placeholder="scenes.name.placeholder" placeholder="My Scene" required>
                 </div>
 
                 <div class="form-group">