[fix] 프로모션 WebView에서 동아리 상세 페이지 이동 불가 문제 수정#16
Open
seongwon030 wants to merge 2 commits into
Open
Conversation
NAVIGATE_WEBVIEW 메시지 타입을 WebViewMessageTypes에 추가하고 useWebViewMessageHandler 훅에 onNavigateWebview 콜백을 지원하여 webview/[slug].tsx에서도 동아리 상세 화면으로 이동할 수 있도록 수정
워크스루웹뷰 내비게이션 메시지 처리를 위한 새로운 NAVIGATE_WEBVIEW 메시지 타입을 추가하고, 웹뷰 메시지 핸들러 훅에서 이를 처리하며, 웹뷰 페이지 컴포넌트에서 라우팅 로직을 구현하였습니다. 변경 사항WebView 내비게이션 메시지 기능
예상 코드 리뷰 노력🎯 3 (중간) | ⏱️ ~20분 관련 가능 PR
제안된 리뷰어
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Tip 💬 Introducing Slack Agent: The best way for teams to turn conversations into code.Slack Agent is built on CodeRabbit's deep understanding of your code, so your team can collaborate across the entire SDLC without losing context.
Built for teams:
One agent for your entire SDLC. Right inside Slack. 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. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (2)
app/webview/[slug].tsx (2)
90-97: ⚡ Quick win
handleNavigateWebview를useCallback으로 감싸는 것을 권장합니다.
handleBack과 마찬가지로handleNavigateWebview도 렌더링마다 새 함수 참조가 생성되어useWebViewMessageHandler내부의handleMessage콜백도 매 렌더마다 재생성됩니다.useCallback으로 감싸면 불필요한 재생성을 방지할 수 있습니다.♻️ 제안 수정
- const handleNavigateWebview = (slug: string) => { + const handleNavigateWebview = useCallback((targetSlug: string) => { - if (slug.startsWith('club/')) { + if (targetSlug.startsWith('club/')) { - const clubId = slug.replace('club/', ''); + const clubId = targetSlug.slice('club/'.length); router.push({ pathname: '/club/[id]', params: { id: clubId } }); } else { - router.push({ pathname: '/webview/[slug]', params: { slug } }); + router.push({ pathname: '/webview/[slug]', params: { slug: targetSlug } }); } - }; + }, [router]);🤖 Prompt for 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. In `@app/webview/`[slug].tsx around lines 90 - 97, The handleNavigateWebview function is recreated on every render causing useWebViewMessageHandler's internal handleMessage callback to be regenerated; wrap handleNavigateWebview in React.useCallback (similar to handleBack) so it memoizes across renders, referencing router.push and keeping the same logic for the 'club/' branch (clubId extraction and router.push to '/club/[id]') and the else branch (router.push to '/webview/[slug]'); ensure its dependency array includes only values used (e.g., router) to avoid stale closures.
90-90: 💤 Low value파라미터 이름
slug가 외부 스코프의slug를 섀도잉합니다.Line 50의
useLocalSearchParams에서 선언된slug와handleNavigateWebview의 파라미터 이름이 동일하여 혼동의 여지가 있습니다.targetSlug또는navigationSlug등으로 구분하면 가독성이 향상됩니다.🤖 Prompt for 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. In `@app/webview/`[slug].tsx at line 90, The parameter name slug in handleNavigateWebview shadows the outer slug from useLocalSearchParams; rename the parameter (e.g., targetSlug or navigationSlug) and update all references inside handleNavigateWebview and any call sites to use the new name so it no longer conflicts with the outer slug variable declared by useLocalSearchParams, preserving the same behavior.
🤖 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 `@app/webview/`[slug].tsx:
- Around line 91-92: The current extraction of clubId using
slug.replace('club/', '') is fragile; update the clubId computation to derive
the substring after the prefix using the known prefix length (e.g., when
slug.startsWith('club/')) by using slug.slice('club/'.length) (or
slug.substring) and then validate that clubId is non-empty before routing;
locate the slug.startsWith('club/') check and the clubId variable in
app/webview/[slug].tsx and replace the replace-based extraction with a
slice-based extraction plus an empty-ID guard to avoid navigating to /club/ for
an empty id.
---
Nitpick comments:
In `@app/webview/`[slug].tsx:
- Around line 90-97: The handleNavigateWebview function is recreated on every
render causing useWebViewMessageHandler's internal handleMessage callback to be
regenerated; wrap handleNavigateWebview in React.useCallback (similar to
handleBack) so it memoizes across renders, referencing router.push and keeping
the same logic for the 'club/' branch (clubId extraction and router.push to
'/club/[id]') and the else branch (router.push to '/webview/[slug]'); ensure its
dependency array includes only values used (e.g., router) to avoid stale
closures.
- Line 90: The parameter name slug in handleNavigateWebview shadows the outer
slug from useLocalSearchParams; rename the parameter (e.g., targetSlug or
navigationSlug) and update all references inside handleNavigateWebview and any
call sites to use the new name so it no longer conflicts with the outer slug
variable declared by useLocalSearchParams, preserving the same behavior.
🪄 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: e9e9ee7f-6820-42ae-820c-a10ed4d6877f
📒 Files selected for processing (3)
app/webview/[slug].tsxhooks/use-webview-message-handler.tstypes/webview-message.types.ts
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
문제
프로모션 WebView(이벤트 정보 페이지)에서 "동아리 정보 보러가기" 버튼을 클릭해도 동아리 상세 페이지로 이동하지 않는 버그
원인
웹에서
NAVIGATE_WEBVIEW메시지를 전송하지만, webview/[slug].tsx가 사용하는 useWebViewMessageHandler 훅에 해당 타입이정의되어 있지 않아 default 케이스(console.warn)로 빠지며 동작하지 않았음.
home-webview-screen.tsx는 자체 handleMessage에서 NAVIGATE_WEBVIEW를 직접 처리해 정상 동작했으나, 공유 훅에는 누락된 상태였음
수정 내용
Summary by CodeRabbit
새로운 기능