feat: 기상음악 AI 분석 기능 추가 - #197
Conversation
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub. 1 Skipped Deployment
|
There was a problem hiding this comment.
Code Review
이번 풀리퀘스트는 기상음악의 자막을 수집하고 로컬 LLM(@mlc-ai/web-llm)을 활용해 기상음악 적합성을 분석하는 AI 분석 기능을 도입합니다. 자막 수집을 위한 API 라우트 추가, Web Worker 기반의 LLM 엔진 구동, Cache API를 활용한 분석 결과 캐싱, 그리고 플레이어 및 AI 분석 결과 패널 등의 UI 컴포넌트가 새롭게 구현되었습니다. 이에 대해 리뷰어는 API 라우트에서의 액세스 토큰 유효성 검증 및 비디오 ID 형식 검증 누락에 따른 보안 취약점을 지적했습니다. 또한, 권한 확인 시 고유하지 않은 사용자 이름을 사용하는 문제, Next.js SSR 환경에서 caches API 미지원으로 인한 런타임 에러 가능성, 그리고 UI에서 선택된 곡의 하이라이트 조건 오류에 대한 개선 의견을 제시했습니다.
Important
The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.
- 자막 API videoId 11자리 정규식 검증 추가 (경로 이탈·yt-dlp 인자 주입 방어) - analysisCache caches API SSR 가드 및 try/catch 추가 - 음악 리스트 선택 표시를 selectedSong 기준으로 수정 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
자동 생성 자막 마커(isAutoGeneratedCaption)로 분석 결과에 autoCaption을 표시하고, AiRatingBadge에 '자동 생성' 배지를 추가한다. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01YDca1eg1GFHRBmBLYnCMEk
base 스타일에 고정돼 있던 truncate를 multiline=false일 때만 적용하도록 바꿔, 여러 줄 안내문에도 NoteText를 쓸 수 있게 한다. 기본값은 기존과 동일. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01YDca1eg1GFHRBmBLYnCMEk
AiIssuesPanel을 .Empty/.Loading/.Error static property 패턴으로 정리하고, 로딩 스켈레톤이 영역을 채우도록 한다. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01YDca1eg1GFHRBmBLYnCMEk
모델 로드 상태(ModelState)를 webllmEngine 모듈이 단일 출처로 보유하고 useSyncExternalStore로 구독한다. 자막 수집 전에 WebGPU 미지원을 먼저 감지하고, 모델 진행 상태를 버튼 옆 인디케이터로 분리한다. 분석 실패 시 진행 중이던 곡들의 로딩 상태를 정리한다. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01YDca1eg1GFHRBmBLYnCMEk
AI 안내를 NoteTooltip으로, 이전/다음을 SVG 아이콘으로 바꾸고 AI 분석 섹션을 결과 유무와 무관한 고정 높이로 맞춘다. 평점 배지를 제목 옆에 배치하고, 영상을 레터박스로 감싼다. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01YDca1eg1GFHRBmBLYnCMEk
#️⃣연관된 이슈
없음
📝작업 내용
/api/youtube/transcript) 추가 (429/타임아웃 대비 동시성 제한·재시도)@mlc-ai/web-llm)을 워커에서 구동해 곡별 적합도 등급·한 줄 요약·부적절 표현(타임스탬프 포함) 분석MusicListItem에 곡 선택 · AI 상태 슬롯 추가wake-up-music/wake-up-music-recommend/wake-up-music-analysis3개 feature로 분리💬리뷰 요구사항
yt-dlp바이너리(YT_DLP_PATH)가 필요합니다gemma-2-2b-it-q4f16_1-MLC경량 모델을 사용하였지만, 사감 선생님 데스크톱 환경에서 램 점유율 및 신뢰도 테스트가 필요합니다.