Skip to content

feat: 웹/앱 버전 표시 기능 - #178

Merged
iOdiO89 merged 9 commits into
devfrom
feat/160-version
Jun 13, 2026
Merged

feat: 웹/앱 버전 표시 기능#178
iOdiO89 merged 9 commits into
devfrom
feat/160-version

Conversation

@iOdiO89

@iOdiO89 iOdiO89 commented Jun 11, 2026

Copy link
Copy Markdown
Contributor

작업 요약

  • 마이페이지에서 웹 및 앱 버전 표기 기능 추가

작업 세부 내용

웹·앱 버전 표시

웹 버전 추출 방식

  • prebuild 스크립트를 통해 web-v* git 태그에서 웹 버전을 추출하여 .env.localNEXT_PUBLIC_WEB_VERSION에 자동 주입
  • dev/build 실행 전 prebuild 스크립트 연동 (apps/web, 루트 prebuild:web)

앱 버전 추출 방식

  • 앱 User-Agent에 Expo 앱 버전 포함 (WEBVIEW_UA_TOKEN/{version})

  • user agent 정보 파싱을 통해 버전 앱 버전 확인

  • 마이페이지 하단 AppVersionFooter에서 버전 표시

    • 웹 환경인 경우: v{webVersion}
    • 앱 WebView: v{appVersion} (w{webVersion})
  • 하드코딩된 APP_VERSION_LABEL 상수 제거

프로필·이미지 관련 수정

  • BaseImage: src 변경 시 이전 로딩/에러 fallback이 계속 노출되던 문제 수정 (key 기반 remount)
  • 닉네임 중복 체크 API: ENDPOINTS.USER_NICKNAME_CHECK 상수 사용 및 params 주입 방식으로 변경
  • usePatchMe: 프로필 수정 성공 후 invalidateQueries 비동기 처리 추가

기타 리팩토링

  • LoginButtons: ReactNativeWebView.postMessage 직접 호출 → WebBridge + isWebview() 유틸로 통일
  • 마이페이지 본문 컨테이너 divmain 시맨틱 태그 적용
  • Android RECORD_AUDIO 권한 제거 (미사용)

연관 이슈

closes #179

@iOdiO89 iOdiO89 self-assigned this Jun 11, 2026
@iOdiO89 iOdiO89 added feature New feature or request APP Good for newcomers WEB labels Jun 11, 2026
@vercel

vercel Bot commented Jun 11, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
depromeet Ready Ready Preview, Comment Jun 13, 2026 6:48pm

@github-actions

Copy link
Copy Markdown

No description provided.

@github-actions
github-actions Bot requested review from soyeong0115 and ychany June 11, 2026 07:52
@coderabbitai

coderabbitai Bot commented Jun 11, 2026

Copy link
Copy Markdown

Review Change Stack

Warning

Review limit reached

@iOdiO89, we couldn't start this review because you've reached your PR review rate limit.

More reviews will be available in 53 minutes and 40 seconds. Learn how PR review limits work.

Your organization has used up its prepaid credits, and credit purchases are no longer available. Enable the review add-on in the billing tab to keep reviews running — you're only billed for reviews past your plan's rate limits ($0.25/file).

⌛ How to resolve this issue?

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.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available.

Please see our Fair Usage Limits Policy for further information.

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 54ef3ba7-1ff4-4242-9512-60ca75c8f31a

📥 Commits

Reviewing files that changed from the base of the PR and between be150f3 and edce4bc.

📒 Files selected for processing (13)
  • apps/app/app.json
  • apps/app/app/index.tsx
  • apps/app/constants/userAgent.ts
  • apps/web/package.json
  • apps/web/scripts/prebuild.mjs
  • apps/web/src/app/login/_components/LoginButtons.tsx
  • apps/web/src/app/mypage/_components/AppVersionFooter.tsx
  • apps/web/src/app/mypage/_consts/mypage.ts
  • apps/web/src/app/mypage/_utils/appVersion.ts
  • apps/web/src/app/mypage/edit/_apis/getNicknameCheck.ts
  • apps/web/src/app/mypage/page.tsx
  • apps/web/src/consts/api.ts
  • apps/web/src/hooks/useImagePicker.ts

Walkthrough

Native app의 WebView User-Agent를 Expo 버전 기반으로 상수화하고, web 애플리케이션 버전을 자동 관리하며, WebBridge 메시지 통신을 표준화합니다. 마이페이지에 동적 버전 표시 기능을 추가하고 API 엔드포인트를 통합합니다.

