핀 등록 태그 선택 검증 추가

[onebone]

변경 내용

• PIN 등록 시 태그를 최소 1개 선택해야 등록할 수 있도록 검증했습니다.
• 태그 조건 라벨과 최대 4개 선택 오류 메시지를 Figma 기준으로 반영했습니다.
• 태그 선택 상태와 오류 메시지에 접근성 속성을 추가했습니다.

관련 이슈

Closes #232

변경 사항

• 새로운 기능 추가
• 버그 수정
• UI/UX 개선
• 리팩토링
• 문서 업데이트

테스트

• 브라우저에서 정상 동작 확인
• 기존 기능에 영향 없음 확인

스크린샷 (UI 변경시)

체크리스트

• 코드가 정상적으로 동작합니다
• 새로운 에러나 경고가 없습니다
• 필요시 문서를 업데이트했습니다
• 코드 포맷팅을 실행했습니다 (pnpm format)
• ESLint 검사를 통과했습니다 (pnpm lint:fix)

코드 품질 확인
PR 제출 전에 다음 명령어를 실행하여 코드 품질을 확인해주세요:

pnpm lint:fix
pnpm format

Summary by CodeRabbit

• 버그 수정

  • 태그를 최소 1개에서 최대 4개까지 선택하도록 제한했습니다.
  • 태그를 초과 선택하거나 필수 태그를 선택하지 않으면 오류 메시지를 표시합니다.
  • 필수 태그가 없을 때 핀 생성이 차단되고 등록 버튼이 비활성화됩니다.

• 접근성 개선

  • 태그 선택 조건과 오류 상태를 안내하는 설명을 추가했습니다.
  • 태그를 해제하거나 올바르게 선택하면 오류 상태가 자동으로 초기화됩니다.

[coderabbitai]

📝 Walkthrough

Walkthrough

SongDetailPage에 태그를 최소 1개, 최대 4개 선택하도록 검증을 추가했습니다. 태그가 없으면 핀 생성을 차단하고 등록 버튼을 비활성화합니다. 초과 선택 오류와 접근성 안내도 표시합니다.

Changes

태그 선택 검증

Layer / File(s)	Summary
태그 제한 규칙과 오류 상태 src/pages/SongDetailPage.tsx	태그 선택 최소·최대값과 오류 메시지를 정의합니다. 선택 상태에 따라 필수 태그 충족 여부와 오류 메시지를 계산합니다.
태그 입력과 등록 검증 src/pages/SongDetailPage.tsx	태그 선택·해제 시 오류 상태를 갱신합니다. 최대 개수 초과 선택을 차단합니다. 태그가 없으면 핀 생성을 중단하고 오류 토스트를 표시합니다. 등록 버튼을 최소 태그 조건에 따라 비활성화합니다. 태그 안내와 오류 메시지에 aria-live, aria-describedby를 적용합니다.

Estimated code review effort: 3 (Moderate) | ~20 minutes

Possibly related PRs

• UMC10th-PLIMAP/plimap-web#58: 동일한 SongDetailPage.tsx의 태그 선택 로직과 관련됩니다.

Suggested labels: feature

Suggested reviewers: kim3360

🚥 Pre-merge checks | ✅ 4

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	제목은 핀 등록의 태그 선택 검증이라는 주요 변경 사항을 간결하고 명확하게 설명합니다.
Linked Issues check	✅ Passed	변경 사항은 [#232]의 최소 1개 검증, 등록 버튼 비활성화, 조건 라벨, 오류 메시지, 최대 4개 제한 요구 사항을 충족합니다.
Out of Scope Changes check	✅ Passed	변경 사항은 [#232]의 태그 검증 및 접근성 개선 범위에 포함되며, 관련 없는 변경은 확인되지 않습니다.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feat/232-pin-tag-validation

---

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.}

[github-actions]

https://pr-248.plimap.kr

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@src/pages/SongDetailPage.tsx`:
- Around line 665-668: Update the tag label in SongDetailPage around the h3
displaying “태그” to show both the existing minimum of 1 and the maximum of 4
selections. Use the existing MAX_TAG_COUNT constant for the maximum value
instead of hardcoding it, while preserving the current label styling and text.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: 3447f120-1ed3-4452-92bb-0ca1890022fb

📥 Commits

Reviewing files that changed from the base of the PR and between 0dd7de2 and be91f76.

📒 Files selected for processing (1)

• src/pages/SongDetailPage.tsx