1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-07 01:41:39 +00:00

['settings' page] WebDav Password: redesigned the 'update password' dialog; fixup & improvement

This commit is contained in:
llj
2022-02-17 15:30:06 +08:00
parent 7ff103f69c
commit 57921f1b11
5 changed files with 30 additions and 31 deletions

View File

@@ -269,19 +269,19 @@ class GenerateShareLink extends React.Component {
// validate password
if (isShowPasswordInput) {
if (password.length === 0) {
this.setState({errorInfo: 'Please enter password'});
this.setState({errorInfo: gettext('Please enter a password.')});
return false;
}
if (password.length < shareLinkPasswordMinLength) {
this.setState({errorInfo: 'Password is too short'});
this.setState({errorInfo: gettext('The password is too short.')});
return false;
}
if (password !== passwdnew) {
this.setState({errorInfo: 'Passwords don\'t match'});
this.setState({errorInfo: gettext('Passwords don\'t match')});
return false;
}
if (Utils.getStrengthLevel(password) < shareLinkPasswordStrengthLevel) {
this.setState({errorInfo: gettext('Password is too weak, should have at least {shareLinkPasswordStrengthLevel} of the following: num, upper letter, lower letter and other symbols'.replace('{shareLinkPasswordStrengthLevel}', shareLinkPasswordStrengthLevel))});
this.setState({errorInfo: gettext('The password is too weak. It should include at least {passwordStrengthLevel} of the following: number, upper letter, lower letter and other symbols.').replace('{passwordStrengthLevel}', shareLinkPasswordStrengthLevel)});
return false;
}
}
@@ -371,9 +371,9 @@ class GenerateShareLink extends React.Component {
return <Loading />;
}
let passwordLengthTip = gettext('(at least {passwordLength} characters and has {shareLinkPasswordStrengthLevel} of the following: num, upper letter, lower letter and other symbols)');
passwordLengthTip = passwordLengthTip.replace('{passwordLength}', shareLinkPasswordMinLength)
.replace('{shareLinkPasswordStrengthLevel}', shareLinkPasswordStrengthLevel);
let passwordLengthTip = gettext('(at least {passwordMinLength} characters and includes {passwordStrengthLevel} of the following: number, upper letter, lower letter and other symbols)');
passwordLengthTip = passwordLengthTip.replace('{passwordMinLength}', shareLinkPasswordMinLength)
.replace('{passwordStrengthLevel}', shareLinkPasswordStrengthLevel);
const { userPerm } = this.props;
const { isCustomPermission } = Utils.getUserPermission(userPerm);

View File

@@ -151,11 +151,11 @@ class GenerateUploadLink extends React.Component {
// check password params
if (showPasswordInput) {
if (password.length === 0) {
this.setState({errorInfo: gettext('Please enter password')});
this.setState({errorInfo: gettext('Please enter a password.')});
return false;
}
if (password.length < shareLinkPasswordMinLength) {
this.setState({errorInfo: gettext('Password is too short')});
this.setState({errorInfo: gettext('The password is too short.')});
return false;
}
if (password !== passwordnew) {
@@ -163,7 +163,7 @@ class GenerateUploadLink extends React.Component {
return false;
}
if (Utils.getStrengthLevel(password) < shareLinkPasswordStrengthLevel) {
this.setState({errorInfo: gettext('Password is too weak, should have at least {shareLinkPasswordStrengthLevel} of the following: num, upper letter, lower letter and other symbols'.replace('{shareLinkPasswordStrengthLevel}', shareLinkPasswordStrengthLevel))});
this.setState({errorInfo: gettext('The password is too weak. It should include at least {passwordStrengthLevel} of the following: number, upper letter, lower letter and other symbols.').replace('{passwordStrengthLevel}', shareLinkPasswordStrengthLevel)});
return false;
}
}
@@ -267,9 +267,9 @@ class GenerateUploadLink extends React.Component {
const { isSendLinkShown } = this.state;
let passwordLengthTip = gettext('(at least {passwordLength} characters and has {shareLinkPasswordStrengthLevel} of the following: num, upper letter, lower letter and other symbols)');
passwordLengthTip = passwordLengthTip.replace('{passwordLength}', shareLinkPasswordMinLength)
.replace('{shareLinkPasswordStrengthLevel}', shareLinkPasswordStrengthLevel);
let passwordLengthTip = gettext('(at least {passwordMinLength} characters and includes {passwordStrengthLevel} of the following: number, upper letter, lower letter and other symbols)');
passwordLengthTip = passwordLengthTip.replace('{passwordMinLength}', shareLinkPasswordMinLength)
.replace('{passwordStrengthLevel}', shareLinkPasswordStrengthLevel);
if (this.state.sharedUploadInfo) {
let sharedUploadInfo = this.state.sharedUploadInfo;

View File

@@ -3,7 +3,6 @@ import PropTypes from 'prop-types';
import { Modal, ModalHeader, ModalBody, ModalFooter, Alert, Button, Input, InputGroup, InputGroupAddon } from 'reactstrap';
import { gettext } from '../../utils/constants';
import { Utils } from '../../utils/utils';
const { webdavSecretMinLength, webdavSecretStrengthLevel } = window.app.pageOptions;
const propTypes = {
password: PropTypes.string.isRequired,
@@ -11,31 +10,33 @@ const propTypes = {
toggle: PropTypes.func.isRequired
};
const { webdavSecretMinLength, webdavSecretStrengthLevel } = window.app.pageOptions;
class UpdateWebdavPassword extends Component {
constructor(props) {
super(props);
this.state = {
errorInfo: '',
password: this.props.password,
isPasswordVisible: false,
btnDisabled: false
btnDisabled: false,
errMsg: ''
};
}
submit = () => {
if (this.state.password.length === 0) {
this.setState({errorInfo: 'Please enter password'});
this.setState({errMsg: gettext('Please enter a password.')});
return false;
}
if (this.state.password.length < webdavSecretMinLength) {
this.setState({errorInfo: 'Password is too short'});
this.setState({errMsg: gettext('The password is too short.')});
return false;
}
if (Utils.getStrengthLevel(this.state.password) < webdavSecretStrengthLevel) {
this.setState({errorInfo: gettext('Password is too weak, should have at least {webdavSecretStrengthLevel} of the following: num, upper letter, lower letter and other symbols'.replace('{webdavSecretStrengthLevel}', webdavSecretStrengthLevel))});
this.setState({errMsg: gettext('The password is too weak. It should include at least {passwordStrengthLevel} of the following: number, upper letter, lower letter and other symbols.').replace('{passwordStrengthLevel}', webdavSecretStrengthLevel)});
return false;
}
@@ -43,12 +44,11 @@ class UpdateWebdavPassword extends Component {
btnDisabled: true
});
this.props.updatePassword(this.state.password);
this.props.updatePassword(this.state.password.trim());
}
handleInputChange = (e) => {
let passwd = e.target.value.trim();
this.setState({password: passwd});
this.setState({password: e.target.value});
}
togglePasswordVisible = () => {
@@ -67,24 +67,23 @@ class UpdateWebdavPassword extends Component {
render() {
const { toggle } = this.props;
let passwordLengthTip = gettext('(at least {passwordLength} characters and has {shareLinkPasswordStrengthLevel} of the following: num, upper letter, lower letter and other symbols)');
passwordLengthTip = passwordLengthTip.replace('{passwordLength}', webdavSecretMinLength)
.replace('{shareLinkPasswordStrengthLevel}', webdavSecretStrengthLevel);
const passwordTip = gettext('(at least {passwordMinLength} characters and includes {passwordStrengthLevel} of the following: number, upper letter, lower letter and other symbols)').replace('{passwordMinLength}', webdavSecretMinLength).replace('{passwordStrengthLevel}', webdavSecretStrengthLevel);
return (
<Modal centered={true} isOpen={true} toggle={toggle}>
<ModalHeader toggle={toggle}>{gettext('WebDav Password')}</ModalHeader>
<span className="tip">{passwordLengthTip}</span>
<ModalBody>
<InputGroup className="">
<InputGroup>
<Input type={this.state.isPasswordVisible ? 'text' : 'password'} value={this.state.password} onChange={this.handleInputChange} autoComplete="new-password"/>
<InputGroupAddon addonType="append">
<Button onClick={this.togglePasswordVisible}><i className={`fas ${this.state.isPasswordVisible ? 'fa-eye': 'fa-eye-slash'}`}></i></Button>
<Button onClick={this.generatePassword}><i className="fas fa-magic"></i></Button>
</InputGroupAddon>
</InputGroup>
<p className="form-text text-muted m-0">{passwordTip}</p>
{this.state.errMsg && <Alert color="danger" className="m-0 mt-2">{gettext(this.state.errMsg)}</Alert>}
</ModalBody>
<ModalFooter>
{this.state.errorInfo && <Alert color="danger" className="mt-2">{gettext(this.state.errorInfo)}</Alert>}
<Button color="secondary" onClick={toggle}>{gettext('Cancel')}</Button>
<Button color="primary" onClick={this.submit} disabled={this.state.btnDisabled}>{gettext('Submit')}</Button>
</ModalFooter>