Updated direct plan checkout without popup

refs https://github.com/TryGhost/Ghost/issues/12365

- Updated direct checkout to load Stripe without opening popup
This commit is contained in:
Rish 2020-11-19 16:04:20 +05:30
parent f7fa4e50e6
commit 2a091ac56d
2 changed files with 13 additions and 9 deletions

View File

@ -9,7 +9,7 @@ import * as Fixtures from './utils/fixtures';
import ActionHandler from './actions';
import './App.css';
import NotificationParser from './utils/notifications';
import {createPopupNotification, isComplimentaryMember} from './utils/helpers';
import {capitalize, createPopupNotification, hasPlan, isComplimentaryMember} from './utils/helpers';
const React = require('react');
const DEV_MODE_DATA = {
@ -99,7 +99,7 @@ export default class App extends React.Component {
try {
// Fetch data from API, links, preview, dev sources
const {site, member, page, showPopup, popupNotification, lastPage, pageQuery} = await this.fetchData();
this.setState({
const state = {
site,
member,
page,
@ -109,7 +109,13 @@ export default class App extends React.Component {
popupNotification,
action: 'init:success',
initStatus: 'success'
});
};
if (!member && ['monthly', 'yearly'].includes(pageQuery) && hasPlan({site, plan: pageQuery})) {
this.onAction('signup', {plan: capitalize(pageQuery)});
}
this.setState(state);
// Listen to preview mode changes
this.hashHandler = () => {
@ -232,7 +238,7 @@ export default class App extends React.Component {
const {page, pageQuery} = this.getPageFromLinkPath(pagePath) || {};
const lastPage = ['accountPlan', 'accountProfile'].includes(page) ? 'accountHome' : null;
return {
showPopup: true,
showPopup: ['monthly', 'yearly'].includes(pageQuery) ? false : true,
...(page ? {page} : {}),
...(pageQuery ? {pageQuery} : {}),
...(lastPage ? {lastPage} : {})
@ -370,6 +376,7 @@ export default class App extends React.Component {
page: 'accountProfile'
};
}
return {};
}
/**Get Accent color from site data, fallback to default*/

View File

@ -5,7 +5,7 @@ import PlansSection from '../common/PlansSection';
import InputForm from '../common/InputForm';
import {ValidateInputForm} from '../../utils/form';
import CalculateDiscount from '../../utils/discount';
import {capitalize, getSitePlans, hasOnlyFreePlan, hasPlan} from '../../utils/helpers';
import {getSitePlans, hasOnlyFreePlan} from '../../utils/helpers';
import {ReactComponent as InvitationIcon} from '../../images/icons/invitation.svg';
const React = require('react');
@ -149,7 +149,7 @@ class SignupPage extends React.Component {
}
componentDidMount() {
const {member, site, pageQuery = ''} = this.context;
const {member} = this.context;
if (member) {
this.context.onAction('switchPage', {
page: 'accountHome'
@ -159,9 +159,6 @@ class SignupPage extends React.Component {
// Handle the default plan if not set
const plans = this.getPlans();
if (['monthly', 'yearly'].includes(pageQuery) && hasPlan({site, plan: pageQuery})) {
this.context.onAction('signup', {plan: capitalize(pageQuery)});
}
const selectedPlan = this.state.plan;
const defaultSelectedPlan = this.getDefaultSelectedPlan(plans, this.state.plan);
if (defaultSelectedPlan !== selectedPlan) {