mirror of
https://github.com/scm-manager/scm-manager.git
synced 2025-11-08 06:25:45 +01:00
fixed password validation in ui
This commit is contained in:
@@ -11,7 +11,7 @@ type State = {
|
|||||||
passwordConfirmationFailed: boolean
|
passwordConfirmationFailed: boolean
|
||||||
};
|
};
|
||||||
type Props = {
|
type Props = {
|
||||||
passwordChanged: string => void,
|
passwordChanged: (string, boolean) => void,
|
||||||
passwordValidator?: string => boolean,
|
passwordValidator?: string => boolean,
|
||||||
// Context props
|
// Context props
|
||||||
t: string => string
|
t: string => string
|
||||||
@@ -98,14 +98,12 @@ class PasswordConfirmation extends React.Component<Props, State> {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
isValid = () => {
|
||||||
|
return this.state.passwordValid && !this.state.passwordConfirmationFailed
|
||||||
|
};
|
||||||
|
|
||||||
propagateChange = () => {
|
propagateChange = () => {
|
||||||
if (
|
this.props.passwordChanged(this.state.password, this.isValid());
|
||||||
this.state.password &&
|
|
||||||
this.state.passwordValid &&
|
|
||||||
!this.state.passwordConfirmationFailed
|
|
||||||
) {
|
|
||||||
this.props.passwordChanged(this.state.password);
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -21,7 +21,8 @@ type State = {
|
|||||||
password: string,
|
password: string,
|
||||||
loading: boolean,
|
loading: boolean,
|
||||||
error?: Error,
|
error?: Error,
|
||||||
passwordChanged: boolean
|
passwordChanged: boolean,
|
||||||
|
passwordValid: boolean
|
||||||
};
|
};
|
||||||
|
|
||||||
class ChangeUserPassword extends React.Component<Props, State> {
|
class ChangeUserPassword extends React.Component<Props, State> {
|
||||||
@@ -35,7 +36,8 @@ class ChangeUserPassword extends React.Component<Props, State> {
|
|||||||
passwordConfirmationError: false,
|
passwordConfirmationError: false,
|
||||||
validatePasswordError: false,
|
validatePasswordError: false,
|
||||||
validatePassword: "",
|
validatePassword: "",
|
||||||
passwordChanged: false
|
passwordChanged: false,
|
||||||
|
passwordValid: false
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -83,6 +85,10 @@ class ChangeUserPassword extends React.Component<Props, State> {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
isValid = () => {
|
||||||
|
return this.state.oldPassword && this.state.passwordValid;
|
||||||
|
};
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { t } = this.props;
|
const { t } = this.props;
|
||||||
const { loading, passwordChanged, error } = this.state;
|
const { loading, passwordChanged, error } = this.state;
|
||||||
@@ -118,7 +124,7 @@ class ChangeUserPassword extends React.Component<Props, State> {
|
|||||||
key={this.state.passwordChanged ? "changed" : "unchanged"}
|
key={this.state.passwordChanged ? "changed" : "unchanged"}
|
||||||
/>
|
/>
|
||||||
<SubmitButton
|
<SubmitButton
|
||||||
disabled={!this.state.password}
|
disabled={!this.isValid()}
|
||||||
loading={loading}
|
loading={loading}
|
||||||
label={t("password.submit")}
|
label={t("password.submit")}
|
||||||
/>
|
/>
|
||||||
@@ -126,8 +132,8 @@ class ChangeUserPassword extends React.Component<Props, State> {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
passwordChanged = (password: string) => {
|
passwordChanged = (password: string, passwordValid: boolean) => {
|
||||||
this.setState({ ...this.state, password });
|
this.setState({ ...this.state, password, passwordValid: (!!password && passwordValid) });
|
||||||
};
|
};
|
||||||
|
|
||||||
onClose = () => {
|
onClose = () => {
|
||||||
|
|||||||
@@ -19,7 +19,8 @@ type State = {
|
|||||||
password: string,
|
password: string,
|
||||||
loading: boolean,
|
loading: boolean,
|
||||||
error?: Error,
|
error?: Error,
|
||||||
passwordChanged: boolean
|
passwordChanged: boolean,
|
||||||
|
passwordValid: boolean
|
||||||
};
|
};
|
||||||
|
|
||||||
class SetUserPassword extends React.Component<Props, State> {
|
class SetUserPassword extends React.Component<Props, State> {
|
||||||
@@ -32,7 +33,8 @@ class SetUserPassword extends React.Component<Props, State> {
|
|||||||
passwordConfirmationError: false,
|
passwordConfirmationError: false,
|
||||||
validatePasswordError: false,
|
validatePasswordError: false,
|
||||||
validatePassword: "",
|
validatePassword: "",
|
||||||
passwordChanged: false
|
passwordChanged: false,
|
||||||
|
passwordValid: false
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -104,7 +106,7 @@ class SetUserPassword extends React.Component<Props, State> {
|
|||||||
key={this.state.passwordChanged ? "changed" : "unchanged"}
|
key={this.state.passwordChanged ? "changed" : "unchanged"}
|
||||||
/>
|
/>
|
||||||
<SubmitButton
|
<SubmitButton
|
||||||
disabled={!this.state.password}
|
disabled={!this.state.passwordValid}
|
||||||
loading={loading}
|
loading={loading}
|
||||||
label={t("user-form.submit")}
|
label={t("user-form.submit")}
|
||||||
/>
|
/>
|
||||||
@@ -112,8 +114,8 @@ class SetUserPassword extends React.Component<Props, State> {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
passwordChanged = (password: string) => {
|
passwordChanged = (password: string, passwordValid: boolean) => {
|
||||||
this.setState({ ...this.state, password });
|
this.setState({ ...this.state, password, passwordValid: (!!password && passwordValid) });
|
||||||
};
|
};
|
||||||
|
|
||||||
onClose = () => {
|
onClose = () => {
|
||||||
|
|||||||
@@ -22,7 +22,8 @@ type State = {
|
|||||||
user: User,
|
user: User,
|
||||||
mailValidationError: boolean,
|
mailValidationError: boolean,
|
||||||
nameValidationError: boolean,
|
nameValidationError: boolean,
|
||||||
displayNameValidationError: boolean
|
displayNameValidationError: boolean,
|
||||||
|
passwordValid: boolean
|
||||||
};
|
};
|
||||||
|
|
||||||
class UserForm extends React.Component<Props, State> {
|
class UserForm extends React.Component<Props, State> {
|
||||||
@@ -41,7 +42,8 @@ class UserForm extends React.Component<Props, State> {
|
|||||||
},
|
},
|
||||||
mailValidationError: false,
|
mailValidationError: false,
|
||||||
displayNameValidationError: false,
|
displayNameValidationError: false,
|
||||||
nameValidationError: false
|
nameValidationError: false,
|
||||||
|
passwordValid: false
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -61,7 +63,6 @@ class UserForm extends React.Component<Props, State> {
|
|||||||
|
|
||||||
isValid = () => {
|
isValid = () => {
|
||||||
const user = this.state.user;
|
const user = this.state.user;
|
||||||
const passwordValid = this.props.user ? !this.isFalsy(user.password) : true;
|
|
||||||
return !(
|
return !(
|
||||||
this.state.nameValidationError ||
|
this.state.nameValidationError ||
|
||||||
this.state.mailValidationError ||
|
this.state.mailValidationError ||
|
||||||
@@ -69,7 +70,7 @@ class UserForm extends React.Component<Props, State> {
|
|||||||
this.isFalsy(user.name) ||
|
this.isFalsy(user.name) ||
|
||||||
this.isFalsy(user.displayName) ||
|
this.isFalsy(user.displayName) ||
|
||||||
this.isFalsy(user.mail) ||
|
this.isFalsy(user.mail) ||
|
||||||
passwordValid
|
!this.state.passwordValid
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -166,9 +167,10 @@ class UserForm extends React.Component<Props, State> {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
handlePasswordChange = (password: string) => {
|
handlePasswordChange = (password: string, passwordValid: boolean) => {
|
||||||
this.setState({
|
this.setState({
|
||||||
user: { ...this.state.user, password }
|
user: { ...this.state.user, password },
|
||||||
|
passwordValid: !this.isFalsy(password) && passwordValid
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user