From d8fec965fae17a5dbcbb1e10964d0ccd4041c230 Mon Sep 17 00:00:00 2001
From: Kushagra Gour <chinchang457@gmail.com>
Date: Tue, 19 Jun 2018 11:27:18 +0530
Subject: [PATCH] remove d-clicks

---
 src/components/Footer.jsx        |  1 +
 src/components/HelpModal.jsx     | 10 ++++++----
 src/components/Notifications.jsx | 10 ++++++----
 src/components/app.jsx           | 28 +++++++++++++++++++++-------
 src/components/common.jsx        |  2 +-
 5 files changed, 35 insertions(+), 16 deletions(-)

diff --git a/src/components/Footer.jsx b/src/components/Footer.jsx
index c68eab7..dee0ff8 100644
--- a/src/components/Footer.jsx
+++ b/src/components/Footer.jsx
@@ -207,6 +207,7 @@ export default class Footer extends Component {
 				</a>
 				<A
 					onClick={this.props.supportDeveloperBtnClickHandler}
+					data-event-category="ui"
 					data-event-action="supportDeveloperFooterBtnClick"
 					class="footer__link  ml-1  hint--rounded  hint--top-right hide-on-mobile"
 					aria-label="Support the developer by pledging some amount"
diff --git a/src/components/HelpModal.jsx b/src/components/HelpModal.jsx
index c4c179c..0d2dc4d 100644
--- a/src/components/HelpModal.jsx
+++ b/src/components/HelpModal.jsx
@@ -1,5 +1,6 @@
 import { h } from 'preact';
-import Modal from './Modal.jsx';
+import Modal from './Modal';
+import { Button } from './common';
 
 export function HelpModal(props) {
 	return (
@@ -47,16 +48,17 @@ export function HelpModal(props) {
 					</a>.
 				</p>
 				<p>
-					<button
+					<Button
 						aria-label="Support the developer"
-						d-click="openSupportDeveloperModal"
+						onClick={props.onSupportBtnClick}
 						data-event-action="supportDeveloperHelpBtnClick"
+						data-event-category="ui"
 						class="btn btn-icon"
 					>
 						<svg>
 							<use xlinkHref="#gift-icon" />
 						</svg>Support the developer
-					</button>{' '}
+					</Button>{' '}
 					<a
 						aria-label="Rate Web Maker"
 						href="https://chrome.google.com/webstore/detail/web-maker/lkfkkhfhhdkiemehlpkgjeojomhpccnh/reviews"
diff --git a/src/components/Notifications.jsx b/src/components/Notifications.jsx
index 107bbc2..f17e0af 100644
--- a/src/components/Notifications.jsx
+++ b/src/components/Notifications.jsx
@@ -1,6 +1,7 @@
 import { h } from 'preact';
+import { A } from './common';
 
-export function Notifications() {
+export function Notifications(props) {
 	return (
 		<div>
 			<h1>Whats new?</h1>
@@ -74,14 +75,15 @@ export function Notifications() {
 						>
 							Share it
 						</a>&nbsp;
-						<a
+						<A
 							aria-label="Support the developer"
-							d-click="openSupportDeveloperModal"
+							onClick={props.onSupportBtnClick}
 							data-event-action="supportDeveloperChangelogBtnClick"
+							data-event-category="ui"
 							class="btn btn-icon"
 						>
 							Support the developer
-						</a>
+						</A>
 					</li>
 				</ul>
 			</div>
diff --git a/src/components/app.jsx b/src/components/app.jsx
index 95be2e5..6e0e919 100644
--- a/src/components/app.jsx
+++ b/src/components/app.jsx
@@ -219,6 +219,7 @@ export default class App extends Component {
 			}
 		});
 	}
+
 	updateProfileUi() {
 		if (this.state.user) {
 			document.body.classList.add('is-logged-in');
@@ -459,7 +460,7 @@ export default class App extends Component {
 				});
 				trackEvent('ui', 'showKeyboardShortcutsShortcut');
 			} else if (event.keyCode === 27) {
-				this.closeAllOverlays();
+				this.closeSavedItemsPane();
 			}
 		});
 	}
@@ -468,6 +469,19 @@ export default class App extends Component {
 		if (this.state.isSavedItemPaneOpen) {
 			this.closeSavedItemsPane();
 		}
+
+		this.setState({
+			isAddLibraryModalOpen: false,
+			isSettingsModalOpen: false,
+			isHelpModalOpen: false,
+			isNotificationsModalOpen: false,
+			isLoginModalOpen: false,
+			isProfileModalOpen: false,
+			isSupportDeveloperModalOpen: false,
+			isKeyboardShortcutsModalOpen: false,
+			isAskToImportModalOpen: false,
+			isOnboardModalOpen: false
+		});
 	}
 	onExternalLibChange(newValues) {
 		log('onExternalLibChange');
@@ -899,14 +913,11 @@ export default class App extends Component {
 		});
 		e.preventDefault();
 	}
-	openSupportDeveloperModal(e) {
-		// this.closeAllModals();
+	openSupportDeveloperModal() {
+		this.closeAllOverlays();
 		this.setState({
 			isSupportDeveloperModalOpen: true
 		});
-		if (e) {
-			trackEvent('ui', e.target.dataset.eventAction);
-		}
 	}
 	supportDeveloperBtnClickHandler(e) {
 		this.openSupportDeveloperModal(e);
@@ -1048,7 +1059,9 @@ export default class App extends Component {
 						this.setState({ isNotificationsModalOpen: false })
 					}
 				>
-					<Notifications />
+					<Notifications
+						onSupportBtnClick={this.openSupportDeveloperModal.bind(this)}
+					/>
 				</Modal>
 				<Modal
 					extraClasses="modal--settings"
@@ -1079,6 +1092,7 @@ export default class App extends Component {
 				<HelpModal
 					show={this.state.isHelpModalOpen}
 					closeHandler={() => this.setState({ isHelpModalOpen: false })}
+					onSupportBtnClick={this.openSupportDeveloperModal.bind(this)}
 				/>
 				<SupportDeveloperModal
 					show={this.state.isSupportDeveloperModalOpen}
diff --git a/src/components/common.jsx b/src/components/common.jsx
index ee2f860..f3f840f 100644
--- a/src/components/common.jsx
+++ b/src/components/common.jsx
@@ -8,7 +8,7 @@ class Clickable extends Component {
 			el.getAttribute('data-event-category'),
 			el.getAttribute('data-event-action')
 		);
-		this.props.onClick();
+		this.props.onClick(e);
 	}
 	render() {
 		const { onClick, Tag, ...props } = this.props;