diff options
Diffstat (limited to 'src/containers/subscription')
-rw-r--r-- | src/containers/subscription/SubscriptionFormScreen.js | 115 | ||||
-rw-r--r-- | src/containers/subscription/SubscriptionPopupScreen.js | 43 |
2 files changed, 158 insertions, 0 deletions
diff --git a/src/containers/subscription/SubscriptionFormScreen.js b/src/containers/subscription/SubscriptionFormScreen.js new file mode 100644 index 000000000..dcac30989 --- /dev/null +++ b/src/containers/subscription/SubscriptionFormScreen.js | |||
@@ -0,0 +1,115 @@ | |||
1 | import { remote } from 'electron'; | ||
2 | import React, { Component } from 'react'; | ||
3 | import PropTypes from 'prop-types'; | ||
4 | import { inject, observer } from 'mobx-react'; | ||
5 | |||
6 | import PaymentStore from '../../stores/PaymentStore'; | ||
7 | |||
8 | import SubscriptionForm from '../../components/subscription/Subscription'; | ||
9 | |||
10 | const { BrowserWindow } = remote; | ||
11 | |||
12 | @inject('stores', 'actions') @observer | ||
13 | export default class SubscriptionFormScreen extends Component { | ||
14 | static propTypes = { | ||
15 | onCloseWindow: PropTypes.func, | ||
16 | content: PropTypes.oneOrManyChildElements, | ||
17 | showSkipOption: PropTypes.bool, | ||
18 | skipAction: PropTypes.func, | ||
19 | skipButtonLabel: PropTypes.string, | ||
20 | hideInfo: PropTypes.bool, | ||
21 | } | ||
22 | |||
23 | static defaultProps = { | ||
24 | onCloseWindow: () => null, | ||
25 | content: '', | ||
26 | showSkipOption: false, | ||
27 | skipAction: () => null, | ||
28 | skipButtonLabel: '', | ||
29 | hideInfo: false, | ||
30 | } | ||
31 | |||
32 | async handlePayment(plan) { | ||
33 | const { | ||
34 | actions, | ||
35 | stores, | ||
36 | onCloseWindow, | ||
37 | } = this.props; | ||
38 | |||
39 | const interval = plan; | ||
40 | |||
41 | const { id } = stores.payment.plan[interval]; | ||
42 | actions.payment.createHostedPage({ | ||
43 | planId: id, | ||
44 | }); | ||
45 | |||
46 | const hostedPage = await stores.payment.createHostedPageRequest; | ||
47 | const url = `file://${__dirname}/../../index.html#/payment/${encodeURIComponent(hostedPage.url)}`; | ||
48 | |||
49 | if (hostedPage.url) { | ||
50 | const paymentWindow = new BrowserWindow({ | ||
51 | parent: remote.getCurrentWindow(), | ||
52 | modal: true, | ||
53 | title: '🔒 Franz Supporter License', | ||
54 | width: 600, | ||
55 | height: window.innerHeight - 100, | ||
56 | maxWidth: 600, | ||
57 | minWidth: 600, | ||
58 | webPreferences: { | ||
59 | nodeIntegration: true, | ||
60 | }, | ||
61 | }); | ||
62 | paymentWindow.loadURL(url); | ||
63 | |||
64 | paymentWindow.on('closed', () => { | ||
65 | onCloseWindow(); | ||
66 | }); | ||
67 | } | ||
68 | } | ||
69 | |||
70 | render() { | ||
71 | const { | ||
72 | content, | ||
73 | actions, | ||
74 | stores, | ||
75 | showSkipOption, | ||
76 | skipAction, | ||
77 | skipButtonLabel, | ||
78 | hideInfo, | ||
79 | } = this.props; | ||
80 | return ( | ||
81 | <SubscriptionForm | ||
82 | plan={stores.payment.plan} | ||
83 | // form={this.prepareForm(stores.payment.plan)} | ||
84 | isLoading={stores.payment.plansRequest.isExecuting} | ||
85 | retryPlanRequest={() => stores.payment.plansRequest.reload()} | ||
86 | isCreatingHostedPage={stores.payment.createHostedPageRequest.isExecuting} | ||
87 | handlePayment={price => this.handlePayment(price)} | ||
88 | content={content} | ||
89 | error={stores.payment.plansRequest.isError} | ||
90 | showSkipOption={showSkipOption} | ||
91 | skipAction={skipAction} | ||
92 | skipButtonLabel={skipButtonLabel} | ||
93 | hideInfo={hideInfo} | ||
94 | openExternalUrl={actions.app.openExternalUrl} | ||
95 | /> | ||
96 | ); | ||
97 | } | ||
98 | } | ||
99 | |||
100 | SubscriptionFormScreen.wrappedComponent.propTypes = { | ||
101 | actions: PropTypes.shape({ | ||
102 | app: PropTypes.shape({ | ||
103 | openExternalUrl: PropTypes.func.isRequired, | ||
104 | }).isRequired, | ||
105 | payment: PropTypes.shape({ | ||
106 | createHostedPage: PropTypes.func.isRequired, | ||
107 | }).isRequired, | ||
108 | user: PropTypes.shape({ | ||
109 | update: PropTypes.func.isRequired, | ||
110 | }).isRequired, | ||
111 | }).isRequired, | ||
112 | stores: PropTypes.shape({ | ||
113 | payment: PropTypes.instanceOf(PaymentStore).isRequired, | ||
114 | }).isRequired, | ||
115 | }; | ||
diff --git a/src/containers/subscription/SubscriptionPopupScreen.js b/src/containers/subscription/SubscriptionPopupScreen.js new file mode 100644 index 000000000..bb0603170 --- /dev/null +++ b/src/containers/subscription/SubscriptionPopupScreen.js | |||
@@ -0,0 +1,43 @@ | |||
1 | import React, { Component } from 'react'; | ||
2 | import PropTypes from 'prop-types'; | ||
3 | import { inject, observer } from 'mobx-react'; | ||
4 | |||
5 | import SubscriptionPopup from '../../components/subscription/SubscriptionPopup'; | ||
6 | |||
7 | |||
8 | @inject('stores', 'actions') @observer | ||
9 | export default class SubscriptionPopupScreen extends Component { | ||
10 | state = { | ||
11 | complete: false, | ||
12 | }; | ||
13 | |||
14 | completeCheck(event) { | ||
15 | const { url } = event; | ||
16 | |||
17 | if (url.includes('recurly') && url.includes('confirmation')) { | ||
18 | this.setState({ | ||
19 | complete: true, | ||
20 | }); | ||
21 | } | ||
22 | } | ||
23 | |||
24 | render() { | ||
25 | return ( | ||
26 | <SubscriptionPopup | ||
27 | url={this.props.router.params.url} | ||
28 | closeWindow={() => window.close()} | ||
29 | completeCheck={e => this.completeCheck(e)} | ||
30 | isCompleted={this.state.complete} | ||
31 | /> | ||
32 | ); | ||
33 | } | ||
34 | } | ||
35 | |||
36 | |||
37 | SubscriptionPopupScreen.wrappedComponent.propTypes = { | ||
38 | router: PropTypes.shape({ | ||
39 | params: PropTypes.shape({ | ||
40 | url: PropTypes.string.isRequired, | ||
41 | }).isRequired, | ||
42 | }).isRequired, | ||
43 | }; | ||