|
@@ -154,9 +154,9 @@ export const LoginForm = (props: LoginFormProps): JSX.Element => {
|
|
|
return (
|
|
return (
|
|
|
<ul className="alert alert-danger">
|
|
<ul className="alert alert-danger">
|
|
|
{errors.map((err, index) => (
|
|
{errors.map((err, index) => (
|
|
|
- <li className={index > 0 ? 'mt-1' : ''}>
|
|
|
|
|
|
|
+ <small className={index > 0 ? 'mt-1' : ''}>
|
|
|
{tWithOpt(err.message, err.args)}
|
|
{tWithOpt(err.message, err.args)}
|
|
|
- </li>
|
|
|
|
|
|
|
+ </small>
|
|
|
))}
|
|
))}
|
|
|
</ul>
|
|
</ul>
|
|
|
);
|
|
);
|
|
@@ -165,17 +165,6 @@ export const LoginForm = (props: LoginFormProps): JSX.Element => {
|
|
|
const renderLocalOrLdapLoginForm = useCallback(() => {
|
|
const renderLocalOrLdapLoginForm = useCallback(() => {
|
|
|
const { isLdapStrategySetup } = props;
|
|
const { isLdapStrategySetup } = props;
|
|
|
|
|
|
|
|
- // separate login errors into two arrays based on error code
|
|
|
|
|
- const [loginErrorListForDangerouslySetInnerHTML, loginErrorList] = separateErrorsBasedOnErrorCode(loginErrors);
|
|
|
|
|
- // Generate login error elements using dangerouslySetInnerHTML
|
|
|
|
|
- const loginErrorElementWithDangerouslySetInnerHTML = generateDangerouslySetErrors(loginErrorListForDangerouslySetInnerHTML);
|
|
|
|
|
- // Generate login error elements using <ul>, <li>
|
|
|
|
|
-
|
|
|
|
|
- const loginErrorElement = (loginErrorList ?? []).length > 0
|
|
|
|
|
- // prioritize loginErrorList because the list should contains new error
|
|
|
|
|
- ? generateSafelySetErrors(loginErrorList)
|
|
|
|
|
- : generateSafelySetErrors(props.externalAccountLoginError != null ? [props.externalAccountLoginError] : []);
|
|
|
|
|
-
|
|
|
|
|
return (
|
|
return (
|
|
|
<>
|
|
<>
|
|
|
{/* !! - DO NOT DELETE HIDDEN ELEMENT - !! -- 7.12 ryoji-s */}
|
|
{/* !! - DO NOT DELETE HIDDEN ELEMENT - !! -- 7.12 ryoji-s */}
|
|
@@ -191,8 +180,6 @@ export const LoginForm = (props: LoginFormProps): JSX.Element => {
|
|
|
<span dangerouslySetInnerHTML={{ __html: t('login.set_env_var_for_logs') }}></span>
|
|
<span dangerouslySetInnerHTML={{ __html: t('login.set_env_var_for_logs') }}></span>
|
|
|
</div>
|
|
</div>
|
|
|
)}
|
|
)}
|
|
|
- {loginErrorElementWithDangerouslySetInnerHTML}
|
|
|
|
|
- {loginErrorElement}
|
|
|
|
|
|
|
|
|
|
<form role="form" onSubmit={handleLoginWithLocalSubmit} id="login-form">
|
|
<form role="form" onSubmit={handleLoginWithLocalSubmit} id="login-form">
|
|
|
<div className="input-group">
|
|
<div className="input-group">
|
|
@@ -253,8 +240,7 @@ export const LoginForm = (props: LoginFormProps): JSX.Element => {
|
|
|
</>
|
|
</>
|
|
|
);
|
|
);
|
|
|
}, [
|
|
}, [
|
|
|
- props, separateErrorsBasedOnErrorCode, loginErrors, generateDangerouslySetErrors, generateSafelySetErrors,
|
|
|
|
|
- isLdapSetupFailed, t, handleLoginWithLocalSubmit, isLoading,
|
|
|
|
|
|
|
+ props, isLdapSetupFailed, t, handleLoginWithLocalSubmit, isLoading,
|
|
|
]);
|
|
]);
|
|
|
|
|
|
|
|
|
|
|
|
@@ -510,6 +496,25 @@ export const LoginForm = (props: LoginFormProps): JSX.Element => {
|
|
|
<div className="col-12 px-md-4 pb-5">
|
|
<div className="col-12 px-md-4 pb-5">
|
|
|
<ReactCardFlip isFlipped={isRegistering} flipDirection="horizontal" cardZIndex="3">
|
|
<ReactCardFlip isFlipped={isRegistering} flipDirection="horizontal" cardZIndex="3">
|
|
|
<div className="front">
|
|
<div className="front">
|
|
|
|
|
+ {/* Error display section - always shown regardless of login method configuration */}
|
|
|
|
|
+ {(() => {
|
|
|
|
|
+ // separate login errors into two arrays based on error code
|
|
|
|
|
+ const [loginErrorListForDangerouslySetInnerHTML, loginErrorList] = separateErrorsBasedOnErrorCode(loginErrors);
|
|
|
|
|
+ // Generate login error elements using dangerouslySetInnerHTML
|
|
|
|
|
+ const loginErrorElementWithDangerouslySetInnerHTML = generateDangerouslySetErrors(loginErrorListForDangerouslySetInnerHTML);
|
|
|
|
|
+ // Generate login error elements - prioritize loginErrorList, fallback to externalAccountLoginError
|
|
|
|
|
+ const loginErrorElement = (loginErrorList ?? []).length > 0
|
|
|
|
|
+ ? generateSafelySetErrors(loginErrorList)
|
|
|
|
|
+ : generateSafelySetErrors(props.externalAccountLoginError != null ? [props.externalAccountLoginError] : []);
|
|
|
|
|
+
|
|
|
|
|
+ return (
|
|
|
|
|
+ <>
|
|
|
|
|
+ {loginErrorElementWithDangerouslySetInnerHTML}
|
|
|
|
|
+ {loginErrorElement}
|
|
|
|
|
+ </>
|
|
|
|
|
+ );
|
|
|
|
|
+ })()}
|
|
|
|
|
+
|
|
|
{isLocalOrLdapStrategiesEnabled && renderLocalOrLdapLoginForm()}
|
|
{isLocalOrLdapStrategiesEnabled && renderLocalOrLdapLoginForm()}
|
|
|
{isLocalOrLdapStrategiesEnabled && isSomeExternalAuthEnabled && (
|
|
{isLocalOrLdapStrategiesEnabled && isSomeExternalAuthEnabled && (
|
|
|
<div className="text-center text-line d-flex align-items-center mb-3">
|
|
<div className="text-center text-line d-flex align-items-center mb-3">
|