Skip to content

feat : 클러스터 범위 수정 및 북마크 UI 연결 - #312

Merged
L0521 merged 2 commits into
developfrom
feat/301-bookmark-cluster-ui
Aug 11, 2026
Merged

L0521 merged 2 commits into
developfrom
feat/301-bookmark-cluster-ui

Conversation

@L0521

@L0521 L0521 commented Aug 11, 2026 •

Copy link
Copy Markdown
Contributor

변경 내용

  • 클러스터 최종 전환 줌 구간을 6, 8/9, 10 기준으로 맞췄습니다.
  • 지도 북마크 버튼을 눌렀을 때 북마크된 핀/클러스터가 전용 색으로 구분되도록 연결했습니다.
  • 앨범 커버 없는 핀에 빈 배경색이 안 채워지던 기존 버그도 같이 고쳤습니다.

관련 이슈

Closes #301

변경 사항

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

테스트

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

스크린샷 (UI 변경시)

스크린샷 2026-08-11 오후 8 31 39 스크린샷 2026-08-11 오후 8 31 53 스크린샷 2026-08-11 오후 8 31 59

체크리스트

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

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

pnpm lint:fix
pnpm format

Summary by CodeRabbit

  • 새 기능

    • 지도에서 북마크 강조 모드를 켜고 끌 수 있습니다.
    • 북마크된 장소의 핀과 클러스터가 노란색으로 강조 표시됩니다.
    • 북마크 버튼의 활성 상태와 접근성 상태가 명확하게 표시됩니다.
  • 개선

    • 지도 핀에 커버 이미지가 없을 때 회색 배경과 기본 아이콘이 표시됩니다.
    • 북마크 목록의 활성 아이콘 크기와 표시가 개선되었습니다.
    • 지도 클러스터링 전환 기준이 조정되었습니다.

클러스터 최종 전환 줌 구간을 6~8/9~10 기준으로 맞추고(NEXT_TIER_ZOOM
REGION1 8→9), 지도 북마크 버튼을 눌렀을 때 북마크된 핀/클러스터가
전용 색으로 구분되도록 연결한다. 앨범 커버 없는 핀에 빈 배경색이
안 채워지던 기존 버그도 같이 고친다.
@L0521 L0521 self-assigned this Aug 11, 2026
@L0521 L0521 added the feature Feature implementation label Aug 11, 2026
@coderabbitai

coderabbitai Bot commented Aug 11, 2026 •

Copy link
Copy Markdown

Review Change Stack

Warning

Review limit reached

@L0521, you've reached your PR review limit, so we couldn't start this review.

Next review available in: 48 minutes

You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository.

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: 17514fb4-7927-4e0b-85ee-80c7073072d9

📥 Commits

Reviewing files that changed from the base of the PR and between 123a8ad and a5e2008.

📒 Files selected for processing (1)
  • src/pages/MapPage.tsx
📝 Walkthrough

Walkthrough

지도 핀과 클러스터에 북마크 상태를 추가했습니다. MapPage의 북마크 버튼으로 강조 모드를 토글하면 기존 오버레이의 마커 색상이 갱신됩니다. 클러스터 범위와 빈 커버 표시도 변경했습니다.

Changes

북마크 지도 강조 표시

