Merged
Conversation
개요두 개의 모달 컴포넌트에서 모집 마감일 처리 로직을 수정했습니다. 선택된 날짜를 하루의 끝(23:59:59)으로 정규화하는 endOf("day") 함수 호출을 추가하고, Import 문을 정렬했습니다. 변경 사항
예상 코드 리뷰 난이도🎯 2 (Simple) | ⏱️ ~12분 관련 가능성 있는 PR
시
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 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 |
![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
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
src/components/RecruitmentRound/RecruitmentRoundInfoModal.tsx (2)
104-124:⚠️ Potential issue | 🟠 Major검증 로직이
mutationBody생성 후에 실행되어 런타임 에러 발생 가능Line 108-109에서
startDate!.toDate()와endDate!.endOf("day").toDate()를 사용하지만, null 체크는 Line 121에서 수행됩니다.endDate가 null인 경우 검증 전에 에러가 발생합니다.
CreateRecruitmentInfoModal.tsx처럼 검증을 먼저 수행하도록 순서를 변경해야 합니다.🛠️ 수정 제안
const handleClickSubmit = () => { if (!roundModalInfo) { return; } const { name, startDate, endDate, recruitmentRoundId, roundType, academicYear, semester } = roundModalInfo; + if (!academicYear || !semester || !name || !startDate || !endDate || !roundType) { + toast.error(`채워지지 않는 필드가 있어요. 모든 필드를 채워주세요!`); + return; + } + const mutationBody: EditRecruitmentRoundMutationArgumentType["body"] = { academicYear: Number(academicYear), semesterType: semester === "1" ? "FIRST" : "SECOND", name, - startDate: toKSTISOString(startDate!.toDate()), - endDate: toKSTISOString(endDate!.endOf("day").toDate()), + startDate: toKSTISOString(startDate.toDate()), + endDate: toKSTISOString(endDate.endOf("day").toDate()), roundType: roundType === "1차" ? "FIRST" : roundType === "2차" ? "SECOND" : "THIRD", }; const mutationSuccessHandler = () => { queryClient.invalidateQueries({ queryKey: [QueryKey.recruitmentRound], }); toast.success(`모집 회차 정보가 ${isEdit ? "수정" : "생성"}되었습니다.`); onClose(); }; - if (!academicYear || !semester || !name || !startDate || !endDate || !roundType) { - toast.error(`채워지지 않는 필드가 있어요. 모든 필드를 채워주세요!`); - return; - } - if (isEdit) {🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/components/RecruitmentRound/RecruitmentRoundInfoModal.tsx` around lines 104 - 124, Move the required-field validation to before you construct mutationBody so toKSTISOString(startDate!.toDate()) and endDate!.endOf("day").toDate() aren't called when startDate or endDate are null; specifically, perform the null/empty checks for academicYear, semester, name, startDate, endDate, and roundType first (the same validation used in CreateRecruitmentInfoModal), return early with toast.error if any are missing, and only then build mutationBody and proceed to use mutationSuccessHandler and queryClient.invalidateQueries.
1-27:⚠️ Potential issue | 🟡 MinorImport 순서가 ESLint 규칙에 맞지 않습니다
ESLint에서
reactimport가@/constants/queryKey보다 먼저 위치해야 한다고 지적하고 있습니다.💡 수정 제안
+import { ChangeEvent, useEffect, useState } from "react"; import { QueryKey } from "@/constants/queryKey"; import useCreateRecruitmentRoundMutation from "@/hooks/mutations/useCreateRecruitmentRoundMutation"; ... -import { ChangeEvent, useEffect, useState } from "react";🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/components/RecruitmentRound/RecruitmentRoundInfoModal.tsx` around lines 1 - 27, The ESLint import-order rule requires the React import to appear before local alias imports; add or move the React import to the top of RecruitmentRoundInfoModal.tsx (e.g., insert import React from "react"; as the first import) so that the 'react' import precedes "@/constants/queryKey" and other internal imports, then run lint to confirm order compliance.
🤖 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/components/Recruitment/CreateRecruitmentInfoModal.tsx`:
- Around line 1-14: Reorder the imports in CreateRecruitmentInfoModal.tsx to
satisfy ESLint import-order rules: place external library imports first (e.g.,
React-related imports like "react" if present,
"dayjs"/"@mui/*"/"@emotion/styled"/"@tanstack/react-query"), then grouped scoped
packages (e.g., "@/hooks/*", "@/constants/*", "@/types/*", "@/utils/*"), and
leave asset imports like "@/assets/warning.svg?react" last; adjust the current
top-of-file imports (WarningIcon, styled, Box/Button/Modal/TextField/Typography,
AdapterDayjs, DatePicker, LocalizationProvider, useQueryClient, useState, toast,
etc.) to follow that order so ESLint no longer flags import-order violations.
---
Outside diff comments:
In `@src/components/RecruitmentRound/RecruitmentRoundInfoModal.tsx`:
- Around line 104-124: Move the required-field validation to before you
construct mutationBody so toKSTISOString(startDate!.toDate()) and
endDate!.endOf("day").toDate() aren't called when startDate or endDate are null;
specifically, perform the null/empty checks for academicYear, semester, name,
startDate, endDate, and roundType first (the same validation used in
CreateRecruitmentInfoModal), return early with toast.error if any are missing,
and only then build mutationBody and proceed to use mutationSuccessHandler and
queryClient.invalidateQueries.
- Around line 1-27: The ESLint import-order rule requires the React import to
appear before local alias imports; add or move the React import to the top of
RecruitmentRoundInfoModal.tsx (e.g., insert import React from "react"; as the
first import) so that the 'react' import precedes "@/constants/queryKey" and
other internal imports, then run lint to confirm order compliance.
ℹ️ Review info
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
src/components/Recruitment/CreateRecruitmentInfoModal.tsxsrc/components/RecruitmentRound/RecruitmentRoundInfoModal.tsx
Comment on lines
+1
to
14
| import WarningIcon from "@/assets/warning.svg?react"; | ||
| import { QueryKey } from "@/constants/queryKey"; | ||
| import useCreateRecruitmentMutation from "@/hooks/mutations/useCreateRecruitmentMutation"; | ||
| import { RecruitmentModalInfoType } from "@/types/entities/recruitment"; | ||
| import { toKSTISOString } from "@/utils/validation/formatDate"; | ||
| import styled from "@emotion/styled"; | ||
| import { Modal, Typography, Box, Button, TextField } from "@mui/material"; | ||
| import { Box, Button, Modal, TextField, Typography } from "@mui/material"; | ||
| import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs"; | ||
| import { DatePicker } from "@mui/x-date-pickers/DatePicker"; | ||
| import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider/LocalizationProvider"; | ||
| import { useQueryClient } from "@tanstack/react-query"; | ||
| import { Dayjs } from "dayjs"; | ||
| import { ChangeEvent, useState } from "react"; | ||
| import { toast } from "react-toastify"; |
There was a problem hiding this comment.
Import 순서가 ESLint 규칙에 맞지 않습니다
ESLint에서 여러 import 순서 오류를 지적하고 있습니다. react, @emotion/styled, @mui/material 등의 외부 라이브러리 import가 @/assets/warning.svg?react보다 먼저 위치해야 합니다.
💡 수정 제안
+import { ChangeEvent, useState } from "react";
+import styled from "@emotion/styled";
+import { Box, Button, Modal, TextField, Typography } from "@mui/material";
+import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
+import { DatePicker } from "@mui/x-date-pickers/DatePicker";
+import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider/LocalizationProvider";
+import { useQueryClient } from "@tanstack/react-query";
+import { Dayjs } from "dayjs";
+import { toast } from "react-toastify";
import WarningIcon from "@/assets/warning.svg?react";
import { QueryKey } from "@/constants/queryKey";
import useCreateRecruitmentMutation from "@/hooks/mutations/useCreateRecruitmentMutation";
import { RecruitmentModalInfoType } from "@/types/entities/recruitment";
import { toKSTISOString } from "@/utils/validation/formatDate";
-import styled from "@emotion/styled";
-import { Box, Button, Modal, TextField, Typography } from "@mui/material";
-import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
-import { DatePicker } from "@mui/x-date-pickers/DatePicker";
-import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider/LocalizationProvider";
-import { useQueryClient } from "@tanstack/react-query";
-import { Dayjs } from "dayjs";
-import { ChangeEvent, useState } from "react";
-import { toast } from "react-toastify";📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
Suggested change
| import WarningIcon from "@/assets/warning.svg?react"; | |
| import { QueryKey } from "@/constants/queryKey"; | |
| import useCreateRecruitmentMutation from "@/hooks/mutations/useCreateRecruitmentMutation"; | |
| import { RecruitmentModalInfoType } from "@/types/entities/recruitment"; | |
| import { toKSTISOString } from "@/utils/validation/formatDate"; | |
| import styled from "@emotion/styled"; | |
| import { Modal, Typography, Box, Button, TextField } from "@mui/material"; | |
| import { Box, Button, Modal, TextField, Typography } from "@mui/material"; | |
| import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs"; | |
| import { DatePicker } from "@mui/x-date-pickers/DatePicker"; | |
| import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider/LocalizationProvider"; | |
| import { useQueryClient } from "@tanstack/react-query"; | |
| import { Dayjs } from "dayjs"; | |
| import { ChangeEvent, useState } from "react"; | |
| import { toast } from "react-toastify"; | |
| import { ChangeEvent, useState } from "react"; | |
| import styled from "@emotion/styled"; | |
| import { Box, Button, Modal, TextField, Typography } from "@mui/material"; | |
| import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs"; | |
| import { DatePicker } from "@mui/x-date-pickers/DatePicker"; | |
| import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider/LocalizationProvider"; | |
| import { useQueryClient } from "@tanstack/react-query"; | |
| import { Dayjs } from "dayjs"; | |
| import { toast } from "react-toastify"; | |
| import WarningIcon from "@/assets/warning.svg?react"; | |
| import { QueryKey } from "@/constants/queryKey"; | |
| import useCreateRecruitmentMutation from "@/hooks/mutations/useCreateRecruitmentMutation"; | |
| import { RecruitmentModalInfoType } from "@/types/entities/recruitment"; | |
| import { toKSTISOString } from "@/utils/validation/formatDate"; |
🧰 Tools
🪛 ESLint
[error] 6-6: @emotion/styled import should occur before import of @/assets/warning.svg?react
(import/order)
[error] 7-7: @mui/material import should occur before import of @/assets/warning.svg?react
(import/order)
[error] 8-8: @mui/x-date-pickers/AdapterDayjs import should occur before import of @/assets/warning.svg?react
(import/order)
[error] 9-9: @mui/x-date-pickers/DatePicker import should occur before import of @/assets/warning.svg?react
(import/order)
[error] 10-10: @mui/x-date-pickers/LocalizationProvider/LocalizationProvider import should occur before import of @/assets/warning.svg?react
(import/order)
[error] 11-11: @tanstack/react-query import should occur before import of @/assets/warning.svg?react
(import/order)
[error] 12-12: dayjs import should occur before import of @/assets/warning.svg?react
(import/order)
[error] 13-13: react import should occur before import of @/assets/warning.svg?react
(import/order)
[error] 14-14: react-toastify import should occur before import of @/assets/warning.svg?react
(import/order)
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@src/components/Recruitment/CreateRecruitmentInfoModal.tsx` around lines 1 -
14, Reorder the imports in CreateRecruitmentInfoModal.tsx to satisfy ESLint
import-order rules: place external library imports first (e.g., React-related
imports like "react" if present,
"dayjs"/"@mui/*"/"@emotion/styled"/"@tanstack/react-query"), then grouped scoped
packages (e.g., "@/hooks/*", "@/constants/*", "@/types/*", "@/utils/*"), and
leave asset imports like "@/assets/warning.svg?react" last; adjust the current
top-of-file imports (WarningIcon, styled, Box/Button/Modal/TextField/Typography,
AdapterDayjs, DatePicker, LocalizationProvider, useQueryClient, useState, toast,
etc.) to follow that order so ESLint no longer flags import-order violations.
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.
Describe your changes
학기 정보의 semesterEndDate, 모집 회차의 endDate에 endOf("day")를 통해 마감 시간을 날짜의 끝으로 설정했습니다.
To Reviewers
Summary by CodeRabbit
릴리스 노트
버그 수정
개선 사항