From 10dfe2e47c43b36479f02587d977031bc6c0c0db Mon Sep 17 00:00:00 2001 From: Michael An <2331806369@qq.com> Date: Thu, 11 Jul 2024 20:37:57 +0800 Subject: [PATCH] fix search when change repoID (#6338) * fix search when change repoID * change function name --- frontend/src/components/search/ai-search.js | 56 +++++++++++++------ frontend/src/components/search/search.js | 21 +++++-- .../src/components/toolbar/common-toolbar.js | 10 ++-- .../lib-content-view/lib-content-view.js | 2 + 4 files changed, 60 insertions(+), 29 deletions(-) diff --git a/frontend/src/components/search/ai-search.js b/frontend/src/components/search/ai-search.js index 83c9778e1e..9f98f547f5 100644 --- a/frontend/src/components/search/ai-search.js +++ b/frontend/src/components/search/ai-search.js @@ -30,7 +30,6 @@ export default class AISearch extends Component { path: PropTypes.string, placeholder: PropTypes.string, onSearchedClick: PropTypes.func.isRequired, - repoName: PropTypes.string, currentRepoInfo: PropTypes.object, isViewFile: PropTypes.bool, isLibView: PropTypes.bool, @@ -64,22 +63,10 @@ export default class AISearch extends Component { this.inputRef = React.createRef(); this.searchContainer = React.createRef(); this.searchResultListRef = React.createRef(); + this.searchResultListContainerRef = React.createRef(); this.indexStateTimer = null; this.isChineseInput = false; - if (props.isLibView && props.currentRepoInfo) { - this.isRepoOwner = props.currentRepoInfo.owner_email === username; - this.isAdmin = props.currentRepoInfo.is_admin; - } else { - this.isRepoOwner = false; - this.isAdmin = false; - } - this.searchResultListContainerRef = React.createRef(); - const { repoID } = props; - let storeKey = 'sfVisitedAISearchItems'; - if (repoID) { - storeKey += repoID; - } - this.storeKey = storeKey; + this.calculateStoreKey(props); } componentDidMount() { @@ -88,12 +75,45 @@ export default class AISearch extends Component { document.addEventListener('compositionend', this.onCompositionEnd); document.addEventListener('click', this.handleOutsideClick); if (this.props.isLibView) { - this.queryLibraryIndexState(); + this.queryLibraryIndexState(this.props.repoID); } } - queryLibraryIndexState() { - seafileAPI.queryLibraryIndexState(this.props.repoID).then(res => { + UNSAFE_componentWillReceiveProps(nextProps) { + this.calculateStoreKey(nextProps); + if (nextProps.isLibView) { + if (this.props.repoID !== nextProps.repoID) { + this.queryLibraryIndexState(nextProps.repoID); + } + } else { + if (this.indexStateTimer) { + clearInterval(this.indexStateTimer); + this.indexStateTimer = null; + } + this.isChineseInput = false; + this.setState({ + indexState: '', + }); + } + } + + calculateStoreKey = (props) => { + if (props.isLibView && props.currentRepoInfo) { + this.isRepoOwner = props.currentRepoInfo.owner_email === username; + this.isAdmin = props.currentRepoInfo.is_admin; + } else { + this.isRepoOwner = false; + this.isAdmin = false; + } + let storeKey = 'sfVisitedAISearchItems'; + if (props.repoID) { + storeKey += props.repoID; + } + this.storeKey = storeKey; + }; + + queryLibraryIndexState(repoID) { + seafileAPI.queryLibraryIndexState(repoID).then(res => { const { state: indexState, task_id: taskId } = res.data; this.setState({ indexState }, () => { if (indexState === INDEX_STATE.RUNNING) { diff --git a/frontend/src/components/search/search.js b/frontend/src/components/search/search.js index c021875202..4154b064a3 100644 --- a/frontend/src/components/search/search.js +++ b/frontend/src/components/search/search.js @@ -58,12 +58,7 @@ class Search extends Component { this.searchResultListRef = React.createRef(); this.isChineseInput = false; this.searchResultListContainerRef = React.createRef(); - const { repoID } = props; - let storeKey = 'sfVisitedSearchItems'; - if (repoID) { - storeKey += repoID; - } - this.storeKey = storeKey; + this.calculateStoreKey(props); } componentDidMount() { @@ -72,6 +67,11 @@ class Search extends Component { document.addEventListener('compositionend', this.onCompositionEnd); } + UNSAFE_componentWillReceiveProps(nextProps) { + this.calculateStoreKey(nextProps); + this.isChineseInput = false; + } + componentWillUnmount() { document.removeEventListener('keydown', this.onDocumentKeydown); document.removeEventListener('compositionstart', this.onCompositionStart); @@ -79,6 +79,15 @@ class Search extends Component { this.isChineseInput = false; } + calculateStoreKey = (props) => { + const { repoID } = props; + let storeKey = 'sfVisitedSearchItems'; + if (repoID) { + storeKey += repoID; + } + this.storeKey = storeKey; + }; + onCompositionStart = () => { this.isChineseInput = true; }; diff --git a/frontend/src/components/toolbar/common-toolbar.js b/frontend/src/components/toolbar/common-toolbar.js index 28532cfaaa..cb60b6da42 100644 --- a/frontend/src/components/toolbar/common-toolbar.js +++ b/frontend/src/components/toolbar/common-toolbar.js @@ -32,6 +32,7 @@ class CommonToolbar extends React.Component { isLibView: props.isLibView, path: props.path, isViewFile: props.isViewFile, + currentRepoInfo: props.currentRepoInfo, }; } @@ -45,12 +46,12 @@ class CommonToolbar extends React.Component { this.unsubscribeLibChange && this.unsubscribeLibChange(); } - onRepoChange = ({ repoID, repoName, isLibView, path, isViewFile }) => { - this.setState({ repoID, repoName, isLibView, path, isViewFile }); + onRepoChange = ({ repoID, repoName, isLibView, path, isViewFile, currentRepoInfo }) => { + this.setState({ repoID, repoName, isLibView, path, isViewFile, currentRepoInfo }); }; renderSearch = () => { - const { repoID, repoName, isLibView, path, isViewFile } = this.state; + const { repoID, repoName, isLibView, path, isViewFile, currentRepoInfo } = this.state; const { searchPlaceholder } = this.props; const placeholder = searchPlaceholder || gettext('Search files'); @@ -62,9 +63,8 @@ class CommonToolbar extends React.Component { path={path} isViewFile={isViewFile} placeholder={placeholder} + currentRepoInfo={currentRepoInfo} onSearchedClick={this.props.onSearchedClick} - repoName={repoName} - currentRepoInfo={this.props.currentRepoInfo} isLibView={isLibView} /> ); diff --git a/frontend/src/pages/lib-content-view/lib-content-view.js b/frontend/src/pages/lib-content-view/lib-content-view.js index 7618e564bf..94774514db 100644 --- a/frontend/src/pages/lib-content-view/lib-content-view.js +++ b/frontend/src/pages/lib-content-view/lib-content-view.js @@ -207,6 +207,7 @@ class LibContentView extends React.Component { path: '', isViewFile: false, isLibView: false, + currentRepoInfo: null, }); } @@ -215,6 +216,7 @@ class LibContentView extends React.Component { this.props.eventBus.dispatch(EVENT_BUS_TYPE.CURRENT_LIBRARY_CHANGED, { repoID: this.props.repoID, repoName: this.state.repoName, + currentRepoInfo: this.state.currentRepoInfo, path: this.state.path, isViewFile: this.state.isViewFile, isLibView: true,