From 43adc432f5cfe27818be2a775e798352613e6d54 Mon Sep 17 00:00:00 2001 From: Peter Zimon Date: Tue, 16 Apr 2019 17:36:37 +0200 Subject: [PATCH] Members refinements (#10689) * Updated close animation speed for members pages * Updated responsive styles for members mobile screens * Adding spinner CSS to members pages * Adding members signup complete page --- .../static/auth/components/Modal.js | 14 +++++++--- .../static/auth/components/Pages.js | 6 ++--- .../static/auth/components/icons.js | 4 +++ .../static/auth/pages/SignupCompletePage.js | 17 ++++++++++++ .../static/auth/pages/StripeSubscribePage.js | 2 +- .../static/auth/styles/components.css | 27 ++++++++++++++++--- .../members-api/static/auth/styles/screen.css | 19 ++++++++----- 7 files changed, 73 insertions(+), 16 deletions(-) create mode 100644 ghost/members-api/static/auth/pages/SignupCompletePage.js diff --git a/ghost/members-api/static/auth/components/Modal.js b/ghost/members-api/static/auth/components/Modal.js index 32887f2ae6..861e42fc73 100644 --- a/ghost/members-api/static/auth/components/Modal.js +++ b/ghost/members-api/static/auth/components/Modal.js @@ -4,6 +4,7 @@ import Pages from './Pages'; import SigninPage from '../pages/SigninPage'; import SignupPage from '../pages/SignupPage'; +import SignupCompletePage from '../pages/SignupCompletePage'; import RequestPasswordResetPage from '../pages/RequestPasswordResetPage'; import PasswordResetSentPage from '../pages/PasswordResetSentPage'; import ResetPasswordPage from '../pages/ResetPasswordPage'; @@ -48,7 +49,7 @@ export default class Modal extends Component { if (stripeConfig) { const createAccountWithSubscription = (data) => members.signup(data).then((success) => { members.createSubscription(data).then((success) => { - this.close(); + window.location.hash = 'signup-complete'; }, (error) => { this.setState({ error: "Unable to confirm payment" }); }); @@ -82,8 +83,14 @@ export default class Modal extends Component { const closeModal = () => this.close(); const clearError = () => this.setState({ error: null }); + const signup = (data) => members.signup(data).then((success) => { + window.location.hash = 'signup-complete'; + }, (error) => { + this.setState({ error }); + }); + const signin = (data) => this.handleAction(members.signin(data)); - const signup = (data) => this.handleAction(members.signup(data)); + const requestReset = (data) => members.requestPasswordReset(data).then((success) => { window.location.hash = 'password-reset-sent'; }, (error) => { @@ -103,8 +110,9 @@ export default class Modal extends Component { - {this.renderSignupPage({error, stripeConfig, members, signup, closeModal, siteConfig})} + {this.renderSignupPage({ error, stripeConfig, members, signup, closeModal, siteConfig})} {this.renderUpgradePage(props, state)} + diff --git a/ghost/members-api/static/auth/components/Pages.js b/ghost/members-api/static/auth/components/Pages.js index 437b01fe0c..a6285535b3 100644 --- a/ghost/members-api/static/auth/components/Pages.js +++ b/ghost/members-api/static/auth/components/Pages.js @@ -54,9 +54,9 @@ export default class Pages extends Component {
e.stopPropagation()}> {this.filterChildren(children, state)}
- - ); diff --git a/ghost/members-api/static/auth/components/icons.js b/ghost/members-api/static/auth/components/icons.js index d767ab78d1..43c1495647 100644 --- a/ghost/members-api/static/auth/components/icons.js +++ b/ghost/members-api/static/auth/components/icons.js @@ -25,4 +25,8 @@ export const IconRightArrow = ( export const GhostLogo = ( ghost-logo +); + +export const IconSignupComplete = ( + SignupComplete ); \ No newline at end of file diff --git a/ghost/members-api/static/auth/pages/SignupCompletePage.js b/ghost/members-api/static/auth/pages/SignupCompletePage.js new file mode 100644 index 0000000000..8f517801c3 --- /dev/null +++ b/ghost/members-api/static/auth/pages/SignupCompletePage.js @@ -0,0 +1,17 @@ +import FormHeader from '../components/FormHeader'; +import FormSubmit from '../components/FormSubmit'; +import { IconSignupComplete } from '../components/icons'; +import Form from '../components/Form'; + +export default ({ error, handleSubmit, siteConfig }) => ( +
+
+
+ { IconSignupComplete } +

Sign up complete

+

Thank you for signing up for { siteConfig.title }! Now you have access to the full content of the site.

+
+ + +
+); diff --git a/ghost/members-api/static/auth/pages/StripeSubscribePage.js b/ghost/members-api/static/auth/pages/StripeSubscribePage.js index 29ee1efe35..1a448c6972 100644 --- a/ghost/members-api/static/auth/pages/StripeSubscribePage.js +++ b/ghost/members-api/static/auth/pages/StripeSubscribePage.js @@ -114,9 +114,9 @@ export default class StripePaymentPage extends Component { } : {}; return (