From 7012c77fe9ddfd2b24572bc0e3165ca2c8d3317a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sa=C3=BAl=20Ibarra=20Corretg=C3=A9?= <saghul@jitsi.org>
Date: Tue, 22 May 2018 12:01:00 +0200
Subject: [PATCH 1/2] feat(toolbox): add ability to specify a toggled label on
 AbstractButton

---
 .../base/toolbox/components/AbstractButton.js | 20 ++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

diff --git a/react/features/base/toolbox/components/AbstractButton.js b/react/features/base/toolbox/components/AbstractButton.js
index 908f05c59..526fad0d2 100644
--- a/react/features/base/toolbox/components/AbstractButton.js
+++ b/react/features/base/toolbox/components/AbstractButton.js
@@ -68,6 +68,11 @@ export default class AbstractButton<P: Props, S: *> extends Component<P, S> {
      */
     label: string;
 
+    /**
+     * The label for this button, when toggled.
+     */
+    toggledLabel: string;
+
     /**
      * The name of the icon of this button, when toggled.
      *
@@ -119,6 +124,19 @@ export default class AbstractButton<P: Props, S: *> extends Component<P, S> {
             || this.iconName;
     }
 
+    /**
+     * Gets the current label, taking the toggled state into account. If no
+     * toggled label is provided, the regular label will also be used in the
+     * toggled state.
+     *
+     * @private
+     * @returns {string}
+     */
+    _getLabel() {
+        return (this._isToggled() ? this.toggledLabel : this.label)
+            || this.label;
+    }
+
     /**
      * Gets the current styles, taking the toggled state into account. If no
      * toggled styles are provided, the regular styles will also be used in the
@@ -179,7 +197,7 @@ export default class AbstractButton<P: Props, S: *> extends Component<P, S> {
             ...this.props,
             accessibilityLabel: this.accessibilityLabel,
             iconName: this._getIconName(),
-            label: this.label,
+            label: this._getLabel(),
             styles: this._getStyles(),
             tooltip: this.tooltip
         };

From b4c95bec39df4c74a5d3a8179432b57fd179c1f1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sa=C3=BAl=20Ibarra=20Corretg=C3=A9?= <saghul@jitsi.org>
Date: Tue, 22 May 2018 12:02:05 +0200
Subject: [PATCH 2/2] [RN] Adjust button labels to reflext the actual state

---
 lang/main.json                                              | 3 +++
 react/features/room-lock/components/RoomLockButton.js       | 3 ++-
 react/features/toolbox/components/native/AudioOnlyButton.js | 3 ++-
 3 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/lang/main.json b/lang/main.json
index ab8091c49..936ee4dd8 100644
--- a/lang/main.json
+++ b/lang/main.json
@@ -74,6 +74,8 @@
     "toolbar": {
         "addPeople": "Add people to your call",
         "audioonly": "Enable / Disable audio only mode (saves bandwidth)",
+        "audioOnlyOn": "Enable audio only mode (saves bandwidth)",
+        "audioOnlyOff": "Disable audio only mode",
         "audioRoute": "Select the audio route",
         "callQuality": "Manage call quality",
         "enterFullScreen": "View full screen",
@@ -278,6 +280,7 @@
         "reservationError": "Reservation system error",
         "reservationErrorMsg": "Error code: __code__, message: __msg__",
         "password": "Enter password",
+        "unlockRoom": "Unlock room",
         "userPassword": "user password",
         "token": "token",
         "tokenAuthFailedTitle": "Authentication failed",
diff --git a/react/features/room-lock/components/RoomLockButton.js b/react/features/room-lock/components/RoomLockButton.js
index 09b9ab788..acce4a6e5 100644
--- a/react/features/room-lock/components/RoomLockButton.js
+++ b/react/features/room-lock/components/RoomLockButton.js
@@ -34,8 +34,9 @@ type Props = AbstractButtonProps & {
 class RoomLockButton extends AbstractButton<Props, *> {
     accessibilityLabel = 'Room lock';
     iconName = 'security';
-    label = 'toolbar.lock';
+    label = 'dialog.lockRoom';
     toggledIconName = 'security-locked';
+    toggledLabel = 'dialog.unlockRoom';
 
     /**
      * Handles clicking / pressing the button.
diff --git a/react/features/toolbox/components/native/AudioOnlyButton.js b/react/features/toolbox/components/native/AudioOnlyButton.js
index a98bb3286..9295a6f39 100644
--- a/react/features/toolbox/components/native/AudioOnlyButton.js
+++ b/react/features/toolbox/components/native/AudioOnlyButton.js
@@ -29,8 +29,9 @@ type Props = AbstractButtonProps & {
 class AudioOnlyButton extends AbstractButton<Props, *> {
     accessibilityLabel = 'Audio only mode';
     iconName = 'visibility';
-    label = 'toolbar.audioonly';
+    label = 'toolbar.audioOnlyOn';
     toggledIconName = 'visibility-off';
+    toggledLabel = 'toolbar.audioOnlyOff';
 
     /**
      * Handles clicking / pressing the button.