bump lighthouse throttle
This commit is contained in:
parent
48bc887b1f
commit
83faefecdc
2 changed files with 9 additions and 5 deletions
|
@ -46,6 +46,7 @@ export default function WunderBarSuggestions(props: Props) {
|
||||||
const inputRef: ElementRef<any> = React.useRef();
|
const inputRef: ElementRef<any> = React.useRef();
|
||||||
const isFocused = inputRef && inputRef.current && inputRef.current === document.activeElement;
|
const isFocused = inputRef && inputRef.current && inputRef.current === document.activeElement;
|
||||||
|
|
||||||
|
const THROTTLE_MS = 1000;
|
||||||
const {
|
const {
|
||||||
push,
|
push,
|
||||||
location: { search },
|
location: { search },
|
||||||
|
@ -53,7 +54,7 @@ export default function WunderBarSuggestions(props: Props) {
|
||||||
const urlParams = new URLSearchParams(search);
|
const urlParams = new URLSearchParams(search);
|
||||||
const queryFromUrl = urlParams.get('q') || '';
|
const queryFromUrl = urlParams.get('q') || '';
|
||||||
const [term, setTerm] = React.useState(queryFromUrl);
|
const [term, setTerm] = React.useState(queryFromUrl);
|
||||||
const throttledTerm = useThrottle(term, 500) || '';
|
const throttledTerm = useThrottle(term, THROTTLE_MS) || '';
|
||||||
const searchSize = isMobile ? 20 : 5;
|
const searchSize = isMobile ? 20 : 5;
|
||||||
const { results, loading } = useLighthouse(throttledTerm, showMature, searchSize);
|
const { results, loading } = useLighthouse(throttledTerm, showMature, searchSize);
|
||||||
const noResults = throttledTerm && !loading && results && results.length === 0;
|
const noResults = throttledTerm && !loading && results && results.length === 0;
|
||||||
|
|
|
@ -5,11 +5,12 @@ import { getSearchQueryString } from 'util/query-params';
|
||||||
import { isURIValid } from 'lbry-redux';
|
import { isURIValid } from 'lbry-redux';
|
||||||
import useThrottle from './use-throttle';
|
import useThrottle from './use-throttle';
|
||||||
|
|
||||||
export default function useLighthouse(query: string, showMature?: boolean, size?: number = 5) {
|
export default function useLighthouse(query: string, showMature?: boolean, size?: number = 6) {
|
||||||
|
const THROTTLE_MS = 1000;
|
||||||
const [results, setResults] = React.useState();
|
const [results, setResults] = React.useState();
|
||||||
const [loading, setLoading] = React.useState();
|
const [loading, setLoading] = React.useState();
|
||||||
const queryString = query ? getSearchQueryString(query, { nsfw: showMature, size }) : '';
|
const queryString = query ? getSearchQueryString(query, { nsfw: showMature, size }) : '';
|
||||||
const throttledQuery = useThrottle(queryString, 500);
|
const throttledQuery = useThrottle(queryString, THROTTLE_MS);
|
||||||
|
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
if (throttledQuery) {
|
if (throttledQuery) {
|
||||||
|
@ -19,9 +20,11 @@ export default function useLighthouse(query: string, showMature?: boolean, size?
|
||||||
let isSubscribed = true;
|
let isSubscribed = true;
|
||||||
lighthouse
|
lighthouse
|
||||||
.search(throttledQuery)
|
.search(throttledQuery)
|
||||||
.then(results => {
|
.then((results) => {
|
||||||
if (isSubscribed) {
|
if (isSubscribed) {
|
||||||
setResults(results.map(result => `lbry://${result.name}#${result.claimId}`).filter(uri => isURIValid(uri)));
|
setResults(
|
||||||
|
results.map((result) => `lbry://${result.name}#${result.claimId}`).filter((uri) => isURIValid(uri))
|
||||||
|
);
|
||||||
setLoading(false);
|
setLoading(false);
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
Loading…
Reference in a new issue