senaduka/old-kitabcitab-frontend
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Add onEnter search

Browse Source
This commit is contained in:
ismailsosic
2023-03-08 12:08:29 +01:00
parent c19a3481d6
commit c39df7ec32
26 changed files with 189 additions and 252 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
kitabcitab/pages/index.js
View File

@@ -5,7 +5,7 @@ import { useRouter } from 'next/router'
export default function Home({data}) {
const router = useRouter()
const searchInputRef = useRef(null)
const searchInputRef = useRef("")
const search = () => {
const term = searchInputRef.current.value
@@ -13,6 +13,11 @@ export default function Home({data}) {
router.push(`/search?term=${term}`)
}
const enterHandler = (e) => {
const term = searchInputRef.current.value
if(e.key === "Enter" && term !== "") router.push(`/search?term=${term}`)
}
return (
<div className="flex flex-col justify-center items-center w-[100vw] h-[50vh]">
<div className="p-10 ">
@@ -29,7 +34,7 @@ export default function Home({data}) {
"
>
<i className='rounded-3xl hover:border-black text-[#9aa0a6] px-3' onClick={() => search()}><AiOutlineSearch size={25}/></i>
<input ref={searchInputRef} className="bg-[#202124] group-hover:bg-[#303134] w-[80%] px-2 active:border-none text-white outline-none text-xl"/>
<input ref={searchInputRef} onKeyDown={(e) => enterHandler(e)} className="bg-[#202124] group-hover:bg-[#303134] w-[80%] px-2 active:border-none text-white outline-none text-xl"/>
<i className='rounded-3xl hover:border-black text-[#9aa0a6] px-3' onClick={() => (searchInputRef.current.value = "")}><AiOutlineClose size={25} /></i>
</div>
<button