diff options
22 files changed, 254 insertions, 141 deletions
diff --git a/CHANGELOG.md b/CHANGELOG.md index ae9d9d634d..1835a17b9a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -25,6 +25,7 @@ Line wrap the file at 100 chars. Th ## [Unreleased] ### Added - Add Korean, Polish and Thai languages to the desktop app. +- Show system notification when account has expired. #### Android - Show a system notification when the account time will soon run out. diff --git a/gui/src/main/account-data-cache.ts b/gui/src/main/account-data-cache.ts index ac829ca0f3..5c178e83a6 100644 --- a/gui/src/main/account-data-cache.ts +++ b/gui/src/main/account-data-cache.ts @@ -1,5 +1,6 @@ import log from 'electron-log'; import moment from 'moment'; +import { hasExpired } from '../shared/account-expiry'; import { AccountToken, IAccountData } from '../shared/daemon-rpc-types'; import consumePromise from '../shared/promise'; import { Scheduler } from '../shared/scheduler'; @@ -85,7 +86,12 @@ export default class AccountDataCache { if (this.currentAccount === accountToken) { this.setValue(accountData); - this.scheduleRefetchIfExpired(accountToken, accountData); + + const refetchDelay = this.calculateRefetchDelay(accountData.expiry); + if (refetchDelay) { + this.scheduleFetch(accountToken, refetchDelay); + } + this.waitStrategy.reset(); this.performingFetch = false; } @@ -97,10 +103,17 @@ export default class AccountDataCache { } } - private scheduleRefetchIfExpired(accountToken: AccountToken, accountData: IAccountData) { - const hasExpired = moment(accountData.expiry).isSameOrBefore(new Date()); - if (hasExpired) { - this.scheduleFetch(accountToken, EXPIRED_ACCOUNT_REFRESH_PERIOD); + private calculateRefetchDelay(accountExpiry: string) { + const currentDate = new Date(); + const oneMinuteBeforeExpiry = moment(accountExpiry).subtract(1, 'minute'); + const closeToExpiry = moment(accountExpiry).isSameOrBefore(moment().add(3, 'days')); + + if (hasExpired(accountExpiry)) { + return EXPIRED_ACCOUNT_REFRESH_PERIOD; + } else if (oneMinuteBeforeExpiry.isSameOrAfter(currentDate) && closeToExpiry) { + return oneMinuteBeforeExpiry.diff(currentDate); + } else { + return undefined; } } diff --git a/gui/src/main/index.ts b/gui/src/main/index.ts index b09d83e292..cef8eda51b 100644 --- a/gui/src/main/index.ts +++ b/gui/src/main/index.ts @@ -2,9 +2,10 @@ import { execFile } from 'child_process'; import { app, BrowserWindow, ipcMain, Menu, nativeImage, screen, shell, Tray } from 'electron'; import log from 'electron-log'; import mkdirp from 'mkdirp'; +import moment from 'moment'; import * as path from 'path'; import * as uuid from 'uuid'; -import AccountExpiry from '../shared/account-expiry'; +import { hasExpired } from '../shared/account-expiry'; import BridgeSettingsBuilder from '../shared/bridge-settings-builder'; import { AccountToken, @@ -27,17 +28,18 @@ import { loadTranslations, messages } from '../shared/gettext'; import { SYSTEM_PREFERRED_LOCALE_KEY } from '../shared/gui-settings-state'; import { IpcMainEventChannel } from '../shared/ipc-event-channel'; import { - AccountExpiryNotificationProvider, - InconsistentVersionNotificationProvider, - UnsupportedVersionNotificationProvider, -} from '../shared/notifications/notification'; -import { backupLogFile, getLogsDirectory, getMainLogFile, getRendererLogFile, setupLogging, } from '../shared/logging'; +import { + AccountExpiredNotificationProvider, + CloseToAccountExpiryNotificationProvider, + InconsistentVersionNotificationProvider, + UnsupportedVersionNotificationProvider, +} from '../shared/notifications/notification'; import consumePromise from '../shared/promise'; import { Scheduler } from '../shared/scheduler'; import AccountDataCache from './account-data-cache'; @@ -165,7 +167,7 @@ class ApplicationMain { private wireguardPublicKey?: IWireguardPublicKey; - private accountExpiryNotificationTimeout?: NodeJS.Timeout; + private accountExpiryNotificationScheduler = new Scheduler(); private accountDataCache = new AccountDataCache( (accountToken) => { @@ -178,7 +180,7 @@ class ApplicationMain { IpcMainEventChannel.account.notify(this.windowController.webContents, accountData); } - this.notifyOfAccountExpiry(); + this.handleAccountExpiry(); }, ); @@ -623,7 +625,11 @@ class ApplicationMain { this.updateTrayIcon(newState, this.settings.blockWhenDisconnected); consumePromise(this.updateLocation()); - this.notificationController.notifyTunnelState(newState, this.settings.blockWhenDisconnected); + this.notificationController.notifyTunnelState( + newState, + this.settings.blockWhenDisconnected, + this.accountData?.expiry, + ); if (this.windowController) { IpcMainEventChannel.tunnel.notify(this.windowController.webContents, newState); @@ -1147,10 +1153,7 @@ class ApplicationMain { } private async autoConnect() { - if ( - !this.accountData || - !new AccountExpiry(this.accountData.expiry, this.locale).hasExpired() - ) { + if (!this.accountData || !hasExpired(this.accountData.expiry)) { try { log.info('Auto-connecting the tunnel'); await this.daemonRpc.connectTunnel(); @@ -1164,12 +1167,8 @@ class ApplicationMain { try { await this.daemonRpc.setAccount(); - if (this.accountExpiryNotificationTimeout) { - global.clearTimeout(this.accountExpiryNotificationTimeout); - this.accountExpiryNotificationTimeout = undefined; - } - this.autoConnectFallbackScheduler.cancel(); + this.accountExpiryNotificationScheduler.cancel(); } catch (error) { log.info(`Failed to logout: ${error.message}`); @@ -1219,19 +1218,30 @@ class ApplicationMain { } } - private notifyOfAccountExpiry() { + private handleAccountExpiry() { if (this.accountData) { - const accountExpiry = new AccountExpiry(this.accountData.expiry, this.locale); - const notificationProvider = new AccountExpiryNotificationProvider({ - accountExpiry, - tooSoon: this.accountExpiryNotificationTimeout !== undefined, + const expiredNotification = new AccountExpiredNotificationProvider({ + accountExpiry: this.accountData.expiry, + tunnelState: this.tunnelState, }); - if (notificationProvider.mayDisplay()) { - this.notificationController.notify(notificationProvider.getSystemNotification()); - this.accountExpiryNotificationTimeout = global.setTimeout(() => { - this.accountExpiryNotificationTimeout = undefined; - this.notifyOfAccountExpiry(); - }, 12 * 60 * 60 * 1000); // Every 12 hours + const closeToExpiryNotification = new CloseToAccountExpiryNotificationProvider({ + accountExpiry: this.accountData.expiry, + locale: this.locale, + }); + + if (expiredNotification.mayDisplay()) { + this.accountExpiryNotificationScheduler.cancel(); + this.notificationController.notify(expiredNotification.getSystemNotification()); + } else if ( + !this.accountExpiryNotificationScheduler.isRunning && + closeToExpiryNotification.mayDisplay() + ) { + this.notificationController.notify(closeToExpiryNotification.getSystemNotification()); + + const twelveHours = 12 * 60 * 60 * 1000; + const remainingMilliseconds = moment(this.accountData.expiry).diff(new Date()); + const delay = Math.min(twelveHours, remainingMilliseconds); + this.accountExpiryNotificationScheduler.schedule(() => this.handleAccountExpiry(), delay); } } } diff --git a/gui/src/main/notification-controller.ts b/gui/src/main/notification-controller.ts index 548c20e122..20c29d0a41 100644 --- a/gui/src/main/notification-controller.ts +++ b/gui/src/main/notification-controller.ts @@ -47,14 +47,18 @@ export default class NotificationController { } } - public notifyTunnelState(tunnelState: TunnelState, blockWhenDisconnected: boolean) { + public notifyTunnelState( + tunnelState: TunnelState, + blockWhenDisconnected: boolean, + accountExpiry?: string, + ) { const notificationProviders: SystemNotificationProvider[] = [ new ConnectingNotificationProvider({ tunnelState, reconnecting: this.reconnecting }), new ConnectedNotificationProvider(tunnelState), new ReconnectingNotificationProvider(tunnelState), new BlockWhenDisconnectedNotificationProvider({ tunnelState, blockWhenDisconnected }), new DisconnectedNotificationProvider(tunnelState), - new ErrorNotificationProvider(tunnelState), + new ErrorNotificationProvider({ tunnelState, accountExpiry }), ]; const notificationProvider = notificationProviders.find((notification) => diff --git a/gui/src/renderer/components/Account.tsx b/gui/src/renderer/components/Account.tsx index 352ed1dad3..3d344887bd 100644 --- a/gui/src/renderer/components/Account.tsx +++ b/gui/src/renderer/components/Account.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import AccountExpiry from '../../shared/account-expiry'; +import { formatDate, hasExpired } from '../../shared/account-expiry'; import { messages } from '../../shared/gettext'; import { AccountContainer, @@ -97,14 +97,12 @@ export default class Account extends React.Component<IProps> { function FormattedAccountExpiry(props: { expiry?: string; locale: string }) { if (props.expiry) { - const expiry = new AccountExpiry(props.expiry, props.locale); - - if (expiry.hasExpired()) { + if (hasExpired(props.expiry)) { return ( <AccountOutOfTime>{messages.pgettext('account-view', 'OUT OF TIME')}</AccountOutOfTime> ); } else { - return <AccountRowValue>{expiry.formattedDate()}</AccountRowValue>; + return <AccountRowValue>{formatDate(props.expiry, props.locale)}</AccountRowValue>; } } else { return ( diff --git a/gui/src/renderer/components/Connect.tsx b/gui/src/renderer/components/Connect.tsx index b57c63a273..636f445bc1 100644 --- a/gui/src/renderer/components/Connect.tsx +++ b/gui/src/renderer/components/Connect.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { Component, Styles, View } from 'reactxp'; import styled from 'styled-components'; -import AccountExpiry from '../../shared/account-expiry'; +import { hasExpired } from '../../shared/account-expiry'; import ExpiredAccountErrorViewContainer from '../containers/ExpiredAccountErrorViewContainer'; import NotificationArea from '../components/NotificationArea'; import { AuthFailureKind, parseAuthFailure } from '../../shared/auth-failure'; @@ -17,7 +17,7 @@ import TunnelControl from './TunnelControl'; interface IProps { connection: IConnectionReduxState; loginState: LoginState; - accountExpiry?: AccountExpiry; + accountExpiry?: string; blockWhenDisconnected: boolean; selectedRelayName: string; onSettings: () => void; @@ -135,7 +135,7 @@ export default class Connect extends Component<IProps, IState> { // Use the account expiry to deduce the account state if (this.props.accountExpiry) { - return this.props.accountExpiry.hasExpired(); + return hasExpired(this.props.accountExpiry); } // Do not assume that the account hasn't expired if the expiry is not available at the moment diff --git a/gui/src/renderer/components/ExpiredAccountErrorView.tsx b/gui/src/renderer/components/ExpiredAccountErrorView.tsx index 61140016ea..0854f0ace2 100644 --- a/gui/src/renderer/components/ExpiredAccountErrorView.tsx +++ b/gui/src/renderer/components/ExpiredAccountErrorView.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { Component, Text, View } from 'reactxp'; import { sprintf } from 'sprintf-js'; import { links } from '../../config.json'; -import AccountExpiry from '../../shared/account-expiry'; +import { hasExpired } from '../../shared/account-expiry'; import { AccountToken } from '../../shared/daemon-rpc-types'; import { messages } from '../../shared/gettext'; import { LoginState } from '../redux/account/reducers'; @@ -29,7 +29,7 @@ interface IExpiredAccountErrorViewProps { isBlocked: boolean; blockWhenDisconnected: boolean; accountToken?: AccountToken; - accountExpiry?: AccountExpiry; + accountExpiry?: string; loginState: LoginState; hideWelcomeView: () => void; onExternalLinkWithAuth: (url: string) => Promise<void>; @@ -52,7 +52,7 @@ export default class ExpiredAccountErrorView extends Component< }; public componentDidUpdate() { - if (this.props.accountExpiry && !this.props.accountExpiry.hasExpired()) { + if (this.props.accountExpiry && !hasExpired(this.props.accountExpiry)) { this.props.hideWelcomeView(); } } diff --git a/gui/src/renderer/components/NotificationArea.tsx b/gui/src/renderer/components/NotificationArea.tsx index bc76ba0885..a6d4699e6a 100644 --- a/gui/src/renderer/components/NotificationArea.tsx +++ b/gui/src/renderer/components/NotificationArea.tsx @@ -3,9 +3,8 @@ import log from 'electron-log'; import React, { useCallback } from 'react'; import { useSelector } from 'react-redux'; import { Types } from 'reactxp'; -import AccountExpiry from '../../shared/account-expiry'; import { - AccountExpiryNotificationProvider, + CloseToAccountExpiryNotificationProvider, BlockWhenDisconnectedNotificationProvider, ConnectingNotificationProvider, ErrorNotificationProvider, @@ -33,11 +32,8 @@ interface IProps { } export default function NotificationArea(props: IProps) { - const accountExpiry = useSelector((state: IReduxState) => - state.account.expiry - ? new AccountExpiry(state.account.expiry, state.userInterface.locale) - : undefined, - ); + const accountExpiry = useSelector((state: IReduxState) => state.account.expiry); + const locale = useSelector((state: IReduxState) => state.userInterface.locale); const tunnelState = useSelector((state: IReduxState) => state.connection.status); const version = useSelector((state: IReduxState) => state.version); const blockWhenDisconnected = useSelector( @@ -48,14 +44,16 @@ export default function NotificationArea(props: IProps) { new ConnectingNotificationProvider({ tunnelState }), new ReconnectingNotificationProvider(tunnelState), new BlockWhenDisconnectedNotificationProvider({ tunnelState, blockWhenDisconnected }), - new ErrorNotificationProvider(tunnelState), + new ErrorNotificationProvider({ tunnelState, accountExpiry }), new InconsistentVersionNotificationProvider({ consistent: version.consistent }), new UnsupportedVersionNotificationProvider(version), new UpdateAvailableNotificationProvider(version), ]; if (accountExpiry) { - notificationProviders.push(new AccountExpiryNotificationProvider({ accountExpiry })); + notificationProviders.push( + new CloseToAccountExpiryNotificationProvider({ accountExpiry, locale }), + ); } const notificationProvider = notificationProviders.find((notification) => diff --git a/gui/src/renderer/components/Settings.tsx b/gui/src/renderer/components/Settings.tsx index 4a7684f405..f01bfd7036 100644 --- a/gui/src/renderer/components/Settings.tsx +++ b/gui/src/renderer/components/Settings.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { Component, Text, View } from 'reactxp'; import { colors, links } from '../../config.json'; -import AccountExpiry from '../../shared/account-expiry'; +import { hasExpired, formatRemainingTime } from '../../shared/account-expiry'; import { messages } from '../../shared/gettext'; import * as AppButton from './AppButton'; import * as Cell from './Cell'; @@ -102,11 +102,10 @@ export default class Settings extends Component<IProps> { return null; } - const expiry = this.props.accountExpiry - ? new AccountExpiry(this.props.accountExpiry, this.props.expiryLocale) - : null; - const isOutOfTime = expiry ? expiry.hasExpired() : false; - const formattedExpiry = expiry ? expiry.remainingTime().toUpperCase() : ''; + const isOutOfTime = this.props.accountExpiry ? hasExpired(this.props.accountExpiry) : false; + const formattedExpiry = this.props.accountExpiry + ? formatRemainingTime(this.props.accountExpiry, this.props.expiryLocale).toUpperCase() + : ''; const outOfTimeMessage = messages.pgettext('settings-view', 'OUT OF TIME'); diff --git a/gui/src/renderer/containers/ConnectPage.tsx b/gui/src/renderer/containers/ConnectPage.tsx index 4ba47f7511..57f550d988 100644 --- a/gui/src/renderer/containers/ConnectPage.tsx +++ b/gui/src/renderer/containers/ConnectPage.tsx @@ -3,7 +3,6 @@ import log from 'electron-log'; import { connect } from 'react-redux'; import { bindActionCreators } from 'redux'; import { sprintf } from 'sprintf-js'; -import AccountExpiry from '../../shared/account-expiry'; import { messages } from '../../shared/gettext'; import Connect from '../components/Connect'; import withAppContext, { IAppContext } from '../context'; @@ -65,9 +64,7 @@ function getRelayName( const mapStateToProps = (state: IReduxState) => { return { - accountExpiry: state.account.expiry - ? new AccountExpiry(state.account.expiry, state.userInterface.locale) - : undefined, + accountExpiry: state.account.expiry, loginState: state.account.status, blockWhenDisconnected: state.settings.blockWhenDisconnected, selectedRelayName: getRelayName(state.settings.relaySettings, state.settings.relayLocations), diff --git a/gui/src/renderer/containers/ExpiredAccountErrorViewContainer.tsx b/gui/src/renderer/containers/ExpiredAccountErrorViewContainer.tsx index 2c4ca2e6dd..dcdc862355 100644 --- a/gui/src/renderer/containers/ExpiredAccountErrorViewContainer.tsx +++ b/gui/src/renderer/containers/ExpiredAccountErrorViewContainer.tsx @@ -1,7 +1,6 @@ import log from 'electron-log'; import { connect } from 'react-redux'; import { bindActionCreators } from 'redux'; -import AccountExpiry from '../../shared/account-expiry'; import ExpiredAccountErrorView from '../components/ExpiredAccountErrorView'; import accountActions from '../redux/account/actions'; @@ -10,9 +9,7 @@ import { IReduxState, ReduxDispatch } from '../redux/store'; const mapStateToProps = (state: IReduxState) => ({ accountToken: state.account.accountToken, - accountExpiry: state.account.expiry - ? new AccountExpiry(state.account.expiry, state.userInterface.locale) - : undefined, + accountExpiry: state.account.expiry, loginState: state.account.status, isBlocked: state.connection.isBlocked, blockWhenDisconnected: state.settings.blockWhenDisconnected, diff --git a/gui/src/shared/account-expiry.ts b/gui/src/shared/account-expiry.ts index d6acb0de91..4511797f3c 100644 --- a/gui/src/shared/account-expiry.ts +++ b/gui/src/shared/account-expiry.ts @@ -2,57 +2,52 @@ import moment from 'moment'; import { sprintf } from 'sprintf-js'; import { messages } from './gettext'; -export default class AccountExpiry { - private expiry: moment.Moment; +type DateArgument = string | Date | moment.Moment; - constructor(isoString: string, locale: string) { - this.expiry = moment(isoString).locale(locale); - } - - public hasExpired(): boolean { - return this.willHaveExpiredAt(new Date()); - } - - public willHaveExpiredAt(date: Date): boolean { - return this.expiry.isSameOrBefore(date); - } +export function hasExpired(expiry: DateArgument): boolean { + return moment(expiry).isSameOrBefore(new Date()); +} - public formattedDate(): string { - return this.expiry.format('lll'); - } +export function formatDate(date: DateArgument, locale: string): string { + return moment(date).locale(locale).format('lll'); +} - public durationUntilExpiry(): string { - const daysDiff = this.expiry.diff(new Date(), 'days'); +export function formatDurationUntilExpiry(expiry: DateArgument, locale: string): string { + const expiryMoment = moment(expiry).locale(locale); + const daysDiff = expiryMoment.diff(new Date(), 'days'); - // Below three months we want to show the duration in days. Moments fromNow() method starts - // measuring duration in months from 26 days and up. - // https://momentjs.com/docs/#/displaying/fromnow/ - if (daysDiff >= 26 && daysDiff <= 90) { - return sprintf( - // TRANSLATORS: The remaining time left on the account measured in days. - // TRANSLATORS: Available placeholders: - // TRANSLATORS: %(duration)s - The remaining time measured in days. - messages.pgettext('account-expiry', '%(duration)s days'), - { duration: daysDiff }, - ); - } else { - return this.expiry.fromNow(true); - } + // Below three months we want to show the duration in days. Moments fromNow() method starts + // measuring duration in months from 26 days and up. + // https://momentjs.com/docs/#/displaying/fromnow/ + if (daysDiff >= 26 && daysDiff <= 90) { + return sprintf( + // TRANSLATORS: The remaining time left on the account measured in days. + // TRANSLATORS: Available placeholders: + // TRANSLATORS: %(duration)s - The remaining time measured in days. + messages.pgettext('account-expiry', '%(duration)s days'), + { duration: daysDiff }, + ); + } else { + return expiryMoment.fromNow(true); } +} - public remainingTime(shouldCapitalizeFirstLetter?: boolean): string { - const duration = this.durationUntilExpiry(); +export function formatRemainingTime( + expiry: DateArgument, + locale: string, + shouldCapitalizeFirstLetter?: boolean, +): string { + const duration = formatDurationUntilExpiry(expiry, locale); - const remaining = sprintf( - // TRANSLATORS: The remaining time left on the account displayed across the app. - // TRANSLATORS: Available placeholders: - // TRANSLATORS: %(duration)s - a localized remaining time (in minutes, hours, or days) until the account expiry - messages.pgettext('account-expiry', '%(duration)s left'), - { duration }, - ); + const remaining = sprintf( + // TRANSLATORS: The remaining time left on the account displayed across the app. + // TRANSLATORS: Available placeholders: + // TRANSLATORS: %(duration)s - a localized remaining time (in minutes, hours, or days) until the account expiry + messages.pgettext('account-expiry', '%(duration)s left'), + { duration }, + ); - return shouldCapitalizeFirstLetter ? capitalizeFirstLetter(remaining) : remaining; - } + return shouldCapitalizeFirstLetter ? capitalizeFirstLetter(remaining) : remaining; } function capitalizeFirstLetter(inputString: string): string { diff --git a/gui/src/shared/notifications/account-expired.ts b/gui/src/shared/notifications/account-expired.ts new file mode 100644 index 0000000000..ea600aa577 --- /dev/null +++ b/gui/src/shared/notifications/account-expired.ts @@ -0,0 +1,34 @@ +import { links } from '../../config.json'; +import { hasExpired } from '../account-expiry'; +import { TunnelState } from '../daemon-rpc-types'; +import { messages } from '../gettext'; +import { SystemNotification, SystemNotificationProvider } from './notification'; + +interface AccountExpiredNotificaitonContext { + accountExpiry: string; + tunnelState: TunnelState; +} + +export class AccountExpiredNotificationProvider implements SystemNotificationProvider { + public constructor(private context: AccountExpiredNotificaitonContext) {} + + public mayDisplay() { + // Only show when disconnected since the error state handles this if the connection is closed + // due to account expiry. + return ( + this.context.tunnelState.state === 'disconnected' && hasExpired(this.context.accountExpiry) + ); + } + + public getSystemNotification(): SystemNotification { + return { + message: messages.pgettext( + 'notifications', + 'You have no more VPN time left on this account.', + ), + critical: true, + presentOnce: { value: true, name: this.constructor.name }, + action: { type: 'open-url', url: links.purchase, withAuth: true }, + }; + } +} diff --git a/gui/src/shared/notifications/blockWhenDisconnected.ts b/gui/src/shared/notifications/block-when-disconnected.ts index 16b65c0672..16b65c0672 100644 --- a/gui/src/shared/notifications/blockWhenDisconnected.ts +++ b/gui/src/shared/notifications/block-when-disconnected.ts diff --git a/gui/src/shared/notifications/accountExpiry.ts b/gui/src/shared/notifications/close-to-account-expiry.ts index b749fb55c1..b30aff2542 100644 --- a/gui/src/shared/notifications/accountExpiry.ts +++ b/gui/src/shared/notifications/close-to-account-expiry.ts @@ -2,7 +2,7 @@ import moment from 'moment'; import { sprintf } from 'sprintf-js'; import { links } from '../../config.json'; import { messages } from '../../shared/gettext'; -import AccountExpiry from '../account-expiry'; +import { formatDurationUntilExpiry, formatRemainingTime, hasExpired } from '../account-expiry'; import { InAppNotification, InAppNotificationProvider, @@ -10,21 +10,21 @@ import { SystemNotificationProvider, } from './notification'; -interface AccountExpiryContext { - accountExpiry: AccountExpiry; - tooSoon?: boolean; +interface CloseToAccountExpiryNotificationContext { + accountExpiry: string; + locale: string; } -export class AccountExpiryNotificationProvider +export class CloseToAccountExpiryNotificationProvider implements InAppNotificationProvider, SystemNotificationProvider { - public constructor(private context: AccountExpiryContext) {} + public constructor(private context: CloseToAccountExpiryNotificationContext) {} public mayDisplay() { - return ( - !this.context.accountExpiry.hasExpired() && - this.context.accountExpiry.willHaveExpiredAt(moment().add(3, 'days').toDate()) && - !this.context.tooSoon + const willHaveExpiredInThreeDays = moment(this.context.accountExpiry).isSameOrBefore( + moment().add(3, 'days'), ); + + return !hasExpired(this.context.accountExpiry) && willHaveExpiredInThreeDays; } public getSystemNotification(): SystemNotification { @@ -34,7 +34,7 @@ export class AccountExpiryNotificationProvider // TRANSLATORS: %(duration)s - remaining time, e.g. "2 days" messages.pgettext('notifications', 'Account credit expires in %(duration)s'), { - duration: this.context.accountExpiry.remainingTime(), + duration: formatDurationUntilExpiry(this.context.accountExpiry, this.context.locale), }, ); @@ -49,7 +49,7 @@ export class AccountExpiryNotificationProvider return { indicator: 'warning', title: messages.pgettext('in-app-notifications', 'ACCOUNT CREDIT EXPIRES SOON'), - subtitle: this.context.accountExpiry.remainingTime(true), + subtitle: formatRemainingTime(this.context.accountExpiry, this.context.locale, true), action: { type: 'open-url', url: links.purchase, withAuth: true }, }; } diff --git a/gui/src/shared/notifications/error.ts b/gui/src/shared/notifications/error.ts index a4ba97c81d..1a8499739e 100644 --- a/gui/src/shared/notifications/error.ts +++ b/gui/src/shared/notifications/error.ts @@ -1,4 +1,6 @@ -import { parseAuthFailure } from '../auth-failure'; +import { sprintf } from 'sprintf-js'; +import { hasExpired } from '../account-expiry'; +import { AuthFailureKind, parseAuthFailure } from '../auth-failure'; import { IErrorState, TunnelState, TunnelParameterError } from '../daemon-rpc-types'; import { messages } from '../gettext'; import { @@ -7,38 +9,62 @@ import { SystemNotificationProvider, } from './notification'; +interface ErrorNotificationContext { + tunnelState: TunnelState; + accountExpiry?: string; +} + export class ErrorNotificationProvider implements SystemNotificationProvider, InAppNotificationProvider { - public constructor(private context: TunnelState) {} + public constructor(private context: ErrorNotificationContext) {} - public mayDisplay = () => this.context.state === 'error'; + public mayDisplay = () => this.context.tunnelState.state === 'error'; public getSystemNotification() { - return this.context.state === 'error' + return this.context.tunnelState.state === 'error' ? { - message: getSystemNotificationMessage(this.context), - critical: !this.context.details.isBlocking, + message: getSystemNotificationMessage( + this.context.tunnelState, + this.context.accountExpiry, + ), + critical: !this.context.tunnelState.details.isBlocking, } : undefined; } public getInAppNotification(): InAppNotification | undefined { - return this.context.state === 'error' + return this.context.tunnelState.state === 'error' ? { indicator: 'error', - title: this.context.details.isBlocking + title: this.context.tunnelState.details.isBlocking ? messages.pgettext('in-app-notifications', 'BLOCKING INTERNET') : messages.pgettext('in-app-notifications', 'YOU MIGHT BE LEAKING NETWORK TRAFFIC'), - subtitle: getInAppNotificationSubtitle(this.context), + subtitle: getInAppNotificationSubtitle(this.context.tunnelState), } : undefined; } } -function getSystemNotificationMessage(tunnelState: { state: 'error'; details: IErrorState }) { +function getSystemNotificationMessage( + tunnelState: { state: 'error'; details: IErrorState }, + accountExpiry?: string, +) { if (!tunnelState.details.isBlocking) { return messages.pgettext('notifications', 'Critical error (your attention is required)'); } else if ( + (tunnelState.details.cause.reason === 'auth_failed' && + parseAuthFailure(tunnelState.details.cause.details).kind === + AuthFailureKind.expiredAccount) || + (accountExpiry && hasExpired(accountExpiry)) + ) { + return sprintf('%(blocking)s %(message)s', { + blocking: messages.pgettext('notifications', 'Blocking internet:'), + message: messages.pgettext( + 'notifications', + 'You have no more VPN time left on this account.', + ), + }); + } else if ( tunnelState.details.cause.reason === 'tunnel_parameter_error' && tunnelState.details.cause.details === 'no_wireguard_key' ) { diff --git a/gui/src/shared/notifications/inconsistentVersion.ts b/gui/src/shared/notifications/inconsistent-version.ts index 94c33bd925..94c33bd925 100644 --- a/gui/src/shared/notifications/inconsistentVersion.ts +++ b/gui/src/shared/notifications/inconsistent-version.ts diff --git a/gui/src/shared/notifications/notification.ts b/gui/src/shared/notifications/notification.ts index e7d89e65bb..98b50d4d24 100644 --- a/gui/src/shared/notifications/notification.ts +++ b/gui/src/shared/notifications/notification.ts @@ -29,13 +29,14 @@ export interface InAppNotificationProvider extends NotificationProvider { getInAppNotification(): InAppNotification | undefined; } -export * from './accountExpiry'; -export * from './blockWhenDisconnected'; +export * from './account-expired'; +export * from './close-to-account-expiry'; +export * from './block-when-disconnected'; export * from './connected'; export * from './connecting'; export * from './disconnected'; export * from './error'; -export * from './inconsistentVersion'; +export * from './inconsistent-version'; export * from './reconnecting'; -export * from './unsupportedVersion'; -export * from './updateAvailable'; +export * from './unsupported-version'; +export * from './update-available'; diff --git a/gui/src/shared/notifications/unsupportedVersion.ts b/gui/src/shared/notifications/unsupported-version.ts index ed471bc586..ed471bc586 100644 --- a/gui/src/shared/notifications/unsupportedVersion.ts +++ b/gui/src/shared/notifications/unsupported-version.ts diff --git a/gui/src/shared/notifications/updateAvailable.ts b/gui/src/shared/notifications/update-available.ts index 4d449bff28..4d449bff28 100644 --- a/gui/src/shared/notifications/updateAvailable.ts +++ b/gui/src/shared/notifications/update-available.ts diff --git a/gui/src/shared/scheduler.ts b/gui/src/shared/scheduler.ts index b31f0cda7c..8ae5a2cbf0 100644 --- a/gui/src/shared/scheduler.ts +++ b/gui/src/shared/scheduler.ts @@ -2,17 +2,28 @@ import { useEffect, useMemo } from 'react'; export class Scheduler { private timer?: NodeJS.Timeout; + private running = false; public schedule(action: () => void, delay = 0) { this.cancel(); - this.timer = global.setTimeout(action, delay); + + this.running = true; + this.timer = global.setTimeout(() => { + this.running = false; + action(); + }, delay); } public cancel() { if (this.timer) { clearTimeout(this.timer); + this.running = false; } } + + public get isRunning() { + return this.running; + } } export function useScheduler() { diff --git a/gui/test/account-data-cache.spec.ts b/gui/test/account-data-cache.spec.ts index bec1c6ef91..770b3ca1f4 100644 --- a/gui/test/account-data-cache.spec.ts +++ b/gui/test/account-data-cache.spec.ts @@ -232,4 +232,33 @@ describe('IAccountData cache', () => { expect(fetchSpy).to.have.been.called.once; }); }); + + it('should refetch one minute before expiry', async () => { + const date = new Date(); + date.setMinutes(date.getMinutes() + 3); + const expiry = date.toISOString(); + + const update = new Promise((resolve, reject) => { + let firstAttempt = true; + const fetch = () => { + if (firstAttempt) { + firstAttempt = false; + setTimeout(() => clock.tick(120_000), 0); + return Promise.resolve({ expiry }); + } else { + resolve(); + return Promise.resolve({ expiry }); + } + }; + + const cache = new AccountDataCache(fetch, () => {}); + + cache.fetch(dummyAccountToken, { + onFinish: () => {}, + onError: (_error: Error) => reject(), + }); + }); + + return expect(update).to.eventually.be.fulfilled; + }); }); |