85 lines
2.6 KiB
JavaScript
Executable file
85 lines
2.6 KiB
JavaScript
Executable file
/* @flow */
|
|
import React from 'react';
|
|
import Flux from '../../lib/flux';
|
|
import BillingInfoStore from '../../stores/BillingInfoStore';
|
|
import UserStore from '../../stores/UserStore';
|
|
import UserSettingsStore from '../../stores/UserSettingsStore';
|
|
import StreamerModeStore from '../../stores/StreamerModeStore';
|
|
import BillingActionCreators from '../../actions/BillingActionCreators';
|
|
import AnalyticsUtils from '../../utils/AnalyticsUtils';
|
|
import StreamerModeEnabled from '../StreamerModeEnabled';
|
|
import SplashHeader from '../premium/SplashHeader';
|
|
import SubscriptionDetails from '../premium/SubscriptionDetails';
|
|
import PremiumFeatures from '../premium/PremiumFeatures';
|
|
import BillingHistory from '../premium/BillingHistory';
|
|
import Spinner from '../../uikit/Spinner';
|
|
import '../../styles/subscription_settings.styl';
|
|
import '../../styles/alert_premium.styl';
|
|
|
|
class UserSettingsPremium extends React.PureComponent {
|
|
renderHeader() {
|
|
const {premiumSubscription, busy, paymentSource, locale, isClaimed, isVerified} = this.props;
|
|
if (!premiumSubscription) {
|
|
return <SplashHeader isClaimed={isClaimed} isVerified={isVerified} />;
|
|
}
|
|
return (
|
|
<SubscriptionDetails
|
|
premiumSubscription={premiumSubscription}
|
|
paymentSource={paymentSource}
|
|
busy={busy}
|
|
locale={locale}
|
|
/>
|
|
);
|
|
}
|
|
|
|
renderBody() {
|
|
const {billingHistory, locale, theme} = this.props;
|
|
if (!billingHistory || !billingHistory.length) {
|
|
return <PremiumFeatures theme={theme} />;
|
|
}
|
|
return <BillingHistory billingHistory={billingHistory} locale={locale} />;
|
|
}
|
|
|
|
componentDidMount() {
|
|
BillingActionCreators.getBillingInfo();
|
|
AnalyticsUtils.track('premium_page_opened');
|
|
}
|
|
|
|
render() {
|
|
const {syncing, hide} = this.props;
|
|
if (hide) {
|
|
return <StreamerModeEnabled />;
|
|
}
|
|
if (syncing) {
|
|
return (
|
|
<div className="premium-settings v2 loading">
|
|
<Spinner />
|
|
</div>
|
|
);
|
|
}
|
|
return (
|
|
<div className="premium-settings v2">
|
|
{this.renderHeader()}
|
|
{this.renderBody()}
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default Flux.connectStores([UserSettingsStore, BillingInfoStore, UserStore, StreamerModeStore], () => {
|
|
const billingState = BillingInfoStore.getState();
|
|
const currentUser = UserStore.getCurrentUser();
|
|
return {
|
|
theme: UserSettingsStore.theme,
|
|
locale: UserSettingsStore.locale,
|
|
hide: StreamerModeStore.enabled,
|
|
isClaimed: currentUser.email,
|
|
isVerified: currentUser.verified,
|
|
...billingState,
|
|
};
|
|
})(UserSettingsPremium);
|
|
|
|
|
|
|
|
// WEBPACK FOOTER //
|
|
// ./discord_app/components/user_settings/UserSettingsPremium.js
|