ampache_react/app/views/LoginPage.jsx

104 lines
3.0 KiB
React
Raw Normal View History

// NPM imports
2016-07-07 23:23:18 +02:00
import React, { Component, PropTypes } from "react";
import { bindActionCreators } from "redux";
import { connect } from "react-redux";
// Actions
2016-07-07 23:23:18 +02:00
import * as actionCreators from "../actions";
// Components
2016-07-07 23:23:18 +02:00
import Login from "../components/Login";
/**
* Login page
*/
2016-07-07 23:23:18 +02:00
export class LoginPage extends Component {
constructor (props) {
super(props);
// Bind this
this.handleSubmit = this.handleSubmit.bind(this);
this._getRedirectTo = this._getRedirectTo.bind(this);
2016-07-07 23:23:18 +02:00
}
/**
* Get URL to redirect to based on location props.
*/
_getRedirectTo() {
let redirectPathname = "/";
let redirectQuery = {};
const { location } = this.props;
if (location.state && location.state.nextPathname) {
redirectPathname = location.state.nextPathname;
2016-07-07 23:23:18 +02:00
}
if (location.state && location.state.nextQuery) {
redirectQuery = location.state.nextQuery;
}
return {
pathname: redirectPathname,
query: redirectQuery
};
2016-07-07 23:23:18 +02:00
}
componentWillMount () {
// This checks if the user is already connected or not and redirects
// them if it is the case.
2016-07-07 23:23:18 +02:00
// Get next page to redirect to
const redirectTo = this._getRedirectTo();
if (this.props.isAuthenticated) {
// If user is already authenticated, redirects them
this.context.router.replace(redirectTo);
} else if (this.props.rememberMe) {
// Else if remember me is set, try to reconnect them
this.props.actions.loginUser(
this.props.username,
this.props.token,
this.props.endpoint,
true,
redirectTo,
true
);
}
2016-07-07 23:23:18 +02:00
}
/**
* Handle click on submit button.
*/
2016-07-07 23:23:18 +02:00
handleSubmit (username, password, endpoint, rememberMe) {
// Get page to redirect to
const redirectTo = this._getRedirectTo();
// Trigger login action
2016-07-07 23:23:18 +02:00
this.props.actions.loginUser(username, password, endpoint, rememberMe, redirectTo);
}
render () {
return (
<Login onSubmit={this.handleSubmit} username={this.props.username} endpoint={this.props.endpoint} rememberMe={this.props.rememberMe} isAuthenticating={this.props.isAuthenticating} error={this.props.error} info={this.props.info} />
);
}
}
LoginPage.contextTypes = {
router: PropTypes.object.isRequired
};
const mapStateToProps = (state) => ({
username: state.auth.username,
endpoint: state.auth.endpoint,
rememberMe: state.auth.rememberMe,
isAuthenticating: state.auth.isAuthenticating,
isAuthenticated: state.auth.isAuthenticated,
token: state.auth.token,
error: state.auth.error,
info: state.auth.info
});
const mapDispatchToProps = (dispatch) => ({
actions: bindActionCreators(actionCreators, dispatch)
});
export default connect(mapStateToProps, mapDispatchToProps)(LoginPage);