diff options
| author | Andrej Mihajlov <and@mullvad.net> | 2018-07-18 15:07:37 +0200 |
|---|---|---|
| committer | Andrej Mihajlov <and@mullvad.net> | 2018-08-15 17:39:38 +0200 |
| commit | 71592249b2dd669b6f24f37bfb7b0f4e43b74998 (patch) | |
| tree | a6097dc7e5d94d06e99c65fdfe160e824395f50c /app/components/Account.js | |
| parent | e84e87f4ce5a8c242f756566cdc6fb59a45f7bea (diff) | |
| download | mullvadvpn-71592249b2dd669b6f24f37bfb7b0f4e43b74998.tar.xz mullvadvpn-71592249b2dd669b6f24f37bfb7b0f4e43b74998.zip | |
Add workspaces
Diffstat (limited to 'app/components/Account.js')
| -rw-r--r-- | app/components/Account.js | 159 |
1 files changed, 0 insertions, 159 deletions
diff --git a/app/components/Account.js b/app/components/Account.js deleted file mode 100644 index 41aea6d894..0000000000 --- a/app/components/Account.js +++ /dev/null @@ -1,159 +0,0 @@ -// @flow - -import moment from 'moment'; -import * as React from 'react'; -import { Component, Text, View } from 'reactxp'; -import * as AppButton from './AppButton'; -import { Layout, Container } from './Layout'; -import NavigationBar, { BackBarItem } from './NavigationBar'; -import SettingsHeader, { HeaderTitle } from './SettingsHeader'; -import styles from './AccountStyles'; -import Img from './Img'; -import { formatAccount } from '../lib/formatters'; -import WindowStateObserver from '../lib/window-state-observer'; - -import type { AccountToken } from '../lib/daemon-rpc'; - -type Props = { - accountToken: AccountToken, - accountExpiry: string, - expiryLocale: string, - updateAccountExpiry: () => Promise<void>, - onLogout: () => void, - onClose: () => void, - onCopyAccountToken: () => void, - onBuyMore: () => void, -}; - -type State = { - isRefreshingExpiry: boolean, - showAccountTokenCopiedMessage: boolean, -}; - -export default class Account extends Component<Props, State> { - state = { - isRefreshingExpiry: false, - showAccountTokenCopiedMessage: false, - }; - - _isMounted = false; - _copyTimer: ?TimeoutID; - _windowStateObserver = new WindowStateObserver(); - - componentDidMount() { - this._isMounted = true; - this._refreshAccountExpiry(); - - this._windowStateObserver.onShow = () => { - this._refreshAccountExpiry(); - }; - } - - componentWillUnmount() { - this._isMounted = false; - - if (this._copyTimer) { - clearTimeout(this._copyTimer); - } - - this._windowStateObserver.dispose(); - } - - onAccountTokenClick() { - if (this._copyTimer) { - clearTimeout(this._copyTimer); - } - this._copyTimer = setTimeout( - () => this.setState({ showAccountTokenCopiedMessage: false }), - 3000, - ); - this.setState({ showAccountTokenCopiedMessage: true }); - this.props.onCopyAccountToken(); - } - - render() { - const expiry = moment(this.props.accountExpiry); - const isOutOfTime = expiry.isSameOrBefore(moment()); - const formattedAccountToken = formatAccount(this.props.accountToken || ''); - const formattedExpiry = expiry.toDate().toLocaleString(this.props.expiryLocale, { - day: 'numeric', - month: 'long', - year: 'numeric', - hour: 'numeric', - minute: 'numeric', - }); - - return ( - <Layout> - <Container> - <View style={styles.account}> - <NavigationBar> - <BackBarItem action={this.props.onClose} title={'Settings'} /> - </NavigationBar> - - <View style={styles.account__container}> - <SettingsHeader> - <HeaderTitle>Account</HeaderTitle> - </SettingsHeader> - - <View style={styles.account__content}> - <View style={styles.account__main}> - <View style={styles.account__row}> - <Text style={styles.account__row_label}>Account ID</Text> - <Text - style={styles.account__row_value} - onPress={this.onAccountTokenClick.bind(this)}> - {this.state.showAccountTokenCopiedMessage - ? 'COPIED TO CLIPBOARD!' - : formattedAccountToken} - </Text> - </View> - - <View style={styles.account__row}> - <Text style={styles.account__row_label}>Paid until</Text> - {isOutOfTime ? ( - <Text style={styles.account__out_of_time} testName="account__out_of_time"> - {'OUT OF TIME'} - </Text> - ) : ( - <Text style={styles.account__row_value}>{formattedExpiry}</Text> - )} - </View> - - <View style={styles.account__footer}> - <AppButton.GreenButton - style={styles.account__buy_button} - onPress={this.props.onBuyMore} - text="Buy more credit" - icon="icon-extLink" - testName="account__buymore"> - <AppButton.Label>Buy more credit</AppButton.Label> - <Img source="icon-extLink" height={16} width={16} /> - </AppButton.GreenButton> - <AppButton.RedButton onPress={this.props.onLogout} testName="account__logout"> - {'Log out'} - </AppButton.RedButton> - </View> - </View> - </View> - </View> - </View> - </Container> - </Layout> - ); - } - - async _refreshAccountExpiry() { - this.setState({ isRefreshingExpiry: true }); - - try { - await this.props.updateAccountExpiry(); - } catch (e) { - // TODO: Report the error to user - } - - if (this._isMounted) { - this.setState({ isRefreshingExpiry: false }); - } - } -} |
