import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { observer, PropTypes as MobxPropTypes } from 'mobx-react'; import { defineMessages, intlShape } from 'react-intl'; import ReactTooltip from 'react-tooltip'; import { ProBadge, H2, H1, H3, } from '@meetfranz/ui'; import moment from 'moment'; import Loader from '../../ui/Loader'; import Button from '../../ui/Button'; import Infobox from '../../ui/Infobox'; import SubscriptionForm from '../../../containers/subscription/SubscriptionFormScreen'; import { i18nPlanName } from '../../../helpers/plan-helpers'; const messages = defineMessages({ headline: { id: 'settings.account.headline', defaultMessage: '!!!Account', }, headlineSubscription: { id: 'settings.account.headlineSubscription', defaultMessage: '!!!Your Subscription', }, headlineUpgrade: { id: 'settings.account.headlineTrialUpgrade', defaultMessage: '!!!Get the free 14 day Franz Professional Trial', }, headlineDangerZone: { id: 'settings.account.headlineDangerZone', defaultMessage: '!!Danger Zone', }, manageSubscriptionButtonLabel: { id: 'settings.account.manageSubscription.label', defaultMessage: '!!!Manage your subscription', }, accountTypeBasic: { id: 'settings.account.accountType.basic', defaultMessage: '!!!Basic Account', }, accountTypePremium: { id: 'settings.account.accountType.premium', defaultMessage: '!!!Premium Supporter Account', }, accountEditButton: { id: 'settings.account.account.editButton', defaultMessage: '!!!Edit Account', }, invoicesButton: { id: 'settings.account.headlineInvoices', defaultMessage: '!!Invoices', }, invoiceDownload: { id: 'settings.account.invoiceDownload', defaultMessage: '!!!Download', }, userInfoRequestFailed: { id: 'settings.account.userInfoRequestFailed', defaultMessage: '!!!Could not load user information', }, tryReloadUserInfoRequest: { id: 'settings.account.tryReloadUserInfoRequest', defaultMessage: '!!!Try again', }, deleteAccount: { id: 'settings.account.deleteAccount', defaultMessage: '!!!Delete account', }, deleteInfo: { id: 'settings.account.deleteInfo', defaultMessage: '!!!If you don\'t need your Franz account any longer, you can delete your account and all related data here.', }, deleteEmailSent: { id: 'settings.account.deleteEmailSent', defaultMessage: '!!!You have received an email with a link to confirm your account deletion. Your account and data cannot be restored!', }, trial: { id: 'settings.account.trial', defaultMessage: '!!!Free Trial', }, yourLicense: { id: 'settings.account.yourLicense', defaultMessage: '!!!Your license:', }, trialEndsIn: { id: 'settings.account.trialEndsIn', defaultMessage: '!!!Your free trial ends in {duration}.', }, trialUpdateBillingInformation: { id: 'settings.account.trialUpdateBillingInfo', defaultMessage: '!!!Please update your billing info to continue using {license} after your trial period.', }, }); export default @observer class AccountDashboard extends Component { static propTypes = { user: MobxPropTypes.observableObject.isRequired, isLoading: PropTypes.bool.isRequired, isLoadingPlans: PropTypes.bool.isRequired, userInfoRequestFailed: PropTypes.bool.isRequired, retryUserInfoRequest: PropTypes.func.isRequired, onCloseSubscriptionWindow: PropTypes.func.isRequired, deleteAccount: PropTypes.func.isRequired, isLoadingDeleteAccount: PropTypes.bool.isRequired, isDeleteAccountSuccessful: PropTypes.bool.isRequired, openEditAccount: PropTypes.func.isRequired, openBilling: PropTypes.func.isRequired, openInvoices: PropTypes.func.isRequired, }; static contextTypes = { intl: intlShape, }; render() { const { user, isLoading, isLoadingPlans, userInfoRequestFailed, retryUserInfoRequest, onCloseSubscriptionWindow, deleteAccount, isLoadingDeleteAccount, isDeleteAccountSuccessful, openEditAccount, openBilling, openInvoices, } = this.props; const { intl } = this.context; let planName = ''; if (user.team && user.team.plan) { planName = i18nPlanName(user.team.plan, intl); console.log(planName); } return (
{user.organization && `${user.organization}, `} {user.email}
{user.isPremium && ({intl.formatMessage(messages.trialEndsIn, { duration: moment.duration(moment().diff(user.team.trialEnd)).humanize(), })}
{intl.formatMessage(messages.trialUpdateBillingInformation, { license: planName, })}
> )}{intl.formatMessage(messages.deleteInfo)}
{intl.formatMessage(messages.deleteEmailSent)}
)}