mirror of https://github.com/portainer/portainer
fix(auth): notify user password requirements [EE-3344] (#7042)
* fix(auth): notify user password requirements [EE-3344] * fix angular codefix/EE-3324/password-change-error
parent
41107191c3
commit
8059cae8e7
|
@ -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',
|
||||||
|
]);
|
||||||
|
|
|
@ -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>
|
||||||
|
|
|
@ -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();
|
||||||
}
|
}
|
||||||
|
|
|
@ -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>
|
||||||
|
|
|
@ -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
|
||||||
|
|
|
@ -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 -->
|
||||||
|
|
Loading…
Reference in New Issue