|
@@ -5,42 +5,23 @@ import { bindActionCreators } from 'redux';
|
|
import { signInRequest } from './../../actions/auth/signIn'
|
|
import { signInRequest } from './../../actions/auth/signIn'
|
|
import { signUpRequest } from './../../actions/auth/signUp'
|
|
import { signUpRequest } from './../../actions/auth/signUp'
|
|
|
|
|
|
-import { auth, googleAuthProvider } from '../../firebase_config'
|
|
|
|
|
|
+import { auth } from '../../firebase_config'
|
|
|
|
|
|
class AuthPage extends Component {
|
|
class AuthPage extends Component {
|
|
constructor(props) {
|
|
constructor(props) {
|
|
super(props);
|
|
super(props);
|
|
- this.state = {
|
|
|
|
- user: null
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- componentDidMount() {
|
|
|
|
- auth.onAuthStateChanged(user => this.setState({ user }))
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- authRequest = () => {
|
|
|
|
- auth.signInWithPopup(googleAuthProvider)
|
|
|
|
- .then(res => {
|
|
|
|
- console.log(res);
|
|
|
|
-
|
|
|
|
- this.setState({
|
|
|
|
- user: res.user
|
|
|
|
- })
|
|
|
|
- })
|
|
|
|
}
|
|
}
|
|
|
|
|
|
render() {
|
|
render() {
|
|
- const { } = this.props; //
|
|
|
|
- const { user } = this.state; //
|
|
|
|
|
|
+ const { isFetching, error, user } = this.props.auth;
|
|
|
|
+ const { signInRequest } = this.props;
|
|
|
|
|
|
console.log("<AuthPage> - props", this.props);
|
|
console.log("<AuthPage> - props", this.props);
|
|
|
|
|
|
-
|
|
|
|
return (
|
|
return (
|
|
<div className="auth-page">
|
|
<div className="auth-page">
|
|
- <h1>{user && user.displayName}</h1>
|
|
|
|
- <button onClick={this.authRequest} disabled={user ? true : false}>Auth</button>
|
|
|
|
|
|
+ <button onClick={signInRequest} disabled={user ? true : false}>Auth</button>
|
|
|
|
+ <h2>{isFetching ? 'wait a moment...' : error ? 'Looks like we\'ve in trouble...' : user && user.displayName}</h2>
|
|
</div>
|
|
</div>
|
|
)
|
|
)
|
|
}
|
|
}
|
|
@@ -48,13 +29,13 @@ class AuthPage extends Component {
|
|
|
|
|
|
const
|
|
const
|
|
mapStateToProps = state => ({
|
|
mapStateToProps = state => ({
|
|
- signInState: {
|
|
|
|
|
|
+ auth: {
|
|
...state.signIn
|
|
...state.signIn
|
|
- },
|
|
|
|
- signUpState: {
|
|
|
|
- ...state.signUp
|
|
|
|
}
|
|
}
|
|
}),
|
|
}),
|
|
- mapDispatchToProps = dispatch => bindActionCreators({ signInRequest, signUpRequest }, dispatch);
|
|
|
|
|
|
+ mapDispatchToProps = dispatch => bindActionCreators({
|
|
|
|
+ signInRequest,
|
|
|
|
+ signUpRequest
|
|
|
|
+ }, dispatch);
|
|
|
|
|
|
export default connect(mapStateToProps, mapDispatchToProps)(AuthPage)
|
|
export default connect(mapStateToProps, mapDispatchToProps)(AuthPage)
|