Skip to content

Instantly share code, notes, and snippets.

@fk1blow
Last active December 26, 2016 02:47
Show Gist options
  • Select an option

  • Save fk1blow/d692bf687909af6d2b526a6f4340aa65 to your computer and use it in GitHub Desktop.

Select an option

Save fk1blow/d692bf687909af6d2b526a6f4340aa65 to your computer and use it in GitHub Desktop.
import React, {Component} from 'react';
import RaisedButton from 'material-ui/RaisedButton';
import {BehaviorSubject} from 'rxjs/BehaviorSubject';
import 'rxjs/add/operator/combineLatest';
import 'rxjs/add/operator/skip';
import styles from './index.css';
import TextField from 'components/TextField';
const noop = () => {};
export default class extends Component {
static defaultProps = { onSubmit: noop };
constructor(props) {
super(props);
this.state = {email: {isValid: false}, pass: {isValid: false}};
this.$email = new BehaviorSubject({isValid: false});
this.$pass = new BehaviorSubject({isValid: false});
}
componentDidMount() {
this.$email
.combineLatest(this.$pass)
.subscribe(([email, pass]) => this.setState({email, pass}))
}
render() {
return (
<form onSubmit={e => e.preventDefault()}>
<div>
<TextField
changeSubject={this.$email}
name="email"
floatingLabelText="Username"
validation="email"
autoFocus="true"
/>
</div>
<div>
<TextField
changeSubject={this.$pass}
validation="pass"
name="pass"
floatingLabelText="Password"
type="password"
/>
</div>
<div className={styles.submit}>
<RaisedButton
onClick={() => this.props.onSubmit(this.state.email, this.state.pass)}
label="Login"
disabled={!this.state.email.isValid || !this.state.pass.isValid}
fullWidth={true}
type="submit"
primary={true} />
</div>
</form>
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment