Add password reset, fixes #13

app/gabsocial/actions/auth.js

@@ -162,7 +162,8 @@ export function resetPassword(nickNameOrEmail) {
     return api(getState).post('/auth/password', params).then(() => {
       dispatch({ type: RESET_PASSWORD_SUCCESS });
     }).catch(error => {
-      dispatch({ type: RESET_PASSWORD_FAIL });
+      dispatch({ type: RESET_PASSWORD_FAIL, error });
+      throw error;
     });
   };
 }

app/gabsocial/features/auth_login/components/login_form.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import { connect } from 'react-redux';
+import { Link } from 'react-router-dom';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import { logIn } from 'gabsocial/actions/auth';
 import { fetchMe } from 'gabsocial/actions/me';
@@ -40,9 +41,9 @@ class LoginForm extends ImmutablePureComponent {
             <div className='input password optional user_password'>
               <input aria-label='Password' className='password optional' placeholder='Password' type='password' name='password' />
             </div>
-            {/* <p className='hint subtle-hint'>
-              <Link to='/auth/password/new'>Trouble logging in?</Link>
-            </p> */}
+            <p className='hint subtle-hint'>
+              <Link to='/auth/reset_password'>Trouble logging in?</Link>
+            </p>
           </div>
         </fieldset>
         <div className='actions'>

app/gabsocial/features/auth_login/components/password_reset.js

@@ -0,0 +1,50 @@
+import React from 'react';
+import { connect } from 'react-redux';
+import ImmutablePureComponent from 'react-immutable-pure-component';
+import { resetPassword } from 'gabsocial/actions/auth';
+import { SimpleForm, FieldsGroup, TextInput } from 'gabsocial/features/forms';
+import { Redirect } from 'react-router-dom';
+import { showAlert } from 'gabsocial/actions/alerts';
+
+export default @connect()
+class PasswordReset extends ImmutablePureComponent {
+
+  state = {
+    isLoading: false,
+    success: false,
+  }
+
+  handleSubmit = e => {
+    const { dispatch } = this.props;
+    const nicknameOrEmail = e.target.nickname_or_email.value;
+    this.setState({ isLoading: true });
+    dispatch(resetPassword(nicknameOrEmail)).then(() => {
+      this.setState({ isLoading: false, success: true });
+      dispatch(showAlert('Password reset received. Check your email for further instructions.', ''));
+    }).catch(error => {
+      this.setState({ isLoading: false });
+    });
+  }
+
+  render() {
+    if (this.state.success) return <Redirect to='/' />;
+
+    return (
+      <SimpleForm onSubmit={this.handleSubmit}>
+        <fieldset disabled={this.state.isLoading}>
+          <FieldsGroup>
+            <TextInput
+              name='nickname_or_email'
+              label='Email or username'
+              placeholder='me@example.com'
+            />
+          </FieldsGroup>
+        </fieldset>
+        <div className='actions'>
+          <button name='button' type='submit' className='btn button button-primary'>Reset password</button>
+        </div>
+      </SimpleForm>
+    );
+  }
+
+}

app/gabsocial/features/ui/index.js

@@ -71,6 +71,7 @@ import {
   LoginPage,
   Preferences,
   EditProfile,
+  PasswordReset,
 } from './util/async-components';
 
 // Dummy import, to make sure that <Status /> ends up in the application bundle.
@@ -191,9 +192,8 @@ class SwitchingColumnsArea extends React.PureComponent {
 
     return (
       <Switch>
-        {/* <WrappedRoute path='/' component={} publicRoute exact /> */}
         <WrappedRoute path='/auth/sign_in' component={LoginPage} publicRoute exact />
-        {/* <WrappedRoute path='/auth/sign_out' component={LogoutForm} publicRoute exact /> */}
+        <WrappedRoute path='/auth/reset_password' component={PasswordReset} publicRoute exact />
 
         <WrappedRoute path='/' exact page={HomePage} component={HomeTimeline} content={children} />
         <WrappedRoute path='/timeline/local' exact page={HomePage} component={CommunityTimeline} content={children} />

app/gabsocial/features/ui/util/async-components.js

@@ -173,3 +173,7 @@ export function Preferences() {
 export function EditProfile() {
   return import(/* webpackChunkName: "features/edit_profile" */'../../edit_profile');
 }
+
+export function PasswordReset() {
+  return import(/* webpackChunkName: "features/auth_login" */'../../auth_login/components/password_reset');
+}