kitabcitab/.next/static/chunks/webpack.js

@@ -131,7 +131,7 @@
 /******/ 	
 /******/ 	/* webpack/runtime/getFullHash */
 /******/ 	!function() {
-/******/ 		__webpack_require__.h = function() { return "216a8a32ee79493b"; }
+/******/ 		__webpack_require__.h = function() { return "6b525e2862ea73db"; }
 /******/ 	}();
 /******/ 	
 /******/ 	/* webpack/runtime/global */

kitabcitab/components/Result.js

@@ -9,11 +9,14 @@ const Result = ({result, term}) => {
     let sentences
 
     const checkForMatches = (props) => {
-      if(props.length !== 1) return sentences.map((sentence) => {
-        sentence.toLowerCase().includes(term.toLowerCase()) ? setTitle(sentence) : null
-      })
       
-      return setTitle(text)
+      if(props.length === 1) return setTitle(props)
+      if(props.length > 1){
+        return sentences.map(sentence => {
+          if(sentence.toLowerCase().includes(term.toLowerCase())) setTitle(sentence)
+          else setTitle(props[0])
+        })
+      }
       
     }
 
@@ -26,9 +29,7 @@ const Result = ({result, term}) => {
     useEffect(() => {
       sentences = splitText()
       checkForMatches(sentences)
-    })
-    // ako term nije pronadjen u textu onda 
-    // treba provjeriti duzinu niza, ako niz ima jednu recenicu, recenica treba biti title, ako ne, naci medju recenicama onu koja ima term u sebi
+    }, [])
 
 
   return (

kitabcitab/pages/index.js

@@ -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

kitabcitab/pages/search.js

@@ -2,7 +2,6 @@ import React, { useState } from 'react'
 import Results from '../components/Results'
 import { AiOutlineClose, AiOutlineSearch } from 'react-icons/ai'
 import Link from 'next/link'
-import { useRef } from 'react'
 import { useRouter } from 'next/router'
 import { ENV_VAR } from '../envconfig'
 
@@ -10,14 +9,16 @@ import { ENV_VAR } from '../envconfig'
 const SearchPage = ({data}) => {
   const router = useRouter()
   const [searchInput, setSearchInput] = useState(router.query.term)
+  const term = searchInput
 
   const search = () => {
-    const term = searchInput
     if(!term) return
     router.push(`/search?term=${term}`)
   }
 
-  console.log(data)
+  const enterHandler = (e) => {
+    if(e.key === "Enter" && term !== "") router.push(`/search?term=${term}`)
+  }
 
   return (
     <div className='flex flex-col justify-center'>
@@ -45,7 +46,7 @@ const SearchPage = ({data}) => {
                 "
             >
                 <i className='rounded-3xl hover:border-black text-[#9aa0a6] px-3' onClick={() => search()}><AiOutlineSearch size={25}/></i>
-                <input value={searchInput} onChange={(e) => setSearchInput(e.target.value)} className="bg-[#303134] ml-5 w-[70%] active:border-none text-white outline-none text-lg "/>
+                <input value={searchInput} onKeyDown={(e) => enterHandler(e)} onChange={(e) => setSearchInput(e.target.value)} className="bg-[#303134] ml-5 w-[70%] active:border-none text-white outline-none text-lg "/>
                 <i className='rounded-3xl text-[#9aa0a6] px-3' onClick={() => setSearchInput("")}><AiOutlineClose size={25} /></i>
             </div>
         </div>