diff --git a/src/app/content/components/Topbar/index.tsx b/src/app/content/components/Topbar/index.tsx index 0ef7ac920f9..3f08646eff4 100644 --- a/src/app/content/components/Topbar/index.tsx +++ b/src/app/content/components/Topbar/index.tsx @@ -11,7 +11,7 @@ import { clearSearch, openMobileToolbar, openSearchResultsMobile, - requestSearch + requestSearch, } from '../../search/actions'; import * as selectSearch from '../../search/selectors'; import * as selectContent from '../../selectors'; @@ -19,6 +19,8 @@ import { mobileNudgeStudyToolsTargetId } from '../NudgeStudyTools/constants'; import { NudgeElementTarget } from '../NudgeStudyTools/styles'; import * as Styled from './styled'; import { TextResizer } from './TextResizer'; +import { useKeyCombination, useMatchMobileQuery } from '../../../reactUtils'; +import { searchKeyCombination } from '../../highlights/constants'; interface Props { search: typeof requestSearch; @@ -35,6 +37,7 @@ interface Props { bookTheme: string; textSize: TextResizerValue | null; setTextSize: (size: TextResizerValue) => void; + selectedResult: any; } type CommonSearchInputParams = Pick< @@ -263,6 +266,27 @@ function Topbar(props: Props) { [props] ); + const isMobile = useMatchMobileQuery(); + const cycleSearchRegions = React.useCallback( + // Only in desktop layout + () => { + if (isMobile) { + console.info('Mobile: ignore'); + return; + } + // Identify which regions are available + const hasResults = props.hasSearchResults; + const ssr = props.selectedResult; + // Determine which region we are in (if any) + // Navigate to the next region in sequence + console.info('Next region!', {isMobile, hasResults, query, ssr}); + + }, + [isMobile, props.hasSearchResults, props.selectedResult, query] + ); + + useKeyCombination(searchKeyCombination, cycleSearchRegions); + return ( @@ -325,6 +349,7 @@ export default connect( searchInSidebar: selectSearch.searchInSidebar(state), searchSidebarOpen: selectSearch.searchResultsOpen(state), textSize: selectContent.textSize(state), + selectedResult: selectSearch.selectedResult(state), }), (dispatch: Dispatch) => ({ clearSearch: flow(clearSearch, dispatch), diff --git a/src/app/content/highlights/constants.ts b/src/app/content/highlights/constants.ts index 9e0430a6bf5..ab8b10bfcd5 100644 --- a/src/app/content/highlights/constants.ts +++ b/src/app/content/highlights/constants.ts @@ -17,3 +17,8 @@ export const highlightKeyCombination: KeyCombinationOptions = { code: 'KeyH', // key isn't always h when alt is pressed altKey: true, }; + +export const searchKeyCombination: KeyCombinationOptions = { + code: 'KeyS', + altKey: true, +}; diff --git a/src/app/content/search/components/SearchResultsSidebar/SearchResultHits.tsx b/src/app/content/search/components/SearchResultsSidebar/SearchResultHits.tsx index 7aa03da8e22..eaa02b001aa 100644 --- a/src/app/content/search/components/SearchResultsSidebar/SearchResultHits.tsx +++ b/src/app/content/search/components/SearchResultsSidebar/SearchResultHits.tsx @@ -82,6 +82,7 @@ const OneSearchResultHit = ({ return (