[Refactor] LNK-50-Leenk : 상세 피드/링크 페이지에서 뒤로가기 시 화면 흔들리는 문제 해결

[dalzzy]

📝 Work Description

• 상세 피드/링크 페이지에서 제스쳐 뒤로가기 했을 때 헤더가 위로 올라갔다가 내려오는 문제를 해결했습니다.

문제

iOS에서는 SafeArea가 있는 화면과 없는 화면 간 전환 시:

• iOS가 다음 화면을 미리 렌더링 (제스처 애니메이션을 위해)
• 두 화면의 SafeArea 기준이 다르면 iOS가 레이아웃을 재계산
• StatusBar 높이만큼 콘텐츠가 점프하는 현상 발생

해결

Before: 불일치 상태
[상세 페이지]
Header top: 35px (고정) → StatusBar와 무관
[일반 페이지]
Header marginTop: 16px (고정) → StatusBar와 무관
→ iOS가 SafeArea 전환 시 레이아웃 기준 변경 → 덜컥임 발생

After: 일관된 기준
[상세 페이지]
Header top: insets.top + 16 → StatusBar 높이 + 16
[일반 페이지]
Header marginTop: insets.top + 16 → StatusBar 높이 + 16
→ 모든 화면이 동일한 SafeArea 기준 사용 → 부드러운 전환

📸 Screenshot

ScreenRecording_01-26-2026.22-28-46_1.1.mp4

🚨Issue

📣 To Reviewers

저번에 이거 고치려다가,, 포기했는데 오랜만에 하니까 뚝딱 수정되었습니다..^^ 역시 ai는 똑똑하다

✅ Check List

• 코드가 정상적으로 컴파일되나요?
• merge할 브랜치의 위치를 확인했나요?
• Label을 지정했나요?

Summary by CodeRabbit

릴리스 노트

• Bug Fixes

  • 헤더 및 메뉴 위치가 기기의 안전 영역을 더 정확하게 반영하도록 개선되었습니다.
  • 상태 바 투명도 설정을 개선하여 UI 일관성이 향상되었습니다.

• Chores

  • iOS 빌드 설정이 업데이트되었습니다.

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

[coderabbitai]

🔍 변경 사항 분석

Walkthrough

안전 영역 삽입값을 기반으로 헤더 컴포넌트의 위치 지정을 동적으로 조정하고, StatusBar 구성을 업데이트하며, iOS 프로젝트 코드 서명 및 프로비저닝 설정을 수정했습니다.

Changes

Cohort / File(s)	변경 사항
안전 영역 인식 헤더 위치 지정 app/(post)/leenk/[id]/index.tsx, components/common/Header/Header.tsx, components/feed/FeedDetailItem.tsx	고정 상단 오프셋(35)을 안전 영역 삽입값과 높이에 따른 동적 오프셋(insets.top + 16 * height)으로 변경하여 기기 안전 영역을 고려한 반응형 위치 지정 구현
StatusBar 및 레이아웃 설정 app/_layout.tsx	StatusBar 구성을 투명한 배경과 어두운 스타일의 새로운 인라인 설정으로 교체 및 조건부 SafeAreaView 래퍼 제거
iOS 빌드 구성 ios/Leenk.xcodeproj/project.pbxproj	개발팀 및 자동 프로비저닝 스타일 제거, 코드 서명 방식을 자동에서 수동으로 변경, 빌드 구성 스크립트 단순화

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

• LNK-M-5 Feat: 공통컴포넌트 추가 구현 #9: 동일한 Header 컴포넌트와 FeedDetailItem 헤더 위치 지정을 안전 영역 삽입값 기반으로 업데이트하여 직접 관련됨
• LNK-4-Leenk-인-앱-브라우저로-회원가입-하도록-수정 #54: 동일한 Header 컴포넌트(components/common/Header/Header.tsx)를 수정하여 안전 영역 인식 동적 상단 간격 추가
• Refactor: LNK-49-LEENK 스플래시 로그인 화면에서 인앱 알림이 나타나는 문제 #69: iOS 프로젝트 파일(ios/Leenk.xcodeproj/project.pbxproj)에서 코드 서명/프로비저닝 변경을 유사하게 수행

Suggested reviewers

• nabbang6

Poem

🐰 안전 영역을 품은 헤더야,
어떤 기기에서든 완벽하게 맞춰
동적인 오프셋으로 춤을 춘다
StatusBar도 투명하게 정장을 갈아입고
iOS 빌드 설정도 손질 깔끔해
모든 화면이 반겨줄 준비 완료! ✨

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Title check	✅ Passed	PR 제목이 SafeArea 기준 불일치로 인한 화면 흔들림 문제 해결이라는 주요 변경사항을 명확하게 반영하고 있습니다.
Description check	✅ Passed	PR 설명이 템플릿의 기본 구조를 따르고 있으며, 문제 상황, 해결 방법, 스크린샷, 리뷰어 의견 등이 포함되어 있습니다.

_{✏️ 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.}

[nabbang6]

확인했습니다!! 고생하셨어용... 최고,, bbb