Add handlers for forgot password and throttle it

app/hub/Views/BrowserLoginForm/BrowserLogInForm.jsx

@@ -29,6 +29,7 @@ const BrowserLogInForm = (props) => {
 		passwordError,
 		handleSubmit,
 		handleInputChange,
+		handleForgotPassword,
 	} = props;
 
 	const emailInputClassNames = ClassNames('BrowserLogInForm__inputBox', {
@@ -86,10 +87,10 @@ const BrowserLogInForm = (props) => {
 			</div>
 			<div className="BrowserLogInForm__item row align-center-middle">
 				<div className="columns small-10">
-					<span className="BrowserLogInForm__link text-center">
-						<NavLink to="/forgot-password">
+					<span className="BrowserLogInForm__link">
+						<div className="BrowserLogInForm__forgotPassword" onClick={handleForgotPassword}>
 							{t('forgot_password')}
-						</NavLink>
+						</div>
 					</span>
 				</div>
 			</div>

app/hub/Views/BrowserLoginForm/BrowserLogInForm.scss

@@ -64,6 +64,11 @@
 	font-size: 14px;
 	line-height: 30px;
 }
+.BrowserLogInForm__forgotPassword {
+	color: $ghosty-blue;
+	text-decoration: underline;
+	cursor: pointer;
+}
 .BrowserLogInForm__button {
 	min-width: 180px;
 }

app/hub/Views/BrowserLoginForm/BrowserLogInFormContainer.jsx

@@ -13,9 +13,11 @@
 
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
+import { throttle } from 'underscore';
 import { validateEmail } from '../../../panel/utils/utils';
 import BrowserLogInForm from './BrowserLogInForm';
 import SignedInView from '../SignedInView';
+
 /**
  * @class Implement the Browser Log In Form for the Ghostery Hub
  * @extends Component
@@ -89,7 +91,7 @@ class BrowserLogInFormContainer extends Component {
 			return;
 		}
 
-		const { actions, history } = this.props;
+		const { actions } = this.props;
 		actions.setToast({
 			toastMessage: '',
 			toastClass: ''
@@ -119,6 +121,33 @@ class BrowserLogInFormContainer extends Component {
 		});
 	}
 
+	_unthrottledHandleForgotPassword = (e) => {
+		e.preventDefault();
+		const { email } = this.state;
+
+		// validate the email and password
+		if (!validateEmail(email)) {
+			this.setState({
+				emailError: true,
+			});
+			return;
+		}
+
+		const { actions } = this.props;
+		actions.resetPassword(email)
+			.then((success) => {
+				if (success) {
+					actions.setToast({
+						toastMessage: t('banner_check_your_email_title'),
+						toastClass: 'success',
+					});
+				}
+			});
+	}
+
+	// eslint-disable-next-line react/sort-comp
+	_handleForgotPassword = throttle(this._unthrottledHandleForgotPassword, 10000)
+
 	/**
 	 * React's required render function. Returns JSX
 	 * @return {JSX} JSX for rendering the Log In View of the Hub app
@@ -142,6 +171,7 @@ class BrowserLogInFormContainer extends Component {
 				passwordError={passwordError}
 				handleInputChange={this._handleInputChange}
 				handleSubmit={this._handleLoginAttempt}
+				handleForgotPassword={this._handleForgotPassword}
 			/>
 		);
 	}

app/hub/Views/BrowserLoginForm/index.js

@@ -15,7 +15,12 @@ import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 
 import BrowserLogInFormContainer from './BrowserLogInFormContainer';
-import { login, getUser, getUserSettings } from '../../../Account/AccountActions';
+import {
+	login,
+	getUser,
+	getUserSettings,
+	resetPassword
+} from '../../../Account/AccountActions';
 import { getTheme } from '../../../panel/actions/PanelActions';
 import { setToast } from '../AppView/AppViewActions';
 
@@ -39,7 +44,8 @@ const mapDispatchToProps = dispatch => ({
 		login,
 		getUser,
 		getUserSettings,
-		getTheme
+		getTheme,
+		resetPassword
 	}, dispatch),
 });