Skip to content

[Fix]카테고리 선택 시 깜빡임 버그 수정 #207

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
minjaehan merged 1 commit into from
Nov 3, 2025
Merged

[Fix]카테고리 선택 시 깜빡임 버그 수정 #207

Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
10 changes: 7 additions & 3 deletions src/pages/home/HomePage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@ const HomePage = () => {
}),
getNextPageParam: (lastPage) => lastPage.nextCursorId ?? undefined,
staleTime: 60 * 1000,
placeholderData: (previousData) => previousData,
});

const handleCategoryChange = (selected: string[]) => {
Expand Down Expand Up @@ -99,6 +100,9 @@ const HomePage = () => {
return out;
}, [data, isCategoryEmpty]);

const hasArticles = articles.length > 0;
const isInitialLoading = isLoading && !hasArticles;

// 카테고리 미선택 상태: API 호출 없이 안내 문구만 렌더
if (isCategoryEmpty) {
return (
Expand Down Expand Up @@ -159,19 +163,19 @@ const HomePage = () => {

{/* 기사 카드 그리드 */}
<div className="mx-auto max-w-[1151px]">
{isLoading ? (
{isInitialLoading ? (
<div className="flex h-[400px] items-center justify-center">
<div className="text-24px-medium text-black-70">잠시만요, 스낵이 기사를 담는 중이에요…</div>
</div>
) : isError ? (
) : isError && !hasArticles ? (
<div className="flex h-[400px] items-center justify-center">
<div className="text-24px-medium text-danger/70">
{error instanceof Error
? error.message
: '앗, 뉴스를 불러오지 못했어요. 잠시 후 다시 시도해 주세요.'}
</div>
</div>
) : articles.length === 0 ? (
) : !hasArticles ? (
<div className="flex h-[200px] items-center justify-center">
<div className="text-24px-medium text-black-70 text-center leading-relaxed">
<span className="block">아직 선택한 카테고리가 없어요.😭</span>
Expand Down
Loading