akai-tools/readest
2
0
Fork 0
forked from akai/readest
Code Pull Requests Activity

fix(search): should be able to terminate search when sidebar is invisible (#2863)

Browse Source
This commit is contained in:
Huang Xin
2026-01-04 17:10:49 +01:00
committed by GitHub
parent 604ef65719
commit eed84a059a
5 changed files with 74 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/readest-app/src/app/reader/components/sidebar/SearchBar.tsx
+17 -11
View File
@@ -38,8 +38,8 @@ const SearchBar: React.FC<SearchBarProps> = ({ isVisible, bookKey, onHideSearchB
const { getBookData } = useBookDataStore();
const { getConfig, setConfig, saveConfig } = useBookDataStore();
const { getView, getProgress } = useReaderStore();
const { getSearchNavState, setSearchTerm, setSearchResults, setSearchProgress } =
useSidebarStore();
const { setSearchTerm, setSearchResults, setSearchProgress } = useSidebarStore();
const { getSearchNavState, getSearchStatus, setSearchStatus } = useSidebarStore();
const searchNavState = getSearchNavState(bookKey);
const { searchTerm } = searchNavState;
@@ -65,14 +65,12 @@ const SearchBar: React.FC<SearchBarProps> = ({ isVisible, bookKey, onHideSearchB
const addToHistory = useCallback(
(term: string) => {
setSearchHistory((prev) => {
const filtered = prev.filter((t) => t !== term);
const updated = [term, ...filtered].slice(0, MAX_SEARCH_HISTORY);
localStorage.setItem(historyStorageKey, JSON.stringify(updated));
return updated;
});
const filtered = searchHistory.filter((t) => t !== term);
const updated = [term, ...filtered].slice(0, MAX_SEARCH_HISTORY);
localStorage.setItem(historyStorageKey, JSON.stringify(updated));
setSearchHistory(updated);
},
[historyStorageKey],
[historyStorageKey, searchHistory],
);
const handleHistoryClick = (term: string) => {
@@ -176,13 +174,15 @@ const SearchBar: React.FC<SearchBarProps> = ({ isVisible, bookKey, onHideSearchB
inputRef.current.onfocus = () => {
inputFocusedRef.current = true;
};
inputRef.current.focus();
if (!appService?.isMobile) {
inputRef.current.focus();
}
}
if (isVisible && searchTerm) {
handleSearchTermChange(searchTerm);
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [isVisible]);
}, [appService, isVisible]);
useEffect(() => {
const handleKeyDown = (e: KeyboardEvent) => {
@@ -236,6 +236,7 @@ const SearchBar: React.FC<SearchBarProps> = ({ isVisible, bookKey, onHideSearchB
// Reset progress at start of search
setSearchProgress(bookKey, 0);
setSearchStatus(bookKey, 'searching');
const { section } = progress;
const index = searchConfig.scope === 'section' ? section.current : undefined;
@@ -253,8 +254,13 @@ const SearchBar: React.FC<SearchBarProps> = ({ isVisible, bookKey, onHideSearchB
const processResults = async () => {
for await (const result of generator) {
if (getSearchStatus(bookKey) === 'terminated') {
console.log('search terminated');
return;
}
if (typeof result === 'string') {
if (result === 'done') {
setSearchStatus(bookKey, 'completed');
setSearchResults(bookKey, [...results]);
setSearchProgress(bookKey, 1);
if (results.length > 0) {
apps/readest-app/src/app/reader/hooks/useSearchNav.ts
+2 -2
View File
@@ -6,8 +6,8 @@ import { flattenSearchResults } from '../components/sidebar/SearchResultsNav';
export function useSearchNav(bookKey: string) {
const { getView, getProgress } = useReaderStore();
const { setSideBarVisible, getSearchNavState, setSearchResultIndex, clearSearch } =
useSidebarStore();
const { setSideBarVisible } = useSidebarStore();
const { getSearchNavState, setSearchResultIndex, clearSearch } = useSidebarStore();
const searchNavState = getSearchNavState(bookKey);
const { searchTerm, searchResults, searchResultIndex, searchProgress } = searchNavState;
apps/readest-app/src/app/reader/hooks/useTextSelector.ts
+30 -40
View File
@@ -1,4 +1,4 @@
import { useEffect, useRef, useState } from 'react';
import { useEffect, useRef } from 'react';
import { useEnv } from '@/context/EnvContext';
import { useReaderStore } from '@/store/readerStore';
import { useBookDataStore } from '@/store/bookDataStore';
@@ -27,7 +27,6 @@ export const useTextSelector = (
const isTouchStarted = useRef(false);
const selectionPosition = useRef<number | null>(null);
const lastPointerType = useRef<string>('mouse');
const [textSelected, setTextSelected] = useState(false);
const isValidSelection = (sel: Selection) => {
return sel && sel.toString().trim().length > 0 && sel.rangeCount > 0;
@@ -47,7 +46,7 @@ export const useTextSelector = (
};
const makeSelection = async (sel: Selection, index: number, rebuildRange = false) => {
isTextSelected.current = true;
setTextSelected(true);
isUpToPopup.current = true;
const range = sel.getRangeAt(0);
if (rebuildRange) {
sel.removeAllRanges();
@@ -64,7 +63,7 @@ export const useTextSelector = (
// FIXME: extremely hacky way to dismiss system selection tools on iOS
const makeSelectionOnIOS = async (sel: Selection, index: number) => {
isTextSelected.current = true;
setTextSelected(true);
isUpToPopup.current = true;
const range = sel.getRangeAt(0);
setTimeout(() => {
sel.removeAllRanges();
@@ -81,25 +80,6 @@ export const useTextSelector = (
}, 30);
}, 30);
};
const handleSelectionchange = (doc: Document) => {
// Available on iOS, Android and Desktop, fired when the selection is changed
// Ideally the popup only shows when the selection is done,
const sel = doc.getSelection() as Selection;
if (osPlatform === 'ios' || appService?.isIOSApp) return;
if (!isValidSelection(sel)) {
if (!isUpToPopup.current) {
handleDismissPopup();
isTextSelected.current = false;
setTextSelected(false);
}
if (isPopuped.current) {
isUpToPopup.current = false;
}
return;
}
isUpToPopup.current = true;
};
const isPointerInsideSelection = (selection: Selection, ev: PointerEvent) => {
if (selection.rangeCount === 0) return false;
const range = selection.getRangeAt(0);
@@ -143,18 +123,38 @@ export const useTextSelector = (
const handleTouchEnd = () => {
isTouchStarted.current = false;
};
const handleSelectionchange = (doc: Document) => {
// Available on iOS, Android and Desktop, fired when the selection is changed
if (osPlatform !== 'android' || !appService?.isAndroidApp) return;
const sel = doc.getSelection() as Selection;
if (isValidSelection(sel)) {
isTextSelected.current = true;
isUpToPopup.current = true;
if (!selectionPosition.current) {
selectionPosition.current = view?.renderer?.start || null;
}
} else {
if (!isUpToPopup.current) {
handleDismissPopup();
isTextSelected.current = false;
}
if (isPopuped.current) {
isUpToPopup.current = false;
}
selectionPosition.current = null;
}
};
const handleScroll = () => {
// Prevent the container from scrolling when text is selected in paginated mode
// FIXME: this is a workaround for issue #873
// TODO: support text selection across pages
if (osPlatform !== 'android' || !appService?.isAndroidApp) return;
const viewSettings = getViewSettings(bookKey);
if (
appService?.isAndroidApp &&
isTextSelected.current &&
!viewSettings?.scrolled &&
view?.renderer?.containerPosition &&
selectionPosition.current
) {
if (viewSettings?.scrolled) return;
if (isTextSelected.current && view?.renderer?.containerPosition && selectionPosition.current) {
console.warn('Keep container position', selectionPosition.current);
view.renderer.containerPosition = selectionPosition.current;
}
@@ -189,15 +189,6 @@ export const useTextSelector = (
return;
};
useEffect(() => {
if (isTextSelected.current && !selectionPosition.current) {
selectionPosition.current = view?.renderer?.start || null;
} else if (!isTextSelected.current) {
selectionPosition.current = null;
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [textSelected]);
useEffect(() => {
const handleSingleClick = (): boolean => {
if (isUpToPopup.current) {
@@ -207,7 +198,6 @@ export const useTextSelector = (
if (isTextSelected.current) {
handleDismissPopup();
isTextSelected.current = false;
setTextSelected(false);
view?.deselect();
return true;
}