Infrastructure/ghost
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-02-10 23:36:14 -05:00
Code Issues Activity

Updated member signin page to show logged in status

Browse source 
no issue
This commit is contained in:
Rish 2019-04-16 22:39:26 +05:30
parent 1211c70eb3
commit 874fceb077
2 changed files with 41 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
core/server/lib/members/static/auth/components/Modal.js
View file

@ -17,6 +17,7 @@ export default class Modal extends Component {
super(); super();
this.state = { this.state = {
error: null, error: null,
showLoggedIn: false,
containerClass: 'gm-page-overlay' containerClass: 'gm-page-overlay'
} }
} }
@ -77,7 +78,7 @@ export default class Modal extends Component {
} }
render(props, state) { render(props, state) {
const { containerClass, error, loadingConfig, paymentConfig, siteConfig } = state; const { containerClass, error, loadingConfig, paymentConfig, siteConfig, showLoggedIn } = state;
const { members } = this.context; const { members } = this.context;
const closeModal = () => this.close(); const closeModal = () => this.close();
@ -89,7 +90,18 @@ export default class Modal extends Component {
this.setState({ error }); this.setState({ error });
}); });
const signin = (data) => this.handleAction(members.signin(data)); // const signin = (data) => this.handleAction(members.signin(data));
const signin = (data) => members.signin(data).then((success) => {
const clearShowLoggedIn = () => {
this.setState({showLoggedIn: false});
this.close();
}
this.setState({showLoggedIn: true}, () => {
window.setTimeout(clearShowLoggedIn, 5000)
});
}, (error) => {
this.setState({ error });
});
const requestReset = (data) => members.requestPasswordReset(data).then((success) => { const requestReset = (data) => members.requestPasswordReset(data).then((success) => {
window.location.hash = 'password-reset-sent'; window.location.hash = 'password-reset-sent';
@ -108,8 +120,8 @@ export default class Modal extends Component {
} }
return ( return (
<Pages className={containerClass} onChange={clearError} onClick={closeModal} stripeConfig={stripeConfig} siteConfig={siteConfig}> <Pages className={containerClass} onChange={clearError} onClick={closeModal} stripeConfig={stripeConfig} siteConfig={siteConfig}>
<SigninPage error={error} hash="" handleSubmit={signup} /> <SigninPage error={error} hash="" handleSubmit={signup} showLoggedIn={showLoggedIn} />
<SigninPage error={error} hash="signin" handleSubmit={signin} /> <SigninPage error={error} hash="signin" handleSubmit={signin} showLoggedIn={showLoggedIn} />
{this.renderSignupPage({ error, stripeConfig, members, signup, closeModal, siteConfig})} {this.renderSignupPage({ error, stripeConfig, members, signup, closeModal, siteConfig})}
{this.renderUpgradePage(props, state)} {this.renderUpgradePage(props, state)}
<SignupCompletePage error={ error } hash="signup-complete" handleSubmit={ closeModal } siteConfig={ siteConfig } /> <SignupCompletePage error={ error } hash="signup-complete" handleSubmit={ closeModal } siteConfig={ siteConfig } />

45
core/server/lib/members/static/auth/pages/SigninPage.js
View file

@ -7,24 +7,29 @@ import { IconRightArrow } from '../components/icons';
import EmailInput from '../components/EmailInput'; import EmailInput from '../components/EmailInput';
import PasswordInput from '../components/PasswordInput'; import PasswordInput from '../components/PasswordInput';
export default ({ error, handleSubmit }) => ( export default ({ error, handleSubmit, showLoggedIn }) => {
<div className="flex flex-column items-center"> let label = showLoggedIn ? (
<div className="gm-modal-form gm-signin-page"> <span><span class="gm-spinner"></span> Logged In </span>
<FormHeader title="" error={error} errorText="Wrong email or password"> ) : "Log in";
<div className="flex justify-between items-baseline"> return (
<h1>Log in</h1> <div className="flex flex-column items-center">
<FormHeaderCTA title="Not a member?" label="Sign up" icon={IconRightArrow} hash="#signup" /> <div className="gm-modal-form gm-signin-page">
</div> <FormHeader title="" error={error} errorText="Wrong email or password">
</FormHeader> <div className="flex justify-between items-baseline">
<Form onSubmit={handleSubmit}> <h1>Log in</h1>
<EmailInput bindTo="email" className="first" /> <FormHeaderCTA title="Not a member?" label="Sign up" icon={IconRightArrow} hash="#signup" />
<PasswordInput bindTo="password" className="gm-forgot-input last"> </div>
<a href="#request-password-reset" className="gm-forgot-link"> </FormHeader>
Forgot <Form onSubmit={handleSubmit}>
</a> <EmailInput bindTo="email" className="first" />
</PasswordInput> <PasswordInput bindTo="password" className="gm-forgot-input last">
<FormSubmit label="Log in" /> <a href="#request-password-reset" className="gm-forgot-link">
</Form> Forgot
</a>
</PasswordInput>
<FormSubmit label={label} />
</Form>
</div>
</div> </div>
</div> )
); };