import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { observer, PropTypes as MobxPropTypes } from 'mobx-react'; import { defineMessages, injectIntl } from 'react-intl'; import ReactTooltip from 'react-tooltip'; import { H1, H2 } from '@meetfranz/ui'; import Loader from '../../ui/Loader'; import Button from '../../ui/Button'; import Infobox from '../../ui/Infobox'; import { LOCAL_SERVER, LIVE_FRANZ_API } from '../../../config'; const messages = defineMessages({ headline: { id: 'settings.account.headline', defaultMessage: 'Account', }, headlineDangerZone: { id: 'settings.account.headlineDangerZone', defaultMessage: 'Danger Zone', }, accountEditButton: { id: 'settings.account.account.editButton', defaultMessage: 'Edit account', }, invoicesButton: { id: 'settings.account.headlineInvoices', defaultMessage: 'Invoices', }, 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 Ferdi 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!', }, yourLicense: { id: 'settings.account.yourLicense', defaultMessage: 'Your Franz License:', }, accountUnavailable: { id: 'settings.account.accountUnavailable', defaultMessage: 'Account is unavailable', }, accountUnavailableInfo: { id: 'settings.account.accountUnavailableInfo', defaultMessage: 'You are using Ferdi without an account. If you want to use Ferdi with an account and keep your services synchronized across installations, please select a server in the Settings tab then login.', }, }); @observer class AccountDashboard extends Component { static propTypes = { user: MobxPropTypes.observableObject.isRequired, isLoading: PropTypes.bool.isRequired, userInfoRequestFailed: PropTypes.bool.isRequired, retryUserInfoRequest: PropTypes.func.isRequired, deleteAccount: PropTypes.func.isRequired, isLoadingDeleteAccount: PropTypes.bool.isRequired, isDeleteAccountSuccessful: PropTypes.bool.isRequired, openEditAccount: PropTypes.func.isRequired, openInvoices: PropTypes.func.isRequired, server: PropTypes.string.isRequired, }; render() { const { user, isLoading, userInfoRequestFailed, retryUserInfoRequest, deleteAccount, isLoadingDeleteAccount, isDeleteAccountSuccessful, openEditAccount, openInvoices, server, } = this.props; const { intl } = this.props; const isUsingWithoutAccount = server === LOCAL_SERVER; const isUsingFranzServer = server === LIVE_FRANZ_API; return (
{intl.formatMessage(messages.accountUnavailableInfo)}
> )} {!isUsingWithoutAccount && ( <> {isLoading &&{user.organization && `${user.organization}, `} {user.email}
Franz
{intl.formatMessage(messages.deleteInfo)}
{intl.formatMessage(messages.deleteEmailSent)}
)}