From e6c663f6e03c6a3881a6edc33d2053a8ecbcab97 Mon Sep 17 00:00:00 2001
From: Sam Reid <reids@colorado.edu>
Date: Tue, 7 Feb 2023 11:43:33 -0700
Subject: [PATCH] Add a second gate for visibility for the reverse battery
 button, see
 https://github.com/phetsims/circuit-construction-kit-common/issues/956

---
 js/view/BatteryReverseButton.ts            | 13 -------------
 js/view/CircuitElementEditContainerNode.ts | 20 ++++++++++++++++----
 2 files changed, 16 insertions(+), 17 deletions(-)

diff --git a/js/view/BatteryReverseButton.ts b/js/view/BatteryReverseButton.ts
index 545f9be7..d20e6e49 100644
--- a/js/view/BatteryReverseButton.ts
+++ b/js/view/BatteryReverseButton.ts
@@ -12,8 +12,6 @@ import circuitConstructionKitCommon from '../circuitConstructionKitCommon.js';
 import Battery from '../model/Battery.js';
 import CCKCRoundPushButton from './CCKCRoundPushButton.js';
 import Circuit from '../model/Circuit.js';
-import CircuitElement from '../model/CircuitElement.js';
-import Vertex from '../model/Vertex.js';
 import { RoundPushButtonOptions } from '../../../sun/js/buttons/RoundPushButton.js';
 import optionize, { EmptySelfOptions } from '../../../phet-core/js/optionize.js';
 
@@ -78,17 +76,6 @@ export default class BatteryReverseButton extends CCKCRoundPushButton {
       }
     }, providedOptions );
     super( options );
-
-    const isReversibleListener = ( isReversible: boolean ) => {
-      this.visible = isReversible;
-    };
-
-    // This is reused across all batteries.  The button itself can be hidden by PhET-iO customization, but the parent
-    // node is another gate for the visibility.
-    circuit.selectionProperty.link( ( newCircuitElement: CircuitElement | Vertex | null, oldCircuitElement: CircuitElement | Vertex | null ) => {
-      oldCircuitElement instanceof Battery && oldCircuitElement.isReversibleProperty.unlink( isReversibleListener );
-      newCircuitElement instanceof Battery && newCircuitElement.isReversibleProperty.link( isReversibleListener );
-    } );
   }
 
   public override dispose(): void {
diff --git a/js/view/CircuitElementEditContainerNode.ts b/js/view/CircuitElementEditContainerNode.ts
index 48e5502d..69942df6 100644
--- a/js/view/CircuitElementEditContainerNode.ts
+++ b/js/view/CircuitElementEditContainerNode.ts
@@ -142,9 +142,7 @@ export default class CircuitElementEditContainerNode extends Node {
       children: [ fuseRepairButton ]
     } );
 
-    const isRepairableListener = ( isRepairable: boolean ) => {
-      fuseRepairButtonContainer.visible = isRepairable;
-    };
+    const isRepairableListener = ( isRepairable: boolean ) => fuseRepairButtonContainer.setVisible( isRepairable );
 
     // This is reused across all instances.  The button itself can be hidden by PhET-iO customization, but the parent
     // node is another gate for the visibility.
@@ -166,6 +164,20 @@ export default class CircuitElementEditContainerNode extends Node {
       maxHeight: trashButton.height
     } );
 
+    // This is reused across all batteries.  The button itself can be hidden by PhET-iO customization, but the parent
+    // node is another gate for the visibility.
+    const batteryReverseContainerNode = new Node( {
+      excludeInvisibleChildrenFromBounds: true,
+      children: [ batteryReverseButton ]
+    } );
+
+    const isReversibleListener = ( isReversible: boolean ) => batteryReverseContainerNode.setVisible( isReversible );
+
+    circuit.selectionProperty.link( ( newCircuitElement: CircuitElement | Vertex | null, oldCircuitElement: CircuitElement | Vertex | null ) => {
+      oldCircuitElement instanceof Battery && oldCircuitElement.isReversibleProperty.unlink( isReversibleListener );
+      newCircuitElement instanceof Battery && newCircuitElement.isReversibleProperty.link( isReversibleListener );
+    } );
+
     const switchReadoutNode = new SwitchReadoutNode( circuit, tandem.createTandem( 'switchReadoutNode' ) );
 
     const listener = ( isDisposable: boolean ) => trashButtonContainer.setVisible( isDisposable );
@@ -392,7 +404,7 @@ export default class CircuitElementEditContainerNode extends Node {
 
               // Batteries can be reversed, nest in a Node so the layout will reflow correctly
               new Node( {
-                children: [ batteryReverseButton ],
+                children: [ batteryReverseContainerNode ],
                 excludeInvisibleChildrenFromBounds: true
               } ),
               selectedCircuitElement.batteryType === 'high-voltage' ? extremeBatteryVoltageNumberControl : voltageNumberControl,