Skip to content

ExplorePage의 selectedCategory 초기값을 URL 쿼리에서 바로 세팅하도록 수정 #190

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
jam-jang merged 2 commits into from
Aug 21, 2025
Merged

ExplorePage의 selectedCategory 초기값을 URL 쿼리에서 바로 세팅하도록 수정 #190

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
b27bb0e
ExplorePage의 selectedCategory 초기값을 URL 쿼리에서 바로 세팅하도록 수정
jam-jang Aug 21, 2025
81fc2e9
Merge pull request #189 from LUNCH-CHAT/fix/explore-page-useEffect/#188
jam-jang Aug 21, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 12 additions & 6 deletions src/pages/Explore-Page/explore-page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,10 @@ export default function ExplorePage() {
const [searchParams] = useSearchParams();
const { setHideNav } = useNav();

const [selectedCategory, setSelectedCategory] = useState('전체');
//초기값을 URL 쿼리에서 즉시 가져오도록 수정
const initialCategory = searchParams.get('category') ?? '전체';
const [selectedCategory, setSelectedCategory] = useState(initialCategory);

const [showDeptModal, setShowDeptModal] = useState(false);
const [showYearModal, setShowYearModal] = useState(false);

Expand All @@ -72,11 +75,13 @@ export default function ExplorePage() {

const { ref, inView } = useInView({ threshold: 0 });

// 쿼리 파라미터로 선택 카테고리 초기화
// 쿼리 변화 시에만 상태 동기화 초기 렌더 레이스 방지함
useEffect(() => {
const param = searchParams.get('category');
setSelectedCategory(param ?? '전체');
}, [searchParams]);
const param = searchParams.get('category') ?? '전체';
if (param !== selectedCategory) {
setSelectedCategory(param);
}
}, [searchParams, selectedCategory]);

// 단대 목록
useEffect(() => {
Expand Down Expand Up @@ -158,7 +163,7 @@ export default function ExplorePage() {
setProfiles([]);
loadPage(0, false);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [buildParams]);
}, [buildParams]);

// 감지되면 다음 페이지 로드
useEffect(() => {
Expand Down Expand Up @@ -192,6 +197,7 @@ export default function ExplorePage() {
<div className="w-full min-h-screen bg-white font-[pretendard] flex flex-col items-center pb-28">
<div className="w-full max-w-[700px]">
<CategorySlider
key={selectedCategory}
categories={categories}
selectedCategory={selectedCategory}
onSelect={setSelectedCategory}
Expand Down