Ignore:
File:
1 edited

Legend:

Unmodified
Added
Removed

  • reactapp/src/Components/Search.js

    r0df6b9e r0ae838b  
    1 import React, { useEffect, useState } from "react";
    2 import JSOG from "jsog";
    3 import { transliterate } from "../Util/transliterate";
    4 import {
    5   SearchDropdownResultSmall,
    6   SearchDropdownTextSmall,
    7   SearchDropdownSmall,
    8   SearchDropdownResultLinkSmall,
    9   SearchSmall,
    10 } from "./Search.style";
    11 function Search() {
    12   const [query, setQuery] = useState("");
    13   const [professors, setProfessors] = useState([]);
    14 
    15   useEffect(() => {
    16     const url = `http://192.168.0.17:8080/public/professors/nameContains/${transliterate(
    17       query
    18     )}`;
    19 
    20     const fetchData = async () => {
    21       try {
    22         const response = await fetch(url);
    23         var cyclicGraph = await response.json();
    24         var jsogStructure = JSOG.encode(cyclicGraph); // has { '@ref': 'ID' } links instead of cycles
    25         cyclicGraph = JSOG.decode(jsogStructure);
    26         setProfessors(cyclicGraph);
    27         //setLoaded(true);
    28       } catch (error) {
    29         console.log("Error", error);
    30       }
    31     };
    32 
    33     if (query.length > 2) fetchData();
    34   }, [query]);
    35 
    36   return (
    37     <div
    38       style={{
    39         position: "relative",
    40         width: "fit-content",
    41         float: "right",
    42       }}
    43     >
    44       <SearchSmall
    45         placeholder="Пребарувај..."
    46         onChange={(e) => setQuery(e.target.value)}
    47       />
    48       <SearchDropdownSmall
    49         display={query.length > 2 && professors.length > 0 ? "block" : "none"}
    50       >
    51         {query.length > 2 &&
    52           professors.slice(0, 7).map((professor) => (
    53             <SearchDropdownResultSmall key={professor.professorId}>
    54               <SearchDropdownResultLinkSmall
    55                 href={"/professor/" + professor.professorId}
    56               >
    57                 <SearchDropdownTextSmall weight="bold" size="medium">
    58                   {professor.professorName}
    59                 </SearchDropdownTextSmall>
    60                 <SearchDropdownTextSmall weight="normal" size="smaller">
    61                   {professor.faculty.facultyName}
    62                 </SearchDropdownTextSmall>
    63               </SearchDropdownResultLinkSmall>
    64             </SearchDropdownResultSmall>
    65           ))}
    66       </SearchDropdownSmall>
    67     </div>
    68   );
    69 }
    70 
    71 export default Search;
Note: See TracChangeset for help on using the changeset viewer.