From d8cb69b6c0fad9428e2ba794521c712816493431 Mon Sep 17 00:00:00 2001
From: McMatts <matt@documize.com>
Date: Tue, 5 Feb 2019 20:26:47 +0000
Subject: [PATCH] Better UX for custom logo upload

Resolves issue with phantom click.
---
 .../components/customize/general-settings.js  | 64 ++++++++++---------
 1 file changed, 33 insertions(+), 31 deletions(-)

diff --git a/gui/app/components/customize/general-settings.js b/gui/app/components/customize/general-settings.js
index 42aac071..461c727a 100644
--- a/gui/app/components/customize/general-settings.js
+++ b/gui/app/components/customize/general-settings.js
@@ -40,41 +40,43 @@ export default Component.extend(Notifier, {
 		let orgId = this.get('appMeta.orgId');
 		let uploadUrl = `${url}/organization/${orgId}/logo`;
 
-		let dzone = new Dropzone("#upload-logo > div", {
-			headers: {
-				'Authorization': 'Bearer ' + self.get('session.authToken')
-			},
-			url: uploadUrl,
-			method: "post",
-			paramName: 'attachment',
-			clickable: true,
-			maxFilesize: 50,
-			parallelUploads: 1,
-			uploadMultiple: false,
-			addRemoveLinks: false,
-			autoProcessQueue: true,
-			createImageThumbnails: false,
+		// Handle upload clicks on button and anything inside that button.
+		let sel = ['#upload-logo', '#upload-logo > div'];
+		for (var i=0; i < 2; i++) {
+			let dzone = new Dropzone(sel[i], {
+				headers: {
+					'Authorization': 'Bearer ' + self.get('session.authToken')
+				},
+				url: uploadUrl,
+				method: "post",
+				paramName: 'attachment',
+				clickable: true,
+				maxFilesize: 50,
+				parallelUploads: 1,
+				uploadMultiple: false,
+				addRemoveLinks: false,
+				autoProcessQueue: true,
+				createImageThumbnails: false,
 
-			init: function () {
-				this.on("success", function (/*file, response*/ ) {
-				});
+				init: function () {
+					this.on("success", function (/*file, response*/ ) {
+					});
 
-				this.on("queuecomplete", function () {
-					self.notifySuccess('Logo uploaded');
-				});
+					this.on("queuecomplete", function () {
+						self.notifySuccess('Logo uploaded');
+					});
 
-				this.on("error", function (error, msg) {
-					self.notifyError(msg);
-					self.notifyError(error);
-				});
-			}
-		});
+					this.on("error", function (error, msg) {
+						self.notifyError(msg);
+						self.notifyError(error);
+					});
+				}
+			});
 
-		dzone.on("complete", function (file) {
-			dzone.removeFile(file);
-		});
-
-		this.set('drop', dzone);
+			dzone.on("complete", function (file) {
+				dzone.removeFile(file);
+			});
+		}
 	},
 
 	actions: {