remove unnecessary functions

cornell-dti · Nov 14, 2023 · 2e8b121 · 2e8b121
1 parent ef605f7
commit 2e8b121
Show file tree

Hide file tree

Showing 2 changed files with 57 additions and 92 deletions.
diff --git a/client/src/modules/SearchBar/Components/SearchBar.tsx b/client/src/modules/SearchBar/Components/SearchBar.tsx
@@ -1,17 +1,15 @@
 import React, { useState, useEffect } from 'react'
-import PropTypes from 'prop-types'
-
-import ProfileDropdown from '../../Globals/ProfileDropdown'
 
 import { Redirect } from 'react-router'
 import axios from 'axios'
 import { Session } from '../../../session-store'
 
-import '../Styles/SearchBar.css'
+import styles from '../Styles/SearchBar.module.css'
 import Course from './Course'
 import SubjectResult from './SubjectResult'
 import ProfessorResult from './ProfessorResult'
 import { Class, Subject, Professor } from 'common'
+import ProfileDropdown from '../../Globals/ProfileDropdown'
 
 type SearchBarProps = {
   isInNavbar: boolean
@@ -28,9 +26,8 @@ export const SearchBar = ({
   userInput,
   imgSrc,
   signOut,
-  isLoggedIn
+  isLoggedIn,
 }: SearchBarProps) => {
-  const [dropdown, setDropdown] = useState<boolean>(true)
   const [index, setIndex] = useState<number>(0)
   const [enter, setEnter] = useState<0 | 1>(0)
   const [mouse, setMouse] = useState<0 | 1>(0)
@@ -42,31 +39,22 @@ export const SearchBar = ({
   const DEBOUNCE_TIME = 200
 
   useEffect(() => {
-    if (
-      query.toLowerCase() !== ''
-    ) {
+    if (query.toLowerCase() !== '') {
       setTimeout(() => {
         axios
-          .post(
-            `/v2/getClassesByQuery`,
-            { query: query },
-          )
+          .post(`http://localhost:8080/v2/getClassesByQuery`, { query: query })
           .then((response) => {
             const queryCourseList = response.data.result
             if (queryCourseList.length !== 0) {
-              setCourses(queryCourseList.sort(sortCourses))
-
+              setCourses(queryCourseList)
             } else {
               setCourses([])
             }
           })
           .catch((e) => console.log('Getting courses failed!'))
 
         axios
-          .post(
-            `/v2/getSubjectsByQuery`,
-            { query: query },
-          )
+          .post(`http://localhost:8080/v2/getSubjectsByQuery`, { query: query })
           .then((response) => {
             const subjectList = response.data.result
             if (subjectList && subjectList.length !== 0) {
@@ -79,10 +67,9 @@ export const SearchBar = ({
           .catch((e) => console.log('Getting subjects failed!'))
 
         axios
-          .post(
-            `/v2/getProfessorsByQuery`,
-            { query: query },
-          )
+          .post(`http://localhost:8080/v2/getProfessorsByQuery`, {
+            query: query,
+          })
           .then((response) => {
             const professorList = response.data.result
             if (professorList && professorList.length !== 0) {
@@ -97,29 +84,6 @@ export const SearchBar = ({
     }
   }, [query])
 
-  /**
-   * Compares classes based on score, then class number, then alphabetically by
-   * subject.
-   * @param {Class} a
-   * @param {Class} b
-   * @returns -1, 0, or 1
-   */
-  const sortCourses = (a: Class, b: Class) => {
-    const sortByAlphabet = (a: Class, b: Class) => {
-      const aSub = a.classSub.toLowerCase()
-      const bSub = b.classSub.toLowerCase()
-      if (aSub < bSub) {
-        return -1
-      } else if (aSub > bSub) {
-        return 1
-      } else {
-        return 0
-      }
-    }
-
-    return sortByAlphabet(a, b) //|| b.score - a.score || a.classNum - b.classNum ||
-  }
-
   const text =
     window.innerWidth >= 840
       ? 'Search by any keyword e.g. “FWS”, “ECON” or “CS 2110”'
@@ -194,7 +158,6 @@ export const SearchBar = ({
   }
 
   const setInitState = () => {
-    setDropdown(true)
     setIndex(0)
     setEnter(0)
     setMouse(0)
@@ -232,13 +195,15 @@ export const SearchBar = ({
           }
           href={`/results/keyword/${query.split(' ').join('+')}`}
         >
-          <p className="result-text">{'Search: "' + query + '"'}</p>
+          <p className={`${styles.resultText}`}>{'Search: "' + query + '"'}</p>
         </a>
       )
 
       results.push(exact_search)
 
-      let subjectList = subjects.slice(0, 3).map((subject, i) => (
+      let subjectList: JSX.Element[] = []
+
+      subjectList = subjects.slice(0, 3).map((subject, i) => (
         //create a new class "button" that will set the selected class to this class when it is clicked.
         <SubjectResult
           key={subject._id}
@@ -261,8 +226,10 @@ export const SearchBar = ({
 
       results.push(subjectList)
 
+      let professorList: JSX.Element[] = []
+
       // Generate list of matching professors and add to results list
-      let professorList = professors.slice(0, 3).map((professor, i) => (
+      professorList = professors.slice(0, 3).map((professor, i) => (
         //create a new class "button" that will set the selected class to this class when it is clicked.
         <ProfessorResult
           key={professor._id}
@@ -283,29 +250,30 @@ export const SearchBar = ({
 
       results.push(professorList)
 
-      results.push(
-        courses.slice(0, 5).map((course, i) => (
-          //create a new class "button" that will set the selected class to this class when it is clicked.
-          <Course
-            key={course._id}
-            info={course}
-            query={query}
-            active={
-              index ===
-              i +
-                subjectList.length +
-                professorList.length +
-                1 /* plus because of exact search, professors, subjects */
-            }
-            enter={enter}
-            mouse={mouse}
-          />
-          //the prop "active" will pass through a bool indicating if the index affected through arrow movement is equal to
-          //the index matching with the course
-          //the prop "enter" will pass through the value of the enter state
-          //the prop "mouse" will pass through the value of the mouse state
-        ))
-      )
+      let coursesList: JSX.Element[] = []
+
+      coursesList = courses.slice(0, 5).map((course, i) => (
+        //create a new class "button" that will set the selected class to this class when it is clicked.
+        <Course
+          key={course._id}
+          info={course}
+          query={query}
+          active={
+            index ===
+            i +
+              subjectList.length +
+              professorList.length +
+              1 /* plus because of exact search, professors, subjects */
+          }
+          enter={enter}
+          mouse={mouse}
+        />
+        //the prop "active" will pass through a bool indicating if the index affected through arrow movement is equal to
+        //the index matching with the course
+        //the prop "enter" will pass through the value of the enter state
+        //the prop "mouse" will pass through the value of the mouse state
+      ))
+      results.push(coursesList)
 
       return results
     } else {
@@ -315,19 +283,18 @@ export const SearchBar = ({
 
   return (
     <div
-      className={
-        'row ' +
-        (contrastingResultsBackground ? 'contrasting-result-background' : '')
-      }
+      className={`${
+        contrastingResultsBackground ? styles.contrastingResultsBackground : ''
+      }`}
     >
       <div
         className={
-          'col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12 searchbar ' +
-          (isInNavbar ? 'searchbar-in-navbar' : '')
+          `col-xl-12 col-lg-12 col-md-12 col-sm-12 ${styles.searchbar} ` +
+          `${isInNavbar ? styles.searchbarInNavbar : ''}`
         }
       >
         <input
-          className="search-text"
+          className={`${styles.searchText}`}
           onKeyUp={handleKeyPress}
           defaultValue={isInNavbar ? (userInput ? userInput : '') : ''}
           placeholder={isInNavbar ? '' : text}
@@ -340,7 +307,7 @@ export const SearchBar = ({
         )}
 
         <ul
-          className="output"
+          className={`${styles.output}`}
           style={query !== '' ? {} : { display: 'none' }}
           onKeyPress={handleKeyPress}
           onMouseEnter={() => setMouse(1)}

diff --git a/...rc/modules/SearchBar/Styles/SearchBar.css → ...les/SearchBar/Styles/SearchBar.module.css b/...rc/modules/SearchBar/Styles/SearchBar.css → ...les/SearchBar/Styles/SearchBar.module.css
@@ -5,11 +5,11 @@
     height: 42px;
   }
 
-  .searchbar-in-navbar {
+  .searchbarInNavbar {
     height: 42px;
   }
 
-  .search-text {
+  .searchText {
     padding-left: 45px;
   }
 }
@@ -19,11 +19,11 @@
     height: 40px;
   }
 
-  .searchbar-in-navbar {
+  .searchbarInNavbar {
     height: 52px;
   }
 
-  .search-text {
+  .searchText {
     padding-left: 40px;
   }
 }
@@ -40,12 +40,12 @@
   box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.1);
 }
 
-.searchbar-in-navbar {
+.searchbarInNavbar {
   border: 1.24929px solid #ececec;
   box-shadow: none;
 }
 
-.search-text {
+.searchText {
   font-family: 'Source Sans Pro', sans-serif;
   font-size: 18px;
   font-weight: var(--regular-weight);
@@ -68,7 +68,7 @@
   z-index: 1002;
 }
 
-.search-text::placeholder {
+.searchText::placeholder {
   color: #c9c9c9;
   font-weight: var(--regular-weight);
 }
@@ -78,18 +78,16 @@
   cursor: pointer;
   max-height: 300px;
   overflow-y: auto;
-  position: absolute;
   width: 100%;
   z-index: 1001;
   border-radius: 0 0 10px 10px;
-  margin-top: -5px;
 }
 
 /* Selects all 'output' class objects that are decendents
-    of 'contrasting-result-background' class .
+    of 'contrastingResultBackground' class .
     Used to add background contrasting color to searchbar
     search results */
-.contrasting-result-background .output {
+.contrastingResultBackground .output {
   border-style: solid;
   border-color: #6ba7ec;
   border-width: 0 1px 1px 1px;