WIP: Add option to recover forgotten password #260

src/user/login-form.js

@@ -17,7 +17,7 @@
 
 import React, { Component } from 'react';
 import { Form, Button, FormGroup, FormControl, FormLabel, Col } from 'react-bootstrap';
-
+import RecoverPassword from './recover-password'
 import AppDispatcher from '../common/app-dispatcher';
 
 class LoginForm extends Component {
@@ -27,6 +27,7 @@ class LoginForm extends Component {
     this.state = {
       username: '',
       password: '',
+      forgottenPassword: false,
       disableLogin: true
     }
   }
@@ -55,6 +56,14 @@ class LoginForm extends Component {
     this.setState({ [event.target.id]: event.target.value, disableLogin });
   }
 
+  openRecoverPassword(){
+    this.setState({forgottenPassword: true});
+  }
+
+  closeRecoverPassword(){
+    this.setState({forgottenPassword: false});
+  }
+
   render() {
     return (
       <Form>
@@ -83,10 +92,14 @@ class LoginForm extends Component {
         <FormGroup style={{paddingTop: 15, paddingBottom: 5}}>
           <Col>
             <Button style={{width: 90}} type="submit" disabled={this.state.disableLogin} onClick={e => this.login(e)}>Login</Button>
+            <Button variant="link" size="sm" style={{marginLeft: 85}} onClick={() => this.openRecoverPassword()}>Forgot your password?</Button>
           </Col>
         </FormGroup>
+        
+        <RecoverPassword show={this.state.forgottenPassword} onClose={() => this.closeRecoverPassword()} sessionToken={this.props.sessionToken} />
 
       </Form>
+      
     );
   }
 }

src/user/recover-password.js

@@ -0,0 +1,72 @@
+/**
+ * This file is part of VILLASweb.
+ *
+ * VILLASweb is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * VILLASweb is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with VILLASweb. If not, see <http://www.gnu.org/licenses/>.
+ ******************************************************************************/
+
+import React from 'react';
+import Dialog from '../common/dialogs/dialog';
+import {Col, Row} from 'react-bootstrap';
+
+
+class RecoverPassword extends React.Component {
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      admins: this.props.admins
+    }
+  }
+
+
+  onClose() {
+      this.props.onClose();
+  }
+
+
+
+  
+  
+
+  render() {
+    return (
+      <Dialog show={this.props.show} title="Recover password" buttonTitle="Close" onClose={(c) => this.onClose(c)} blendOutCancel = {true} valid={true}>
+        <div>
+        <span>Please contact an administrator</span>
+        <div>
+        {this.state.admins != null && this.state.admins.map(admin => (
+          <form>
+            <Row>
+              <Col xs={3}>Admin: </Col>
+              <Col xs={3}> {admin.username} </Col>
+            </Row>
+
+
+            <Row as={Col}>
+              <Col xs={3}>E-mail: </Col>
+              <Col xs={3}> {admin.mail} </Col>
+            </Row>
+
+          </form> 
+          ))}
+        </div>
+
+          
+      </div>
+      </Dialog>
+    );
+  }
+}
+
+export default RecoverPassword;