@antscorp/antsomi-ui 1.3.5-common.4 → 1.3.5-common.5

package/es/components/molecules/EditorTab/EditorTab.d.ts

@@ -14,7 +14,6 @@ interface EditorTabProps {
     showArrow?: boolean;
     showDropdown?: boolean;
     editNameOnConfigure?: boolean;
-    disabledScroll?: boolean;
     showComposeNewQuery?: boolean;
     className?: string;
     leftBlockClassName?: string;

package/es/components/molecules/EditorTab/EditorTab.js

@@ -11,7 +11,9 @@ import { handleError } from '@antscorp/antsomi-ui/es/utils';
 const PATH = 'src/components/EditorTab/index.jsx';
 export const EditorTab = props => {
     var _a;
-    const { listTab = [], activeId = '', defaultActiveId, showArrow, showDropdown, editNameOnConfigure, disabledScroll, onCloseTab, onActiveTab, onAddTab, onConfigure, onSaveName, showComposeNewQuery, className, leftBlockClassName, tabItemClassName, } = props;
+    const { listTab = [], activeId = '', defaultActiveId, showArrow, showDropdown, editNameOnConfigure, 
+    // disabledScroll,
+    onCloseTab, onActiveTab, onAddTab, onConfigure, onSaveName, showComposeNewQuery, className, leftBlockClassName, tabItemClassName, } = props;
     const [activeTabId, setActiveTabId] = useState(defaultActiveId || activeId || ((_a = listTab === null || listTab === void 0 ? void 0 : listTab[0]) === null || _a === void 0 ? void 0 : _a.id));
     const [arrTabs, setArrTabs] = useState(listTab || []);
     const [isEditable, setIsEditable] = useState();
@@ -23,23 +25,25 @@ export const EditorTab = props => {
             setActiveTabId(listTab[listTab.length - 1].id);
         }
         setArrTabs(listTab);
-    }, [listTab, arrTabs.length]);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [listTab]);
     useEffect(() => {
-        onActiveTab(activeTabId);
-        setTimeout(() => {
-            if (!disabledScroll) {
-                const tabEl = document.getElementById(`tab-${activeTabId}`);
-                if (tabEl) {
-                    tabEl.scrollIntoView({ block: 'center', inline: 'center', behavior: 'smooth' });
-                }
-            }
-        }, 500);
-    }, [activeTabId, disabledScroll, onActiveTab]);
+        if (onActiveTab)
+            onActiveTab(activeTabId);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [activeTabId]);
     useEffect(() => {
-        if (activeId && activeTabId !== activeId) {
-            setActiveTabId(activeId);
+        const tabEl = document.getElementById(`tab-${activeTabId}`);
+        if (tabEl) {
+            tabEl.scrollIntoView({ block: 'center', inline: 'center', behavior: 'smooth' });
         }
-    }, [activeId, activeTabId]);
+    }, [activeTabId]);
+    useEffect(() => {
+        // if (activeId && activeTabId !== activeId) {
+        //   setActiveTabId(activeId);
+        // }
+        setActiveTabId(prev => (activeId && prev !== activeId ? activeId : prev));
+    }, [activeId]);
     const handleAddNew = () => {
         onAddTab();
     };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antscorp/antsomi-ui",
-  "version": "1.3.5-common.4",
+  "version": "1.3.5-common.5",
   "description": "An enterprise-class UI design language and React UI library.",
   "sideEffects": [
     "dist/*",