From c6e24ce9486aa61ad60e8c185b3feae6e9c7f7ac Mon Sep 17 00:00:00 2001 From: Ben Gotow Date: Fri, 8 Apr 2016 13:52:14 -0700 Subject: [PATCH] fix(sync-errors): Improve display of sync errors and offline status - Make the retry interval go 2 sec, 3.4s, 6 sec... - Only show the connection status bar if the interval is > 5 seconds, in case the error was temporary. - Do not show sync errors in the sidebar. The only available action is "Try Again", and we try again on our own. The error is frustrating and the user can't do anything about it anyway. --- .../lib/headers/connection-status-header.jsx | 7 ++++++- .../lib/sidebar/initial-sync-activity.cjsx | 9 --------- .../notifications/stylesheets/notifications.less | 14 ++------------ .../worker-sync/lib/nylas-sync-worker.coffee | 7 ++++--- src/flux/nylas-api.coffee | 2 +- src/flux/stores/nylas-sync-status-store.coffee | 5 +++++ static/variables/ui-variables.less | 2 +- 7 files changed, 19 insertions(+), 27 deletions(-) diff --git a/internal_packages/notifications/lib/headers/connection-status-header.jsx b/internal_packages/notifications/lib/headers/connection-status-header.jsx index c6b915f6d..9675ecb42 100644 --- a/internal_packages/notifications/lib/headers/connection-status-header.jsx +++ b/internal_packages/notifications/lib/headers/connection-status-header.jsx @@ -47,8 +47,13 @@ export default class ConnectionStatusHeader extends React.Component { } getStateFromStores() { + const nextRetryDelay = NylasSyncStatusStore.nextRetryDelay(); const nextRetryTimestamp = NylasSyncStatusStore.nextRetryTimestamp(); - const connected = NylasSyncStatusStore.connected(); + let connected = NylasSyncStatusStore.connected(); + + if (nextRetryDelay < 5000) { + connected = true; + } let nextRetryText = null; if (!connected) { diff --git a/internal_packages/notifications/lib/sidebar/initial-sync-activity.cjsx b/internal_packages/notifications/lib/sidebar/initial-sync-activity.cjsx index b0a95ee61..e7187e43d 100644 --- a/internal_packages/notifications/lib/sidebar/initial-sync-activity.cjsx +++ b/internal_packages/notifications/lib/sidebar/initial-sync-activity.cjsx @@ -27,12 +27,10 @@ class InitialSyncActivity extends React.Component fetched = 0 totalProgress = 0 incomplete = 0 - error = null for acctId, state of @state.sync for model, modelState of state incomplete += 1 unless modelState.complete - error ?= modelState.error if modelState.count count += modelState.count / 1 fetched += modelState.fetched / 1 @@ -45,13 +43,6 @@ class InitialSyncActivity extends React.Component if incomplete is 0 return false - else if error -
-
An error occurred while syncing your mailbox. Sync will resume in a moment… -
Try Again Now
-
- {@_expandedSyncState()} -
else
@setState expandedSync: !@state.expandedSync}> {@_renderProgressBar(totalProgress)} diff --git a/internal_packages/notifications/stylesheets/notifications.less b/internal_packages/notifications/stylesheets/notifications.less index cccfab416..562b3806c 100644 --- a/internal_packages/notifications/stylesheets/notifications.less +++ b/internal_packages/notifications/stylesheets/notifications.less @@ -136,7 +136,7 @@ background-color: #615396; } .notification-error { - background-color: @background-color-error; + background: linear-gradient(to top, darken(@background-color-error, 4%) 0%, @background-color-error 100%); border-color: @background-color-error; color: @color-error; } @@ -144,7 +144,7 @@ border-color: @background-color-success; } .notification-offline { - background-color: #CC9900; + background: linear-gradient(to top, darken(#CC9900, 4%) 0%, #CC9900 100%); border-color: darken(#CC9900, 5%); } @@ -152,7 +152,6 @@ display:flex; font-size: @font-size-base; color:@text-color-inverse; - border-top:1px solid rgba(0,0,0,0.25); border-bottom:1px solid rgba(0,0,0,0.25); padding-left: @padding-base-horizontal; line-height: @line-height-base * 1.5; @@ -213,12 +212,3 @@ body.platform-win32 { } } } - -// Activity Error Header - -.account-error-header.notifications-sticky { - .notifications-sticky-item { - background-color: initial; - background: linear-gradient(to top, #ca2541 0%, #d55268 100%); - } -} diff --git a/internal_packages/worker-sync/lib/nylas-sync-worker.coffee b/internal_packages/worker-sync/lib/nylas-sync-worker.coffee index fbe34d8c4..94fc7c2f9 100644 --- a/internal_packages/worker-sync/lib/nylas-sync-worker.coffee +++ b/internal_packages/worker-sync/lib/nylas-sync-worker.coffee @@ -18,7 +18,7 @@ class BackoffTimer @_timeout = null backoff: => - @_delay = Math.min(@_delay * 1.4, 5 * 1000 * 60) # Cap at 5 minutes + @_delay = Math.min(@_delay * 1.7, 5 * 1000 * 60) # Cap at 5 minutes if not NylasEnv.inSpecMode() console.log("Backing off after sync failure. Will retry in #{Math.floor(@_delay / 1000)} seconds.") @@ -30,7 +30,7 @@ class BackoffTimer , @_delay resetDelay: => - @_delay = 20 * 1000 + @_delay = 2 * 1000 getCurrentDelay: => @_delay @@ -277,7 +277,8 @@ class NylasSyncWorker _backoff: => @_resumeTimer.backoff() @_resumeTimer.start() - @_state.nextRetryTimestamp = Date.now() + @_resumeTimer.getCurrentDelay() + @_state.nextRetryDelay = @_resumeTimer.getCurrentDelay() + @_state.nextRetryTimestamp = Date.now() + @_state.nextRetryDelay updateTransferState: (model, updatedKeys) -> @_state[model] = _.extend(@_state[model], updatedKeys) diff --git a/src/flux/nylas-api.coffee b/src/flux/nylas-api.coffee index b5ccdca2f..2cc3b3cfb 100644 --- a/src/flux/nylas-api.coffee +++ b/src/flux/nylas-api.coffee @@ -256,7 +256,7 @@ class NylasAPI type: 'error' tag: '401' sticky: true - message: "Action failed: There was an error syncing with #{email}. You + message: "An mailbox action for #{email} could not be completed. You may not be able to send or receive mail.", icon: 'fa-sign-out' actions: [{ diff --git a/src/flux/stores/nylas-sync-status-store.coffee b/src/flux/stores/nylas-sync-status-store.coffee index 80addb2f7..90154f925 100644 --- a/src/flux/stores/nylas-sync-status-store.coffee +++ b/src/flux/stores/nylas-sync-status-store.coffee @@ -86,4 +86,9 @@ class NylasSyncStatusStore extends NylasStore state.nextRetryTimestamp _.compact(retryDates).sort((a, b) => a < b).pop() + nextRetryDelay: => + retryDelays = _.values(@_statesByAccount).map (state) -> + state.nextRetryDelay + _.compact(retryDelays).sort((a, b) => a < b).pop() + module.exports = new NylasSyncStatusStore() diff --git a/static/variables/ui-variables.less b/static/variables/ui-variables.less index 6ea6e109f..2353314e6 100644 --- a/static/variables/ui-variables.less +++ b/static/variables/ui-variables.less @@ -217,7 +217,7 @@ rgba(253,253,253,0.75) 100%); @background-color-info: @blue-light; @background-color-success: #00ac6f; @background-color-warning: #ff4800; -@background-color-error: #f15f4b; +@background-color-error: #ca2541; @background-color-pending: #b4babd; //== Menus