mirror of https://github.com/grafana/grafana.git
Login: Show SAML login button if SAML is enabled (#19591)
* Show SAML login button if SAML is enabled Move logic inside LoginServiceButtons * Prevent from rendering login-oauth div if no login service is enabled
This commit is contained in:
parent
e16064b9b0
commit
a62dea47b4
|
|
@ -41,24 +41,7 @@ export const LoginPage: FC = () => {
|
|||
/>
|
||||
) : null}
|
||||
|
||||
{isOauthEnabled ? (
|
||||
<>
|
||||
<div className="text-center login-divider">
|
||||
<div>
|
||||
<div className="login-divider-line" />
|
||||
</div>
|
||||
<div>
|
||||
<span className="login-divider-text">{disableLoginForm ? null : <span>or</span>}</span>
|
||||
</div>
|
||||
<div>
|
||||
<div className="login-divider-line" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="clearfix" />
|
||||
|
||||
<LoginServiceButtons />
|
||||
</>
|
||||
) : null}
|
||||
<LoginServiceButtons />
|
||||
{!disableUserSignUp ? <UserSignup /> : null}
|
||||
</div>
|
||||
<CSSTransition
|
||||
|
|
|
|||
|
|
@ -46,11 +46,39 @@ export interface LoginServices {
|
|||
[key: string]: LoginService;
|
||||
}
|
||||
|
||||
const LoginDivider = () => {
|
||||
return (
|
||||
<>
|
||||
<div className="text-center login-divider">
|
||||
<div>
|
||||
<div className="login-divider-line" />
|
||||
</div>
|
||||
<div>
|
||||
<span className="login-divider-text">{config.disableLoginForm ? null : <span>or</span>}</span>
|
||||
</div>
|
||||
<div>
|
||||
<div className="login-divider-line" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="clearfix" />
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export const LoginServiceButtons = () => {
|
||||
const keyNames = Object.keys(loginServices());
|
||||
const serviceElements = keyNames.map(key => {
|
||||
const serviceElementsEnabled = keyNames.filter(key => {
|
||||
const service: LoginService = loginServices()[key];
|
||||
return service.enabled ? (
|
||||
return service.enabled;
|
||||
});
|
||||
|
||||
if (serviceElementsEnabled.length === 0) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const serviceElements = serviceElementsEnabled.map(key => {
|
||||
const service: LoginService = loginServices()[key];
|
||||
return (
|
||||
<a
|
||||
key={key}
|
||||
className={`btn btn-medium btn-service btn-service--${service.className || key} login-btn`}
|
||||
|
|
@ -60,8 +88,14 @@ export const LoginServiceButtons = () => {
|
|||
<i className={`btn-service-icon fa fa-${service.icon ? service.icon : key}`} />
|
||||
Sign in with {service.name}
|
||||
</a>
|
||||
) : null;
|
||||
);
|
||||
});
|
||||
|
||||
return <div className="login-oauth text-center">{serviceElements}</div>;
|
||||
const divider = LoginDivider();
|
||||
return (
|
||||
<>
|
||||
{divider}
|
||||
<div className="login-oauth text-center">{serviceElements}</div>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in New Issue