Files
msgapp/src/app/components/SearchBar.tsx
2025-10-09 16:35:19 +09:00

29 lines
732 B
TypeScript

"use client";
import { useRouter } from "next/navigation";
import { useState } from "react";
export function SearchBar() {
const router = useRouter();
const [term, setTerm] = useState("");
return (
<form
onSubmit={(e) => {
e.preventDefault();
const q = term.trim();
router.push(q ? `/search?q=${encodeURIComponent(q)}` : "/search");
}}
style={{ display: "flex", gap: 8, alignItems: "center" }}
>
<input
value={term}
onChange={(e) => setTerm(e.target.value)}
placeholder="검색어 입력"
style={{ padding: "6px 8px", border: "1px solid #ddd", borderRadius: 6 }}
/>
<button type="submit"></button>
</form>
);
}