change result title display

kitabcitab/components/Result.js

@@ -1,10 +1,35 @@
-import React from 'react'
+import { React, useEffect, useState} from 'react'
 import { useRouter } from 'next/router'
 
-const Result = ({result}) => {
+const Result = ({result, term}) => {
 
     const router = useRouter()
-    const {book, writer, text, page} = result._source
+    const {book, writer, text} = result._source
+    const [title, setTitle] = useState()
+    let sentences
+
+    const checkForMatches = (props) => {
+      if(props.length !== 1) return sentences.map((sentence) => {
+        sentence.toLowerCase().includes(term.toLowerCase()) ? setTitle(sentence) : null
+      })
+      
+      return setTitle(text)
+      
+    }
+
+    const splitText = () => {
+      try{
+        return text.match( /[^\.!\?]+[\.!\?]+/g)
+      }catch{err => console.log(err)}
+    }
+
+    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 (
     <div onClick={() => (router.push({pathname: `/${result._type}/${result._id}`}))} className='
@@ -21,8 +46,8 @@ const Result = ({result}) => {
     laptop:text-lg
     '
     >
-        <p className='m-3'>{text}</p>
-        <p className='m-3'>"{book}" - {writer} - str. {page}.</p>
+        <p className='m-3'>{title}</p>
+        <p className='m-3'>"{book}" - {writer} - str. {result._id}.</p>
     </div>
   )
 }

kitabcitab/components/Results.js

@@ -1,7 +1,7 @@
 import React from 'react'
 import Result from './Result'
 
-const Results = ({data}) => {
+const Results = ({data, term}) => {
 
 
   return (
@@ -19,7 +19,7 @@ const Results = ({data}) => {
 
 
     '>
-        {data.map((result) => <Result key={result._id} result={result}/>)}
+        {data.map((result) => <Result key={result._id} result={result} term={term}/>)}
     </div>
   )
 }