From 6215cfa341fe6dbc1fe079fb3757ab671ab6342f Mon Sep 17 00:00:00 2001 From: eug-vs Date: Sun, 28 Jun 2020 04:31:50 +0300 Subject: fix: add missing deps and search limit --- src/components/Header/SearchBar.tsx | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) (limited to 'src/components/Header') diff --git a/src/components/Header/SearchBar.tsx b/src/components/Header/SearchBar.tsx index 2be8f6f..365f33b 100644 --- a/src/components/Header/SearchBar.tsx +++ b/src/components/Header/SearchBar.tsx @@ -1,4 +1,4 @@ -import React, { useState, useEffect } from 'react'; +import React, { useState, useEffect, useCallback } from 'react'; import SearchIcon from '@material-ui/icons/Search'; import { InputBase, @@ -18,6 +18,7 @@ interface PropTypes { } const INTERVAL = 300; +const LIMIT = 7; const useStyles = makeStyles(theme => ({ root: { @@ -47,19 +48,19 @@ const SearchBar: React.FC = ({ navigate }) => { setTimeout(() => setIsReady(true), INTERVAL); }; - const fetchPolls = () => { + const fetchPolls = useCallback(() => { sleep(); - get(`/users?username[$regex]=${query}`).then(response => { + get(`/users?username[$regex]=${query}&$limit=${LIMIT}`).then(response => { setResults(response.data); }); - }; + }, [query]); useEffect(() => { if (isReady && shouldRefetch) { fetchPolls(); setShouldRefetch(false); } - }, [isReady]); + }, [isReady, fetchPolls, shouldRefetch]); const handleChange = (event: React.ChangeEvent): void => { -- cgit v1.2.3