From f5d41c89e65140233951ff77b97072f5f5ba95fb Mon Sep 17 00:00:00 2001
From: Jan Prochazka <jan.prochazka@gmail.com>
Date: Sun, 5 Mar 2023 12:20:07 +0100
Subject: [PATCH] show selected tab in multitab

---
 packages/web/src/tabpanel/TabRegister.svelte  | 26 +++++--------------
 .../web/src/tabpanel/TabsContainer.svelte     | 25 +++++++++++++++---
 packages/web/src/tabpanel/TabsPanel.svelte    |  5 +++-
 3 files changed, 32 insertions(+), 24 deletions(-)

diff --git a/packages/web/src/tabpanel/TabRegister.svelte b/packages/web/src/tabpanel/TabRegister.svelte
index be16d8da..eb73c09f 100644
--- a/packages/web/src/tabpanel/TabRegister.svelte
+++ b/packages/web/src/tabpanel/TabRegister.svelte
@@ -1,42 +1,28 @@
 <script lang="ts">
   import _ from 'lodash';
-  import { currentDatabase, lockedDatabaseMode, openedTabs, TabDefinition } from '../stores';
+  import { openedTabs } from '../stores';
   import TabContent from './TabContent.svelte';
   import tabs from '../tabs';
-  import { shouldShowTab } from './TabsPanel.svelte';
 
   export let multiTabIndex;
+  export let shownTab;
 
   let mountedTabs = {};
 
-  function findShownTab(tabs: TabDefinition[], multiTabIndex, lockedDbMode, currentDb) {
-    const selectedTab = tabs.find(x => x.selected && x.closedTime == null && (x.multiTabIndex || 0) == multiTabIndex);
-    if (selectedTab) {
-      return selectedTab;
-    }
-
-    const selectedIndex = _.findLastIndex(
-      tabs,
-      x => (x.multiTabIndex || 0) == multiTabIndex && shouldShowTab(x, lockedDbMode, currentDb)
-    );
-
-    return tabs[selectedIndex];
-  }
-
-  $: shownTab = findShownTab($openedTabs, multiTabIndex, $lockedDatabaseMode, $currentDatabase);
-
   // cleanup closed tabs
   $: {
     if (
       _.difference(
         _.keys(mountedTabs),
         _.map(
-          $openedTabs.filter(x => x.closedTime == null),
+          $openedTabs.filter(x => x.closedTime == null && (x.multiTabIndex || 0) == multiTabIndex),
           'tabid'
         )
       ).length > 0
     ) {
-      mountedTabs = _.pickBy(mountedTabs, (v, k) => $openedTabs.find(x => x.tabid == k && x.closedTime == null));
+      mountedTabs = _.pickBy(mountedTabs, (v, k) =>
+        $openedTabs.find(x => x.tabid == k && x.closedTime == null && (x.multiTabIndex || 0) == multiTabIndex)
+      );
     }
   }
 
diff --git a/packages/web/src/tabpanel/TabsContainer.svelte b/packages/web/src/tabpanel/TabsContainer.svelte
index 439610b9..51da6107 100644
--- a/packages/web/src/tabpanel/TabsContainer.svelte
+++ b/packages/web/src/tabpanel/TabsContainer.svelte
@@ -1,15 +1,34 @@
-<script lang='ts'>
+<script lang="ts">
   import TabRegister from './TabRegister.svelte';
   import TabsPanel from './TabsPanel.svelte';
+  import _ from 'lodash';
+  import { currentDatabase, lockedDatabaseMode, openedTabs, TabDefinition } from '../stores';
+  import { shouldShowTab } from './TabsPanel.svelte';
 
   export let multiTabIndex;
+
+  function findShownTab(tabs: TabDefinition[], multiTabIndex, lockedDbMode, currentDb) {
+    const selectedTab = tabs.find(x => x.selected && x.closedTime == null && (x.multiTabIndex || 0) == multiTabIndex);
+    if (selectedTab) {
+      return selectedTab;
+    }
+
+    const selectedIndex = _.findLastIndex(
+      tabs,
+      x => (x.multiTabIndex || 0) == multiTabIndex && shouldShowTab(x, lockedDbMode, currentDb)
+    );
+
+    return tabs[selectedIndex];
+  }
+
+  $: shownTab = findShownTab($openedTabs, multiTabIndex, $lockedDatabaseMode, $currentDatabase);
 </script>
 
 <div class="tabs">
-  <TabsPanel {multiTabIndex} />
+  <TabsPanel {multiTabIndex} {shownTab} />
 </div>
 <div class="content">
-  <TabRegister {multiTabIndex} />
+  <TabRegister {multiTabIndex} {shownTab} />
 </div>
 
 <style>
diff --git a/packages/web/src/tabpanel/TabsPanel.svelte b/packages/web/src/tabpanel/TabsPanel.svelte
index 479aaef2..d836d0d9 100644
--- a/packages/web/src/tabpanel/TabsPanel.svelte
+++ b/packages/web/src/tabpanel/TabsPanel.svelte
@@ -281,6 +281,7 @@
   import CloseTabModal from '../modals/CloseTabModal.svelte';
 
   export let multiTabIndex;
+  export let shownTab;
 
   $: showTabFilterFunc = tab =>
     shouldShowTab(tab, $lockedDatabaseMode, $currentDatabase) && (tab.multiTabIndex || 0) == multiTabIndex;
@@ -517,7 +518,9 @@
             <div
               id={`file-tab-item-${tab.tabid}`}
               class="file-tab-item"
-              class:selected={$draggingTab || $draggingDbGroup ? tab.tabid == $draggingTabTarget?.tabid : tab.selected}
+              class:selected={$draggingTab || $draggingDbGroup
+                ? tab.tabid == $draggingTabTarget?.tabid
+                : tab.tabid == shownTab?.tabid}
               on:click={e => handleTabClick(e, tab.tabid)}
               on:mouseup={e => handleMouseUp(e, tab.tabid)}
               use:contextMenu={getContextMenu(tab)}