diff --git a/src/pages/forum/Forum.jsx b/src/pages/forum/Forum.jsx index f9fcb91..7bf52ce 100644 --- a/src/pages/forum/Forum.jsx +++ b/src/pages/forum/Forum.jsx @@ -9,9 +9,10 @@ import ForumList from '../../components/forumcards/ForumList'; import './Forum.css'; function ForumPage() { - const { currentUser } = useAuth(); const [forumPosts, setForumPosts] = useState([]); const [filteredPosts, setFilteredPosts] = useState([]); + const [sortOrder, setSortOrder] = useState(''); + const [searchQuery, setSearchQuery] = useState(''); const fetchForumPosts = async () => { try { @@ -59,20 +60,25 @@ function ForumPage() { return new Date(now.setDate(diff)).setHours(0, 0, 0, 0); }; - const handleFilterChange = useCallback(({ tags, sortOrder, searchQuery }) => { + const calculateFeaturedScore = (product) => { + const { weeklyClicks, likes, comments } = product; + return (weeklyClicks * 0.5) + (likes * 0.3) + (comments * 0.2); + }; + + const filterAndSortPosts = useCallback(({ tags, sortOrder, searchQuery }) => { let filtered = forumPosts; - if (tags.length > 0) { + if (tags && tags.length > 0) { filtered = filtered.filter(post => tags.some(tag => post.tags.includes(tag)) ); } if (searchQuery) { - const lowerCaseQuery = searchQuery.toLowerCase(); + const lowerQuery = searchQuery.toLowerCase(); filtered = filtered.filter(post => - post.title.toLowerCase().includes(lowerCaseQuery) || - post.description.toLowerCase().includes(lowerCaseQuery) + post.title.toLowerCase().includes(lowerQuery) || + post.description.toLowerCase().includes(lowerQuery) ); } @@ -83,17 +89,17 @@ function ForumPage() { } setFilteredPosts(filtered); + setSortOrder(sortOrder); + setSearchQuery(searchQuery); }, [forumPosts]); - const calculateFeaturedScore = (product) => { - const { weeklyClicks, likes, comments } = product; - return (weeklyClicks * 0.5) + (likes * 0.3) + (comments * 0.2); - }; - return ( - + filterAndSortPosts({ tags: [], sortOrder: order, searchQuery })} + />
diff --git a/src/pages/forum/filter/ForumFilter.jsx b/src/pages/forum/filter/ForumFilter.jsx index 2e34314..7fc3e5f 100644 --- a/src/pages/forum/filter/ForumFilter.jsx +++ b/src/pages/forum/filter/ForumFilter.jsx @@ -1,13 +1,10 @@ import React, { useState, useEffect } from 'react'; import { useNavigate } from 'react-router-dom'; import { useAuth } from '../../../Auth'; - import SearchBar from '../../../components/searchbar/Searchbar'; import './ForumFilter.css'; -function ForumFilter({ onFilterChange }) { - const navigate = useNavigate(); - const { currentUser } = useAuth(); +function ForumFilter({ onFilterChange, onSortChange }) { const [selectedTags, setSelectedTags] = useState([]); const [sortOrder, setSortOrder] = useState(''); const [query, setQuery] = useState(''); @@ -24,11 +21,11 @@ function ForumFilter({ onFilterChange }) { const handleSortChange = (e) => { setSortOrder(e.target.value); + onSortChange(e.target.value); }; const handleInputChange = (e) => { - const value = e.target.value; - setQuery(value); + setQuery(e.target.value); }; const handleSearch = (e) => { @@ -38,7 +35,7 @@ function ForumFilter({ onFilterChange }) { useEffect(() => { onFilterChange({ tags: selectedTags, sortOrder, searchQuery: query }); - }, [selectedTags, sortOrder, query]); + }, [selectedTags, sortOrder, query, onFilterChange]); return (
@@ -68,7 +65,7 @@ function ForumFilter({ onFilterChange }) {
-
+