Trying to add search function / useNavigate question

src/components/search/index.js

@@ -1,11 +1,11 @@
-import React, { useRef } from 'react';
+import React, { useRef } from "react";
+import { createSearchParams, useNavigate } from "react-router-dom";
 // Import createSearchParams
 // Import useNavigate
 
 const Search = () => {
-
   // get navigate function
-  const navigate = "REPLACE ME";
+  const navigate = useNavigate();
 
   const searchInputRef = useRef();
 
@@ -13,13 +13,14 @@ const Search = () => {
     e.preventDefault();
 
     const searchQuery = {
-      name: searchInputRef.current.value
+      name: searchInputRef.current.value,
-    }
+    };
 
     // use createSearchParams
-    const query = "REPLACE ME";
+    const query = createSearchParams(searchQuery);
 
     // imperatively redirect with useNavigate() returned function
+    navigate({ pathname: "/search", search: `${query}` });
   };
 
   return (