added type to event

src/components/Header/Header.tsx

@@ -1,9 +1,15 @@
-import React from "react";
+import { useState, ChangeEvent } from "react";
 import Logo from "../../assets/icons/logo.svg";
 import Button from "../shared/Button";
 import { lowerMenuItems } from "../../utils/data";
 
 const Header = () => {
+  const [searchValue, setSearchValue] = useState<string>("");
+
+  const handleSearchChange = (e: ChangeEvent<HTMLInputElement>) => {
+    setSearchValue(e.target.value);
+  };
+
   return (
     <div className="relative my-2 items-center justify-center flex">
       <div className="container px-8 flex justify-between">
@@ -28,7 +34,7 @@ const Header = () => {
               </a>
             </li>
             <li>
-              <SearchInput />
+              <SearchInput onChange={handleSearchChange} value={searchValue} />
             </li>
           </ul>
           <ul className="flex gap-4 items-center">
@@ -49,7 +55,13 @@ const Header = () => {
 
 export default Header;
 
-const SearchInput = ({ value, onChange }) => {
+const SearchInput = ({
+  value,
+  onChange,
+}: {
+  value: string;
+  onChange: (e: ChangeEvent<HTMLInputElement>) => void;
+}) => {
   return (
     <div className="flex items-center border border-[#5A2C82] overflow-hidden">
       <input