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:
@@ -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);
|
||||
|
@@ -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;
|
||||
|
@@ -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>
|
||||
|
Reference in New Issue
Block a user