From 56152c77f318cc305d40ae288273b6624247b33b Mon Sep 17 00:00:00 2001
From: "Stanko K.R." <stanko@stanko.io>
Date: Thu, 21 Aug 2025 16:21:44 +0200
Subject: [PATCH] Focus the input field when Fizzy bar gets triggered

---
 app/javascript/controllers/bar_controller.js | 3 +++
 app/views/conversations/_composer.html.erb   | 2 +-
 app/views/searches/_form.html.erb            | 1 +
 3 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/app/javascript/controllers/bar_controller.js b/app/javascript/controllers/bar_controller.js
index 8cf84190e..db6dd008b 100644
--- a/app/javascript/controllers/bar_controller.js
+++ b/app/javascript/controllers/bar_controller.js
@@ -68,6 +68,9 @@ export default class extends Controller {
 
   #showItem(element) {
     element.removeAttribute("hidden")
+
+    const autofocusElement = element.querySelector("[autofocus]")
+    autofocusElement?.focus()
   }
 
   #hideItem(element) {
diff --git a/app/views/conversations/_composer.html.erb b/app/views/conversations/_composer.html.erb
index 6dcb3bca8..6b353718b 100644
--- a/app/views/conversations/_composer.html.erb
+++ b/app/views/conversations/_composer.html.erb
@@ -10,7 +10,7 @@
   <%= form.hidden_field :client_message_id, data: { conversation__composer_target: "clientMessageIdInput" } %>
   <%= form.label :content, "Ask Fizzy", class: "font-weight-black txt-nowrap" %>
   <%= form.text_field :content,
-        autofocus: "on",
+        autofocus: true,
         placeholder: "Ask something…",
         class: "conversation__composer-input input",
         data: {
diff --git a/app/views/searches/_form.html.erb b/app/views/searches/_form.html.erb
index 54fa6b1cc..6013cb8a3 100644
--- a/app/views/searches/_form.html.erb
+++ b/app/views/searches/_form.html.erb
@@ -5,6 +5,7 @@
         type: "search",
         placeholder: "Find something in Cards and Comments…",
         autocomplete: "off",
+        autofocus: true,
         data: {
           action: "keydown.enter->bar#showModalAndSubmit keydown.esc->bar#reset" } %>
 <% end %>