bump lighthouse throttle

This commit is contained in:
zeppi 2021-06-16 14:38:30 -04:00
parent 48bc887b1f
commit 83faefecdc
2 changed files with 9 additions and 5 deletions

View file

@ -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;

View file

@ -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);
} }
}) })