Web: Common: login: added hashPassword

This commit is contained in:
Artem Tarasov 2020-09-30 21:20:51 +03:00
parent 8db1420cdd
commit f7064f3baa
3 changed files with 95 additions and 91 deletions

View File

@ -1,10 +1,9 @@
import { request, setAuthorizationToken } from "../client";
export function login(userName, password) {
export function login(userName, hash) {
const data = {
userName,
password
passwordHash: hash
};
return request({
@ -33,4 +32,4 @@ export function checkConfirmLink(data) {
url: "/authentication/confirm.json",
data
});
}
}

View File

@ -22,6 +22,7 @@ import ForgotPasswordModalDialog from "./sub-components/forgot-password-modal-di
import { login, setIsLoaded } from "../../store/auth/actions";
import { sendInstructionsToChangePassword } from "../../api/people";
import Register from "./sub-components/register-container";
import { createHashPassword } from "../../utils";
const LoginContainer = styled.div`
display: flex;
@ -33,11 +34,11 @@ const LoginContainer = styled.div`
@media (max-width: 768px) {
padding: 0 16px;
max-width: 475px;
}
}
@media (max-width: 375px) {
margin: 72px auto 0 auto;
max-width: 311px;
}
}
.greeting-title {
width: 100%;
@ -56,11 +57,11 @@ const LoginContainer = styled.div`
@media (max-width: 768px) {
margin: 32px 0 0 0;
width: 100%
width: 100%;
}
@media (max-width: 375px) {
margin: 32px 0 0 0;
width: 100%
width: 100%;
}
.login-forgot-wrapper {
@ -73,48 +74,48 @@ const LoginContainer = styled.div`
.login-checkbox {
float: left;
span {
span {
font-size: 12px;
}
}
}
}
.login-tooltip {
display: inline-flex;
.login-tooltip {
display: inline-flex;
@media(min-width: 1025px) {
margin-left: 8px;
margin-top: 4px;
}
@media(max-width: 1024px) {
padding: 4px 8px 8px 8px;
}
@media (min-width: 1025px) {
margin-left: 8px;
margin-top: 4px;
}
@media (max-width: 1024px) {
padding: 4px 8px 8px 8px;
}
}
}
}
.login-link {
float: right;
line-height: 16px;
}
}
}
.login-button {
margin-bottom: 16px;
}
.login-button {
margin-bottom: 16px;
}
.login-button-dialog {
margin-right: 8px;
}
.login-button-dialog {
margin-right: 8px;
}
.login-bottom-border {
width: 100%;
height: 1px;
background: #ECEEF1;
}
.login-bottom-border {
width: 100%;
height: 1px;
background: #eceef1;
}
.login-bottom-text {
margin: 0 8px;
.login-bottom-text {
margin: 0 8px;
}
}
}
`;
class Form extends Component {
@ -174,8 +175,7 @@ class Form extends Component {
onSendPasswordInstructions = () => {
if (!this.state.email.trim()) {
this.setState({ emailError: true });
}
else {
} else {
this.setState({ isLoading: true });
sendInstructionsToChangePassword(this.state.email)
.then(
@ -198,7 +198,7 @@ class Form extends Component {
onSubmit = () => {
const { errorText, identifier, password } = this.state;
const { login, setIsLoaded, history } = this.props;
const { login, setIsLoaded, history, passwordHash } = this.props;
errorText && this.setState({ errorText: "" });
let hasError = false;
@ -221,7 +221,9 @@ class Form extends Component {
this.setState({ isLoading: true });
login(userName, pass)
const hash = createHashPassword(pass, passwordHash);
login(userName, hash)
.then(() => {
setIsLoaded(true);
history.push("/");
@ -231,7 +233,7 @@ class Form extends Component {
});
};
componentDidMount() {
async componentDidMount() {
const { match, t } = this.props;
const { error, confirmedEmail } = match.params;
@ -251,7 +253,7 @@ class Form extends Component {
upperCase: false,
digits: false,
specSymbols: false
}
};
render() {
const { greetingTitle, match, t } = this.props;
@ -276,16 +278,16 @@ class Form extends Component {
return (
<>
<LoginContainer>
<Text fontSize="32px"
<Text
fontSize="32px"
fontWeight={600}
textAlign="center"
className="greeting-title">
className="greeting-title"
>
{greetingTitle}
</Text>
<form className="auth-form-container">
<FieldContainer
isVertical={true}
labelVisible={false}
@ -338,19 +340,19 @@ class Form extends Component {
className="login-checkbox"
isChecked={isChecked}
onChange={this.onChangeCheckbox}
label={<Text fontSize='13px'>{t("Remember")}</Text>}
label={<Text fontSize="13px">{t("Remember")}</Text>}
/>
<HelpButton
className="login-tooltip"
helpButtonHeaderContent={t("CookieSettingsTitle")}
tooltipContent={
<Text fontSize='12px'>{t("RememberHelper")}</Text>
<Text fontSize="12px">{t("RememberHelper")}</Text>
}
/>
</div>
<Link
fontSize='13px'
fontSize="13px"
color="#316DAA"
className="login-link"
type="page"
@ -361,7 +363,7 @@ class Form extends Component {
</Link>
</div>
{openDialog &&
{openDialog && (
<ForgotPasswordModalDialog
openDialog={openDialog}
isLoading={isLoading}
@ -372,7 +374,7 @@ class Form extends Component {
onDialogClose={this.onDialogClose}
t={t}
/>
}
)}
<Button
id="button"
@ -388,25 +390,25 @@ class Form extends Component {
/>
{params.confirmedEmail && (
<Text isBold={true} fontSize='16px'>
<Text isBold={true} fontSize="16px">
{t("MessageEmailConfirmed")} {t("MessageAuthorize")}
</Text>
)}
<Text fontSize='14px' color="#c30">
<Text fontSize="14px" color="#c30">
{errorText}
</Text>
{socialButtons.length ? (<Box displayProp="flex" alignItems="center">
<div className="login-bottom-border"></div>
<Text className="login-bottom-text" color="#A3A9AE">{t("Or")}</Text>
<div className="login-bottom-border"></div>
</Box>
{socialButtons.length ? (
<Box displayProp="flex" alignItems="center">
<div className="login-bottom-border"></div>
<Text className="login-bottom-text" color="#A3A9AE">
{t("Or")}
</Text>
<div className="login-bottom-border"></div>
</Box>
) : null}
</form>
</LoginContainer>
</>
);
}
@ -440,13 +442,14 @@ const LoginForm = props => {
return (
<>
{isLoaded && <>
<PageLayout sectionBodyContent={<FormWrapper i18n={i18n} {...props} />} />
{enabledJoin &&
<RegisterWrapper i18n={i18n} {...props} />
}
</>
}
{isLoaded && (
<>
<PageLayout
sectionBodyContent={<FormWrapper i18n={i18n} {...props} />}
/>
{enabledJoin && <RegisterWrapper i18n={i18n} {...props} />}
</>
)}
</>
);
};
@ -462,10 +465,12 @@ function mapStateToProps(state) {
isLoaded: state.auth.isLoaded,
language: state.auth.user.cultureName || state.auth.settings.culture,
greetingTitle: state.auth.settings.greetingSettings,
enabledJoin: state.auth.settings.enabledJoin
enabledJoin: state.auth.settings.enabledJoin,
passwordHash: state.auth.settings.passwordHash
};
}
export default connect(mapStateToProps, { login, setIsLoaded })(
withRouter(LoginForm)
);
export default connect(mapStateToProps, {
login,
setIsLoaded
})(withRouter(LoginForm));

View File

@ -15,7 +15,7 @@ export const SET_CURRENT_PRODUCT_ID = "SET_CURRENT_PRODUCT_ID";
export const SET_CURRENT_PRODUCT_HOME_PAGE = "SET_CURRENT_PRODUCT_HOME_PAGE";
export const SET_GREETING_SETTINGS = "SET_GREETING_SETTINGS";
export const SET_CUSTOM_NAMES = "SET_CUSTOM_NAMES";
export const SET_WIZARD_COMPLETED ="SET_WIZARD_COMPLETED";
export const SET_WIZARD_COMPLETED = "SET_WIZARD_COMPLETED";
export function setCurrentUser(user) {
return {
@ -45,7 +45,6 @@ export function setIsLoaded(isLoaded) {
};
}
export function setLogout() {
return {
type: LOGOUT
@ -118,28 +117,27 @@ export function setCustomNames(customNames) {
export function setWizardComplete() {
return {
type: SET_WIZARD_COMPLETED
}
};
}
export function getUser(dispatch) {
return api.people.getUser()
return api.people
.getUser()
.then(user => dispatch(setCurrentUser(user)))
.catch(err => dispatch(setCurrentUser({})));
}
export function getPortalSettings(dispatch) {
return api.settings
.getSettings()
.then(settings => {
dispatch(setSettings(settings));
settings.nameSchemaId && getCurrentCustomSchema(dispatch, settings.nameSchemaId);
});
return api.settings.getSettings().then(settings => {
dispatch(setSettings(settings));
settings.nameSchemaId &&
getCurrentCustomSchema(dispatch, settings.nameSchemaId);
});
}
export function getCurrentCustomSchema(dispatch, id) {
return api.settings
return api.settings
.getCurrentCustomSchema(id)
.then(customNames => dispatch(setCustomNames(customNames)));
.then(customNames => dispatch(setCustomNames(customNames)));
}
export function getModules(dispatch) {
@ -156,17 +154,19 @@ export function getUserInfo(dispatch) {
return getUser(dispatch).finally(() => loadInitInfo(dispatch));
}
export function login(user, pass) {
export function login(user, hash) {
return dispatch => {
return api.user.login(user, pass)
.then(() => dispatch(setIsLoaded(false)))
.then(() => getUserInfo(dispatch));
return api.user
.login(user, hash)
.then(() => dispatch(setIsLoaded(false)))
.then(() => getUserInfo(dispatch));
};
}
export function logout() {
return dispatch => {
return api.user.logout()
return api.user
.logout()
.then(() => dispatch(setLogout()))
.then(() => dispatch(setIsLoaded(true)));
};
@ -188,4 +188,4 @@ export function getPortalPasswordSettings(dispatch, confirmKey = null) {
return api.settings.getPortalPasswordSettings(confirmKey).then(settings => {
dispatch(setPasswordSettings(settings));
});
}
}