web: Common: Fixed login/logout setups (translation, layout)
This commit is contained in:
parent
7fd9e3be6d
commit
0347e2df54
@ -14,7 +14,7 @@ import {
|
|||||||
} from "asc-web-components";
|
} from "asc-web-components";
|
||||||
import { connect } from "react-redux";
|
import { connect } from "react-redux";
|
||||||
import styled from "styled-components";
|
import styled from "styled-components";
|
||||||
import { withTranslation, I18nextProvider } from "react-i18next";
|
import { withTranslation } from "react-i18next";
|
||||||
import i18n from "./i18n";
|
import i18n from "./i18n";
|
||||||
import SubModalDialog from "./sub-components/modal-dialog";
|
import SubModalDialog from "./sub-components/modal-dialog";
|
||||||
import { login, setIsLoaded } from "../../store/auth/actions";
|
import { login, setIsLoaded } from "../../store/auth/actions";
|
||||||
@ -25,6 +25,7 @@ const FormContainer = styled.form`
|
|||||||
max-width: 432px;
|
max-width: 432px;
|
||||||
|
|
||||||
.login-header {
|
.login-header {
|
||||||
|
min-height: 79px;
|
||||||
margin-bottom: 24px;
|
margin-bottom: 24px;
|
||||||
|
|
||||||
.login-logo {
|
.login-logo {
|
||||||
@ -181,9 +182,12 @@ class Form extends Component {
|
|||||||
};
|
};
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
const { language, match } = this.props;
|
const { language, match, i18n } = this.props;
|
||||||
const { error, confirmedEmail } = match.params;
|
const { error, confirmedEmail } = match.params;
|
||||||
i18n.changeLanguage(language);
|
|
||||||
|
if(i18n.lng != language)
|
||||||
|
i18n.changeLanguage(language);
|
||||||
|
|
||||||
error && this.setState({ errorText: error });
|
error && this.setState({ errorText: error });
|
||||||
confirmedEmail && this.setState({ identifier: confirmedEmail });
|
confirmedEmail && this.setState({ identifier: confirmedEmail });
|
||||||
window.addEventListener("keyup", this.onKeyPress);
|
window.addEventListener("keyup", this.onKeyPress);
|
||||||
@ -323,19 +327,6 @@ class Form extends Component {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const FormWrapper = withTranslation()(Form);
|
|
||||||
|
|
||||||
const LoginForm = props => {
|
|
||||||
const { language } = props;
|
|
||||||
i18n.changeLanguage(language);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<I18nextProvider i18n={i18n}>
|
|
||||||
<PageLayout sectionBodyContent={<FormWrapper {...props} />} />
|
|
||||||
</I18nextProvider>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
Form.propTypes = {
|
Form.propTypes = {
|
||||||
login: PropTypes.func.isRequired,
|
login: PropTypes.func.isRequired,
|
||||||
match: PropTypes.object.isRequired,
|
match: PropTypes.object.isRequired,
|
||||||
@ -343,6 +334,7 @@ Form.propTypes = {
|
|||||||
setIsLoaded: PropTypes.func.isRequired,
|
setIsLoaded: PropTypes.func.isRequired,
|
||||||
greetingTitle: PropTypes.string.isRequired,
|
greetingTitle: PropTypes.string.isRequired,
|
||||||
t: PropTypes.func.isRequired,
|
t: PropTypes.func.isRequired,
|
||||||
|
i18n: PropTypes.object.isRequired,
|
||||||
language: PropTypes.string.isRequired
|
language: PropTypes.string.isRequired
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -352,12 +344,28 @@ Form.defaultProps = {
|
|||||||
email: ""
|
email: ""
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const FormWrapper = withTranslation()(Form);
|
||||||
|
|
||||||
|
const LoginForm = props => {
|
||||||
|
const { language, isLoaded } = props;
|
||||||
|
|
||||||
|
i18n.changeLanguage(language);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
{isLoaded && <PageLayout sectionBodyContent={<FormWrapper i18n={i18n} {...props} />} />}
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
LoginForm.propTypes = {
|
LoginForm.propTypes = {
|
||||||
language: PropTypes.string.isRequired
|
language: PropTypes.string.isRequired,
|
||||||
|
isLoaded: PropTypes.bool
|
||||||
};
|
};
|
||||||
|
|
||||||
function mapStateToProps(state) {
|
function mapStateToProps(state) {
|
||||||
return {
|
return {
|
||||||
|
isLoaded: state.auth.isLoaded,
|
||||||
language: state.auth.user.cultureName || state.auth.settings.culture,
|
language: state.auth.user.cultureName || state.auth.settings.culture,
|
||||||
greetingTitle: state.auth.settings.greetingSettings
|
greetingTitle: state.auth.settings.greetingSettings
|
||||||
};
|
};
|
||||||
|
@ -132,13 +132,17 @@ export function getUserInfo(dispatch) {
|
|||||||
|
|
||||||
export function login(user, pass) {
|
export function login(user, pass) {
|
||||||
return dispatch => {
|
return dispatch => {
|
||||||
return api.user.login(user, pass).then(() => getUserInfo(dispatch));
|
return api.user.login(user, pass)
|
||||||
|
.then(() => dispatch(setIsLoaded(false)))
|
||||||
|
.then(() => getUserInfo(dispatch));
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
export function logout() {
|
export function logout() {
|
||||||
return dispatch => {
|
return dispatch => {
|
||||||
return api.user.logout().then(() => dispatch(setLogout()));
|
return api.user.logout()
|
||||||
|
.then(() => dispatch(setLogout()))
|
||||||
|
.then(() => dispatch(setIsLoaded(true)));
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user