From 4256d16426257ea3752c483cbe66200e2816865f Mon Sep 17 00:00:00 2001
From: "a.tolmachev" <a.tolmachev@tbank.ru>
Date: Sat, 2 May 2026 14:40:58 +0000
Subject: [PATCH] ui: use hidden state for wizard streaming panels

---
 apps/ui/html/wizard/step5.html |  8 ++++----
 apps/ui/js/wizard.js           | 10 +++++-----
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/apps/ui/html/wizard/step5.html b/apps/ui/html/wizard/step5.html
index 6bc647e..0e9f6d4 100644
--- a/apps/ui/html/wizard/step5.html
+++ b/apps/ui/html/wizard/step5.html
@@ -208,7 +208,7 @@ tls:
                 <label class="checkbox-pill"><input id="streaming-drop-duplicates" type="checkbox"> <span data-i18n="wizard.streaming.drop_duplicates">Drop duplicates</span></label>
               </div>
 
-              <div id="streaming-tool-family-block" style="display:none;">
+              <div id="streaming-tool-family-block" hidden>
                 <div class="section-divider" style="margin: 8px 0 16px;">
                   <span class="section-divider-label" data-i18n="wizard.streaming.tool_family">Tool family</span>
                   <div class="section-divider-line"></div>
@@ -227,7 +227,7 @@ tls:
                     <input id="streaming-stop-tool-name" class="form-input input-mono" type="text" placeholder="logs_follow_stop">
                   </div>
                 </div>
-                <div class="form-row" id="streaming-async-tool-family-row" style="display:none;">
+                <div class="form-row" id="streaming-async-tool-family-row" hidden>
                   <div class="form-group">
                     <label class="form-label" data-i18n="wizard.streaming.status_tool_name">Status tool name</label>
                     <input id="streaming-status-tool-name" class="form-input input-mono" type="text" placeholder="deploy_status">
@@ -250,7 +250,7 @@ tls:
             <div class="section-divider-line"></div>
           </div>
 
-          <div id="wizard-live-status" class="info-callout" style="margin-bottom: 20px; display:none;">
+          <div id="wizard-live-status" class="info-callout" hidden style="margin-bottom: 20px;">
             <svg class="info-callout-icon" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round">
               <circle cx="8" cy="8" r="7"/>
               <path d="M8 11V8M8 5v-.5"/>
@@ -353,7 +353,7 @@ tls:
             </div>
           </div>
 
-          <div id="wizard-grpc-live-tools" class="config-card" style="margin-bottom: 20px; display:none;">
+          <div id="wizard-grpc-live-tools" class="config-card" hidden style="margin-bottom: 20px;">
             <div class="config-card-header">
               <div class="config-card-header-icon">
                 <svg width="13" height="13" viewBox="0 0 16 16" fill="none" stroke="var(--text-secondary)" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round">
diff --git a/apps/ui/js/wizard.js b/apps/ui/js/wizard.js
index 3ef6e59..f3f2499 100644
--- a/apps/ui/js/wizard.js
+++ b/apps/ui/js/wizard.js
@@ -1718,7 +1718,7 @@ function updateStreamingConfigVisibility() {
     if (!node) return;
     var group = node.closest('.form-group') || node.closest('.checkbox-pill');
     if (group) {
-      group.style.display = isUnary ? 'none' : '';
+      group.hidden = isUnary;
     }
   });
 
@@ -1732,8 +1732,8 @@ function updateStreamingConfigVisibility() {
           : tKey('wizard.streaming.help.window')));
   }
 
-  if (toolFamily) toolFamily.style.display = (isSession || isAsyncJob) ? '' : 'none';
-  if (asyncRow) asyncRow.style.display = isAsyncJob ? '' : 'none';
+  if (toolFamily) toolFamily.hidden = !(isSession || isAsyncJob);
+  if (asyncRow) asyncRow.hidden = !isAsyncJob;
 
   ensureStreamingToolFamilyDefaults(mode);
 }
@@ -2213,7 +2213,7 @@ async function runWizardLiveAction(button, busyLabel, handler) {
 
 function updateWizardProtocolVisibility() {
   var grpcTools = document.getElementById('wizard-grpc-live-tools');
-  if (grpcTools) grpcTools.style.display = wizardProtocol === 'grpc' ? '' : 'none';
+  if (grpcTools) grpcTools.hidden = wizardProtocol !== 'grpc';
   updateStreamingModeOptions();
   updateStreamingConfigVisibility();
 }
@@ -2225,7 +2225,7 @@ function showWizardLiveStatus(title, text, isError) {
   if (!root || !titleEl || !textEl) return;
   titleEl.textContent = title;
   textEl.textContent = text;
-  root.style.display = '';
+  root.hidden = false;
   root.classList.toggle('is-error', !!isError);
   root.classList.toggle('is-success', !isError);
 }