Changes

Native App User-Agent 관리

Layer / File(s) Summary
User-Agent 상수 및 WebView 적용
apps/app/constants/userAgent.ts, apps/app/app/index.tsx, apps/app/app.json
USER_AGENT 상수를 Expo 버전과 WEBVIEW_UA_TOKEN을 조합하여 정의하고 WebView의 applicationNameForUserAgent에 적용합니다. Android 권한에서 RECORD_AUDIO를 제거합니다.

Web 버전 관리 및 WebBridge 통신

Layer / File(s) Summary
Web 버전 자동 관리 인프라
apps/web/package.json, apps/web/scripts/prebuild.mjs
git 태그에서 웹 버전을 추출하여 .env.localNEXT_PUBLIC_WEB_VERSION에 자동 주입하는 전처리 스크립트를 추가합니다. npm run dev/build 실행 시 자동 실행되도록 훅을 설정합니다.
WebBridge 기반 소셜 로그인 통신
apps/web/src/app/login/_components/LoginButtons.tsx
소셜 로그인 핸들러를 isWebview() 분기와 표준화된 WebBridge.postMessage({ type, payload: { provider } }) 형식으로 변경합니다. 약관 안내 마크업을 정렬합니다.
WebBridge 이미지 피커 통신 표준화
apps/app/utils/handleImage.ts, apps/web/src/hooks/useImagePicker.ts
WebBridge.postMessage 호출을 일관된 { type, payload } 형식으로 정렬합니다.
마이페이지 동적 버전 표시
apps/web/src/app/mypage/_utils/appVersion.ts, apps/web/src/app/mypage/_components/AppVersionFooter.tsx, apps/web/src/app/mypage/_consts/mypage.ts, apps/web/src/app/mypage/page.tsx
AppVersionFooter를 비동기 Server Component로 변경하여 user-agent에서 앱 버전을, NEXT_PUBLIC_WEB_VERSION에서 웹 버전을 추출해 v{app} (w{web}) 형식으로 표시합니다. 정적 버전 상수를 제거합니다. 마이페이지 컨테이너를 시맨틱 main 요소로 변경합니다.
API 엔드포인트 통합
apps/web/src/consts/api.ts, apps/web/src/app/mypage/edit/_apis/getNicknameCheck.ts
ENDPOINTSUSER_NICKNAME_CHECK 상수를 추가하고, getNicknameCheck를 쿼리 파라미터 방식으로 변경합니다.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

  • depromeet/PIKI-Client#144: WebView의 applicationNameForUserAgent를 UA 토큰 기반으로 변경하는 로직이 직접 연관됩니다.
  • depromeet/PIKI-Client#153: WebBridge 기반 소셜 로그인 REQUEST_SOCIAL_LOGIN 메시지 전송 로직과 동일한 코드 경로를 공유합니다.
  • depromeet/PIKI-Client#166: WebBridge 메시지 타입과 페이로드 스키마 변경이 이 PR의 통신 표준화와 직접 이어집니다.

Suggested reviewers

  • ychany
  • soyeong0115
  • kanghaeun

🐰 버전을 자동으로 관리하고
다리 위에서 메시지를 주고받아
앱과 웹이 하나 되네요
동적 표시로 언제든 확인하고
권한도 정리해서 더 깔끔해졌어요 ✨

🚥 Pre-merge checks | ✅ 3 | ❌ 2

❌ Failed checks (2 warnings)

Check name Status Explanation Resolution
Out of Scope Changes check ⚠️ Warning Android RECORD_AUDIO 권한 제거, 이미지 피커 포맷 변경, LoginButtons 리팩토링 등 일부 변경이 #160 이슈 범위를 벗어납니다. RECORD_AUDIO 권한 제거와 LoginButtons 웹뷰 통신 로직 변경은 별도 이슈로 분리하거나 범위 문서에 명시하시기 바랍니다.
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 (3 passed)
Check name Status Explanation
Title check ✅ Passed PR 제목이 웹/앱 버전 표시 기능을 명확히 설명하며 주요 변경사항을 정확히 반영합니다.
Linked Issues check ✅ Passed PR이 #160 이슈의 주요 요구사항인 마이페이지 앱 버전 표시, 프로필 수정, 닉네임 체크, 웹 버전 표시 기능을 구현했습니다.
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch feat/160-version

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 and usage tips.

