diff --git a/frontend/web/components/modals/Payment.js b/frontend/web/components/modals/Payment.js index b2f5a95f799d..b1dcd50b7fbb 100644 --- a/frontend/web/components/modals/Payment.js +++ b/frontend/web/components/modals/Payment.js @@ -6,6 +6,7 @@ import Constants from 'common/constants' import InfoMessage from 'components/InfoMessage' import Icon from 'components/Icon' import firstpromoter from 'project/firstPromoter' +import Utils from 'common/utils/utils' const PaymentButton = (props) => { const activeSubscription = AccountStore.getOrganisationPlan( @@ -744,29 +745,45 @@ const Payment = class extends Component { } } +Payment.propTypes = {} +export const onPaymentLoad = () => { + const planId = API.getCookie('plan') + let link + if (planId && Utils.getFlagsmithHasFeature('payments_enabled')) { + ;(function () { + // Create a link element with data-cb-plan-id attribute + link = document.createElement('a') + link.setAttribute('data-cb-type', 'checkout') + link.setAttribute('data-cb-plan-id', planId) + link.setAttribute('href', 'javascript:void(0)') + // Append the link to the body + document.body.appendChild(link) + })() + // API.setCookie('plan', null) + } + Chargebee.init({ + site: Project.chargebee.site, + }) + Chargebee.registerAgain() + firstpromoter() + Chargebee.getInstance().setCheckoutCallbacks(() => ({ + success: (hostedPageId) => { + AppActions.updateSubscription(hostedPageId) + }, + })) + if (link) { + link.click() + document.body.removeChild(link) + API.setCookie('plan', null) + } +} + const WrappedPayment = makeAsyncScriptLoader( 'https://js.chargebee.com/v2/chargebee.js', { removeOnUnmount: true, }, )(ConfigProvider(Payment)) - -Payment.propTypes = {} - -module.exports = (props) => ( - { - Chargebee.init({ - site: Project.chargebee.site, - }) - Chargebee.registerAgain() - firstpromoter() - Chargebee.getInstance().setCheckoutCallbacks(() => ({ - success: (hostedPageId) => { - AppActions.updateSubscription(hostedPageId) - }, - })) - }} - /> +export default (props) => ( + ) diff --git a/frontend/web/components/pages/FeaturesPage.js b/frontend/web/components/pages/FeaturesPage.js index cd61e877d7fb..bc2a28d0eded 100644 --- a/frontend/web/components/pages/FeaturesPage.js +++ b/frontend/web/components/pages/FeaturesPage.js @@ -23,6 +23,9 @@ import EnvironmentDocumentCodeHelp from 'components/EnvironmentDocumentCodeHelp' import TableOwnerFilter from 'components/tables/TableOwnerFilter' import TableGroupsFilter from 'components/tables/TableGroupsFilter' import TableValueFilter from 'components/tables/TableValueFilter' +import Utils from 'common/utils/utils' +import makeAsyncScriptLoader from 'react-async-script' +import { onPaymentLoad } from 'components/modals/Payment' const FeaturesPage = class extends Component { static displayName = 'FeaturesPage' @@ -711,5 +714,14 @@ const FeaturesPage = class extends Component { } FeaturesPage.propTypes = {} +const InnerComponent = ConfigProvider(FeaturesPage) -module.exports = ConfigProvider(FeaturesPage) +const WrappedPayment = makeAsyncScriptLoader( + 'https://js.chargebee.com/v2/chargebee.js', + { + removeOnUnmount: true, + }, +)(InnerComponent) +export default (props) => ( + +) diff --git a/frontend/web/components/pages/HomePage.js b/frontend/web/components/pages/HomePage.js index ac6c710b8894..7317aadc21ec 100644 --- a/frontend/web/components/pages/HomePage.js +++ b/frontend/web/components/pages/HomePage.js @@ -65,6 +65,10 @@ const HomePage = class extends React.Component { } componentDidMount() { + const plan = Utils.fromParam().plan + if (plan) { + API.setCookie('plan', plan) + } if ( Project.albacross && this.props.location.pathname.indexOf('signup') !== -1