File tree Expand file tree Collapse file tree 1 file changed +12
-0
lines changed
src/browser/components/ChatInput Expand file tree Collapse file tree 1 file changed +12
-0
lines changed Original file line number Diff line number Diff line change @@ -18,6 +18,7 @@ export function SSHHostInput(props: SSHHostInputProps) {
1818 const [ highlightedIndex , setHighlightedIndex ] = useState ( - 1 ) ;
1919 const inputRef = useRef < HTMLInputElement > ( null ) ;
2020 const containerRef = useRef < HTMLDivElement > ( null ) ;
21+ const itemRefs = useRef < Array < HTMLDivElement | null > > ( [ ] ) ;
2122
2223 // Fetch SSH config hosts on mount
2324 useEffect ( ( ) => {
@@ -101,6 +102,16 @@ export function SSHHostInput(props: SSHHostInputProps) {
101102 setHighlightedIndex ( - 1 ) ;
102103 } ;
103104
105+ // Scroll highlighted item into view
106+ useEffect ( ( ) => {
107+ if ( highlightedIndex >= 0 && itemRefs . current [ highlightedIndex ] ) {
108+ itemRefs . current [ highlightedIndex ] ?. scrollIntoView ( {
109+ block : "nearest" ,
110+ behavior : "smooth" ,
111+ } ) ;
112+ }
113+ } , [ highlightedIndex ] ) ;
114+
104115 // Show dropdown when there are filtered hosts
105116 const shouldShowDropdown = showDropdown && filteredHosts . length > 0 && ! props . disabled ;
106117
@@ -123,6 +134,7 @@ export function SSHHostInput(props: SSHHostInputProps) {
123134 { filteredHosts . map ( ( host , index ) => (
124135 < div
125136 key = { host }
137+ ref = { ( el ) => ( itemRefs . current [ index ] = el ) }
126138 onClick = { ( ) => selectHost ( host ) }
127139 onMouseEnter = { ( ) => setHighlightedIndex ( index ) }
128140 className = { `cursor-pointer px-2 py-1 text-xs ${
You can’t perform that action at this time.
0 commit comments