Layer / File(s) Summary
마커 데이터 계약과 렌더링
src/api/pin.ts, src/features/map/types.ts, src/features/map/components/*Marker.tsx, src/features/map/utils/*Marker.ts, src/features/map/constants/devMockMapPins.ts
지도 핀과 클러스터에 hasBookmarkedPlace를 추가했습니다. 북마크 상태에 따라 핀과 클러스터 색상을 변경합니다. 커버 이미지가 없으면 빈 커버 아이콘을 표시합니다.
오버레이 강조 상태 연결
src/features/map/hooks/useMapPinOverlays.ts, src/features/map/hooks/useClusterOverlays.ts, src/features/map/components/MapViewer.tsx
isBookmarkHighlightOn을 오버레이 훅으로 전달합니다. 강조 모드가 변경되면 기존 핀과 클러스터 마커만 갱신합니다. NEXT_TIER_ZOOM.REGION1을 9로 변경했습니다.
북마크 토글과 지도 연결
src/pages/MapPage.tsx, src/features/pin/components/PinListSheet.tsx
북마크 버튼에 aria-pressed와 토글 동작을 추가했습니다. 토글 상태를 MapViewer에 전달하고 활성 아이콘 크기를 변경했습니다.

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

Sequence Diagram(s)

sequenceDiagram
  participant MapPage
  participant MapViewer
  participant useMapPinOverlays
  participant useClusterOverlays
  participant MapPinMarker
  participant ClusterMarker
  MapPage->>MapViewer: isBookmarkHighlightOn 전달
  MapViewer->>useMapPinOverlays: 핀 강조 모드 전달
  MapViewer->>useClusterOverlays: 클러스터 강조 모드 전달
  useMapPinOverlays->>MapPinMarker: 북마크 핀 색상 갱신
  useClusterOverlays->>ClusterMarker: 북마크 클러스터 색상 갱신
Loading

Possibly related PRs

Suggested reviewers: kim3360

🚥 Pre-merge checks | ✅ 3 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Out of Scope Changes check ⚠️ Warning PinListSheet 아이콘 크기 변경과 앨범 커버 배경 수정은 연결 이슈의 요구 사항에 포함되지 않습니다. 연결 이슈와 무관한 아이콘 크기 변경과 앨범 커버 배경 수정은 별도 PR로 분리하거나 범위 근거를 추가하십시오.
✅ Passed checks (3 passed)
Check name Status Explanation
Linked Issues check ✅ Passed 클러스터 줌 구간 변경과 북마크 핀·클러스터 표시 기능을 모두 구현한 내용이 확인됩니다.
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed 제목은 클러스터 범위 수정과 북마크 UI 연결이라는 주요 변경 사항을 정확하고 간결하게 설명합니다.
✨ 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/301-bookmark-cluster-ui

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

Comment @coderabbitai help to get the list of available commands.

@github-actions

Copy link
Copy Markdown

https://pr-312.plimap.kr

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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/MapPage.tsx`:
- Line 207: Update the hasBookmarkedPlace value when constructing the
mapFocusPin or focusedFeedPin so it reflects selectedMapPlace.bookmarkedByMe
instead of always being false. Preserve false when the selected place is not
bookmarked.
🪄 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: 13b7eaab-c205-4628-94fb-1f1367983a1e

📥 Commits

Reviewing files that changed from the base of the PR and between 3ff0ac2 and 123a8ad.

⛔ Files ignored due to path filters (2)
  • src/assets/icons/pin-cover-empty.svg is excluded by !**/*.svg
  • src/assets/icons/pin.svg is excluded by !**/*.svg
📒 Files selected for processing (12)
  • src/api/pin.ts
  • src/features/map/components/ClusterMarker.tsx
  • src/features/map/components/MapPinMarker.tsx
  • src/features/map/components/MapViewer.tsx
  • src/features/map/constants/devMockMapPins.ts
  • src/features/map/hooks/useClusterOverlays.ts
  • src/features/map/hooks/useMapPinOverlays.ts
  • src/features/map/types.ts
  • src/features/map/utils/mapClusterMarker.ts
  • src/features/map/utils/mapPinMarker.ts
  • src/features/pin/components/PinListSheet.tsx
  • src/pages/MapPage.tsx

Comment thread src/pages/MapPage.tsx Outdated
@L0521 L0521 changed the title feat : 클러스터 범위 수정 및 북마크 UI 연결 (#301) feat : 클러스터 범위 수정 및 북마크 UI 연결 Aug 11, 2026
focusedPin의 hasBookmarkedPlace가 항상 false로 고정되어 있어,
북마크된 장소를 검색·피드로 진입해도 강조 모드에서 기본 색으로
표시되던 문제를 수정한다.
@L0521
L0521 merged commit f40614b into develop Aug 11, 2026
2 of 3 checks passed
@L0521
L0521 deployed to preview-maintenance August 11, 2026 11:51 — with GitHub Actions Active
@coderabbitai coderabbitai Bot mentioned this pull request Aug 12, 2026
12 tasks

This branch was successfully deployed

2 active (1 outdated) deployments
preview-maintenance — a5e20083 Deployed Aug 11, 2026 by L0521 via cleanup #518
preview — 123a8adc Deployed Aug 11, 2026 by L0521 via deploy #514
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

feature Feature implementation

Projects

None yet

Development

Successfully merging this pull request may close these issues.

클러스터 범위 수정 및 북마크 UI 연결

1 participant