fix(auth): notify user password requirements [EE-3344] (#7042)

* fix(auth): notify user password requirements [EE-3344]

* fix angular code
fix/EE-3324/password-change-error
itsconquest 2022-06-15 16:01:19 +12:00 committed by GitHub
parent 41107191c3
commit 8059cae8e7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 27 additions and 7 deletions

View File

@ -1,7 +1,15 @@
import { react2angular } from '@/react-tools/react2angular'; import { react2angular } from '@/react-tools/react2angular';
import { usePublicSettings } from '@/portainer/settings/queries'; import { usePublicSettings } from '@/portainer/settings/queries';
export function PasswordCheckHint() { interface Props {
passwordValid: boolean;
forceChangePassword?: boolean;
}
export function PasswordCheckHint({
passwordValid,
forceChangePassword,
}: Props) {
const settingsQuery = usePublicSettings(); const settingsQuery = usePublicSettings();
const minPasswordLength = settingsQuery.data?.RequiredPasswordLength; const minPasswordLength = settingsQuery.data?.RequiredPasswordLength;
@ -12,10 +20,18 @@ export function PasswordCheckHint() {
className="fa fa-exclamation-triangle orange-icon space-right" className="fa fa-exclamation-triangle orange-icon space-right"
aria-hidden="true" aria-hidden="true"
/> />
{forceChangePassword &&
'An administrator has changed your password requirements, '}
The password must be at least {minPasswordLength} characters long. The password must be at least {minPasswordLength} characters long.
{passwordValid && (
<i className="fa fa-check green-icon space-left" aria-hidden="true" />
)}
</p> </p>
</div> </div>
); );
} }
export const PasswordCheckHintAngular = react2angular(PasswordCheckHint, []); export const PasswordCheckHintAngular = react2angular(PasswordCheckHint, [
'passwordValid',
'forceChangePassword',
]);

View File

@ -54,7 +54,7 @@
</div> </div>
</div> </div>
</div> </div>
<password-check-hint ng-if="!form.new_password.$valid || (forceChangePassword && !formValues.newPassword)"></password-check-hint> <password-check-hint password-valid="form.new_password.$valid && formValues.newPassword" force-change-password="forceChangePassword"></password-check-hint>
<div ng-if="userRole === 1"> <div ng-if="userRole === 1">
<p class="text-muted"> <p class="text-muted">
<i class="fa fa-exclamation-circle blue-icon" aria-hidden="true"></i> <i class="fa fa-exclamation-circle blue-icon" aria-hidden="true"></i>

View File

@ -51,6 +51,9 @@ angular.module('portainer.app').controller('AccountController', [
if ($scope.userRole === 1 && newTransition.to().name === 'portainer.settings.authentication') { if ($scope.userRole === 1 && newTransition.to().name === 'portainer.settings.authentication') {
return true; return true;
} }
if (newTransition.to().name === 'portainer.logout') {
return true;
}
if ($scope.forceChangePassword) { if ($scope.forceChangePassword) {
ModalService.confirmForceChangePassword(); ModalService.confirmForceChangePassword();
} }

View File

@ -67,10 +67,11 @@
<!-- !confirm-password-input --> <!-- !confirm-password-input -->
<!-- note --> <!-- note -->
<div class="form-group"> <div class="form-group">
<div class="col-sm-12 text-muted" ng-if="!form.password.$valid"> <div class="col-sm-12 text-muted">
<p> <p>
<i class="fa fa-exclamation-triangle orange-icon space-right" aria-hidden="true"></i> <i class="fa fa-exclamation-triangle orange-icon space-right" aria-hidden="true"></i>
<span>The password must be at least {{ requiredPasswordLength }} characters long.</span> <span>The password must be at least {{ requiredPasswordLength }} characters long.</span>
<i class="fa fa-check green-icon space-left" aria-hidden="true" ng-if="form.password.$valid && formValues.Password"></i>
</p> </p>
</div> </div>
</div> </div>

View File

@ -83,7 +83,7 @@
</div> </div>
</div> </div>
<!-- !confirm-password-input --> <!-- !confirm-password-input -->
<password-check-hint ng-if="!form.new_password.$valid"></password-check-hint> <password-check-hint password-valid="form.new_password.$valid && formValues.newPassword"></password-check-hint>
<div class="form-group"> <div class="form-group">
<div class="col-sm-2"> <div class="col-sm-2">
<button <button

View File

@ -80,10 +80,10 @@
<!-- !confirm-password-input --> <!-- !confirm-password-input -->
<!-- password-check-hint --> <!-- password-check-hint -->
<div class="form-group" ng-if="AuthenticationMethod === 1 && !form.password.$valid"> <div class="form-group" ng-if="AuthenticationMethod === 1">
<div class="col-sm-3 col-lg-2"></div> <div class="col-sm-3 col-lg-2"></div>
<div class="col-sm-8"> <div class="col-sm-8">
<password-check-hint></password-check-hint> <password-check-hint password-valid="form.password.$valid && formValues.Password"></password-check-hint>
</div> </div>
</div> </div>
<!-- ! password-check-hint --> <!-- ! password-check-hint -->