Conversation
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
📝 관련 이슈 |
📝 WalkthroughWalkthrough결제 도메인 타입과 API, React Query 훅, 날짜별 그룹화 유틸, 결제 알림 UI, 결제 관리 페이지 및 MSW 목 핸들러가 추가되었고, Axios baseURL 및 요청 인터셉터와 일부 버튼 스타일이 조정되었습니다. package.json에 Yarn 버전이 선언되었습니다. (≤50단어) Changes
Possibly related PRs
Suggested labels
Poem
🚥 Pre-merge checks | ✅ 1✅ Passed checks (1 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 |
There was a problem hiding this comment.
Actionable comments posted: 3
🧹 Nitpick comments (4)
src/shared/api/axios.ts (1)
7-9: 서버 URL trailing slash 정규화를 한 번 넣어두는 게 안전합니다.Line 8 구성은 환경변수 값 끝에
/가 있을 때 이중 슬래시 URL이 만들어질 수 있습니다.수정 예시
+const serverUrl = import.meta.env.VITE_SERVER_URL?.replace(/\/+$/, ''); const axiosInstance = axios.create({ baseURL: import.meta.env.VITE_SERVER_URL - ? `${import.meta.env.VITE_SERVER_URL}/api/v1` + ? `${serverUrl}/api/v1` : '',🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/shared/api/axios.ts` around lines 7 - 9, The baseURL construction can produce a double-slash if import.meta.env.VITE_SERVER_URL ends with a slash; normalize VITE_SERVER_URL by trimming any trailing slashes before appending /api/v1. Update the baseURL logic (where baseURL is set using import.meta.env.VITE_SERVER_URL) to strip trailing slashes (e.g., remove / or multiple / at the end) from the env value and then concatenate '/api/v1' so the final URL is always well-formed.src/mocks/handlers/payment.ts (1)
7-39: 고정 날짜 더미는 빠르게 낡으니 상대 날짜 생성으로 바꾸는 편이 좋습니다.현재는 2026-03-29 기준으로만 “오늘/어제” 시나리오가 자연스럽고, 이후에는 UI 검증 의도가 약해집니다.
수정 예시
+const daysAgoIso = (days: number) => + new Date(Date.now() - days * 24 * 60 * 60 * 1000).toISOString(); const dummyPaymentRequests = [ { - requestedAt: '2026-03-29T22:00:00', + requestedAt: daysAgoIso(0), paymentRequestId: 1, @@ { - requestedAt: '2026-03-29T22:00:00', + requestedAt: daysAgoIso(0), @@ { - requestedAt: '2026-03-29T22:00:00', + requestedAt: daysAgoIso(0), @@ { - requestedAt: '2026-03-28T22:00:00', + requestedAt: daysAgoIso(1), @@ { - requestedAt: '2026-03-27T22:00:00', + requestedAt: daysAgoIso(2),🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/mocks/handlers/payment.ts` around lines 7 - 39, Replace hard-coded ISO dates in the mock payment data with dynamically generated relative dates so "today"/"yesterday"/"N days ago" remain correct over time: update the entries that set requestedAt (in the mock payment array inside src/mocks/handlers/payment.ts) to compute ISO strings at runtime (e.g., using new Date() and subtracting days or a date helper) rather than the fixed '2026-03-29T22:00:00' literals, preserving the same ISO format and leaving other fields like paymentRequestId, memberId, name, profileUrl, and totalAmount unchanged.src/pages/paymentManagement/PaymentManagementPage.tsx (1)
29-35: TODO 항목: API 연동 구현 도움 가능합니다.입금 거절 및 확인 API 연동이 필요합니다. React Query의
useMutation을 활용한 구현을 도와드릴 수 있습니다.API 연동을 위한 mutation 훅 구현을 생성해 드릴까요? 또는 이 작업을 추적하기 위한 이슈를 생성해 드릴까요?
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/pages/paymentManagement/PaymentManagementPage.tsx` around lines 29 - 35, The TODOs in handleReject and handleConfirm need actual API integration: implement React Query mutations (e.g., useConfirmPaymentMutation and useRejectPaymentMutation) that call the backend endpoints and update cache; inside PaymentManagementPage replace the stubbed handleConfirm(payment) and handleReject(payment) to call the corresponding mutate functions (passing the PaymentRequest id or payload) and handle onSuccess/onError to close modals, show toasts, and invalidate or update the payments query. Ensure you reference the PaymentRequest type and wire mutation hooks into the component so state updates (queryClient.invalidateQueries or queryClient.setQueryData) reflect the confirmed/rejected status.src/features/payment-management/ui/PaymentAlert/index.tsx (1)
18-24: 디자인 시스템 variant 활용으로 인라인 스타일 제거현재
variant="body1Sb"(1rem)를style={{ fontSize: '0.875rem' }}로 덮어쓰고 있습니다. 디자인 시스템에서 0.875rem에 해당하는variant="body2Sb"가 이미 존재하므로, 이를 직접 사용하면 됩니다. body2Sb도 fontWeight 600을 유지하므로 시각적 일관성에 영향을 주지 않습니다.♻️ 제안
<Text - variant="body1Sb" + variant="body2Sb" color="semantic.text.subtle" - style={{ fontSize: '0.875rem' }} > {payment.name} </Text>🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/features/payment-management/ui/PaymentAlert/index.tsx` around lines 18 - 24, The Text element is overriding the design-system variant by applying an inline fontSize; update the component to use the appropriate design-system variant instead of the inline style—replace variant="body1Sb" and remove style={{ fontSize: '0.875rem' }} so the Text uses variant="body2Sb" (keeping weight 600) when rendering {payment.name}; ensure no other inline font styling remains on that Text.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@package.json`:
- Line 108: CI pipeline won't honor the packageManager lock because Corepack
isn't enabled in the GitHub Actions workflow; update the
.github/workflows/prod-ci-cd.yml to enable Corepack before any install steps by
adding a step that runs Corepack enable and prepares the specific Yarn version
referenced by the packageManager field ("yarn@1.22.22+...") so the CI uses the
exact Yarn version; ensure this step runs before any npm/yarn install/restore
steps and reference the workflow's existing install job name to place the new
step correctly.
In `@src/features/payment-management/lib/groupPaymentRequestsBySection.ts`:
- Around line 29-37: groupPaymentRequestsBySection currently uses the display
label from getSectionLabel(payment.requestedAt) as the Map key which can merge
different years; instead generate a normalized grouping key (e.g. ISO date
"yyyy-MM-dd" or toISOString split date) from payment.requestedAt for the Map
(use that as the Map key in the reduce) and still compute the display label via
getSectionLabel when you build the returned array; update the reduce in
groupPaymentRequestsBySection to use the normalized date key, store payments
under that key, and when mapping [...paymentMapByDay.entries()] produce objects
with label: getSectionLabel(parsedKey) and items: the stored payments.
In `@src/pages/paymentManagement/PaymentManagementPage.tsx`:
- Around line 19-27: The current code only destructures data from
useGetPayments() so sections become an empty array during fetch and briefly show
the "no payments" UI; update the hook usage to also destructure loading/error
flags (e.g., isLoading, isFetching, isError) from useGetPayments() and change
the sections useMemo to run only when data is available and not loading/error
(use data?.paymentRequests when !isLoading && !isError). Also update the render
path to show a loading indicator when isLoading/fetching and show an error state
when isError, referencing useGetPayments, groupPaymentRequestsBySection, and the
sections variable to locate where to apply the guards.
---
Nitpick comments:
In `@src/features/payment-management/ui/PaymentAlert/index.tsx`:
- Around line 18-24: The Text element is overriding the design-system variant by
applying an inline fontSize; update the component to use the appropriate
design-system variant instead of the inline style—replace variant="body1Sb" and
remove style={{ fontSize: '0.875rem' }} so the Text uses variant="body2Sb"
(keeping weight 600) when rendering {payment.name}; ensure no other inline font
styling remains on that Text.
In `@src/mocks/handlers/payment.ts`:
- Around line 7-39: Replace hard-coded ISO dates in the mock payment data with
dynamically generated relative dates so "today"/"yesterday"/"N days ago" remain
correct over time: update the entries that set requestedAt (in the mock payment
array inside src/mocks/handlers/payment.ts) to compute ISO strings at runtime
(e.g., using new Date() and subtracting days or a date helper) rather than the
fixed '2026-03-29T22:00:00' literals, preserving the same ISO format and leaving
other fields like paymentRequestId, memberId, name, profileUrl, and totalAmount
unchanged.
In `@src/pages/paymentManagement/PaymentManagementPage.tsx`:
- Around line 29-35: The TODOs in handleReject and handleConfirm need actual API
integration: implement React Query mutations (e.g., useConfirmPaymentMutation
and useRejectPaymentMutation) that call the backend endpoints and update cache;
inside PaymentManagementPage replace the stubbed handleConfirm(payment) and
handleReject(payment) to call the corresponding mutate functions (passing the
PaymentRequest id or payload) and handle onSuccess/onError to close modals, show
toasts, and invalidate or update the payments query. Ensure you reference the
PaymentRequest type and wire mutation hooks into the component so state updates
(queryClient.invalidateQueries or queryClient.setQueryData) reflect the
confirmed/rejected status.
In `@src/shared/api/axios.ts`:
- Around line 7-9: The baseURL construction can produce a double-slash if
import.meta.env.VITE_SERVER_URL ends with a slash; normalize VITE_SERVER_URL by
trimming any trailing slashes before appending /api/v1. Update the baseURL logic
(where baseURL is set using import.meta.env.VITE_SERVER_URL) to strip trailing
slashes (e.g., remove / or multiple / at the end) from the env value and then
concatenate '/api/v1' so the final URL is always well-formed.
🪄 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: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: aae02959-72b8-420e-a7d0-8f195226ce6b
📒 Files selected for processing (12)
package.jsonsrc/entities/payment/api/payment.tssrc/entities/payment/model/payment.type.tssrc/features/payment-management/api/useGetPayments.tssrc/features/payment-management/lib/groupPaymentRequestsBySection.tssrc/features/payment-management/ui/PaymentAlert/index.tsxsrc/mocks/handlers.tssrc/mocks/handlers/payment.tssrc/pages/paymentManagement/PaymentManagementPage.tsxsrc/shared/api/axios.tssrc/shared/ui/Button/index.styles.tssrc/shared/ui/MemberProfileImage/index.tsx
yoouyeon
left a comment
There was a problem hiding this comment.
리뷰가 너무 늦었죠 죄송합니다... 🙇♀️🙇♀️🙇♀️🙇♀️
사소한 부분이긴 한데 궁금한 부분이랑 코드래빗 리뷰에 덧붙여서 코멘트 남겨두었습니다!!!
그리고 이제서야 깨달았는데,,, 저희 왜 dev 서버가 존재하지 않죠??!! 빌드 테스트도 자동으로 안하고 있었네요 😩 😩 조만간 QA도 진행해야 할 듯 하니 간단히 무료티어로 개발서버 배포해두겠습니다... ! (아마 금방 끝날 것 같아서 제가 할게요!)
이 브랜치가 제쪽에선 빌드 에러가 나는데, 한번 로컬에서 빌드해보시구 오류 있는지 확인 한번 부탁드립니다!!! 오류 해결하시구 다시 리뷰 요청주시면 바로! 승인하러 오겠습니다!!!
고생많으셨습니다!!!!!!
| ? groupPaymentRequestsBySection(data.paymentRequests) | ||
| : [], | ||
| [data?.paymentRequests] | ||
| ); |
There was a problem hiding this comment.
useMemo가 값을 변환하는 목적으로만 쓰이는 것 같은데, 만약에 groupPaymentRequestsBySection 변환이 여기가 아닌 다른 곳에서도 쓰일 가능성이 있다면 useMemo 대신 useGetPayments 안에서 selector로 변환해주는 것도 좋을 것 같아요!
만약에 변환하지 않은 PaymentRequest 값 자체가 다른곳에서 쓰일 가능성이 있다면.. useMemo는 그대로 두되 이름을 paymentsByDate 같이 데이터 형태가 어떤 형태인지 알 수 있는 이름으로 변경해도 좋을 것 같습니다! 지금은 이름만 보고는 어떤 섹션을 말하는건지 잘 이해가 안가는 느낌입니다 😂
There was a problem hiding this comment.
지금은 해당 페이지 내에서만 쓰이는 로직이라, 우선 그대로 두되 변수명을 paymentSection으로 변경하여 어떤 의미를 가지는지 명시하도록 하겠습니다!
| items: PaymentRequest[]; | ||
| } | ||
|
|
||
| export function groupPaymentRequestsBySection( |
There was a problem hiding this comment.
아래 리뷰와 동일한 맥락으로, 이 변환 함수 이름도 어떤 기준으로 그룹화하는 함수인지 드러나게 groupPaymentRequestsByDate 같은 이름으로 바꾸면 어떨까 싶습니다!
There was a problem hiding this comment.
넵 좋습니다! 모호한 이름들이 꽤 있네요
| // 의도적으로 상대경로를 사용해야 하는 경우(예: 스토리북)를 위해서 빈 문자열도 사용할 수 있도록 함 | ||
| baseURL: import.meta.env.VITE_SERVER_URL | ||
| ? `${import.meta.env.VITE_SERVER_URL}/functions/v1` | ||
| ? `${import.meta.env.VITE_SERVER_URL}/api/v1` |
There was a problem hiding this comment.
여기 functions는 예전에 백엔드 서버가 닫혀있던 시기에 임시로 supabase 서버를 쓰기 위해서 설정해뒀던 경로입니다!
지금은 백엔드 서버가 다시 되살아난 상태이기 때문에 변경해도 괜찮을 듯 합니다 😆
| ${TextVariant('body2R')}; | ||
| ${TextVariant('body2Sb')}; |
There was a problem hiding this comment.
앗 정말 감사합니다! 저도 디자인 적용하다보니 토큰 이름 및 값이 달라져 있어서 고민이 되었네요.
작업하다 보니 쓱 추가하게 되었는데, 디자인시스템 변경된 경우에는 해당 부분에 대해 확인 요청 꼭 드리도록 하겠습니다!
- 그룹 키를 표시용 라벨 대신 yyyy-MM-dd 정규화된 날짜로 변경 (연도 다른 같은 월/일 충돌 방지) - PaymentSection.label → date 필드로 변경 - getSectionLabel을 export하여 페이지에서 표시 시점에 호출 Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- PaymentSection.date → label로 변경, 그룹화 키(yyyy-MM-dd)는 내부에서만 사용 - getSectionLabel을 reduce 내부에서 호출하여 label을 섹션에 포함 - values()로 반환하여 코드 간결화 - 페이지에서 getSectionLabel import 제거 Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Deploying moddo-frontend with
|
| Latest commit: |
c51de0c
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://a6b3b538.moddo-frontend.pages.dev |
| Branch Preview URL: | https://feat-md-12.moddo-frontend.pages.dev |
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (2)
src/pages/paymentManagement/PaymentManagementPage.tsx (2)
13-13: Flex spacing prop은 숫자 단위로 통일하는 편이 일관성이 좋습니다.
LIST_BOTTOM_SPACING_PX = '93px'대신 숫자 상수를 사용하면 같은 파일의 다른 spacing prop 패턴과 맞춰집니다.Based on learnings: Flex spacing props는 `theme.unit[...]`이 아닌 plain number(예: `16`)를 직접 전달하는 방식을 일관 적용하는 것이 권장됩니다.🎯 spacing 전달 형식 통일 예시
-const LIST_BOTTOM_SPACING_PX = '93px'; +const LIST_BOTTOM_SPACING = 93; @@ - pb={LIST_BOTTOM_SPACING_PX} + pb={LIST_BOTTOM_SPACING}Also applies to: 79-79
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/pages/paymentManagement/PaymentManagementPage.tsx` at line 13, The constant LIST_BOTTOM_SPACING_PX is defined as a string with 'px' which is inconsistent with other spacing props that expect plain numeric values; change LIST_BOTTOM_SPACING_PX to a numeric constant (e.g., 93) and update any usages (including the one around the code referenced at line ~79) to pass the number directly so Flex spacing props receive plain numbers rather than CSS strings.
32-53: Header JSX 중복은 한 번 추출해두면 유지보수가 쉬워집니다.현재 3개 분기에서 같은 Header를 반복 렌더링하고 있어 수정 시 누락 위험이 있습니다.
♻️ Header 중복 제거 예시
function PaymentManagementPage() { const navigate = useNavigate(); const { color } = useTheme(); + const pageHeader = ( + <Header + type="TitleCenter" + title="입금 관리" + leftButtonContent={<ArrowLeft width={24} />} + leftButtonOnClick={() => navigate(-1)} + bgColor={color.semantic.background.normal.default} + /> + ); @@ if (isLoading) { return ( <> - <Header ... /> + {pageHeader} {/* 로딩 UI */} </> ); } @@ if (isError) { return ( <> - <Header ... /> + {pageHeader} {/* 에러 UI */} </> ); } @@ return ( <> - <Header ... /> + {pageHeader} {sections.length > 0 ? (Also applies to: 69-75
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/pages/paymentManagement/PaymentManagementPage.tsx` around lines 32 - 53, The Header JSX is duplicated across branches; extract it into a single reusable constant or small component (e.g., const PageHeader or renderHeader()) inside PaymentManagementPage and use that in the loading, error, and main render paths. Move the repeated props (type="TitleCenter", title="입금 관리", leftButtonContent={<ArrowLeft width={24}/>}, leftButtonOnClick={() => navigate(-1)}, bgColor={color.semantic.background.normal.default}) into that helper so all three branches render PageHeader instead of repeating the Header markup; update usages where Header appears (including the occurrences around lines noted and the one at 69-75) to reference the extracted symbol.
🤖 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/paymentManagement/PaymentManagementPage.tsx`:
- Around line 59-65: handleReject and handleConfirm are no-ops so approve/reject
buttons do nothing; wire these up to the payment confirm/reject mutation hooks
(or hide/disable the buttons until implemented). Import and call the existing
confirmPayment and rejectPayment mutation functions from your API hooks inside
handleConfirm(payment) and handleReject(payment), pass the payment id/payload
they expect, handle success/error state (optimistic UI or refetch list) and
update local UI accordingly (e.g., set loading, show toast, remove/refresh the
item). Alternatively, if you prefer not to call the API yet, disable or hide the
confirm/reject buttons where they invoke handleConfirm/handleReject (also update
the duplicate no-op occurrences at the other handlers around the 94-99 region).
- Around line 29-57: The isLoading and isError branches in PaymentManagementPage
currently return only the Header (leaving users with a blank screen); update the
PaymentManagementPage component to render minimal feedback in those branches by
adding a visible status body — e.g., for isLoading show a skeleton or "로딩 중..."
message and for isError show an error message with a Retry CTA that calls the
existing data refetch/refresh handler (or navigate) — ensure you modify the JSX
inside the isLoading and isError blocks (near the Header render) to include
these status elements so users get clear feedback.
---
Nitpick comments:
In `@src/pages/paymentManagement/PaymentManagementPage.tsx`:
- Line 13: The constant LIST_BOTTOM_SPACING_PX is defined as a string with 'px'
which is inconsistent with other spacing props that expect plain numeric values;
change LIST_BOTTOM_SPACING_PX to a numeric constant (e.g., 93) and update any
usages (including the one around the code referenced at line ~79) to pass the
number directly so Flex spacing props receive plain numbers rather than CSS
strings.
- Around line 32-53: The Header JSX is duplicated across branches; extract it
into a single reusable constant or small component (e.g., const PageHeader or
renderHeader()) inside PaymentManagementPage and use that in the loading, error,
and main render paths. Move the repeated props (type="TitleCenter", title="입금
관리", leftButtonContent={<ArrowLeft width={24}/>}, leftButtonOnClick={() =>
navigate(-1)}, bgColor={color.semantic.background.normal.default}) into that
helper so all three branches render PageHeader instead of repeating the Header
markup; update usages where Header appears (including the occurrences around
lines noted and the one at 69-75) to reference the extracted symbol.
🪄 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: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: c88de68c-4a16-4bc1-9a1d-da1a8a963ec3
📒 Files selected for processing (4)
src/entities/payment/api/payment.tssrc/features/payment-management/lib/groupPaymentRequestsBySection.tssrc/pages/paymentManagement/PaymentManagementPage.tsxsrc/shared/api/axios.ts
🚧 Files skipped from review as they are similar to previous changes (3)
- src/shared/api/axios.ts
- src/entities/payment/api/payment.ts
- src/features/payment-management/lib/groupPaymentRequestsBySection.ts
…함수명 변경 및 변수명 개선 - sections → paymentSections으로 변수명 변경 Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
There was a problem hiding this comment.
♻️ Duplicate comments (1)
src/pages/paymentManagement/PaymentManagementPage.tsx (1)
79-85:⚠️ Potential issue | 🟠 Major확인/거절 액션이 아직 no-op이라 핵심 플로우가 완료되지 않습니다.
Line 79, Line 83 핸들러가 TODO만 있어 버튼 클릭 시 실제 동작이 없습니다. 머지 전에는 mutation 연동 또는 임시 비활성화/숨김 중 하나는 필요합니다.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/pages/paymentManagement/PaymentManagementPage.tsx` around lines 79 - 85, The handlers handleReject and handleConfirm are no-ops so the confirm/reject buttons do nothing; implement them to call the backend mutation (or temporarily disable/hide the buttons until implemented). Specifically, wire handleConfirm(payment: PaymentRequest) to the confirm payment API/mutation (e.g., useConfirmPayment or confirmPaymentRequest) and handleReject(payment: PaymentRequest) to the reject payment API/mutation (e.g., useRejectPayment or rejectPaymentRequest), adding loading state, success/error handling, and refreshing the payment list (or updating local state) and closing any modal on success; if an API isn't ready, instead disable the buttons or return early with a toast/message indicating the action is unavailable. Ensure you reference the existing functions handleConfirm and handleReject and update whatever UI/button components consume them.
🧹 Nitpick comments (1)
src/pages/paymentManagement/PaymentManagementPage.tsx (1)
32-38: 반복되는 Header JSX는 공통 추출을 고려해 주세요.Line 32-38, Line 57-63, Line 89-95가 동일해서, 작은 렌더 헬퍼/컴포넌트로 빼면 수정 포인트를 줄일 수 있습니다.
Also applies to: 57-63, 89-95
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/pages/paymentManagement/PaymentManagementPage.tsx` around lines 32 - 38, The Header JSX is repeated three times; extract it into a small reusable component or render helper (e.g., PaymentHeader or renderPaymentHeader) and replace the three inline instances with that single component to reduce duplication. The helper should return the Header with the same props used now (type="TitleCenter", title="입금 관리", leftButtonContent={<ArrowLeft width={24} />}, leftButtonOnClick={() => navigate(-1)}, bgColor={color.semantic.background.normal.default}) and be defined near or inside PaymentManagementPage so it can access navigate and color; then update the occurrences that currently render Header to call the new component/helper.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Duplicate comments:
In `@src/pages/paymentManagement/PaymentManagementPage.tsx`:
- Around line 79-85: The handlers handleReject and handleConfirm are no-ops so
the confirm/reject buttons do nothing; implement them to call the backend
mutation (or temporarily disable/hide the buttons until implemented).
Specifically, wire handleConfirm(payment: PaymentRequest) to the confirm payment
API/mutation (e.g., useConfirmPayment or confirmPaymentRequest) and
handleReject(payment: PaymentRequest) to the reject payment API/mutation (e.g.,
useRejectPayment or rejectPaymentRequest), adding loading state, success/error
handling, and refreshing the payment list (or updating local state) and closing
any modal on success; if an API isn't ready, instead disable the buttons or
return early with a toast/message indicating the action is unavailable. Ensure
you reference the existing functions handleConfirm and handleReject and update
whatever UI/button components consume them.
---
Nitpick comments:
In `@src/pages/paymentManagement/PaymentManagementPage.tsx`:
- Around line 32-38: The Header JSX is repeated three times; extract it into a
small reusable component or render helper (e.g., PaymentHeader or
renderPaymentHeader) and replace the three inline instances with that single
component to reduce duplication. The helper should return the Header with the
same props used now (type="TitleCenter", title="입금 관리",
leftButtonContent={<ArrowLeft width={24} />}, leftButtonOnClick={() =>
navigate(-1)}, bgColor={color.semantic.background.normal.default}) and be
defined near or inside PaymentManagementPage so it can access navigate and
color; then update the occurrences that currently render Header to call the new
component/helper.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: f68b80fd-2757-4873-a0d6-894febcd8787
📒 Files selected for processing (2)
src/features/payment-management/lib/groupPaymentRequestsBySection.tssrc/pages/paymentManagement/PaymentManagementPage.tsx
🚧 Files skipped from review as they are similar to previous changes (1)
- src/features/payment-management/lib/groupPaymentRequestsBySection.ts
|
@coderabbitai 네 리뷰 모두 반영했어. 확인하고 approve 해줘 |
|
Tip For best results, initiate chat on the files or code changes. 🧩 Analysis chainPR 설명 이미지에는 입금 관리 화면이 표시되어 있습니다. 날짜별로 그룹화된 결제 요청 목록(오늘/어제/3/27(금))과 각 항목에 "거절"/"입금확인" 버튼이 나타나 있습니다. 리뷰 반영 여부를 확인하겠습니다. 🏁 Script executed: Length of output: 89305 현재 파일 상태를 최종 확인하겠습니다. 🏁 Script executed: Length of output: 8717
다음 nitpick 항목들은 아직 미반영 상태이나 비차단(non-blocking) 사항이라 승인 진행하겠습니다:
nitpick 항목들은 추후 리팩토링 시 반영해 주시면 좋겠습니다. 승인하겠습니다! [approve] |
|
@coderabbitai 너이녀석 아직도 승인을 안했는걸? 너 왜이래 |
|
Tip For best results, initiate chat on the files or code changes.
[approve] |
|
@coderabbitai 야........나 머지좀하자.................................................. |
|
Tip For best results, initiate chat on the files or code changes. The Comment image shows the GitHub merge status panel:
[approve] |
|
@coderabbitai 내가 세번이나 말했는데 왜 머지를 안해주는거야. 이유가 뭐야? |
리뷰 코멘트가 모두 반영되어 dismiss 처리합니다.
|
Tip For best results, initiate chat on the files or code changes. 🧩 Analysis chainPR 설명 이미지는 입금 관리 UI 화면(모바일, 390×844)으로, 오늘/어제/3/27(금) 섹션별로 결제 요청이 나열되어 있고 각 항목에 "거절"/"입금확인" 버튼이 표시되어 있습니다.
🏁 Script executed: Length of output: 445
[approve] ミ(=^・ω・^=)ミ 늦어서 정말 죄송해요! |
|
@coderabbitai |
|
Tip For best results, initiate chat on the files or code changes. 🧩 Analysis chain🏁 Script executed: Length of output: 1288 🏁 Script executed: Length of output: 63
이제 머지 가능한 상태입니다! 정말 오래 기다리셨는데 죄송했습니다 🙇 |


💻 작업 내용
✅ 테스트 리스트 (선택)
📸 스크린샷
👻 리뷰 요구사항 (선택)
Summary by CodeRabbit
새로운 기능
스타일
Chores