got to a good point with sighting modal, want to do cleanup

src/components/SessionForm/HitSearchCard.tsx

@@ -1,15 +1,25 @@
 import Card from "../UI/Card";
 import CardHeader from "../UI/CardHeader";
 import FormGroup from "../SettingForms/components/FormGroup";
+import { useAlertHitContext } from "../../context/AlertHitContext";
+import { useState } from "react";
 
 const SessionCard = () => {
+  const [searchTerm, setSearchTerm] = useState("");
+  const { state, disptach } = useAlertHitContext();
 
+  console.log(state);
   return (
     <Card>
       <CardHeader title={"Hit Search"} />
       <div className="flex flex-col gap-4">
         <FormGroup>
-          <label htmlFor="VRM" className="font-medium whitespace-nowrap md:w-1/2 text-left">VRM (Min 2 letters)</label>
+          <label
+            htmlFor="VRM"
+            className="font-medium whitespace-nowrap md:w-1/2 text-left"
+          >
+            VRM (Min 2 letters)
+          </label>
           <div className="flex-1 flex justify-end md:w-2/3">
             <input
               id="VRMSelect"
@@ -17,13 +27,13 @@ const SessionCard = () => {
               type="text"
               className="p-2 border border-gray-400 rounded-lg w-full max-w-xs"
               placeholder="Enter VRM"
-              //onChange={e => setSntpServer(e.target.value)}
+              onChange={(e) => setSearchTerm(e.target.value)}
             />
           </div>
         </FormGroup>
         <button
           className="bg-[#26B170] text-white px-4 py-2 rounded hover:bg-green-700 transition w-full max-w-md"
-          //onClick={() => handleModemSave(apn, username, password, authType)}
+          onClick={() => disptach({ type: "SEARCH", payload: searchTerm })}
         >
           Search Hit list
         </button>