forked from grafana/grafana
-
Notifications
You must be signed in to change notification settings - Fork 0
/
LoginPage.tsx
69 lines (65 loc) · 2.24 KB
/
LoginPage.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
// Libraries
import React, { FC } from 'react';
import { CSSTransition } from 'react-transition-group';
// Components
import { UserSignup } from './UserSignup';
import { LoginServiceButtons } from './LoginServiceButtons';
import LoginCtrl from './LoginCtrl';
import { LoginForm } from './LoginForm';
import { ChangePassword } from './ChangePassword';
import { Branding } from 'app/core/components/Branding/Branding';
import { Footer } from 'app/core/components/Footer/Footer';
export const LoginPage: FC = () => {
return (
<Branding.LoginBackground className="login container">
<div className="login-content">
<div className="login-branding">
<Branding.LoginLogo className="login-logo" />
</div>
<LoginCtrl>
{({
loginHint,
passwordHint,
isOauthEnabled,
ldapEnabled,
authProxyEnabled,
disableLoginForm,
disableUserSignUp,
login,
isLoggingIn,
changePassword,
skipPasswordChange,
isChangingPassword,
}) => (
<div className="login-outer-box">
<div className={`login-inner-box ${isChangingPassword ? 'hidden' : ''}`} id="login-view">
{!disableLoginForm ? (
<LoginForm
displayForgotPassword={!(ldapEnabled || authProxyEnabled)}
onSubmit={login}
loginHint={loginHint}
passwordHint={passwordHint}
isLoggingIn={isLoggingIn}
/>
) : null}
<LoginServiceButtons />
{!disableUserSignUp ? <UserSignup /> : null}
</div>
<CSSTransition
appear={true}
mountOnEnter={true}
in={isChangingPassword}
timeout={250}
classNames="login-inner-box"
>
<ChangePassword onSubmit={changePassword} onSkip={skipPasswordChange} focus={isChangingPassword} />
</CSSTransition>
</div>
)}
</LoginCtrl>
<div className="clearfix" />
</div>
<Footer />
</Branding.LoginBackground>
);
};