(null)
+ const close = useCallback(() => setSearchIsActive(false), [setSearchIsActive])
+
+ const selectPrevOrNextResult = useCallback(
+ (ev: KeyboardEvent) => {
+ if (ev.shiftKey) {
+ selectPrev()
+ } else {
+ selectNext()
+ }
+ },
+ [selectPrev, selectNext],
+ )
+
const onKeyDown = useCallback(
(ev: KeyboardEvent) => {
ev.stopPropagation()
@@ -37,6 +81,10 @@ export const SearchView = memo(
setSearchIsActive(false)
}
+ if (ev.key === 'Enter') {
+ selectPrevOrNextResult(ev)
+ }
+
if (ev.key == 'f' && (ev.metaKey || ev.ctrlKey)) {
if (inputRef.current) {
// If the input is already focused, select all
@@ -49,7 +97,7 @@ export const SearchView = memo(
ev.preventDefault()
}
},
- [setSearchIsActive],
+ [setSearchIsActive, selectPrevOrNextResult],
)
useEffect(() => {
@@ -81,24 +129,37 @@ export const SearchView = memo(
}
}, [setSearchIsActive])
- const close = useCallback(() => setSearchIsActive(false), [setSearchIsActive])
-
if (!searchIsActive) return null
return (
🔍
-
-
+
+
+
+ {numResults != null && (
+
+
+ {resultIndex == null ? '?' : resultIndex + 1}/{numResults}
+
+
+
+
+ )}