tabs: lastActiveTab should be lastActiveTabId.

save-last-tab should use id

Author: shubham-padia

app/common/config-schemata.ts

@@ -21,7 +21,7 @@ export const configSchemata = {
   downloadsPath: z.string(),
   enableSpellchecker: z.boolean(),
   errorReporting: z.boolean(),
-  lastActiveTab: z.number(),
+  lastActiveTabId: z.string().optional(),
   promptDownload: z.boolean(),
   proxyBypass: z.string(),
   // eslint-disable-next-line @typescript-eslint/naming-convention

app/common/typed-ipc.ts

@@ -13,7 +13,7 @@ export type MainMessage = {
   "realm-icon-changed": (serverURL: string, iconURL: string) => void;
   "realm-name-changed": (serverURL: string, realmName: string) => void;
   "reload-full-app": () => void;
-  "save-last-tab": (index: number) => void;
+  "save-last-tab": (id: string) => void;
   "switch-server-tab": (id: string) => void;
   "toggle-app": () => void;
   "toggle-badge-option": (newValue: boolean) => void;

app/main/index.ts

@@ -451,8 +451,8 @@ function createMainWindow(): BrowserWindow {
     },
   );
 
-  ipcMain.on("save-last-tab", (_event, index: number) => {
-    ConfigUtil.setConfigItem("lastActiveTab", index);
+  ipcMain.on("save-last-tab", (_event, id: string) => {
+    ConfigUtil.setConfigItem("lastActiveTabId", id);
   });
 
   ipcMain.on("focus-this-webview", (event) => {

app/renderer/js/main.ts

@@ -85,7 +85,7 @@ export class ServerManagerView {
   loading: Set<string>;
   activeTab?: ServerOrFunctionalTab;
   tabs: ServerOrFunctionalTab[];
-  functionalTabs: Map<TabPage, number>;
+  functionalTabs: Map<TabPage, string>;
   presetOrgs: string[];
   preferenceView?: PreferenceView;
   constructor() {
@@ -195,7 +195,7 @@ export class ServerManagerView {
       // eslint-disable-next-line @typescript-eslint/naming-convention
       customCSS: false,
       silent: false,
-      lastActiveTab: 0,
+      lastActiveTabId: undefined,
       dnd: false,
       dndPreviousSettings: {
         showNotification: true,
@@ -343,18 +343,23 @@ export class ServerManagerView {
       }
 
       // Open last active tab
-      let lastActiveTab = ConfigUtil.getConfigItem("lastActiveTab", 0);
-      if (lastActiveTab >= servers.length) {
-        lastActiveTab = 0;
+      const firstTab = this.tabs[0];
+      const lastActiveTabId = ConfigUtil.getConfigItem(
+        "lastActiveTabId",
+        firstTab.properties.tabId,
+      )!;
+      let lastActiveTab = this.getTabById(lastActiveTabId)!;
+      if (lastActiveTab.properties.index >= servers.length) {
+        lastActiveTab = firstTab;
       }
 
-      // `webview.load()` for lastActiveTab before the others
-      await this.activateTab(lastActiveTab);
+      // `webview.load()` for lastActiveTabId before the others
+      await this.activateTab(lastActiveTabId);
       await Promise.all(
         servers.map(async (server, i) => {
-          // After the lastActiveTab is activated, we load the others in the background
+          // After the lastActiveTabId is activated, we load the others in the background
           // without activating them, to prevent flashing of server icons
-          if (i === lastActiveTab) {
+          if (server.id === lastActiveTabId) {
             return;
           }
 
@@ -379,7 +384,7 @@ export class ServerManagerView {
       icon: DomainUtil.iconAsUrl(server.icon),
       label: server.alias,
       $root: this.$tabsContainer,
-      onClick: this.activateLastTab.bind(this, index),
+      onClick: this.activateLastTab.bind(this, tabId),
       index,
       tabId,
       onHover: this.onHover.bind(this, index),
@@ -568,9 +573,8 @@ export class ServerManagerView {
     }
 
     const index = this.tabs.length;
-    this.functionalTabs.set(tabProperties.page, index);
-
     const tabId = this.generateTabId();
+    this.functionalTabs.set(tabProperties.page, tabId);
     const $view = await tabProperties.makeView();
     this.$webviewsContainer.append($view);
 
@@ -583,9 +587,9 @@ export class ServerManagerView {
         $root: this.$tabsContainer,
         index,
         tabId,
-        onClick: this.activateTab.bind(this, index),
+        onClick: this.activateTab.bind(this, tabId),
         onDestroy: async () => {
-          await this.destroyFunctionalTab(tabProperties.page, index);
+          await this.destroyFunctionalTab(tabProperties.page, tabId);
           tabProperties.destroyView();
         },
         $view,
@@ -596,7 +600,7 @@ export class ServerManagerView {
     // closed when the functional tab DOM is ready, handled in webview.js
     this.$webviewsContainer.classList.remove("loaded");
 
-    await this.activateTab(this.functionalTabs.get(tabProperties.page)!);
+    await this.activateTab(tabId);
   }
 
   async openSettings(
@@ -648,11 +652,11 @@ export class ServerManagerView {
       .loadURL(new URL("app/renderer/network.html", bundleUrl).href);
   }
 
-  async activateLastTab(index: number): Promise<void> {
+  async activateLastTab(id: string): Promise<void> {
     // Open all the tabs in background, also activate the tab based on the index
-    await this.activateTab(index);
+    await this.activateTab(id);
     // Save last active tab via main process to avoid JSON DB errors
-    ipcRenderer.send("save-last-tab", index);
+    ipcRenderer.send("save-last-tab", id);
   }
 
   // Returns tab in an way that does not crash app when it is passed
@@ -672,8 +676,8 @@ export class ServerManagerView {
     return this.tabs.map((tab) => this.tabForIpc(tab));
   }
 
-  async activateTab(index: number, hideOldTab = true): Promise<void> {
-    const tab = this.tabs[index];
+  async activateTab(id: string, hideOldTab = true): Promise<void> {
+    const tab = this.getTabById(id);
     if (!tab) {
       return;
     }
@@ -730,8 +734,8 @@ export class ServerManagerView {
     this.$loadingIndicator.classList.toggle("hidden", !loading);
   }
 
-  async destroyFunctionalTab(page: TabPage, index: number): Promise<void> {
-    const tab = this.tabs[index];
+  async destroyFunctionalTab(page: TabPage, tabId: string): Promise<void> {
+    const tab = this.getTabById(tabId);
     if (!tab) {
       return;
     }
@@ -742,15 +746,14 @@ export class ServerManagerView {
 
     const wasActive = tab === this.activeTab;
 
+    delete this.tabs[tab.properties.index]; // eslint-disable-line @typescript-eslint/no-array-delete
     await tab.destroy();
-
-    delete this.tabs[index]; // eslint-disable-line @typescript-eslint/no-array-delete
     this.functionalTabs.delete(page);
 
     // Issue #188: If the functional tab was not focused, do not activate another tab.
     if (wasActive) {
       this.activeTab = undefined;
-      await this.activateTab(0, false);
+      await this.activateTab(this.tabs[0].properties.tabId, false);
     }
   }
 
@@ -772,7 +775,7 @@ export class ServerManagerView {
     // Save and remember the index of last active tab so that we can use it later
     const {activeTab} = this;
     if (activeTab !== undefined) {
-      ConfigUtil.setConfigItem("lastActiveTab", activeTab.properties.index);
+      ConfigUtil.setConfigItem("lastActiveTabId", activeTab.properties.tabId);
     }
 
     // Destroy the current view and re-initiate it
@@ -865,8 +868,8 @@ export class ServerManagerView {
           enabled: await this.isLoggedIn(index),
           click: async () => {
             // Switch to tab whose icon was right-clicked
-            await this.activateTab(index);
             const tab = this.tabs[index];
+            await this.activateTab(tab.properties.tabId);
             if (tab instanceof ServerTab)
               (await tab.webview).showNotificationSettings();
           },
@@ -1020,8 +1023,7 @@ export class ServerManagerView {
     });
 
     ipcRenderer.on("switch-server-tab", async (event, tabId: string) => {
-      const tab = this.getTabById(tabId)!;
-      await this.activateLastTab(tab.properties.index);
+      await this.activateLastTab(tabId);
     });
 
     ipcRenderer.on("open-org-tab", async () => {