feat: sort result list

Author: HerringtonDarkholme

src/webview/SearchSidebar/SearchResultList/index.tsx

@@ -1,6 +1,7 @@
 import { memo, useCallback } from 'react'
 import type { DisplayResult } from '../../../types'
 import TreeItem from './TreeItem'
+import { refScroller } from './useListState'
 import * as stylex from '@stylexjs/stylex'
 import { Virtuoso } from 'react-virtuoso'
 
@@ -37,6 +38,7 @@ const SearchResultList = ({ matches }: SearchResultListProps) => {
   )
   return (
     <Virtuoso
+      ref={refScroller}
       {...stylex.props(styles.resultList)}
       totalCount={matches.length}
       itemContent={render}

src/webview/SearchSidebar/SearchResultList/useListState.tsx

@@ -4,6 +4,13 @@
 import { useCallback } from 'react'
 import { useBoolean } from 'react-use'
 import { onResultChange } from '../../hooks/useSearch'
+import type { VirtuosoHandle } from 'react-virtuoso'
+
+let ref: VirtuosoHandle
+
+export function refScroller(handle: VirtuosoHandle) {
+  ref = handle
+}
 
 const collapseMap = new Map<string, boolean>()
 
@@ -17,7 +24,11 @@ export function useToggleResult(filePath: string) {
   const toggleIsExpanded = useCallback(() => {
     toggleResult(filePath)
     toggle()
-  }, [filePath, toggle])
+    if (isExpanded) {
+      // TODO
+      // ref.scrollToIndex(10)
+    }
+  }, [filePath, toggle, isExpanded])
   return [isExpanded, toggleIsExpanded] as const
 }
 

src/webview/hooks/useSearch.tsx

@@ -50,6 +50,10 @@ export function onResultChange(f: () => void) {
   }
 }
 
+function byFileName(a: [string, unknown], b: [string, unknown]) {
+  return a[0].localeCompare(b[0])
+}
+
 // this function is also called in useQuery
 function postSearch(searchQuery: SearchQuery) {
   id = (id + 1) % MOD
@@ -68,6 +72,7 @@ childPort.onMessage('searchResultStreaming', event => {
   refreshResultIfStale()
   queryInFlight = query
   grouped = merge(groupBy(event.searchResult))
+  grouped.sort(byFileName)
   notify()
 })
 
@@ -104,6 +109,7 @@ childPort.onMessage('refreshSearchResult', event => {
     temp.set(fileName, updatedResults)
   }
   grouped = [...temp.entries()]
+  grouped.sort(byFileName)
   notify()
 })