From 626cb46915d3ff535156dd1114114fadb4942d2d Mon Sep 17 00:00:00 2001
From: Will Hunt <will@half-shot.uk>
Date: Tue, 14 May 2019 21:05:22 +0100
Subject: [PATCH] Cleanup interface buttons

---
 res/css/views/settings/_Notifications.scss     |  8 ++++++++
 .../tabs/room/NotificationSettingsTab.js       | 18 +++++++++++++++---
 src/i18n/strings/en_EN.json                    |  3 ++-
 3 files changed, 25 insertions(+), 4 deletions(-)

diff --git a/res/css/views/settings/_Notifications.scss b/res/css/views/settings/_Notifications.scss
index d6c0b5dbeb..b21e7a5113 100644
--- a/res/css/views/settings/_Notifications.scss
+++ b/res/css/views/settings/_Notifications.scss
@@ -71,3 +71,11 @@ limitations under the License.
 .mx_UserNotifSettings_notifTable .mx_Spinner {
     position: absolute;
 }
+
+.mx_NotificationSound_soundUpload {
+    display: none;
+}
+
+.mx_NotificationSound_resetSound {
+    margin-left: 5px;
+}
\ No newline at end of file
diff --git a/src/components/views/settings/tabs/room/NotificationSettingsTab.js b/src/components/views/settings/tabs/room/NotificationSettingsTab.js
index e7ed14b491..9d0848baf4 100644
--- a/src/components/views/settings/tabs/room/NotificationSettingsTab.js
+++ b/src/components/views/settings/tabs/room/NotificationSettingsTab.js
@@ -46,6 +46,13 @@ export default class NotificationsSettingsTab extends React.Component {
         });
     }
 
+    async _triggerUploader(e) {
+        e.stopPropagation();
+        e.preventDefault();
+
+        this.refs.soundUpload.click();
+    }
+
     async _onSoundUploadChanged(e) {
         if (!e.target.files || !e.target.files.length) {
             this.setState({
@@ -133,10 +140,15 @@ export default class NotificationsSettingsTab extends React.Component {
                     <div>
                         <h3>{_t("Set a new custom sound")}</h3>
                         <form autoComplete={false} noValidate={true}>
-                            <input type="file" onChange={this._onSoundUploadChanged.bind(this)} accept="audio/*" />
+                            <input ref="soundUpload" className="mx_NotificationSound_soundUpload" type="file" onChange={this._onSoundUploadChanged.bind(this)} accept="audio/*" />
                         </form>
-                        <AccessibleButton onClick={this._clearSound.bind(this)} kind="primary">
-                                {_t("Reset to default sound")}
+
+                        <AccessibleButton onClick={this._triggerUploader.bind(this)} kind="primary">
+                                {_t("Browse")}
+                        </AccessibleButton>
+
+                        <AccessibleButton className="mx_NotificationSound_resetSound" onClick={this._clearSound.bind(this)} kind="primary">
+                                {_t("Reset")}
                         </AccessibleButton>
                     </div>
                 </div>
diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json
index d841d5a34b..5070bb7d30 100644
--- a/src/i18n/strings/en_EN.json
+++ b/src/i18n/strings/en_EN.json
@@ -616,7 +616,8 @@
     "URL Previews": "URL Previews",
     "Sounds": "Sounds",
     "Set a new custom sound": "Set a new custom sound",
-    "Reset to default sound": "Reset to default sound",
+    "Browse": "Browse",
+    "Reset": "Reset",
     "Change room avatar": "Change room avatar",
     "Change room name": "Change room name",
     "Change main address for the room": "Change main address for the room",