Conversation
- MyLinksPage 컴포넌트 추가 - 링크 경로 업데이트
- 링크가 없을 경우 모임 생성 버튼 표시 - 페이지 헤더와 내비게이션 기능 추가
- 데이터 타입 정의 - useGetExpensesLinks 훅 추가 - mock 핸들러 업데이트
- borderWidth, borderColor, borderStyle 속성 추가 - processStyleProps에 스타일 처리 로직 반영
- processStyleProps에 minWidth, overflow, display, flex, textAlign, whiteSpace, textOverflow 추가 - Text 컴포넌트에 processStyleProps 적용
- LinkBox 컴포넌트 생성 - 링크 표시/복사 기능 추가 - mock api 연결 - 로딩 중 UI 표시 추가
- processStyleProps에 minHeight와 boxSizing 처리 로직 추가 - SizeProps, LayoutProps 인터페이스에 속성 정의
|
Warning Rate limit exceeded
⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the 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 have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. 📝 WalkthroughWalkthrough정산 링크 관리 기능의 UI를 개발하며, 새로운 MyLinks 페이지와 라우팅을 추가하고 링크 API 및 스타일 시스템을 확장했습니다. Changes
Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches🧪 Generate unit tests (beta)
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 |
- import 누락 수정 - 타입 오류 수정
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (5)
src/shared/ui/Text/index.tsx (1)
6-15:BaseStyledProps의 커스텀 props가 DOM으로 전달될 수 있습니다.
...props로BaseStyledProps의 모든 속성이S.Text에 전달됩니다. styled-components는@emotion/is-prop-valid로 대부분 필터링하지만,color등 일부 HTML 유효 속성은 DOM에 그대로 전달되어 React 콘솔 경고가 발생할 수 있습니다.현재 동작에 문제가 없다면 당장은 괜찮지만, DOM 경고가 발생할 경우 styled-components의
shouldForwardProp또는 transient props($prefix) 패턴 적용을 고려해 주세요.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/shared/ui/Text/index.tsx` around lines 6 - 15, The Text component's props type (TextProps) extends BaseStyledProps and spreads all props into S.Text, which can cause custom styling props (from BaseStyledProps) like color to be forwarded to the DOM and trigger React warnings; update the styled component S.Text to filter these by either using styled-components' shouldForwardProp to block BaseStyledProps keys or switch to transient props (prefix prop names with $ and update TextProps and usages accordingly), ensuring TextProps/BaseStyledProps fields are not passed through via ...props to the underlying DOM element (reference S.Text, TextProps, BaseStyledProps, shouldForwardProp, and transient props).src/shared/lib/processStyle.ts (1)
168-171:flex: 0등 falsy 값이 무시됩니다.
props.flex &&패턴은flex가0일 때 조건이 false로 평가되어 스타일이 적용되지 않습니다.flex: 0은 flex item이 grow하지 않도록 하는 유효한 CSS 값입니다. 기존 props에도 동일한 패턴이 사용되고 있지만,flex는0이 의미 있는 값으로 자주 쓰이므로 주의가 필요합니다.제안: undefined 체크로 변경
- ${props.flex && + ${props.flex !== undefined && css` flex: ${props.flex}; `}🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/shared/lib/processStyle.ts` around lines 168 - 171, The current conditional uses "props.flex &&" which incorrectly skips valid falsy values like 0; update the check in the styled template that references props.flex and the css block so it tests for undefined (e.g. props.flex !== undefined or typeof props.flex !== 'undefined') before emitting "flex: ${props.flex};" ensuring flex: 0 is applied when provided.src/shared/types/styled.d.ts (1)
63-71:TextProps이름이Text/index.tsx의 로컬TextProps와 충돌할 수 있습니다.
src/shared/ui/Text/index.tsx에서도 동일한 이름의TextProps인터페이스를 로컬로 정의하고 있어 혼동을 유발할 수 있습니다.BaseStyledTextProps또는TextStyleProps등으로 구분하면 가독성이 높아질 수 있습니다.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/shared/types/styled.d.ts` around lines 63 - 71, The exported interface TextProps in src/shared/types/styled.d.ts conflicts with the local TextProps in src/shared/ui/Text/index.tsx; rename the exported interface to a distinct name (e.g., BaseStyledTextProps or TextStyleProps) and update all places that import or reference that symbol (search for TextProps imports/usages, including styled-components and components relying on shared types) so code compiles and the local Text/index.tsx can keep its own TextProps without collision.src/shared/ui/Text/index.styles.tsx (1)
21-26:textAlign스타일이 두 곳에서 적용될 수 있습니다.Line 23에서
$textAlign을 통해text-align을 설정하고, Line 26의processStyleProps에서도textAlignprop이 있으면 동일한 CSS 속성을 출력합니다.processStyleProps가 뒤에 위치하므로 우선하겠지만, 동일 속성이 두 경로로 적용되는 것은 혼동을 유발할 수 있습니다.장기적으로
$textAlign전용 라인을 제거하고processStyleProps로 통합하는 것을 고려해 보세요.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/shared/ui/Text/index.styles.tsx` around lines 21 - 26, The Text styled component currently applies text-align twice (explicit line using $textAlign and again via processStyleProps); remove the explicit text-align line from Text and rely on processStyleProps to emit text-align using the $textAlign prop, but ensure processStyleProps (or the shape it consumes) recognizes $textAlign and applies a default of 'left' when undefined; update any references/tests expecting the explicit behavior to use processStyleProps and keep identifiers Text, StyledTextProps, processStyleProps, and $textAlign for locating the change.src/pages/myLinks/ui/LinkBox/index.tsx (1)
13-18: 복사 실패 시 사용자 피드백이 없습니다.
copyClipboard가false를 반환하는 경우(복사 실패) 사용자에게 아무런 알림이 표시되지 않습니다. 실패 시에도 toast를 표시하면 UX가 개선됩니다.💡 실패 케이스 처리 제안
const copyLink = async (text: string) => { const isCopied = await copyClipboard(text); if (isCopied) { showToast({ type: 'success', content: '링크 복사 완료!' }); + } else { + showToast({ type: 'error', content: '링크 복사에 실패했어요.' }); } };🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/pages/myLinks/ui/LinkBox/index.tsx` around lines 13 - 18, The copyLink function currently only shows a success toast when copyClipboard returns true; add feedback for failure by showing an error toast when isCopied is false and also wrap the await copyClipboard(text) in try/catch to show an error toast (via showToast) if copyClipboard throws. Update the copyLink function to call showToast({type: 'error', content: '링크 복사 실패' /* or localized message */}) on failure and in the catch include a generic message or the caught error for better UX/debugging.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@src/pages/myLinks/MyLinksPage.tsx`:
- Around line 17-40: The isLoading branch currently builds a JSX fragment but
never returns it, so the loading UI is never rendered; update the MyLinksPage
component to return the loading JSX when isLoading is true (e.g., add a return
before the fragment) so the Header and Flex elements (Header, Flex) with the
loading text are rendered, keeping the existing props such as
leftButtonOnClick={() => navigate(-1)} and bgColor intact.
---
Nitpick comments:
In `@src/pages/myLinks/ui/LinkBox/index.tsx`:
- Around line 13-18: The copyLink function currently only shows a success toast
when copyClipboard returns true; add feedback for failure by showing an error
toast when isCopied is false and also wrap the await copyClipboard(text) in
try/catch to show an error toast (via showToast) if copyClipboard throws. Update
the copyLink function to call showToast({type: 'error', content: '링크 복사 실패' /*
or localized message */}) on failure and in the catch include a generic message
or the caught error for better UX/debugging.
In `@src/shared/lib/processStyle.ts`:
- Around line 168-171: The current conditional uses "props.flex &&" which
incorrectly skips valid falsy values like 0; update the check in the styled
template that references props.flex and the css block so it tests for undefined
(e.g. props.flex !== undefined or typeof props.flex !== 'undefined') before
emitting "flex: ${props.flex};" ensuring flex: 0 is applied when provided.
In `@src/shared/types/styled.d.ts`:
- Around line 63-71: The exported interface TextProps in
src/shared/types/styled.d.ts conflicts with the local TextProps in
src/shared/ui/Text/index.tsx; rename the exported interface to a distinct name
(e.g., BaseStyledTextProps or TextStyleProps) and update all places that import
or reference that symbol (search for TextProps imports/usages, including
styled-components and components relying on shared types) so code compiles and
the local Text/index.tsx can keep its own TextProps without collision.
In `@src/shared/ui/Text/index.styles.tsx`:
- Around line 21-26: The Text styled component currently applies text-align
twice (explicit line using $textAlign and again via processStyleProps); remove
the explicit text-align line from Text and rely on processStyleProps to emit
text-align using the $textAlign prop, but ensure processStyleProps (or the shape
it consumes) recognizes $textAlign and applies a default of 'left' when
undefined; update any references/tests expecting the explicit behavior to use
processStyleProps and keep identifiers Text, StyledTextProps, processStyleProps,
and $textAlign for locating the change.
In `@src/shared/ui/Text/index.tsx`:
- Around line 6-15: The Text component's props type (TextProps) extends
BaseStyledProps and spreads all props into S.Text, which can cause custom
styling props (from BaseStyledProps) like color to be forwarded to the DOM and
trigger React warnings; update the styled component S.Text to filter these by
either using styled-components' shouldForwardProp to block BaseStyledProps keys
or switch to transient props (prefix prop names with $ and update TextProps and
usages accordingly), ensuring TextProps/BaseStyledProps fields are not passed
through via ...props to the underlying DOM element (reference S.Text, TextProps,
BaseStyledProps, shouldForwardProp, and transient props).
|
@coderabbitai approve |
✅ Actions performedComments resolved and changes approved. |
💻 작업 내용
ROUTE.myLinks) 추가processStyleProps유틸 강화: border, layout, text 등의 추가 스타일을 처리할 수 있도록 개선📸 스크린샷
Summary by CodeRabbit
릴리스 노트