imrpoved closed tabs order algorithm

packages/web/src/TabsPanel.js

@@ -9,6 +9,7 @@ import { FontIcon } from './icons';
 import useTheme from './theme/useTheme';
 import usePropsCompare from './utility/usePropsCompare';
 import { useShowMenu } from './modals/showMenu';
+import { setSelectedTabFunc } from './utility/common';
 
 // const files = [
 //   { name: 'app.js' },
@@ -140,19 +141,12 @@ export default function TabsPanel() {
     if (e.target.closest('.tabCloseButton')) {
       return;
     }
-    setOpenedTabs(files =>
-      files.map(x => ({
-        ...x,
-        selected: x.tabid == tabid,
-      }))
-    );
+    setOpenedTabs(files => setSelectedTabFunc(files, tabid));
   };
   const closeTabFunc = closeCondition => tabid => {
     setOpenedTabs(files => {
       const active = files.find(x => x.tabid == tabid);
       if (!active) return files;
-      const lastSelectedIndex = _.findIndex(files, x => x.tabid == tabid);
-      let selectedIndex = lastSelectedIndex;
 
       const newFiles = files.map(x => ({
         ...x,
@@ -163,25 +157,12 @@ export default function TabsPanel() {
         return newFiles;
       }
 
-      while (selectedIndex >= 0 && newFiles[selectedIndex].closedTime) selectedIndex -= 1;
-
-      if (selectedIndex < 0) {
-        selectedIndex = lastSelectedIndex;
-        while (selectedIndex < newFiles.length && newFiles[selectedIndex].closedTime) selectedIndex += 1;
-      }
-
-      if (selectedIndex < 0 || selectedIndex >= newFiles.length)
-        selectedIndex = _.findIndex(newFiles, x => x.closedTime == null);
+      const selectedIndex = _.findLastIndex(newFiles, x => x.closedTime == null);
 
       return newFiles.map((x, index) => ({
         ...x,
         selected: index == selectedIndex,
       }));
-
-      // if (selectedIndex != lastSelectedIndex) {
-      // }
-
-      // return newFiles;
     });
   };
 

packages/web/src/appobj/ClosedTabAppObject.js

@@ -4,6 +4,7 @@ import moment from 'moment';
 import { DropDownMenuItem } from '../modals/DropDownMenu';
 import { useSetOpenedTabs } from '../utility/globalState';
 import { AppObjectCore } from './AppObjectCore';
+import { setSelectedTabFunc } from '../utility/common';
 
 function Menu({ data }) {
   const setOpenedTabs = useSetOpenedTabs();
@@ -27,11 +28,15 @@ function ClosedTabAppObject({ data, commonProps }) {
 
   const onClick = () => {
     setOpenedTabs(files =>
-      files.map(x => ({
-        ...x,
-        selected: x.tabid == tabid,
-        closedTime: x.tabid == tabid ? undefined : x.closedTime,
-      }))
+      setSelectedTabFunc(
+        files.map(
+          x => ({
+            ...x,
+            closedTime: x.tabid == tabid ? undefined : x.closedTime,
+          }),
+          tabid
+        )
+      )
     );
   };
 

packages/web/src/tabs/MarkdownEditorTab.js

@@ -10,6 +10,7 @@ import useModalState from '../modals/useModalState';
 import LoadingInfo from '../widgets/LoadingInfo';
 import { useOpenedTabs, useSetOpenedTabs } from '../utility/globalState';
 import useOpenNewTab from '../utility/useOpenNewTab';
+import { setSelectedTabFunc } from '../utility/common';
 
 export default function MarkdownEditorTab({ tabid, tabVisible, toolbarPortalRef, ...other }) {
   const { editorData, setEditorData, isLoading, saveToStorage } = useEditorData({ tabid });
@@ -29,12 +30,7 @@ export default function MarkdownEditorTab({ tabid, tabVisible, toolbarPortalRef,
     await saveToStorage();
     const existing = (openedTabs || []).find(x => x.props && x.props.sourceTabId == tabid && x.closedTime == null);
     if (existing) {
-      setOpenedTabs(tabs =>
-        tabs.map(x => ({
-          ...x,
-          selected: x.tabid == existing.tabid,
-        }))
-      );
+      setOpenedTabs(tabs => setSelectedTabFunc(tabs, existing.tabid));
     } else {
       const thisTab = (openedTabs || []).find(x => x.tabid == tabid);
       openNewTab({

packages/web/src/utility/common.js

@@ -15,3 +15,10 @@ export function sleep(milliseconds) {
 export function changeTab(tabid, setOpenedTabs, changeFunc) {
   setOpenedTabs(files => files.map(tab => (tab.tabid == tabid ? changeFunc(tab) : tab)));
 }
+
+export function setSelectedTabFunc(files, tabid) {
+  return [
+    ...(files || []).filter(x => x.tabid != tabid).map(x => ({ ...x, selected: false })),
+    ...(files || []).filter(x => x.tabid == tabid).map(x => ({ ...x, selected: true })),
+  ];
+}

packages/web/src/utility/useOpenNewTab.js

@@ -5,6 +5,7 @@ import stableStringify from 'json-stable-stringify';
 import _ from 'lodash';
 import { useOpenedTabs, useSetOpenedTabs } from './globalState';
 import tabs from '../tabs';
+import { setSelectedTabFunc } from './common';
 
 export default function useOpenNewTab() {
   const setOpenedTabs = useSetOpenedTabs();
@@ -37,12 +38,7 @@ export default function useOpenNewTab() {
       }
 
       if (existing) {
-        setOpenedTabs(tabs =>
-          tabs.map(x => ({
-            ...x,
-            selected: x.tabid == existing.tabid,
-          }))
-        );
+        setOpenedTabs(tabs => setSelectedTabFunc(tabs, existing.tabid));
         return;
       }