coop-cloud-chaos-patchs/outline
coop-cloud-chaos-patchs/outline
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Search fixes

Browse Source
This commit is contained in:
Jori Lallo 2018-02-04 17:27:57 -08:00
parent 47da3f2b9b
commit 2b81cea277
1 changed files with 10 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
app/scenes/Search/Search.js
View File

@ -68,6 +68,7 @@ class Search extends Component {
@observable offset: number = 0; @observable offset: number = 0;
@observable allowLoadMore: boolean = true; @observable allowLoadMore: boolean = true;
@observable isFetching = false; @observable isFetching = false;
@observable pinToTop = false;
componentDidMount() { componentDidMount() {
this.handleQueryChange(); this.handleQueryChange();
@ -103,7 +104,9 @@ class Search extends Component {
handleQueryChange = () => { handleQueryChange = () => {
const query = this.props.match.params.query; const query = this.props.match.params.query;
this.query = query ? decodeURIComponent(query) : ''; this.query = query ? query : '';
this.resultIds = [];
this.offset = 0;
this.allowLoadMore = true; this.allowLoadMore = true;
// To prevent "no results" showing before debounce kicks in // To prevent "no results" showing before debounce kicks in
@ -137,6 +140,7 @@ class Search extends Component {
limit: DEFAULT_PAGINATION_LIMIT, limit: DEFAULT_PAGINATION_LIMIT,
}); });
this.resultIds = this.resultIds.concat(newResults); this.resultIds = this.resultIds.concat(newResults);
if (this.resultIds.length > 0) this.pinToTop = true;
if ( if (
newResults.length === 0 || newResults.length === 0 ||
newResults.length < DEFAULT_PAGINATION_LIMIT newResults.length < DEFAULT_PAGINATION_LIMIT
@ -150,6 +154,7 @@ class Search extends Component {
} }
} else { } else {
this.resultIds = []; this.resultIds = [];
this.pinToTop = false;
} }
this.isFetching = false; this.isFetching = false;
@ -172,8 +177,8 @@ class Search extends Component {
render() { render() {
const { documents, notFound } = this.props; const { documents, notFound } = this.props;
const hasResults = this.resultIds.length > 0; const showEmpty =
const showEmpty = !this.isFetching && this.query && !hasResults; !this.isFetching && this.query && this.resultIds.length === 0;
return ( return (
<Container auto> <Container auto>
@ -185,14 +190,14 @@ class Search extends Component {
<p>We’re unable to find the page you’re accessing.</p> <p>We’re unable to find the page you’re accessing.</p>
</div> </div>
)} )}
<ResultsWrapper pinToTop={hasResults} column auto> <ResultsWrapper pinToTop={this.pinToTop} column auto>
<SearchField <SearchField
onKeyDown={this.handleKeyDown} onKeyDown={this.handleKeyDown}
onChange={this.updateLocation} onChange={this.updateLocation}
value={this.query} value={this.query}
/> />
{showEmpty && <Empty>No matching documents.</Empty>} {showEmpty && <Empty>No matching documents.</Empty>}
<ResultList column visible={hasResults}> <ResultList column visible={this.pinToTop}>
<StyledArrowKeyNavigation <StyledArrowKeyNavigation
mode={ArrowKeyNavigation.mode.VERTICAL} mode={ArrowKeyNavigation.mode.VERTICAL}
defaultActiveChildIndex={0} defaultActiveChildIndex={0}