Fixed an issue where the Query History panel would auto-scroll to the top and did not preserve the scroll bar position for the selected entry. #9380

Author: adityatoshniwal

docs/en_US/release_notes_9_12.rst

@@ -26,4 +26,6 @@ Housekeeping
 
 Bug fixes
 *********
+| `Issue #9380 <https://github.com/pgadmin-org/pgadmin4/issues/9380>`_ - Fixed an issue where the Query History panel would auto-scroll to the top and did not preserve the scroll bar position for the selected entry.
+
 

web/pgadmin/tools/sqleditor/static/js/components/sections/QueryHistory.jsx

@@ -272,12 +272,8 @@ QuerySourceIcon.propTypes = {
 };
 
 function HistoryEntry({entry, formatEntryDate, itemKey, selectedItemKey, onClick}) {
-  return <ListItemButton component='li' tabIndex="0" data-label="history-entry" data-pgadmin={entry.is_pgadmin_query} ref={(ele)=>{
-    selectedItemKey==itemKey && ele?.scrollIntoView({
-      block: 'center',
-      behavior: 'smooth',
-    });
-  }} className={'QuerySources-fontSourceCode ' + (entry.status ? '' : 'QuerySources-itemError')} selected={selectedItemKey==itemKey} onClick={onClick}>
+  return <ListItemButton component='li' tabIndex="0" data-label="history-entry" data-pgadmin={entry.is_pgadmin_query}
+    className={'QuerySources-fontSourceCode ' + (entry.status ? '' : 'QuerySources-itemError')} selected={selectedItemKey==itemKey} onClick={onClick}>
     <Box whiteSpace="nowrap" textOverflow="ellipsis" overflow="hidden" >
       <QuerySourceIcon source={entry.query_source}/>
       {entry.query}
@@ -397,6 +393,10 @@ export function QueryHistory() {
           setActiveOnce(true);
           setSelectedItemKey((prev)=>prev || 1);
         }
+
+        listRef.current?.querySelector('[data-label="history-entry"].Mui-selected')?.scrollIntoView({
+          block: 'center',
+        });
       }
     });