Add onEnter search

kitabcitab/.next/build-manifest.json

@@ -15,6 +15,16 @@
   ],
   "rootMainFiles": [],
   "pages": {
+    "/": [
+      "static/chunks/webpack.js",
+      "static/chunks/main.js",
+      "static/chunks/pages/index.js"
+    ],
+    "/[book]/[id]": [
+      "static/chunks/webpack.js",
+      "static/chunks/main.js",
+      "static/chunks/pages/[book]/[id].js"
+    ],
     "/_app": [
       "static/chunks/webpack.js",
       "static/chunks/main.js",

kitabcitab/.next/server/middleware-build-manifest.js

@@ -1 +1 @@
-self.__BUILD_MANIFEST={"polyfillFiles":["static/chunks/polyfills.js"],"devFiles":["static/chunks/react-refresh.js"],"ampDevFiles":["static/chunks/webpack.js","static/chunks/amp.js"],"lowPriorityFiles":["static/development/_buildManifest.js","static/development/_ssgManifest.js"],"rootMainFiles":[],"pages":{"/_app":["static/chunks/webpack.js","static/chunks/main.js","static/chunks/pages/_app.js"],"/_error":["static/chunks/webpack.js","static/chunks/main.js","static/chunks/pages/_error.js"],"/search":["static/chunks/webpack.js","static/chunks/main.js","static/chunks/pages/search.js"]},"ampFirstPages":[]}
+self.__BUILD_MANIFEST={"polyfillFiles":["static/chunks/polyfills.js"],"devFiles":["static/chunks/react-refresh.js"],"ampDevFiles":["static/chunks/webpack.js","static/chunks/amp.js"],"lowPriorityFiles":["static/development/_buildManifest.js","static/development/_ssgManifest.js"],"rootMainFiles":[],"pages":{"/":["static/chunks/webpack.js","static/chunks/main.js","static/chunks/pages/index.js"],"/[book]/[id]":["static/chunks/webpack.js","static/chunks/main.js","static/chunks/pages/[book]/[id].js"],"/_app":["static/chunks/webpack.js","static/chunks/main.js","static/chunks/pages/_app.js"],"/_error":["static/chunks/webpack.js","static/chunks/main.js","static/chunks/pages/_error.js"],"/search":["static/chunks/webpack.js","static/chunks/main.js","static/chunks/pages/search.js"]},"ampFirstPages":[]}

kitabcitab/.next/server/pages-manifest.json

@@ -2,5 +2,7 @@
   "/_app": "pages/_app.js",
   "/_error": "pages/_error.js",
   "/_document": "pages/_document.js",
+  "/": "pages/index.js",
+  "/[book]/[id]": "pages/[book]/[id].js",
   "/search": "pages/search.js"
 }

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

@@ -131,7 +131,7 @@
 /******/ 	
 /******/ 	/* webpack/runtime/getFullHash */
 /******/ 	!function() {
-/******/ 		__webpack_require__.h = function() { return "93e21dfb81445514"; }
+/******/ 		__webpack_require__.h = function() { return "a2eda309a2e86c12"; }
 /******/ 	}();
 /******/ 	
 /******/ 	/* webpack/runtime/global */

kitabcitab/.next/static/development/_buildManifest.js

@@ -1 +1 @@
-self.__BUILD_MANIFEST = {__rewrites:{beforeFiles:[],afterFiles:[],fallback:[]},"/_error":["static\u002Fchunks\u002Fpages\u002F_error.js"],"/search":["static\u002Fchunks\u002Fpages\u002Fsearch.js"],sortedPages:["\u002F_app","\u002F_error","\u002Fsearch"]};self.__BUILD_MANIFEST_CB && self.__BUILD_MANIFEST_CB()
+self.__BUILD_MANIFEST = {__rewrites:{beforeFiles:[],afterFiles:[],fallback:[]},"/":["static\u002Fchunks\u002Fpages\u002Findex.js"],"/_error":["static\u002Fchunks\u002Fpages\u002F_error.js"],"/search":["static\u002Fchunks\u002Fpages\u002Fsearch.js"],"/[book]/[id]":["static\u002Fchunks\u002Fpages\u002F[book]\u002F[id].js"],sortedPages:["\u002F","\u002F_app","\u002F_error","\u002Fsearch","\u002F[book]\u002F[id]"]};self.__BUILD_MANIFEST_CB && self.__BUILD_MANIFEST_CB()

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
+
+      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])
       })
-      
-      return setTitle(text)
+      }
       
     }
 
@@ -26,7 +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
 

kitabcitab/components/Results.js

@@ -3,6 +3,7 @@ import Result from './Result'
 
 const Results = ({data, term}) => {
 
+  console.log(data)
 
   return (
     <div className='

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 onKeyDown={(e) => enterHandler(e)} value={searchInput} 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>