1 | import React from 'react';
|
2 | import { modes } from '../data/constants';
|
3 | import EmailSubOrGiftArticle from './email-sub-or-gift-article';
|
4 | import EmailSubOnlyArticle from './email-sub-only-article';
|
5 | import EmailFreeArticle from './email-free-article';
|
6 |
|
7 | export default class extends React.Component {
|
8 |
|
9 | constructor (props) {
|
10 | super(props)
|
11 | }
|
12 |
|
13 | componentWillMount () {
|
14 | this.setState(this.props.store.getState())
|
15 | this.storeUnsubscribe = this.props.store.subscribe(() => this.setState(this.props.store.getState()))
|
16 | }
|
17 |
|
18 | componentWillUnmount () {
|
19 | this.storeUnsubscribe()
|
20 | }
|
21 |
|
22 | render () {
|
23 | const actions = this.props.actions
|
24 | const dispatch = this.props.dispatch
|
25 | if (this.state.mode === modes.GIFT_OR_SUB) {
|
26 | return (
|
27 | <EmailSubOrGiftArticle
|
28 | isReady={this.state.isReady}
|
29 | isOpen={this.props.isTop ? this.state.isOpenTop : this.state.isOpenBottom}
|
30 | isGift={this.state.isGift}
|
31 | onIsGiftChange={isGift => dispatch(actions.isGiftChange(isGift))}
|
32 | credit={this.state.credit}
|
33 | monthlyAllowance={this.state.monthlyAllowance}
|
34 | emailAddresses={this.state.emailAddresses}
|
35 | emailAddressErrors={this.state.emailAddressErrors}
|
36 | onEmailAddressChange={(index, value) => dispatch(actions.emailAddressChange(index, value))}
|
37 | onAddEmailAddress={() => dispatch(actions.addEmailAddress())}
|
38 | onRemoveEmailAddress={index => dispatch(actions.removeEmailAddress(index))}
|
39 | customMessage={this.props.customMessage}
|
40 | messageText={this.state.messageText}
|
41 | onMessageTyping={(value) => dispatch(actions.messageTextChange(value))}
|
42 | messageLength={this.state.messageLength}
|
43 | onSend={() => dispatch(actions.validateThenSend())}
|
44 | isSending={this.state.isSending}
|
45 | onClose={() => dispatch(this.props.isTop ? actions.closeTop() : actions.closeBottom())}
|
46 | />
|
47 | )
|
48 | } else if (this.state.mode === modes.SUB_ONLY) {
|
49 | return (
|
50 | <EmailSubOnlyArticle
|
51 | isReady={this.state.isReady}
|
52 | isOpen={this.props.isTop ? this.state.isOpenTop : this.state.isOpenBottom}
|
53 | emailAddresses={this.state.emailAddresses}
|
54 | emailAddressErrors={this.state.emailAddressErrors}
|
55 | onEmailAddressChange={(index, value) => dispatch(actions.emailAddressChange(index, value))}
|
56 | onAddEmailAddress={() => dispatch(actions.addEmailAddress())}
|
57 | onRemoveEmailAddress={index => dispatch(actions.removeEmailAddress(index))}
|
58 | customMessage={this.props.customMessage}
|
59 | messageText={this.state.messageText}
|
60 | onMessageTyping={(value) => dispatch(actions.messageTextChange(value))}
|
61 | messageLength={this.state.messageLength}
|
62 | onSend={() => dispatch(actions.validateThenSend())}
|
63 | isSending={this.state.isSending}
|
64 | onClose={() => dispatch(this.props.isTop ? actions.closeTop() : actions.closeBottom())}
|
65 | />
|
66 | )
|
67 | } else if (this.state.mode === modes.FREE) {
|
68 | return (
|
69 | <EmailFreeArticle
|
70 | isReady={this.state.isReady}
|
71 | isOpen={this.props.isTop ? this.state.isOpenTop : this.state.isOpenBottom}
|
72 | emailAddresses={this.state.emailAddresses}
|
73 | emailAddressErrors={this.state.emailAddressErrors}
|
74 | onEmailAddressChange={(index, value) => dispatch(actions.emailAddressChange(index, value))}
|
75 | onAddEmailAddress={() => dispatch(actions.addEmailAddress())}
|
76 | onRemoveEmailAddress={index => dispatch(actions.removeEmailAddress(index))}
|
77 | customMessage={this.props.customMessage}
|
78 | messageText={this.state.messageText}
|
79 | onMessageTyping={(value) => dispatch(actions.messageTextChange(value))}
|
80 | messageLength={this.state.messageLength}
|
81 | onSend={() => dispatch(actions.validateThenSend())}
|
82 | isSending={this.state.isSending}
|
83 | onClose={() => dispatch(this.props.isTop ? actions.closeTop() : actions.closeBottom())}
|
84 | />
|
85 | )
|
86 | }
|
87 | }
|
88 | }
|