From 3a72d12b3768208a9a3cb5533dc8e09fe9a6c9ee Mon Sep 17 00:00:00 2001
From: sergey kilochytsky <s.kilochytsky@pixelplex.io>
Date: Sat, 11 Jan 2020 11:36:53 +0300
Subject: [PATCH] [BRG-546] show error when extension not installed (#23)

---
 package.json                           |  2 +-
 src/actions/WidgetActions.js           |  5 +++++
 src/assets/scss/components/_toast.scss | 10 ++++++----
 src/components/QRCodeWidget/index.jsx  | 10 ++++++++++
 src/containers/QRCodeWidget/index.jsx  |  7 +++++++
 5 files changed, 29 insertions(+), 5 deletions(-)

diff --git a/package.json b/package.json
index f106d44..a33b5ac 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
 	"name": "bridge-landing",
 	"description": "Echo Bridge Landing",
-	"version": "1.16.0",
+	"version": "1.16.1",
 	"repository": {
 		"type": "git",
 		"url": "https://github.com/echoprotocol/bridge-website.git"
diff --git a/src/actions/WidgetActions.js b/src/actions/WidgetActions.js
index 6c57a88..2a9176f 100644
--- a/src/actions/WidgetActions.js
+++ b/src/actions/WidgetActions.js
@@ -91,6 +91,11 @@ class WidgetActions extends BaseActionsClass {
 				dispatch(this.setValue('error', 'Amount should be more than 0', false));
 				return;
 			}
+			if (!window.echojslib) {
+				dispatch(this.setValue('error', 'Install Bridge Extension to proceed', false));
+				dispatch(this.setValue('downloadLink', 'https://chrome.google.com/webstore/detail/echo-bridge/ginklfodpcgldnicehmlpehfmgjhbdcl', false));
+				return;
+			}
 			const access = await window.echojslib.extension.getAccess();
 
 			if (!access) {
diff --git a/src/assets/scss/components/_toast.scss b/src/assets/scss/components/_toast.scss
index 8406628..dbb5bf6 100644
--- a/src/assets/scss/components/_toast.scss
+++ b/src/assets/scss/components/_toast.scss
@@ -1,4 +1,4 @@
-.toast  {
+.toast {
 	@include futura-medium();
 	align-items: center;
 	justify-content: center;
@@ -7,6 +7,7 @@
 	bottom: 0;
 	left: 0;
 	display: flex;
+	flex-direction: column;
 	height: 77px;
 	font-size: 16px;
 
@@ -16,7 +17,8 @@
 		color: #bb3e51;
 	}
 
-	&-content {
-		padding-top: 20px;
-	}
 }
+
+.toast-content {
+	padding-top: 20px;
+}
\ No newline at end of file
diff --git a/src/components/QRCodeWidget/index.jsx b/src/components/QRCodeWidget/index.jsx
index b5fb656..2c771ff 100644
--- a/src/components/QRCodeWidget/index.jsx
+++ b/src/components/QRCodeWidget/index.jsx
@@ -23,6 +23,7 @@ class QRCodeWidget extends React.Component {
 			account, error,
 			currency,
 			isConnected,
+			downloadLink,
 		} = this.props;
 		return (
 			<div className="widget-page">
@@ -83,6 +84,10 @@ class QRCodeWidget extends React.Component {
 							<div className="toast-content">
 								{error}
 							</div>
+							{
+								downloadLink &&
+								<a className="toast-link" href={downloadLink}>Download</a>
+							}
 						</div>
 					}
 
@@ -95,12 +100,17 @@ class QRCodeWidget extends React.Component {
 
 }
 
+QRCodeWidget.defaultProps = {
+	downloadLink: null,
+};
+
 QRCodeWidget.propTypes = {
 	pay: PropTypes.func.isRequired,
 	isConnected: PropTypes.bool.isRequired,
 	account: PropTypes.string.isRequired,
 	currency: PropTypes.object.isRequired,
 	error: PropTypes.string.isRequired,
+	downloadLink: PropTypes.string,
 };
 
 export default QRCodeWidget;
diff --git a/src/containers/QRCodeWidget/index.jsx b/src/containers/QRCodeWidget/index.jsx
index 756d1ee..c75e6b7 100644
--- a/src/containers/QRCodeWidget/index.jsx
+++ b/src/containers/QRCodeWidget/index.jsx
@@ -47,6 +47,7 @@ class QRCodeWidget extends React.Component {
 			error,
 			isConnected,
 			pay,
+			downloadLink,
 		} = this.props;
 		return (
 			<QRCodeWidgetComponent
@@ -55,12 +56,16 @@ class QRCodeWidget extends React.Component {
 				currency={currency}
 				error={error}
 				isConnected={isConnected}
+				downloadLink={downloadLink}
 			/>
 		);
 	}
 
 }
 
+QRCodeWidget.defaultProps = {
+	downloadLink: null,
+};
 QRCodeWidget.propTypes = {
 	match: PropTypes.object.isRequired,
 	pay: PropTypes.func.isRequired,
@@ -69,6 +74,7 @@ QRCodeWidget.propTypes = {
 	currency: PropTypes.object.isRequired,
 	error: PropTypes.string.isRequired,
 	isConnected: PropTypes.bool.isRequired,
+	downloadLink: PropTypes.string,
 };
 
 export default withRouter(connect(
@@ -76,6 +82,7 @@ export default withRouter(connect(
 		currency: state.widget.get('currency'),
 		error: state.widget.get('error'),
 		isConnected: state.global.get('isConnected'),
+		downloadLink: state.widget.get('downloadLink'),
 	}),
 	(dispatch) => ({
 		pay: (account) => dispatch(WidgetActions.payWithBridge(account)),