diff options
Diffstat (limited to 'src/containers/subscription/SubscriptionFormScreen.js')
-rw-r--r-- | src/containers/subscription/SubscriptionFormScreen.js | 115 |
1 files changed, 115 insertions, 0 deletions
diff --git a/src/containers/subscription/SubscriptionFormScreen.js b/src/containers/subscription/SubscriptionFormScreen.js new file mode 100644 index 000000000..fc6e3c4be --- /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/SubscriptionForm'; | ||
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 | }; | ||