Fix: search filter and pagination

nqq203 · Apr 6, 2024 · a5a4096 · a5a4096
1 parent 0510f5a
commit a5a4096
Show file tree

Hide file tree

Showing 7 changed files with 412 additions and 235 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/components/SearchBar/SearchBar.js b/src/components/SearchBar/SearchBar.js
@@ -11,7 +11,7 @@ export const SearchBar = () =>{
   const navigate = useNavigate();
   const [searchWord,setSearchWord] = useState(null)
 
-  // buggg
+
   const handleSubmit = (e) => {
     e.preventDefault(); 
     setSearchWord(searchInputRef.current.value.trim());
@@ -29,8 +29,6 @@ export const SearchBar = () =>{
         window.location.reload();
       }
 
-      console.log("Navigate")
-      // Navigate to the route with constructed URL
     }
   }
 

diff --git a/src/page/homepage/homepage.js b/src/page/homepage/homepage.js
@@ -14,12 +14,12 @@ export default function HomePage(){
   const { isAuthenticated } = useAuth()
   const [username, setUsername] = useState(localStorage.getItem("fullname") || null);
 
-  const {data: fetchCourses, isSuccess, isLoading, isError } = useQuery(
+  const {data: fetchCourses, isSuccess, isLoading, isError,refetch } = useQuery(
     "fetch10Courses",
     () => callApiGetCoursesPagination(1,10),
     {
       onSuccess: (data) => {
-        // console.log(data)
+        console.log(data)
         setCourses(data?.metadata?.results)
         setInstructors(data?.metadata?.instructors)
         setLoading(false)
@@ -32,11 +32,12 @@ export default function HomePage(){
     }
   )
 
-  // localStorage.getItem('fullname')
   useEffect(() => {
+    console.log(isAuthenticated)
     if(!isAuthenticated) {
       setUsername(null)
     }
+    refetch()
   }, [isAuthenticated])  
 
   return(

diff --git a/src/page/homepage/homepageStyle.js b/src/page/homepage/homepageStyle.js
@@ -9,6 +9,8 @@ import { useRef } from "react";
 import {Button} from "../../components/Button/Button.js"
 import {Chip} from "../../components/Chip/Chip.js"
 import {CustomRating} from "../../components/Rating/Rating.js"
+import { useNavigate } from "react-router-dom";
+
 
 export const StyleH1 = styled.h1`
     margin-left: 25px;
@@ -165,11 +167,13 @@ export const CourseItem = (props ) => {
     const priceCourse = props.price || "0"
     const imgCourse = props.image || "/imgs/courses/web.jpg"
     const chipLabel = props.chipLabel || false
+    const navigate = useNavigate()
 
     const formattedPrice = priceCourse.toLocaleString(navigator.language, { minimumFractionDigits: 0 })
 
     const handleCourseClick = () =>{
         console.log("Click course");
+        navigate('/view-lecture');
     }
 
     return(