@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: 2

🤖 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 `@apps/web/package.json`:
- Around line 7-10: The Turborepo cache key isn't sensitive to the
VERCEL_GIT_COMMIT_REF (or derived NEXT_PUBLIC_WEB_VERSION) so prebuild
(apps/web/scripts/prebuild.mjs) may not run on cache hits; update the root
turbo.json to include VERCEL_GIT_COMMIT_REF in globalEnv or modify the apps/web
build.inputs to include NEXT_PUBLIC_WEB_VERSION (or the .env* value) so the
cache key changes when the commit ref/version changes, ensuring the prebuild
script runs and .env.local-derived NEXT_PUBLIC_WEB_VERSION is refreshed.

In `@apps/web/scripts/prebuild.mjs`:
- Around line 57-58: When getWebVersion() returns null, the script currently
does nothing and leaves a stale NEXT_PUBLIC_WEB_VERSION in .env.local; update
the logic around getWebVersion() / insertWebVersionIntoEnv to explicitly clear
or remove the NEXT_PUBLIC_WEB_VERSION entry (e.g., set it to an empty string or
delete the key) when webVersion is null so the old value is not preserved in
.env.local. Ensure you modify the code that calls insertWebVersionIntoEnv
(and/or the insertWebVersionIntoEnv implementation) to handle the null case and
write the updated .env content accordingly.
🪄 Autofix (Beta)

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: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 946eb354-8246-4ee4-9c5f-bad4c13a27f7

📥 Commits

Reviewing files that changed from the base of the PR and between 0d8281d and be150f3.

📒 Files selected for processing (14)
  • apps/app/app.json
  • apps/app/app/index.tsx
  • apps/app/constants/userAgent.ts
  • apps/app/utils/handleImage.ts
  • apps/web/package.json
  • apps/web/scripts/prebuild.mjs
  • apps/web/src/app/login/_components/LoginButtons.tsx
  • apps/web/src/app/mypage/_components/AppVersionFooter.tsx
  • apps/web/src/app/mypage/_consts/mypage.ts
  • apps/web/src/app/mypage/_utils/appVersion.ts
  • apps/web/src/app/mypage/edit/_apis/getNicknameCheck.ts
  • apps/web/src/app/mypage/page.tsx
  • apps/web/src/consts/api.ts
  • apps/web/src/hooks/useImagePicker.ts
💤 Files with no reviewable changes (1)
  • apps/web/src/app/mypage/_consts/mypage.ts

Comment thread apps/web/package.json
Comment thread apps/web/scripts/prebuild.mjs Outdated
Comment on lines +28 to +30
getAuthUrl('kakao').then(({ url }) => {
window.location.href = url;
});

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

handleKakaoLogin / handleGoogleLogin에서 async 함수 안에 .then()을 쓰면 getAuthUrl이 실패했을 때 에러가 잡히지 않는 것 같아

저번에 테스트할 때 카카오 로그인 버튼 눌렀는데 아무 반응 없었던 것도 이 때문일 수 있을 것 같은데 이미 async를 쓰고 있으니 await으로 통일하고 try/catch로 토스트 띄어주는 식으로 에러 처리를 해주는건 어떨까?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

스크린샷 2026-06-12 오전 9 54 07

이거 너가 추가한 코드던데...?! 나는 저장하면서 prettier만 바뀌었을 뿐이야 ..

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

아 내가 추가한거였구나.. 따로 해서 올릴게

if (!tag.startsWith(WEB_VERSION_TAG_PREFIX)) return null;

const webVersion = tag.slice(WEB_VERSION_TAG_PREFIX.length);
console.log('[WEB VERSION] ', webVersion);

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

콘솔 필요하다면 console.warn 으로 수정해줭

@iOdiO89
iOdiO89 force-pushed the feat/160-version branch from cd86302 to b925d2f Compare June 13, 2026 18:45
@iOdiO89
iOdiO89 merged commit 01598cf into dev Jun 13, 2026
4 of 5 checks passed
@iOdiO89
iOdiO89 deleted the feat/160-version branch June 13, 2026 18:48
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

APP Good for newcomers feature New feature or request WEB

Projects

None yet

Development

Successfully merging this pull request may close these issues.

feat: 웹/앱 버전 표기 기능

2 participants