Fix/#333 노래 상세정보 추가 fetch를 위한 인터섹션 옵저버 오류 수정

[Creative-Lee]

📝작업 내용

fetch 정상 작동하도록 로직 수정

💬리뷰 참고사항

1ref + 1effect 로 옵져버 실행시키는 구조입니다.
첫 노래 상세정보 API 응답 이후에 옵져버를 실행시켜야 하는등 제약 조건이 조금 있어서 로직이 많아 졌어요
관련해서 api가 수정되면 좋을 것 같아서 건의해둔 상태입니다!

DOM 구조

현재 관련해서 API 수정 건의가 진행중입니다~!
개선되면 로직도 가벼워지고, DOM 구조 역시 더 간단해질 것 같아요.

as is : extraPrev, prev, next, extraNext 총 4개의 데이터 배엘에 map()
to be : prev, next 총 2개의 데이터 배열에 map()

선 배포

원래 사용자에게 제공되야 했던 기능이었어서
#333 bug fix브랜치 기준으로 prod 배포 미리 나갔습니다!

#️⃣연관된 이슈

close #333

[github-actions]

Unit Test Results

  72 files    72 suites   8s ⏱️
284 tests 284 ✔️ 0 💤 0 ❌
287 runs  287 ✔️ 0 💤 0 ❌

Results for commit ab43b89.

♻️ This comment has been updated with latest results.

[cruelladevil]

함께 이야기했던 스냅하면서 fetch 될 경우 스냅이 제대로 동작하지 않는 경우가 있다는 것을 인지해야 할 것 같아요!
⬆️ 중요하지는 않은 내용입니다. 유튜브 쇼츠도 해당 동작이 생기고 scroll snap의 한계인듯 합니다.
스와이프 기능 구현하고 문제 해결하는데 에너지 소모가 많았을텐데 고생하셨습니다!

[ukkodeveloper]

직접 설명 들어서 approve 하겠습니다! 앞으로 개선할 방향에 대해서도 잘 들었습니다 👍