fix: search only on enter / click

islands/stamp/StampSearch.tsx

@@ -1,11 +1,18 @@
+import { useState } from "preact/hooks";
+
 export function StampSearchClient() {
-  const handleSearch = (event) => {
-    const searchTerm = event.target.value;
-    // if (!isNaN(Number(searchTerm))) {
-    // const stampId = parseInt(searchTerm);
-    // Redirect to /stamp/[id] route with the stampId
-    window.location.href = `/stamp/${searchTerm}`;
-    // }
+  const [searchTerm, setSearchTerm] = useState("");
+
+  const handleSearch = () => {
+    if (searchTerm.trim()) {
+      window.location.href = `/stamp/${searchTerm.trim()}`;
+    }
+  };
+
+  const handleKeyPress = (event: KeyboardEvent) => {
+    if (event.key === "Enter") {
+      handleSearch();
+    }
   };
 
   return (
@@ -14,12 +21,15 @@ export function StampSearchClient() {
         type="text"
         className="min-w-[220px] md:min-w-[460px] h-[54px] bg-[#3F2A4E] px-4 py-2 rounded text-[13px] text-[#8D9199]"
         placeholder="Search stamps"
-        onInput={handleSearch}
+        value={searchTerm}
+        onInput={(e) => setSearchTerm((e.target as HTMLInputElement).value)}
+        onKeyPress={handleKeyPress}
       />
       <img
         src="/img/icon_search.svg"
         alt="Search icon"
-        class="absolute top-4 right-6"
+        class="absolute top-4 right-6 cursor-pointer"
+        onClick={handleSearch}
       />
     </div>
   );