bump search results to 30 and remove autosearch
This commit is contained in:
parent
4ac9c87162
commit
aeaed80999
5 changed files with 13 additions and 60 deletions
|
@ -1,10 +1,5 @@
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import {
|
import { makeSelectSearchUris, selectIsSearching, selectSearchDownloadUris } from 'lbry-redux';
|
||||||
doSearch,
|
|
||||||
makeSelectSearchUris,
|
|
||||||
selectIsSearching,
|
|
||||||
selectSearchDownloadUris,
|
|
||||||
} from 'lbry-redux';
|
|
||||||
import FileListSearch from './view';
|
import FileListSearch from './view';
|
||||||
|
|
||||||
const select = (state, props) => ({
|
const select = (state, props) => ({
|
||||||
|
@ -13,8 +8,9 @@ const select = (state, props) => ({
|
||||||
isSearching: selectIsSearching(state),
|
isSearching: selectIsSearching(state),
|
||||||
});
|
});
|
||||||
|
|
||||||
const perform = dispatch => ({
|
const perform = () => ({});
|
||||||
search: search => dispatch(doSearch(search)),
|
|
||||||
});
|
|
||||||
|
|
||||||
export default connect(select, perform)(FileListSearch);
|
export default connect(
|
||||||
|
select,
|
||||||
|
perform
|
||||||
|
)(FileListSearch);
|
||||||
|
|
|
@ -3,14 +3,10 @@ import React from 'react';
|
||||||
import FileTile from 'component/fileTile';
|
import FileTile from 'component/fileTile';
|
||||||
import ChannelTile from 'component/channelTile';
|
import ChannelTile from 'component/channelTile';
|
||||||
import { parseURI } from 'lbry-redux';
|
import { parseURI } from 'lbry-redux';
|
||||||
import debounce from 'util/debounce';
|
|
||||||
|
|
||||||
const SEARCH_DEBOUNCE_TIME = 800;
|
|
||||||
|
|
||||||
const NoResults = () => <div className="file-tile">{__('No results')}</div>;
|
const NoResults = () => <div className="file-tile">{__('No results')}</div>;
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
search: string => void,
|
|
||||||
query: string,
|
query: string,
|
||||||
isSearching: boolean,
|
isSearching: boolean,
|
||||||
uris: ?Array<string>,
|
uris: ?Array<string>,
|
||||||
|
@ -18,27 +14,6 @@ type Props = {
|
||||||
};
|
};
|
||||||
|
|
||||||
class FileListSearch extends React.PureComponent<Props> {
|
class FileListSearch extends React.PureComponent<Props> {
|
||||||
constructor(props: Props) {
|
|
||||||
super(props);
|
|
||||||
this.debouncedSearch = debounce(this.props.search, SEARCH_DEBOUNCE_TIME);
|
|
||||||
}
|
|
||||||
|
|
||||||
componentDidMount() {
|
|
||||||
const { search, query } = this.props;
|
|
||||||
search(query);
|
|
||||||
}
|
|
||||||
|
|
||||||
componentWillReceiveProps(nextProps: Props) {
|
|
||||||
const { query: nextQuery } = nextProps;
|
|
||||||
const { query: currentQuerry } = this.props;
|
|
||||||
|
|
||||||
if (nextQuery !== currentQuerry) {
|
|
||||||
this.debouncedSearch(nextQuery);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
debouncedSearch: string => void;
|
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { uris, query, downloadUris, isSearching } = this.props;
|
const { uris, query, downloadUris, isSearching } = this.props;
|
||||||
|
|
||||||
|
|
|
@ -26,7 +26,7 @@ const select = state => {
|
||||||
|
|
||||||
const perform = dispatch => ({
|
const perform = dispatch => ({
|
||||||
onSearch: query => {
|
onSearch: query => {
|
||||||
dispatch(doSearch(query));
|
dispatch(doSearch(query, 30)); // Hard coding this for now until https://github.com/lbryio/lbry-app/pull/1639 is merged
|
||||||
dispatch(doNavigate(`/search`, { query }));
|
dispatch(doNavigate(`/search`, { query }));
|
||||||
},
|
},
|
||||||
onSubmit: (uri, extraParams) => dispatch(doNavigate('/show', { uri, ...extraParams })),
|
onSubmit: (uri, extraParams) => dispatch(doNavigate('/show', { uri, ...extraParams })),
|
||||||
|
|
|
@ -1,12 +1,11 @@
|
||||||
import React from 'react';
|
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import { selectIsSearching, selectSearchValue, doUpdateSearchQuery } from 'lbry-redux';
|
import { selectIsSearching, doUpdateSearchQuery, makeSelectCurrentParam } from 'lbry-redux';
|
||||||
import { doNavigate } from 'redux/actions/navigation';
|
import { doNavigate } from 'redux/actions/navigation';
|
||||||
import SearchPage from './view';
|
import SearchPage from './view';
|
||||||
|
|
||||||
const select = state => ({
|
const select = state => ({
|
||||||
isSearching: selectIsSearching(state),
|
isSearching: selectIsSearching(state),
|
||||||
query: selectSearchValue(state),
|
query: makeSelectCurrentParam('query')(state),
|
||||||
});
|
});
|
||||||
|
|
||||||
const perform = dispatch => ({
|
const perform = dispatch => ({
|
||||||
|
@ -14,4 +13,7 @@ const perform = dispatch => ({
|
||||||
updateSearchQuery: query => dispatch(doUpdateSearchQuery(query)),
|
updateSearchQuery: query => dispatch(doUpdateSearchQuery(query)),
|
||||||
});
|
});
|
||||||
|
|
||||||
export default connect(select, perform)(SearchPage);
|
export default connect(
|
||||||
|
select,
|
||||||
|
perform
|
||||||
|
)(SearchPage);
|
||||||
|
|
|
@ -8,31 +8,11 @@ import Page from 'component/page';
|
||||||
import Icon from 'component/common/icon';
|
import Icon from 'component/common/icon';
|
||||||
import * as icons from 'constants/icons';
|
import * as icons from 'constants/icons';
|
||||||
|
|
||||||
const MODAL_ANIMATION_TIME = 250;
|
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
query: ?string,
|
query: ?string,
|
||||||
};
|
};
|
||||||
|
|
||||||
class SearchPage extends React.PureComponent<Props> {
|
class SearchPage extends React.PureComponent<Props> {
|
||||||
constructor() {
|
|
||||||
super();
|
|
||||||
|
|
||||||
this.input = null;
|
|
||||||
}
|
|
||||||
|
|
||||||
componentDidMount() {
|
|
||||||
// Wait for the modal to animate down before focusing
|
|
||||||
// without this there is an issue with scroll the page down
|
|
||||||
setTimeout(() => {
|
|
||||||
if (this.input) {
|
|
||||||
this.input.focus();
|
|
||||||
}
|
|
||||||
}, MODAL_ANIMATION_TIME);
|
|
||||||
}
|
|
||||||
|
|
||||||
input: ?HTMLInputElement;
|
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { query } = this.props;
|
const { query } = this.props;
|
||||||
return (
|
return (
|
||||||
|
|
Loading…
Reference in a new issue