From 1499c0126d1a7a2377b0267b761479100c636ee9 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Tue, 30 Jun 2020 00:41:09 +0300
Subject: feat!: create useNavigate hook

---
 src/components/Header/SearchBar.tsx | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

(limited to 'src/components/Header/SearchBar.tsx')

diff --git a/src/components/Header/SearchBar.tsx b/src/components/Header/SearchBar.tsx
index bff16a0..253e77f 100644
--- a/src/components/Header/SearchBar.tsx
+++ b/src/components/Header/SearchBar.tsx
@@ -12,10 +12,8 @@ import { makeStyles } from '@material-ui/core/styles';
 import { User } from 'which-types';
 import { get } from '../../requests';
 import UserStrip from '../UserStrip/UserStrip';
+import { useNavigate } from '../../hooks/useNavigate';
 
-interface PropTypes {
-  navigate: (prefix: string, id: string) => void;
-}
 
 const INTERVAL = 300;
 const LIMIT = 7;
@@ -36,10 +34,11 @@ const useStyles = makeStyles(theme => ({
   }
 }));
 
-const SearchBar: React.FC<PropTypes> = ({ navigate }) => {
+const SearchBar: React.FC = () => {
   const [results, setResults] = useState<User[]>([]);
   const [query, setQuery] = useState<string>('');
   const [debouncedQuery, setDebouncedQuery] = useState<string>(query);
+  const { navigate } = useNavigate();
   const classes = useStyles();
 
   useEffect(() => {
@@ -79,7 +78,7 @@ const SearchBar: React.FC<PropTypes> = ({ navigate }) => {
           results.map((result, index) => (
             <div key={result._id}>
               <ListItem button onClick={handleNavigate(index)}>
-                <UserStrip user={result} navigate={navigate} />
+                <UserStrip user={result} />
               </ListItem>
               {(index < results.length - 1) && <Divider />}
             </div>
-- 
cgit v1.2.3