diff --git a/frontend/src/components/DifficultyFilter.tsx b/frontend/src/components/DifficultyFilter.tsx index 6dcc8e1e..aabdba6c 100644 --- a/frontend/src/components/DifficultyFilter.tsx +++ b/frontend/src/components/DifficultyFilter.tsx @@ -2,6 +2,7 @@ import { Select, SelectContent, SelectItem, + SelectSeparator, SelectTrigger, SelectValue, } from "@/components/ui/select"; @@ -25,6 +26,7 @@ export function DifficultyFilter({ value, onChange }: DifficultyFilterProps) { Filter by difficulty + Easy Medium Hard diff --git a/frontend/src/components/SearchQuestionsList.tsx b/frontend/src/components/SearchQuestionsList.tsx index 464a1186..b5dc4046 100644 --- a/frontend/src/components/SearchQuestionsList.tsx +++ b/frontend/src/components/SearchQuestionsList.tsx @@ -1,5 +1,9 @@ +import { DifficultyFilter } from "@/components/DifficultyFilter"; import { useSearchQuestions } from "@/services/api/programmingForumComponents"; -import { QuestionSummary } from "@/services/api/programmingForumSchemas"; +import { + DifficultyLevel, + QuestionSummary, +} from "@/services/api/programmingForumSchemas"; import { Loader2 } from "lucide-react"; import { useEffect, useState } from "react"; import { useSearchParams } from "react-router-dom"; @@ -10,6 +14,7 @@ import { QuestionCard } from "./QuestionCard"; export const SearchQuestionsList = () => { const [params] = useSearchParams(); const [pageSize, setPageSize] = useState(20); + const [difficulty, setDifficulty] = useState(); const [previousData, setPreviousData] = useState<{ items: QuestionSummary[]; totalItems: number; @@ -26,6 +31,7 @@ export const SearchQuestionsList = () => { queryParams: { q: params.get("q") ?? "", pageSize, + ...(difficulty && { difficulty }), }, }); @@ -49,11 +55,14 @@ export const SearchQuestionsList = () => { return (
-

- {questions.length - ? `Found ${searchResultData.totalItems} results` - : "No questions found"} -

+
+

+ {questions.length + ? `Found ${searchResultData.totalItems} results` + : "No questions found"} +

+ +
{!questions.length && (

Try searching for specific topics or keywords.

)}