Extract filtering for enabled targets so that the index of the targets is always the same for the bridge message callback

app/javascript/controllers/bridge/buttons_controller.js

@@ -10,20 +10,24 @@ export default class extends BridgeComponent {
   }
 
   notifyBridgeOfConnect() {
-    const buttons = this.buttonTargets
-      .filter(target => !target.closest("[data-bridge-disabled]"))
+    const buttons = this.#enabledButtonTargets
       .map((target, index) => {
         const element = new BridgeElement(target)
         return { ...element.getButton(), index }
     })
 
     this.send("connect", { buttons }, message => {
-      this.clickButton(message)
+      this.#clickButton(message)
     })
   }
 
-  clickButton(message) {
+  #clickButton(message) {
     const selectedIndex = message.data.selectedIndex
-    this.buttonTargets[selectedIndex].click()
+    this.#enabledButtonTargets[selectedIndex].click()
+  }
+
+  get #enabledButtonTargets() {
+    return this.buttonTargets
+      .filter(target => !target.closest("[data-bridge-disabled]"))
   }
 }

app/javascript/controllers/bridge/overflow_menu_controller.js

@@ -10,20 +10,24 @@ export default class extends BridgeComponent {
   }
 
   notifyBridgeOfConnect() {
-    const items = this.itemTargets
-      .filter(target => !target.closest("[data-bridge-disabled]"))
+    const items = this.#enabledItemTargets
       .map((target, index) => {
         const element = new BridgeElement(target)
         return { title: element.title, index }
       })
 
     this.send("connect", { items }, message => {
-      this.clickItem(message)
+      this.#clickItem(message)
     })
   }
 
-  clickItem(message) {
+  #clickItem(message) {
     const selectedIndex = message.data.selectedIndex
-    this.itemTargets[selectedIndex].click()
+    this.#enabledItemTargets[selectedIndex].click()
+  }
+
+  get #enabledItemTargets() {
+    return this.itemTargets
+      .filter(target => !target.closest("[data-bridge-disabled]"))
   }
 }