fix: replace HA test icon with refresh, make automation rules collapsible

Use refresh icon instead of flask for HA test connection buttons.
Add collapse/expand chevron to automation rule rows (collapsed by default).

server/src/wled_controller/static/css/automations.css

@@ -52,9 +52,26 @@
 
 .rule-header {
     display: flex;
-    justify-content: space-between;
     align-items: center;
-    margin-bottom: 8px;
+    gap: 6px;
+}
+
+.rule-collapse-chevron {
+    cursor: pointer;
+    font-size: 0.7rem;
+    color: var(--text-muted);
+    transition: transform 0.15s ease;
+    user-select: none;
+    flex-shrink: 0;
+    padding: 2px;
+}
+
+.rule-collapse-chevron:hover {
+    color: var(--text-color);
+}
+
+.rule-header .btn-remove-rule {
+    margin-left: auto;
 }
 
 .rule-type-label {
@@ -97,6 +114,10 @@
     height: 16px;
 }
 
+.rule-fields-container {
+    margin-top: 8px;
+}
+
 .rule-fields {
     display: flex;
     flex-direction: column;

server/src/wled_controller/static/js/features/automations.ts

@@ -637,14 +637,24 @@ function addAutomationRuleRow(rule: any) {
 
     row.innerHTML = `
         <div class="rule-header">
+            <span class="rule-collapse-chevron">&#9654;</span>
             <select class="rule-type-select">
                 ${RULE_TYPE_KEYS.map(k => `<option value="${k}" ${ruleType === k ? 'selected' : ''}>${t('automations.rule.' + k)}</option>`).join('')}
             </select>
             <button type="button" class="btn-remove-rule" onclick="this.closest('.automation-rule-row').remove(); if(window._autoGenerateAutomationName) window._autoGenerateAutomationName();" title="Remove">${ICON_TRASH}</button>
         </div>
-        <div class="rule-fields-container"></div>
+        <div class="rule-fields-container" style="display:none"></div>
     `;
 
+    // Wire collapse/expand toggle
+    const chevron = row.querySelector('.rule-collapse-chevron') as HTMLElement;
+    chevron.addEventListener('click', () => {
+        const fields = row.querySelector('.rule-fields-container') as HTMLElement;
+        const collapsed = fields.style.display === 'none';
+        fields.style.display = collapsed ? '' : 'none';
+        chevron.style.transform = collapsed ? 'rotate(90deg)' : '';
+    });
+
     const typeSelect = row.querySelector('.rule-type-select') as HTMLSelectElement;
     const container = row.querySelector('.rule-fields-container') as HTMLElement;
 

server/src/wled_controller/static/js/features/home-assistant-sources.ts

@@ -7,7 +7,7 @@ import { fetchWithAuth, escapeHtml } from '../core/api.ts';
 import { t } from '../core/i18n.ts';
 import { Modal } from '../core/modal.ts';
 import { showToast, showConfirm } from '../core/ui.ts';
-import { ICON_CLONE, ICON_EDIT, ICON_TEST } from '../core/icons.ts';
+import { ICON_CLONE, ICON_EDIT, ICON_REFRESH } from '../core/icons.ts';
 import * as P from '../core/icon-paths.ts';
 import { wrapCard } from '../core/card-colors.ts';
 import { TagInput, renderTagChips } from '../core/tag-input.ts';
@@ -251,7 +251,7 @@ export function createHASourceCard(source: HomeAssistantSource) {
             ${renderTagChips(source.tags)}
             ${source.description ? `<div class="template-config" style="opacity:0.7;">${escapeHtml(source.description)}</div>` : ''}`,
         actions: `
-                <button class="btn btn-icon btn-secondary" data-action="test" title="${t('ha_source.test')}">${ICON_TEST}</button>
+                <button class="btn btn-icon btn-secondary" data-action="test" title="${t('ha_source.test')}">${ICON_REFRESH}</button>
                 <button class="btn btn-icon btn-secondary" data-action="clone" title="${t('common.clone')}">${ICON_CLONE}</button>
                 <button class="btn btn-icon btn-secondary" data-action="edit" title="${t('common.edit')}">${ICON_EDIT}</button>`,
     });