[FEAT#315] 끗장 뱃지 표시, 나다움 내역 UI 개선

[grapefruit13]

📝 작업 내용

🎯 관련 이슈

Closes #315

Summary by CodeRabbit

새로운 기능

• 관리자 계정의 경우 게시물 및 댓글 작성자 이름 옆에 관리자 배지가 표시됩니다.
• 상점 히스토리 페이지의 상단에 고정된 필터 영역이 추가되어 요약 정보, 필터, 기간 범위를 한 곳에서 관리할 수 있습니다.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Review	Updated (UTC)
youthit	Ready	Preview, Comment	Jan 26, 2026 1:21pm

[coderabbitai]

Walkthrough

끗장 뱃지를 표시하기 위해 새 AdminBadge 컴포넌트를 추가하고, 포스트와 댓글 컴포넌트들을 통해 role prop을 전파한다. 동시에 나다움 내역 페이지의 요약 섹션과 필터를 상단에 고정하는 UI 레이아웃 개선을 수행한다.

Changes

Cohort / File(s)	Summary
Admin 뱃지 시스템 fe/src/components/shared/ui/admin-badge.tsx, fe/src/components/community/PostMainContent.tsx, fe/src/components/shared/post-profile-section.tsx, fe/src/components/community/CommentItem.tsx, fe/src/app/(main)/community/post/[id]/page.tsx	AdminBadge 컴포넌트 신규 생성 (role이 "admin"일 때 "끗장" 배지 렌더링). PostMainContent, PostProfileSection에 role prop 추가 및 전파. 포스트 디테일 페이지, 댓글에서 AdminBadge 렌더링.
나다움 내역 UI 개선 fe/src/app/(main)/store/history/nadaum/page.tsx	요약 섹션을 sticky 컨테이너로 감싸고, 필터 영역과 기간 범위 표시를 상단 고정 레이아웃으로 재구성. 기존 데이터 페칭 및 무한 스크롤 로직은 유지.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~15 minutes

Possibly related PRs

• [FEAT#309] role 필드 추가 #310: 백엔드에서 post/comment 응답에 nullable "role" 필드를 추가한 PR과 연계되어, 프론트엔드에서 그 role을 PostMainContent/PostProfileSection 및 AdminBadge를 통해 표시한다.
• [FEAT#77] 나다움 내역 UI/API #170: 같은 파일인 fe/src/app/(main)/store/history/nadaum/page.tsx를 수정하여 나다움 내역 UI를 개선하는 겹치는 변경을 다룬다.
• [FEAT#54] 프로그램 문의 섹션 추가 #59: 사용자 생성 콘텐츠(포스트/댓글)에 admin 지시자를 추가하는 점에서 유사하며, QnA 항목에 admin 배지를 렌더링하는 것과 패턴이 같다.

Suggested labels

✨ feature, FE

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Description check	⚠️ Warning	PR 설명이 불완전하다. 필수 섹션인 '📝 작업 내용'과 '🔄 변경사항'이 비어있고, '👀 리뷰 포인트'도 작성되지 않았다. 관련 이슈 링크만 제공되어 있다.	작업 내용, 변경사항, 리뷰 포인트를 구체적으로 작성하고, 필요시 스크린샷을 추가해주세요.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	PR 제목이 주요 변경사항을 명확하게 반영하고 있다. 끗장 뱃지 표시와 나다움 내역 UI 개선이라는 두 가지 핵심 기능을 포함하고 있으며, 코드 변경 내용과 일치한다.
Linked Issues check	✅ Passed	PR의 코드 변경사항이 #315 이슈의 요구사항을 충족한다. 끗장 뱃지 표시(AdminBadge 컴포넌트 추가) [#315]와 나다움 내역 상단 필터 고정(sticky 레이아웃 적용) [#315]이 모두 구현되었다.
Out of Scope Changes check	✅ Passed	모든 변경사항이 #315 이슈의 범위 내에 있다. AdminBadge 컴포넌트 추가, role prop 전파, sticky 필터 레이아웃 적용이 모두 이슈 요구사항과 관련된 변경이다.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

• 📝 Generate docstrings

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[github-actions]

🔨 빌드 상태: 성공! ✅

프론트엔드 빌드가 성공적으로 완료되었습니다! 🎉

✅ 체크 완료

• 🔨 Frontend Build: 성공

📊 상세 정보

• Commit: 328edb3
• Branch: FEAT#315
• 빌드 완료 시간: 2026. 1. 26. 오후 10:22:23

🚀 빌드에 문제가 없습니다. 머지 가능합니다!

[coderabbitai]

Actionable comments posted: 1

🤖 Fix all issues with AI agents

In `@fe/src/app/`(main)/store/history/nadaum/page.tsx:
- Around line 208-277: The icon-only ButtonBase used to open the period filter
(the ButtonBase wrapping ListFilterIcon and invoking
setSelectedPeriod(appliedPeriod); setIsPeriodFilterOpen(true)) lacks an
accessible name; add an appropriate aria-label (e.g., "Open period filter" or
localised "기간 필터 열기") to that ButtonBase so screen readers can convey its
purpose.