Snow rendering changes, allquestions page fixes and improvements

src/components/QuestionSearchResult.js

@@ -4,6 +4,10 @@ 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
@@ -11,10 +15,6 @@ class QuestionSearchResult extends PureComponent {
     let subjs = []
     let results = -1
 
-    const countReducer = (acc, subj) => {
-      return acc + subj.Questions.length
-    }
-
     if (searchTerm) {
       subjs = data.reduce((acc, subj) => {
         const resultQuestions = subj.Questions.reduce((qacc, question) => {
@@ -50,9 +50,8 @@ class QuestionSearchResult extends PureComponent {
       return (
         <div>
           <div>
-            {searchTerm ? '' : 'Kezdj el írni kereséshez!'} {results}{' '}
+            {searchTerm ? '' : 'Kezdj el írni kereséshez! '}
-            {searchTerm ? 'találat' : 'kérdés'}{' '}
+            {`${results} találat, ${subjs.length} tárgyból`}
-            {searchTerm ? subjs.length : data.length} tárgy
           </div>
           {results === 0 && (
             <div>

src/components/layout.js

@@ -8,7 +8,11 @@ import tabs from '../data/tabs.json'
 import constants from '../constants.json'
 import BB from './b.js'
 
-// FIXME: window resize event listener to show sidebar on resize
+const renderSnow = () => {
+  const date = new Date()
+  // if its december, and date is more than 5
+  return date.getMonth() === 11 && date.getDate() > 5
+}
 
 export default function Layout(props) {
   let href = props.route
@@ -29,8 +33,6 @@ export default function Layout(props) {
   }
 
   useEffect(() => {
-    closeSideBar()
-
     fetch(`${constants.apiUrl}infos`, {
       credentials: 'include',
       Accept: 'application/json',
@@ -49,23 +51,26 @@ export default function Layout(props) {
     setWindowSize([window.innerWidth, window.innerHeight])
     window.addEventListener('resize', () => {
       setWindowSize([window.innerWidth, window.innerHeight])
+      setSidebarOpen(window.innerWidth >= 700)
     })
   }, [])
   const snowflakeCount = (windowSize[0] + windowSize[1]) / 8
 
   return (
     <div>
-      <div
+      {renderSnow() && (
-        style={{
+        <div
-          pointerEvents: 'none',
+          style={{
-          zIndex: 900,
+            pointerEvents: 'none',
-          position: 'fixed',
+            zIndex: 900,
-          width: `${windowSize[0]}px`,
+            position: 'fixed',
-          height: `${windowSize[1]}px`,
+            width: `${windowSize[0]}px`,
-        }}
+            height: `${windowSize[1]}px`,
-      >
+          }}
-        <Snowfall snowflakeCount={snowflakeCount} />
+        >
-      </div>
+          <Snowfall snowflakeCount={snowflakeCount} />
+        </div>
+      )}
       <div className="sidebar">
         <div className="headercontainer">
           <span

src/pages/allQuestions.js

@@ -11,6 +11,10 @@ import styles from './allQuestions.module.css'
 
 import constants from '../constants.json'
 
+const countReducer = (acc, subj) => {
+  return acc + subj.Questions.length
+}
+
 function mergeData(data) {
   return data.reduce((acc, db) => {
     return [
@@ -60,7 +64,6 @@ function fetchDbs() {
         return resp.json()
       })
       .then((data) => {
-        console.log(data)
         resolve(data)
       })
   })
@@ -72,6 +75,8 @@ export default function AllQuestions({ router }) {
   const [dbs, setDbs] = useState(null)
   const [searchTerm, setSearchTerm] = useState('')
   const [activeSubjName, setActiveSubjName] = useState('')
+  const subjectCount = data ? data.length : 0
+  const questionCount = data ? data.reduce(countReducer, 0) : 0
 
   useEffect(() => {
     router.replace(`${router.asPath.replace('.html', '')}`, undefined, {
@@ -97,9 +102,7 @@ export default function AllQuestions({ router }) {
             defaultValue={-1}
             onChange={(event) => {
               const key = event.target.value
-              if (key === 'none') {
+              if (key === 'all') {
-                console.log(key)
-              } else if (key === 'all') {
                 fetchAllData(dbs).then((res) => {
                   setData(mergeData(res))
                   console.log(res)
@@ -182,9 +185,7 @@ export default function AllQuestions({ router }) {
               <Subject subj={currSubj} />
             </div>
           </>
-        ) : (
+        ) : null}
-          <LoadingIndicator />
-        )}
       </div>
     )
   }
@@ -236,6 +237,7 @@ export default function AllQuestions({ router }) {
   return (
     <div>
       {dbs && renderDbSelector()}
+      {data && `${questionCount} kérdés, ${subjectCount} tárgy`}
       <div className={styles.typeSelector}>
         <div
           className={!asd ? styles.activeTypeSelector : ''}