Update DashboardTabs for Improved ID Handling and Scrolling Logic

- Added `htmlId` prop to `DashboardTabItem` for better accessibility and unique identification of tab items.
- Adjusted scrolling logic to account for offset, enhancing the user experience when navigating through tabs.

src/components/Dashboard/common/DashboardTabs.jsx

@@ -77,6 +77,7 @@ DashboardTabLabel.propTypes = {
 }
 
 const DashboardTabItem = memo(function DashboardTabItem({
+  htmlId = undefined,
   tab,
   tabIndex,
   isSelected,
@@ -142,7 +143,7 @@ const DashboardTabItem = memo(function DashboardTabItem({
       draggable
       onDragStart={(event) => onDragStart(event, tab.id)}
       onDragEnd={onDragEnd}
-      id={`dashboard-tab-item-${tab.id}`}
+      id={htmlId}
       onClick={() => onClick(tab.id)}
       onKeyDown={(event) => onKeyDown(event, tabIndex)}
       onDragOver={(event) => onDragOver(event, tab)}
@@ -190,6 +191,7 @@ const DashboardTabItem = memo(function DashboardTabItem({
 DashboardTabItem.displayName = 'DashboardTabItem'
 
 DashboardTabItem.propTypes = {
+  htmlId: PropTypes.string,
   tab: PropTypes.shape({
     id: PropTypes.string.isRequired,
     title: PropTypes.string,
@@ -749,13 +751,13 @@ const DashboardTabs = () => {
 
     const offset = 50
 
-    // Tab is off-screen to the left
+    // Tab is too close to / off-screen on the left
-    if (tabItemRect.left < scrollRect.left) {
+    if (tabItemRect.left < scrollRect.left + offset) {
       scrollEl.scrollLeft -= scrollRect.left - tabItemRect.left + offset
     }
 
-    // Tab is off-screen to the right
+    // Tab is too close to / off-screen on the right
-    else if (tabItemRect.right > scrollRect.right) {
+    else if (tabItemRect.right > scrollRect.right - offset) {
       scrollEl.scrollLeft += tabItemRect.right - scrollRect.right + offset
     }
   }
@@ -816,6 +818,7 @@ const DashboardTabs = () => {
                     tabIndex={index}
                     isSelected={isSelected}
                     isDragging={isDragging}
+                    htmlId={`dashboard-tab-item-${tab.id}`}
                     dropPosition={
                       isDropTarget
                         ? dropTarget.insertBefore