Merge branch 'refresh-account-history'

7 files changed, 81 insertions, 49 deletions

diff --git a/CHANGELOG.md b/CHANGELOG.md
index eb258739c3..44d0287573 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -28,6 +28,7 @@ Line wrap the file at 100 chars.                                              Th
 
 - Fix the potential reconnect loop in GUI, triggered by the timeout when receiving
   the initial state of the daemon.
+- Fix the bug which caused the account token history to remain stale after logout.
 
 #### Linux
 - Fix startup failure when network device with a hardware address that's not a MAC address is
diff --git a/gui/packages/desktop/scripts/serve.js b/gui/packages/desktop/scripts/serve.js
index 10c0cd2086..e2b91813dc 100644
--- a/gui/packages/desktop/scripts/serve.js
+++ b/gui/packages/desktop/scripts/serve.js
@@ -27,15 +27,13 @@ function runElectron(browserSyncUrl) {
     },
     stdio: 'inherit',
   });
-  child.once('close', onCloseElectron);
+  child.once('close', () => {
+    process.exit();
+  });
 
   return child;
 }
 
-function onCloseElectron() {
-  process.exit();
-}
-
 function startBrowserSync() {
   bsync.init(
     {
@@ -62,7 +60,7 @@ function startBrowserSync() {
       bsync
         .watch(['build/src/config.json', 'build/src/main/**/*', 'build/src/shared/**/*'])
         .on('change', () => {
-          child.removeListener('close', onCloseElectron);
+          child.removeAllListeners('close');
           child.once('close', () => {
             child = runElectron(browserSyncUrl);
           });
diff --git a/gui/packages/desktop/src/main/index.ts b/gui/packages/desktop/src/main/index.ts
index 173be30819..bd56ed0423 100644
--- a/gui/packages/desktop/src/main/index.ts
+++ b/gui/packages/desktop/src/main/index.ts
@@ -60,6 +60,7 @@ class ApplicationMain {
   private oldLogFilePath?: string;
   private quitStage = AppQuitStage.unready;
 
+  private accountHistory: AccountToken[] = [];
   private tunnelState: TunnelStateTransition = { state: 'disconnected' };
   private settings: ISettings = {
     accountToken: undefined,
@@ -351,6 +352,15 @@ class ApplicationMain {
       return this.recoverFromBootstrapError(error);
     }
 
+    // fetch account history
+    try {
+      this.setAccountHistory(await this.daemonRpc.getAccountHistory());
+    } catch (error) {
+      log.error(`Failed to fetch the account history: ${error.message}`);
+
+      return this.recoverFromBootstrapError(error);
+    }
+
     // fetch the tunnel state
     try {
       this.setTunnelState(await this.daemonRpc.getState());
@@ -490,6 +500,14 @@ class ApplicationMain {
     ]);
   }
 
+  private setAccountHistory(accountHistory: AccountToken[]) {
+    this.accountHistory = accountHistory;
+
+    if (this.windowController) {
+      IpcMainEventChannel.accountHistory.notify(this.windowController.webContents, accountHistory);
+    }
+  }
+
   private setTunnelState(newState: TunnelStateTransition) {
     this.tunnelState = newState;
     this.updateTrayIcon(newState, this.settings.blockWhenDisconnected);
@@ -505,9 +523,15 @@ class ApplicationMain {
   }
 
   private setSettings(newSettings: ISettings) {
+    const oldSettings = this.settings;
     this.settings = newSettings;
+
     this.updateTrayIcon(this.tunnelState, newSettings.blockWhenDisconnected);
 
+    if (oldSettings.accountToken !== newSettings.accountToken) {
+      this.updateAccountHistory();
+    }
+
     if (this.windowController) {
       IpcMainEventChannel.settings.notify(this.windowController.webContents, newSettings);
     }
@@ -748,6 +772,7 @@ class ApplicationMain {
     IpcMainEventChannel.state.handleGet(() => ({
       isConnected: this.connectedToDaemon,
       autoStart: getOpenAtLogin(),
+      accountHistory: this.accountHistory,
       tunnelState: this.tunnelState,
       settings: this.settings,
       location: this.location,
@@ -800,10 +825,10 @@ class ApplicationMain {
       this.daemonRpc.getAccountData(token),
     );
 
-    IpcMainEventChannel.accountHistory.handleGet(() => this.daemonRpc.getAccountHistory());
-    IpcMainEventChannel.accountHistory.handleRemoveItem((token: AccountToken) =>
-      this.daemonRpc.removeAccountFromHistory(token),
-    );
+    IpcMainEventChannel.accountHistory.handleRemoveItem(async (token: AccountToken) => {
+      await this.daemonRpc.removeAccountFromHistory(token);
+      this.updateAccountHistory();
+    });
 
     ipcMain.on('show-window', () => {
       const windowController = this.windowController;
@@ -883,6 +908,14 @@ class ApplicationMain {
     );
   }
 
+  private async updateAccountHistory(): Promise<void> {
+    try {
+      this.setAccountHistory(await this.daemonRpc.getAccountHistory());
+    } catch (error) {
+      log.error(`Failed to fetch the account history: ${error.message}`);
+    }
+  }
+
   private updateDaemonsAutoConnect() {
     const daemonAutoConnect = this.guiSettings.autoConnect && getOpenAtLogin();
     if (daemonAutoConnect !== this.settings.autoConnect) {
diff --git a/gui/packages/desktop/src/main/window-controller.ts b/gui/packages/desktop/src/main/window-controller.ts
index a0cbd77399..3822ecb23f 100644
--- a/gui/packages/desktop/src/main/window-controller.ts
+++ b/gui/packages/desktop/src/main/window-controller.ts
@@ -213,7 +213,11 @@ export default class WindowController {
     });
   }
 
-  private onDisplayMetricsChanged = (_event: any, _display: Display, changedMetrics: string[]) => {
+  private onDisplayMetricsChanged = (
+    _event: Electron.Event,
+    _display: Display,
+    changedMetrics: string[],
+  ) => {
     if (changedMetrics.includes('workArea') && this.windowValue.isVisible()) {
       this.updatePosition();
       this.notifyUpdateWindowShape();
@@ -237,7 +241,7 @@ export default class WindowController {
     });
   }
 
-  private executeWhenWindowIsReady(closure: () => any) {
+  private executeWhenWindowIsReady(closure: () => void) {
     if (this.isWindowReady) {
       closure();
     } else {
diff --git a/gui/packages/desktop/src/renderer/app.tsx b/gui/packages/desktop/src/renderer/app.tsx
index 688aaf2eb0..fe4047187f 100644
--- a/gui/packages/desktop/src/renderer/app.tsx
+++ b/gui/packages/desktop/src/renderer/app.tsx
@@ -99,6 +99,10 @@ export default class AppRenderer {
       this.onDaemonDisconnected(errorMessage ? new Error(errorMessage) : undefined);
     });
 
+    IpcRendererEventChannel.accountHistory.listen((newAccountHistory: AccountToken[]) => {
+      this.setAccountHistory(newAccountHistory);
+    });
+
     IpcRendererEventChannel.tunnel.listen((newState: TunnelStateTransition) => {
       this.setTunnelState(newState);
     });
@@ -141,6 +145,7 @@ export default class AppRenderer {
     this.settings = initialState.settings;
     this.guiSettings = initialState.guiSettings;
 
+    this.setAccountHistory(initialState.accountHistory);
     this.setTunnelState(initialState.tunnelState);
     this.setSettings(initialState.settings);
 
@@ -258,8 +263,7 @@ export default class AppRenderer {
   }
 
   public async removeAccountFromHistory(accountToken: AccountToken): Promise<void> {
-    await IpcRendererEventChannel.accountHistory.removeItem(accountToken);
-    await this.fetchAccountHistory();
+    return IpcRendererEventChannel.accountHistory.removeItem(accountToken);
   }
 
   public async setAllowLan(allowLan: boolean) {
@@ -362,21 +366,9 @@ export default class AppRenderer {
     }
   }
 
-  private async fetchAccountHistory(): Promise<void> {
-    const accountHistory = await IpcRendererEventChannel.accountHistory.get();
-
-    this.reduxActions.account.updateAccountHistory(accountHistory);
-  }
-
   private async onDaemonConnected() {
     this.connectedToDaemon = true;
 
-    try {
-      await this.fetchAccountHistory();
-    } catch (error) {
-      log.error(`Cannot fetch the account history: ${error.message}`);
-    }
-
     if (this.settings.accountToken) {
       this.memoryHistory.replace('/connect');
 
@@ -424,6 +416,10 @@ export default class AppRenderer {
     }
   }
 
+  private setAccountHistory(accountHistory: AccountToken[]) {
+    this.reduxActions.account.updateAccountHistory(accountHistory);
+  }
+
   private setTunnelState(tunnelState: TunnelStateTransition) {
     const actions = this.reduxActions;
 
diff --git a/gui/packages/desktop/src/renderer/components/ConnectStyles.tsx b/gui/packages/desktop/src/renderer/components/ConnectStyles.tsx
index c00d6667bd..645541000b 100644
--- a/gui/packages/desktop/src/renderer/components/ConnectStyles.tsx
+++ b/gui/packages/desktop/src/renderer/components/ConnectStyles.tsx
@@ -53,6 +53,7 @@ export default {
   error_message: Styles.createTextStyle({
     fontFamily: 'Open Sans',
     fontSize: 13,
+    lineHeight: 20,
     fontWeight: '600',
     color: colors.white,
     marginBottom: 24,
diff --git a/gui/packages/desktop/src/shared/ipc-event-channel.ts b/gui/packages/desktop/src/shared/ipc-event-channel.ts
index c8cb1bf4c8..02480d8150 100644
--- a/gui/packages/desktop/src/shared/ipc-event-channel.ts
+++ b/gui/packages/desktop/src/shared/ipc-event-channel.ts
@@ -17,6 +17,7 @@ import {
 export interface IAppStateSnapshot {
   isConnected: boolean;
   autoStart: boolean;
+  accountHistory: AccountToken[];
   tunnelState: TunnelStateTransition;
   settings: ISettings;
   location?: ILocation;
@@ -38,17 +39,17 @@ interface IReceiver<T> {
   listen(fn: (value: T) => void): void;
 }
 
-interface ITunnelMethods {
+interface ITunnelMethods extends IReceiver<TunnelStateTransition> {
   connect(): Promise<void>;
   disconnect(): Promise<void>;
 }
 
-interface ITunnelHandlers {
+interface ITunnelHandlers extends ISender<TunnelStateTransition> {
   handleConnect(fn: () => Promise<void>): void;
   handleDisconnect(fn: () => Promise<void>): void;
 }
 
-interface ISettingsMethods {
+interface ISettingsMethods extends IReceiver<ISettings> {
   setAllowLan(allowLan: boolean): Promise<void>;
   setEnableIpv6(enableIpv6: boolean): Promise<void>;
   setBlockWhenDisconnected(block: boolean): Promise<void>;
@@ -56,7 +57,7 @@ interface ISettingsMethods {
   updateRelaySettings(update: RelaySettingsUpdate): Promise<void>;
 }
 
-interface ISettingsHandlers {
+interface ISettingsHandlers extends ISender<ISettings> {
   handleAllowLan(fn: (allowLan: boolean) => Promise<void>): void;
   handleEnableIpv6(fn: (enableIpv6: boolean) => Promise<void>): void;
   handleBlockWhenDisconnected(fn: (block: boolean) => Promise<void>): void;
@@ -64,13 +65,13 @@ interface ISettingsHandlers {
   handleUpdateRelaySettings(fn: (update: RelaySettingsUpdate) => Promise<void>): void;
 }
 
-interface IGuiSettingsMethods {
+interface IGuiSettingsMethods extends IReceiver<IGuiSettingsState> {
   setAutoConnect(autoConnect: boolean): void;
   setStartMinimized(startMinimized: boolean): void;
   setMonochromaticIcon(monochromaticIcon: boolean): void;
 }
 
-interface IGuiSettingsHandlers {
+interface IGuiSettingsHandlers extends ISender<IGuiSettingsState> {
   handleAutoConnect(fn: (autoConnect: boolean) => void): void;
   handleStartMinimized(fn: (startMinimized: boolean) => void): void;
   handleMonochromaticIcon(fn: (monochromaticIcon: boolean) => void): void;
@@ -88,21 +89,19 @@ interface IAccountMethods {
   getData(token: AccountToken): Promise<IAccountData>;
 }
 
-interface IAccountHistoryHandlers {
-  handleGet(fn: () => Promise<AccountToken[]>): void;
+interface IAccountHistoryHandlers extends ISender<AccountToken[]> {
   handleRemoveItem(fn: (token: AccountToken) => Promise<void>): void;
 }
 
-interface IAccountHistoryMethods {
-  get(): Promise<AccountToken[]>;
+interface IAccountHistoryMethods extends IReceiver<AccountToken[]> {
   removeItem(token: AccountToken): Promise<void>;
 }
 
-interface IAutoStartMethods {
+interface IAutoStartMethods extends IReceiver<boolean> {
   set(autoStart: boolean): Promise<void>;
 }
 
-interface IAutoStartHandlers {
+interface IAutoStartHandlers extends ISender<boolean> {
   handleSet(fn: (value: boolean) => Promise<void>): void;
 }
 
@@ -134,7 +133,7 @@ const SET_START_MINIMIZED = 'set-start-minimized';
 
 const GET_APP_STATE = 'get-app-state';
 
-const GET_ACCOUNT_HISTORY = 'get-account-history';
+const ACCOUNT_HISTORY_CHANGED = 'account-history-changed';
 const REMOVE_ACCOUNT_HISTORY_ITEM = 'remove-account-history-item';
 
 const SET_ACCOUNT = 'set-account';
@@ -165,13 +164,13 @@ export class IpcRendererEventChannel {
     listen: listen(DAEMON_DISCONNECTED),
   };
 
-  public static tunnel: IReceiver<TunnelStateTransition> & ITunnelMethods = {
+  public static tunnel: ITunnelMethods = {
     listen: listen(TUNNEL_STATE_CHANGED),
     connect: requestSender(CONNECT_TUNNEL),
     disconnect: requestSender(DISCONNECT_TUNNEL),
   };
 
-  public static settings: IReceiver<ISettings> & ISettingsMethods = {
+  public static settings: ISettingsMethods = {
     listen: listen(SETTINGS_CHANGED),
     setAllowLan: requestSender(SET_ALLOW_LAN),
     setEnableIpv6: requestSender(SET_ENABLE_IPV6),
@@ -196,14 +195,14 @@ export class IpcRendererEventChannel {
     listen: listen(UPGRADE_VERSION_CHANGED),
   };
 
-  public static guiSettings: IReceiver<IGuiSettingsState> & IGuiSettingsMethods = {
+  public static guiSettings: IGuiSettingsMethods = {
     listen: listen(GUI_SETTINGS_CHANGED),
     setAutoConnect: set(SET_AUTO_CONNECT),
     setMonochromaticIcon: set(SET_MONOCHROMATIC_ICON),
     setStartMinimized: set(SET_START_MINIMIZED),
   };
 
-  public static autoStart: IReceiver<boolean> & IAutoStartMethods = {
+  public static autoStart: IAutoStartMethods = {
     listen: listen(AUTO_START_CHANGED),
     set: requestSender(SET_AUTO_START),
   };
@@ -215,7 +214,7 @@ export class IpcRendererEventChannel {
   };
 
   public static accountHistory: IAccountHistoryMethods = {
-    get: requestSender(GET_ACCOUNT_HISTORY),
+    listen: listen(ACCOUNT_HISTORY_CHANGED),
     removeItem: requestSender(REMOVE_ACCOUNT_HISTORY_ITEM),
   };
 }
@@ -237,7 +236,7 @@ export class IpcMainEventChannel {
     notify: sender(DAEMON_DISCONNECTED),
   };
 
-  public static tunnel: ISender<TunnelStateTransition> & ITunnelHandlers = {
+  public static tunnel: ITunnelHandlers = {
     notify: sender(TUNNEL_STATE_CHANGED),
     handleConnect: requestHandler(CONNECT_TUNNEL),
     handleDisconnect: requestHandler(DISCONNECT_TUNNEL),
@@ -247,7 +246,7 @@ export class IpcMainEventChannel {
     notify: sender(LOCATION_CHANGED),
   };
 
-  public static settings: ISender<ISettings> & ISettingsHandlers = {
+  public static settings: ISettingsHandlers = {
     notify: sender(SETTINGS_CHANGED),
     handleAllowLan: requestHandler(SET_ALLOW_LAN),
     handleEnableIpv6: requestHandler(SET_ENABLE_IPV6),
@@ -268,14 +267,14 @@ export class IpcMainEventChannel {
     notify: sender(UPGRADE_VERSION_CHANGED),
   };
 
-  public static guiSettings: ISender<IGuiSettingsState> & IGuiSettingsHandlers = {
+  public static guiSettings: IGuiSettingsHandlers = {
     notify: sender(GUI_SETTINGS_CHANGED),
     handleAutoConnect: handler(SET_AUTO_CONNECT),
     handleMonochromaticIcon: handler(SET_MONOCHROMATIC_ICON),
     handleStartMinimized: handler(SET_START_MINIMIZED),
   };
 
-  public static autoStart: ISender<boolean> & IAutoStartHandlers = {
+  public static autoStart: IAutoStartHandlers = {
     notify: sender<boolean>(AUTO_START_CHANGED),
     handleSet: requestHandler(SET_AUTO_START),
   };
@@ -287,7 +286,7 @@ export class IpcMainEventChannel {
   };
 
   public static accountHistory: IAccountHistoryHandlers = {
-    handleGet: requestHandler(GET_ACCOUNT_HISTORY),
+    notify: sender<AccountToken[]>(ACCOUNT_HISTORY_CHANGED),
     handleRemoveItem: requestHandler(REMOVE_ACCOUNT_HISTORY_ITEM),
   };
 }