qmining-page/src/components/QuestionSearchResult.js

import React, { PureComponent } from 'react'

import Questions from './Questions.js'

import constants from '../constants.json'

const countReducer = (acc, subj) => {
  return acc + subj.Questions.length
}

class QuestionSearchResult extends PureComponent {
  render() {
    const { data, searchTerm } = this.props

    let subjs = []
    let results = -1

    if (searchTerm) {
      subjs = data.reduce((acc, subj) => {
        const resultQuestions = subj.Questions.reduce((qacc, question) => {
          const keys = ['Q', 'A', 'data']
          keys.some((key) => {
            if (typeof question[key] !== 'string') {
              return false
            }
            if (
              question[key] &&
              question[key].toLowerCase().includes(searchTerm.toLowerCase())
            ) {
              qacc.push(question)
              return true
            }
          })
          return qacc
        }, [])
        if (resultQuestions.length > 0) {
          acc.push({
            Name: subj.Name,
            Questions: resultQuestions,
          })
        }
        return acc
      }, [])
      results = subjs.reduce(countReducer, 0)
    } else {
      results = data.reduce(countReducer, 0)
    }

    const renderCount = () => {
      return (
        <div>
          <div>
            {searchTerm ? '' : 'Kezdj el írni kereséshez! '}
            {`${results} találat, ${subjs.length} tárgyból`}
          </div>
          {results === 0 && (
            <div>
              {
                'Pontos egyezést keres a kereső, próbálj kisebb részletre keresni'
              }
            </div>
          )}
        </div>
      )
    }

    if (results > constants.maxQuestionsToRender) {
      return renderCount()
    } else {
      return (
        <div>
          <div>{renderCount()}</div>
          <div>
            <Questions subjs={subjs} />
          </div>
        </div>
      )
    }
  }
}

export default QuestionSearchResult