Refresh account expiration when window becomes visible

3 files changed, 75 insertions, 24 deletions

diff --git a/app/components/Account.js b/app/components/Account.js
index 74c7d99629..8639d0fe42 100644
--- a/app/components/Account.js
+++ b/app/components/Account.js
@@ -7,6 +7,7 @@ import { Layout, Container } from './Layout';
 import styles from './AccountStyles';
 import Img from './Img';
 import { formatAccount } from '../lib/formatters';
+import AppVisiblityObserver from '../lib/app-visibility';
 
 import type { AccountToken } from '../lib/ipc-facade';
 
@@ -28,15 +29,27 @@ export default class Account extends Component<AccountProps, AccountState> {
     isRefreshingExpiry: false,
   };
 
+  _appVisibilityObserver: ?AppVisiblityObserver;
+
   _isMounted = false;
 
   componentDidMount() {
     this._isMounted = true;
     this._refreshAccountExpiry();
+
+    this._appVisibilityObserver = new AppVisiblityObserver((isVisible) => {
+      if (isVisible) {
+        this._refreshAccountExpiry();
+      }
+    });
   }
 
   componentWillUnmount() {
     this._isMounted = false;
+
+    if (this._appVisibilityObserver) {
+      this._appVisibilityObserver.dispose();
+    }
   }
 
   render() {
diff --git a/app/lib/app-visibility.js b/app/lib/app-visibility.js
new file mode 100644
index 0000000000..d599f6941b
--- /dev/null
+++ b/app/lib/app-visibility.js
@@ -0,0 +1,28 @@
+// @flow
+import { ipcRenderer } from 'electron';
+
+type EventHandler = (boolean) => any;
+
+export default class AppVisiblityObserver {
+  _handler: EventHandler;
+
+  constructor(handler: EventHandler) {
+    this._handler = handler;
+
+    ipcRenderer.on('show-window', this._handleShowEvent).on('hide-window', this._handleHideEvent);
+  }
+
+  dispose() {
+    ipcRenderer
+      .removeListener('show-window', this._handleShowEvent)
+      .removeListener('hide-window', this._handleHideEvent);
+  }
+
+  _handleShowEvent = (_event) => {
+    this._handler(true);
+  };
+
+  _handleHideEvent = (_event) => {
+    this._handler(false);
+  };
+}
diff --git a/app/main.js b/app/main.js
index 2ac7f0a8d1..b6fefc519e 100644
--- a/app/main.js
+++ b/app/main.js
@@ -110,7 +110,8 @@ const ApplicationMain = {
 
     tray.on('click', () => windowController.toggle());
 
-    this._registerIpcEvents();
+    this._registerWindowIpcEvents(window);
+    this._registerIpcListeners();
     this._setAppMenu();
     this._addContextMenu(window);
 
@@ -140,7 +141,13 @@ const ApplicationMain = {
     window.loadFile('build/index.html');
   },
 
-  _registerIpcEvents() {
+  _registerWindowIpcEvents(window: BrowserWindow) {
+    // Notify renderer when window visibility changes.
+    window.on('show', () => window.webContents.send('show-window'));
+    window.on('hide', () => window.webContents.send('hide-window'));
+  },
+
+  _registerIpcListeners() {
     ipcMain.on('on-browser-window-ready', () => {
       this._pollConnectionInfoFile();
     });
@@ -406,32 +413,35 @@ const ApplicationMain = {
     ];
 
     // add inspect element on right click menu
-    window.webContents.on('context-menu', (_e: Event, props: { x: number, y: number }) => {
-      let inspectTemplate = [
-        {
-          label: 'Inspect element',
-          click() {
-            window.openDevTools({ mode: 'detach' });
-            window.inspectElement(props.x, props.y);
+    window.webContents.on(
+      'context-menu',
+      (_e: Event, props: { x: number, y: number, isEditable: boolean }) => {
+        let inspectTemplate = [
+          {
+            label: 'Inspect element',
+            click() {
+              window.openDevTools({ mode: 'detach' });
+              window.inspectElement(props.x, props.y);
+            },
           },
-        },
-      ];
+        ];
 
-      if (props.isEditable) {
-        let inputMenu = menuTemplate;
+        if (props.isEditable) {
+          let inputMenu = menuTemplate;
 
-        // mixin 'inspect element' into standard menu when in development mode
-        if (process.env.NODE_ENV === 'development') {
-          inputMenu = menuTemplate.concat([{ type: 'separator' }], inspectTemplate);
-        }
+          // mixin 'inspect element' into standard menu when in development mode
+          if (process.env.NODE_ENV === 'development') {
+            inputMenu = menuTemplate.concat([{ type: 'separator' }], inspectTemplate);
+          }
 
-        Menu.buildFromTemplate(inputMenu).popup(window);
-      } else if (process.env.NODE_ENV === 'development') {
-        // display inspect element for all non-editable
-        // elements when in development mode
-        Menu.buildFromTemplate(inspectTemplate).popup(window);
-      }
-    });
+          Menu.buildFromTemplate(inputMenu).popup(window);
+        } else if (process.env.NODE_ENV === 'development') {
+          // display inspect element for all non-editable
+          // elements when in development mode
+          Menu.buildFromTemplate(inspectTemplate).popup(window);
+        }
+      },
+    );
   },
 
   _createTray(): Tray {