[Feat] 질문지 리스트 페이지에서 카테고리 검색 구현

[ShipFriend0516]

관련 이슈 번호

• 작성자: 서정우
• 작성 날짜: 2024.11.23

close #141

✅ 체크리스트

• 코드가 정상적으로 작동하는지 확인했습니다.
• 주요 변경사항에 대한 설명을 작성했습니다.
• 코드 스타일 가이드에 따라 코드를 작성했습니다.

🧩 작업 내용

• Select 컴포넌트 기능 개선 및 리팩토링
• 카테고리 관련 기능 추가 및 수정
  

📝 작업 상세 내역

질문지 리스트 카테고리

• 카테고리 검색 API 연동
• searchParams를 활용한 카테고리 필터링 기능 추가

  useEffect(() => {
    getQuestionList(selectedCategory);
    if (selectedCategory !== "전체") {
      console.log("selectedCategory", selectedCategory);
      setSearchParams({ category: selectedCategory });
    }
  }, [selectedCategory]);

  useEffect(() => {
    if (searchParams.get("category")) {
      setSelectedCategory(searchParams.get("category") ?? "전체");
    }
  }, [searchParams]);

이렇게 해서 localhost:5173/questions?category=프론트엔드 이런 식으로 들어올시 category에 맞는 리스트 보여주도록 했습니다.

Select 컴포넌트 개선

• Select 컴포넌트에 제네릭 타입을 적용하여 타입 안정성 강화
• value와 setValue를 props로 받아서 사용하도록 수정
• 재네릭 타입에 따른 기본값 설정 기능 추가
• 카테고리 데이터 constraints 를 적용

📌 테스트 및 검증 결과

• Select 컴포넌트의 제네릭 타입 적용 테스트 완료
• 카테고리 필터링 동작 확인