Scroll tab target into view (#1580)

diff --git a/src/app/atoms/tabs/Tabs.jsx b/src/app/atoms/tabs/Tabs.jsx
index 39800ce350dbcbcb3f11c5423766792e588de2fd..bcdc8ef7eda3c5f594bb3c0b8eb07dd9eefff7be 100644 (file)
--- a/src/app/atoms/tabs/Tabs.jsx
+++ b/src/app/atoms/tabs/Tabs.jsx
@@ -41,8 +41,9 @@ TabItem.propTypes = {
 function Tabs({ items, defaultSelected, onSelect }) {
   const [selectedItem, setSelectedItem] = useState(items[defaultSelected]);
 
-  const handleTabSelection = (item, index) => {
+  const handleTabSelection = (item, index, target) => {
     if (selectedItem === item) return;
+    target.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'center' });
     setSelectedItem(item);
     onSelect(item, index);
   };
@@ -57,7 +58,7 @@ function Tabs({ items, defaultSelected, onSelect }) {
               selected={selectedItem.text === item.text}
               iconSrc={item.iconSrc}
               disabled={item.disabled}
-              onClick={() => handleTabSelection(item, index)}
+              onClick={(e) => handleTabSelection(item, index, e.currentTarget)}
             >
               {item.text}
             </TabItem>