moved search settings to the search page.
This commit is contained in:
parent
78055ad0d1
commit
78ab2a795b
4 changed files with 50 additions and 39 deletions
|
@ -1,16 +1,22 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { selectIsSearching, doUpdateSearchQuery, makeSelectCurrentParam } from 'lbry-redux';
|
||||
import * as settings from 'constants/settings';
|
||||
import { selectIsSearching, selectSearchValue, doUpdateSearchQuery } from 'lbry-redux';
|
||||
import { doSetClientSetting } from 'redux/actions/settings';
|
||||
import { doNavigate } from 'redux/actions/navigation';
|
||||
import { makeSelectClientSetting } from 'redux/selectors/settings';
|
||||
import SearchPage from './view';
|
||||
|
||||
const select = state => ({
|
||||
isSearching: selectIsSearching(state),
|
||||
query: makeSelectCurrentParam('query')(state),
|
||||
query: selectSearchValue(state),
|
||||
showUnavailable: makeSelectClientSetting(settings.SHOW_UNAVAILABLE)(state),
|
||||
resultCount: makeSelectClientSetting(settings.RESULT_COUNT)(state),
|
||||
});
|
||||
|
||||
const perform = dispatch => ({
|
||||
navigate: path => dispatch(doNavigate(path)),
|
||||
updateSearchQuery: query => dispatch(doUpdateSearchQuery(query)),
|
||||
setClientSetting: (key, value) => dispatch(doSetClientSetting(key, value)),
|
||||
});
|
||||
|
||||
export default connect(
|
||||
|
|
|
@ -1,6 +1,8 @@
|
|||
// @flow
|
||||
import * as React from 'react';
|
||||
import * as settings from 'constants/settings';
|
||||
import { isURIValid, normalizeURI } from 'lbry-redux';
|
||||
import { FormField, FormRow } from 'component/common/form';
|
||||
import FileTile from 'component/fileTile';
|
||||
import FileListSearch from 'component/fileListSearch';
|
||||
import ToolTip from 'component/common/tooltip';
|
||||
|
@ -10,13 +12,52 @@ import * as icons from 'constants/icons';
|
|||
|
||||
type Props = {
|
||||
query: ?string,
|
||||
showUnavailable: boolean,
|
||||
resultCount: number,
|
||||
setClientSetting: (string, number | boolean) => void,
|
||||
};
|
||||
|
||||
class SearchPage extends React.PureComponent<Props> {
|
||||
constructor() {
|
||||
super();
|
||||
|
||||
(this: any).onShowUnavailableChange = this.onShowUnavailableChange.bind(this);
|
||||
(this: any).onSearchResultCountChange = this.onSearchResultCountChange.bind(this);
|
||||
}
|
||||
|
||||
onSearchResultCountChange(event: SyntheticInputEvent<*>) {
|
||||
const count = event.target.value;
|
||||
this.props.setClientSetting(settings.RESULT_COUNT, count);
|
||||
}
|
||||
|
||||
onShowUnavailableChange(event: SyntheticInputEvent<*>) {
|
||||
this.props.setClientSetting(settings.SHOW_UNAVAILABLE, event.target.checked);
|
||||
}
|
||||
|
||||
render() {
|
||||
const { query } = this.props;
|
||||
const { query, resultCount, showUnavailable } = this.props;
|
||||
return (
|
||||
<Page>
|
||||
<React.Fragment>
|
||||
<FormRow alignRight>
|
||||
<FormField
|
||||
type="number"
|
||||
name="result_count"
|
||||
min={1}
|
||||
max={1000}
|
||||
value={resultCount}
|
||||
onChange={this.onSearchResultCountChange}
|
||||
postfix={__('returned results')}
|
||||
/>
|
||||
<FormField
|
||||
type="checkbox"
|
||||
name="show_unavailable"
|
||||
onChange={this.onShowUnavailableChange}
|
||||
checked={showUnavailable}
|
||||
postfix={__('Show unavailable content')}
|
||||
/>
|
||||
</FormRow>
|
||||
</React.Fragment>
|
||||
{isURIValid(query) && (
|
||||
<React.Fragment>
|
||||
<div className="file-list__header">
|
||||
|
|
|
@ -18,7 +18,6 @@ import SettingsPage from './view';
|
|||
const select = state => ({
|
||||
daemonSettings: selectDaemonSettings(state),
|
||||
showNsfw: makeSelectClientSetting(settings.SHOW_NSFW)(state),
|
||||
showUnavailable: makeSelectClientSetting(settings.SHOW_UNAVAILABLE)(state),
|
||||
instantPurchaseEnabled: makeSelectClientSetting(settings.INSTANT_PURCHASE_ENABLED)(state),
|
||||
instantPurchaseMax: makeSelectClientSetting(settings.INSTANT_PURCHASE_MAX)(state),
|
||||
currentTheme: makeSelectClientSetting(settings.THEME)(state),
|
||||
|
@ -27,7 +26,6 @@ const select = state => ({
|
|||
languages: selectLanguages(state),
|
||||
automaticDarkModeEnabled: makeSelectClientSetting(settings.AUTOMATIC_DARK_MODE_ENABLED)(state),
|
||||
autoplay: makeSelectClientSetting(settings.AUTOPLAY)(state),
|
||||
resultCount: makeSelectClientSetting(settings.RESULT_COUNT)(state),
|
||||
});
|
||||
|
||||
const perform = dispatch => ({
|
||||
|
|
|
@ -27,12 +27,10 @@ type Props = {
|
|||
showNsfw: boolean,
|
||||
instantPurchaseEnabled: boolean,
|
||||
instantPurchaseMax: Price,
|
||||
showUnavailable: boolean,
|
||||
currentTheme: string,
|
||||
themes: Array<string>,
|
||||
automaticDarkModeEnabled: boolean,
|
||||
autoplay: boolean,
|
||||
resultCount: number,
|
||||
};
|
||||
|
||||
type State = {
|
||||
|
@ -51,14 +49,12 @@ class SettingsPage extends React.PureComponent<Props, State> {
|
|||
(this: any).onKeyFeeChange = this.onKeyFeeChange.bind(this);
|
||||
(this: any).onInstantPurchaseMaxChange = this.onInstantPurchaseMaxChange.bind(this);
|
||||
(this: any).onShowNsfwChange = this.onShowNsfwChange.bind(this);
|
||||
(this: any).onShowUnavailableChange = this.onShowUnavailableChange.bind(this);
|
||||
(this: any).onShareDataChange = this.onShareDataChange.bind(this);
|
||||
(this: any).onThemeChange = this.onThemeChange.bind(this);
|
||||
(this: any).onAutomaticDarkModeChange = this.onAutomaticDarkModeChange.bind(this);
|
||||
(this: any).onAutoplayChange = this.onAutoplayChange.bind(this);
|
||||
(this: any).clearCache = this.clearCache.bind(this);
|
||||
// (this: any).onLanguageChange = this.onLanguageChange.bind(this)
|
||||
(this: any).onSearchResultCountChange = this.onSearchResultCountChange.bind(this);
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
|
@ -115,15 +111,6 @@ class SettingsPage extends React.PureComponent<Props, State> {
|
|||
this.props.setClientSetting(settings.SHOW_NSFW, event.target.checked);
|
||||
}
|
||||
|
||||
onShowUnavailableChange(event: SyntheticInputEvent<*>) {
|
||||
this.props.setClientSetting(settings.SHOW_UNAVAILABLE, event.target.checked);
|
||||
}
|
||||
|
||||
onSearchResultCountChange(event: SyntheticInputEvent<*>) {
|
||||
const count = event.target.value;
|
||||
this.props.setClientSetting(settings.RESULT_COUNT, count);
|
||||
}
|
||||
|
||||
setDaemonSetting(name: string, value: boolean | string | Price) {
|
||||
this.props.setDaemonSetting(name, value);
|
||||
}
|
||||
|
@ -147,12 +134,10 @@ class SettingsPage extends React.PureComponent<Props, State> {
|
|||
showNsfw,
|
||||
instantPurchaseEnabled,
|
||||
instantPurchaseMax,
|
||||
showUnavailable,
|
||||
currentTheme,
|
||||
themes,
|
||||
automaticDarkModeEnabled,
|
||||
autoplay,
|
||||
resultCount,
|
||||
} = this.props;
|
||||
|
||||
const noDaemonSettings = !daemonSettings || Object.keys(daemonSettings).length === 0;
|
||||
|
@ -272,25 +257,6 @@ class SettingsPage extends React.PureComponent<Props, State> {
|
|||
)}
|
||||
/>
|
||||
</section>
|
||||
<section className="card card--section">
|
||||
<div className="card__title">{__('Search Settings')}</div>
|
||||
<FormField
|
||||
type="number"
|
||||
name="result_count"
|
||||
min={1}
|
||||
max={1000}
|
||||
value={resultCount}
|
||||
onChange={this.onSearchResultCountChange}
|
||||
postfix={__('The number of search results presented')}
|
||||
/>
|
||||
<FormField
|
||||
type="checkbox"
|
||||
name="show_unavailable"
|
||||
onChange={this.onShowUnavailableChange}
|
||||
checked={showUnavailable}
|
||||
postfix={__('Show unavailable content in search results')}
|
||||
/>
|
||||
</section>
|
||||
<section className="card card--section">
|
||||
<div className="card__title">{__('Share Diagnostic Data')}</div>
|
||||
<FormField
|
||||
|
|
Loading…
Reference in a new issue