-
Notifications
You must be signed in to change notification settings - Fork 0
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. Weโll occasionally send you account related emails.
Already on GitHub? Sign in to your account
๐ ํ์๊ฐ์ ํ์ด์ง ๋ฆฌํฉํ ๋ง ์งํ #62
Conversation
Walkthrough์ด ํ ๋ฆฌํ์คํธ๋ ์ฌ์ฉ์ ๊ฐ์ ํ๋ก์ธ์ค์ ๊ด๋ จ๋ API ๋ฐ ๋ชจ๋ธ ๊ณ์ธต์ ๋ฆฌํฉํ ๋งํฉ๋๋ค. ๊ธฐ์กด์ ์ง์ ์ ์ธ API ํธ์ถ ๋ฐฉ์์์ React Query ํ ์ ์ฌ์ฉํ๋ ๋ฐฉ์์ผ๋ก ๋ณ๊ฒฝ๋์์ผ๋ฉฐ, SMS ์ธ์ฆ, ์ฌ์ฉ์ ๊ฐ์ , ํ์ด๋จธ ๊ด๋ฆฌ ๋ฑ์ ๋ก์ง์ ๋ ๋ชจ๋ํํ๊ณ ์ถ์ํํ์ต๋๋ค. ์ฝ๋์ ๊ตฌ์กฐ๋ฅผ ๊ฐ์ ํ๊ณ ์ํ ๊ด๋ฆฌ๋ฅผ ๋ ํจ์จ์ ์ผ๋ก ๋ง๋ค์์ต๋๋ค. Changes
Sequence DiagramsequenceDiagram
participant User
participant SignUpForm
participant useSendSms
participant postSendSms
participant useCheckSmsCode
participant getCheckSmsCode
participant useSignup
participant postSignup
User->>SignUpForm: ์ ํ๋ฒํธ ์
๋ ฅ
SignUpForm->>useSendSms: SMS ์ ์ก ์์ฒญ
useSendSms->>postSendSms: SMS ์ ์ก API ํธ์ถ
postSendSms-->>useSendSms: SMS ์ ์ก ์๋ต
useSendSms-->>SignUpForm: SMS ์ ์ก ์ํ ์
๋ฐ์ดํธ
User->>SignUpForm: SMS ์ฝ๋ ์
๋ ฅ
SignUpForm->>useCheckSmsCode: SMS ์ฝ๋ ๊ฒ์ฆ
useCheckSmsCode->>getCheckSmsCode: SMS ์ฝ๋ ๊ฒ์ฆ API ํธ์ถ
getCheckSmsCode-->>useCheckSmsCode: ๊ฒ์ฆ ๊ฒฐ๊ณผ
User->>SignUpForm: ๊ฐ์
์ ๋ณด ์
๋ ฅ
SignUpForm->>useSignup: ๊ฐ์
์์ฒญ
useSignup->>postSignup: ์ฌ์ฉ์ ๊ฐ์
API ํธ์ถ
postSignup-->>useSignup: ๊ฐ์
์๋ต
Poem
Tip CodeRabbit's docstrings feature is now available as part of our Early Access Program! Simply use the command Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? ๐ชง TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 5
๐ญ Outside diff range comments (1)
src/entities/signUp/ui/SignUpForm/index.tsx (1)
Line range hint
132-141
: SMS ์ธ์ฆ ์ ๋ ฅ ํ๋์ ๋นํ์ฑํ ๋ก์ง์ ์ค๋ฅ๊ฐ ์์ต๋๋ค.
disabled={!isSmsSent && watch('code') !== null}
์กฐ๊ฑด์ด ์ง๊ด์ ์ด์ง ์์ผ๋ฉฐ, ์๋ชป๋ ์ํฉ์์ ์ ๋ ฅ ํ๋๊ฐ ๋นํ์ฑํ๋ ์ ์์ต๋๋ค.- disabled={!isSmsSent && watch('code') !== null} + disabled={!isSmsSent}
๐งน Nitpick comments (7)
src/entities/signUp/model/useCheckSmsCode.ts (1)
4-10
: TanStack Query ์ค์ ์ต์ ํ๊ฐ ํ์ํฉ๋๋ค.ํ์ฌ ์ฟผ๋ฆฌ ์ค์ ์ด ๊ธฐ๋ณธ๊ฐ๋ง ์ฌ์ฉํ๊ณ ์์ด, SMS ์ธ์ฆ ํน์ฑ์ ๋ง๊ฒ ์ต์ ํ๊ฐ ํ์ํฉ๋๋ค.
๋ค์๊ณผ ๊ฐ์ด ๊ฐ์ ํด๋ณด์ธ์:
export const useCheckSmsCode = (phoneNumber: string, code: string) => { return useQuery({ queryKey: ['CheckSmsCode', phoneNumber, code], queryFn: () => getCheckSmsCode(phoneNumber, code), enabled: false, + retry: 1, + staleTime: 0, + cacheTime: 1000 * 60 * 5, // 5๋ถ + onError: (error) => { + if (axios.isAxiosError(error)) { + toast.error(error.response?.data?.message || 'SMS ์ธ์ฆ์ ์คํจํ์ต๋๋ค.'); + } + } }); };์ด๋ ๊ฒ ํ๋ฉด:
- ์คํจ ์ 1๋ฒ๋ง ์ฌ์๋
- ์บ์๋ 5๋ถ๊ฐ ์ ์ง
- ์๋ฌ ์ฒ๋ฆฌ๊ฐ ํตํฉ๋ฉ๋๋ค
src/entities/signUp/api/getCheckSmsCode.ts (1)
4-14
: ์๋ต ํ์ ์ ์๊ฐ ํ์ํฉ๋๋คํ์ ์์ ์ฑ์ ์ํด API ์๋ต ํ์ ์ ์ ์ํ๊ณ ์ ์ฉํ๋ ๊ฒ์ด ์ข์ต๋๋ค.
๋ค์๊ณผ ๊ฐ์ด ํ์ ์ ์ถ๊ฐํ๋ ๊ฒ์ ์ ์๋๋ฆฝ๋๋ค:
interface CheckSmsResponse { success: boolean; message?: string; } export const getCheckSmsCode = async (phoneNumber: string, code: string): Promise<CheckSmsResponse> => { // ... existing code }src/entities/signUp/model/useSendSms.ts (2)
17-17
: ์คํ๋ฅผ ์์ ํด์ฃผ์ธ์์๋ฌ ๋ฉ์์ง์ ์คํ๊ฐ ์์ต๋๋ค:
- "๋ฌธ์ ๋งค์์ง" -> "๋ฌธ์ ๋ฉ์์ง"
9-19
: mutation ์ค์ ๊ฐ์ ์ด ํ์ํฉ๋๋คmutation ์ค์ ์ retry ์ต์ ๊ณผ ๊ตฌ์ฒด์ ์ธ ์๋ฌ ์ฒ๋ฆฌ๋ฅผ ์ถ๊ฐํ๋ฉด ์ข์ ๊ฒ ๊ฐ์ต๋๋ค.
๋ค์๊ณผ ๊ฐ์ด ์์ ํ๋ ๊ฒ์ ์ ์๋๋ฆฝ๋๋ค:
return useMutation({ mutationFn: (phoneNumber: string) => postSendSms(phoneNumber), + retry: 1, onSuccess: () => { setIsSmsSent(true); setTimer(180); toast.success('๋ฌธ์ ๋ฉ์์ง ์ ์ก์ด ์๋ฃ๋์์ต๋๋ค.'); }, - onError: () => { + onError: (error: Error) => { + const errorMessage = error.message === 'INVALID_PHONE' + ? '์ฌ๋ฐ๋ฅธ ์ ํ๋ฒํธ๋ฅผ ์ ๋ ฅํด์ฃผ์ธ์.' + : '๋ฌธ์ ๋ฉ์์ง ์ ์ก์ ์คํจํ์ต๋๋ค.'; - toast.error('๋ฌธ์ ๋งค์์ง ์ ์ก์ ์คํจํ์ต๋๋ค.'); + toast.error(errorMessage); }, });src/entities/signUp/model/useSignup.ts (1)
23-25
: ์๋ฌ ์ฒ๋ฆฌ๋ฅผ ๋ ๊ตฌ์ฒด์ ์ผ๋ก ๊ฐ์ ํด ๋ณด์ธ์.ํ์ฌ๋ ๋ชจ๋ ์๋ฌ์ ๋ํด ๋์ผํ ๋ฉ์์ง๋ฅผ ๋ณด์ฌ์ฃผ๊ณ ์์ต๋๋ค. API ์๋ต์ ์๋ฌ ํ์ ์ ๋ฐ๋ผ ๋ค๋ฅธ ๋ฉ์์ง๋ฅผ ํ์ํ๋ฉด ์ฌ์ฉ์์๊ฒ ๋ ๋ช ํํ ํผ๋๋ฐฑ์ ์ ๊ณตํ ์ ์์ต๋๋ค.
- onError: () => { - toast.error('ํ์๊ฐ์ ์ ์คํจํ์ต๋๋ค.'); - }, + onError: (error: any) => { + const errorMessage = error.response?.data?.message || 'ํ์๊ฐ์ ์ ์คํจํ์ต๋๋ค.'; + toast.error(errorMessage); + },src/entities/signUp/ui/SignUpForm/index.tsx (2)
Line range hint
43-49
: ํผ ์ ์ถ ์ ์๋ฌ ์ฒ๋ฆฌ๋ฅผ ๊ฐ์ ํด ๋ณด์ธ์.ํ์ฌ๋ ์ฒซ ๋ฒ์งธ ์๋ฌ๋ง ํ์ํ๊ณ ์์ต๋๋ค. ๋ชจ๋ ์ ํจ์ฑ ๊ฒ์ฌ ์ค๋ฅ๋ฅผ ํ ๋ฒ์ ๋ณด์ฌ์ฃผ๋ฉด ์ฌ์ฉ์ ๊ฒฝํ์ด ํฅ์๋ ์ ์์ต๋๋ค.
(data) => signup(data), - (errors) => { - const firstError = Object.values(errors)[0]; - if (firstError && firstError.message) { - showError(firstError.message as string); - } - }, + (errors) => { + const errorMessages = Object.values(errors) + .map(error => error.message) + .filter(Boolean); + errorMessages.forEach(message => showError(message as string)); + },๐งฐ Tools
๐ช Biome (1.9.4)
[error] 46-46: Change to an optional chain.
Unsafe fix: Change to an optional chain.
(lint/complexity/useOptionalChain)
Line range hint
144-150
: ํ์ด๋จธ ํ์์ ์ ๊ทผ์ฑ์ ๊ฐ์ ํด ๋ณด์ธ์.์๊ฐ ํ์๊ฐ ์คํฌ๋ฆฐ ๋ฆฌ๋ ์ฌ์ฉ์์๊ฒ ๋ช ํํ์ง ์์ ์ ์์ต๋๋ค. aria-label์ ์ถ๊ฐํ์ฌ ์ ๊ทผ์ฑ์ ํฅ์์ํฌ ์ ์์ต๋๋ค.
className="text-caption2 text-gray-300" disabled={isSmsSent} + aria-label={isSmsSent + ? `์ธ์ฆ๋ฒํธ ์ฌ๋ฐ์ก๊น์ง ๋จ์ ์๊ฐ: ${Math.floor(timer / 60)}๋ถ ${timer % 60}์ด` + : '์ธ์ฆ๋ฒํธ ๋ฐ์กํ๊ธฐ'}
๐ Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
๐ Files selected for processing (11)
src/entities/signUp/api/checkSmsCode.ts
(0 hunks)src/entities/signUp/api/getCheckSmsCode.ts
(1 hunks)src/entities/signUp/api/postSendSms.ts
(1 hunks)src/entities/signUp/api/postSignup.ts
(1 hunks)src/entities/signUp/api/sendSms.ts
(0 hunks)src/entities/signUp/api/signup.ts
(0 hunks)src/entities/signUp/model/useCheckSmsCode.ts
(1 hunks)src/entities/signUp/model/useSendSms.ts
(1 hunks)src/entities/signUp/model/useSignup.ts
(1 hunks)src/entities/signUp/model/useTimer.ts
(1 hunks)src/entities/signUp/ui/SignUpForm/index.tsx
(4 hunks)
๐ค Files with no reviewable changes (3)
- src/entities/signUp/api/checkSmsCode.ts
- src/entities/signUp/api/sendSms.ts
- src/entities/signUp/api/signup.ts
๐ Additional comments (2)
src/entities/signUp/model/useSignup.ts (1)
1-12
: ๊น๋ํ ํ์
์ ์์ ํ์ํ import ๊ตฌ๋ฌธ์
๋๋ค!
SignUpData ์ธํฐํ์ด์ค๊ฐ ํ์๊ฐ์ ์ ํ์ํ ๋ชจ๋ ํ๋๋ฅผ ๋ช ํํ๊ฒ ์ ์ํ๊ณ ์์ต๋๋ค.
src/entities/signUp/ui/SignUpForm/index.tsx (1)
Line range hint 7-36
: ์ปค์คํ
ํ
์ ํ์ฉํ ๊น๋ํ ๋ฆฌํฉํ ๋ง์
๋๋ค!
React Query๋ฅผ ์ฌ์ฉํ ์ํ ๊ด๋ฆฌ๊ฐ ์ ๊ตฌํ๋์ด ์์ต๋๋ค. SMS ์ธ์ฆ ๊ด๋ จ ๋ก์ง์ด ํ ์ผ๋ก ๋ถ๋ฆฌ๋์ด ์ฝ๋์ ๊ฐ๋ ์ฑ์ด ํฅ์๋์์ต๋๋ค.
๐งฐ Tools
๐ช Biome (1.9.4)
[error] 46-46: Change to an optional chain.
Unsafe fix: Change to an optional chain.
(lint/complexity/useOptionalChain)
export const postSendSms = async (phoneNumber: string) => { | ||
if (!phoneNumber) { | ||
toast.error('์ ํ๋ฒํธ๋ฅผ ์ ๋ ฅํด์ฃผ์ธ์.'); | ||
return; | ||
} | ||
|
||
const response = await axios.post('/api/auth/sms', { phoneNumber }); | ||
return response; | ||
}; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
๐ ๏ธ Refactor suggestion
API ์์ฒญ์ ๋ํ ์๋ฌ ์ฒ๋ฆฌ์ ํ์ ์์ ์ฑ ๊ฐ์ ์ด ํ์ํฉ๋๋ค.
๋ค์ ์ฌํญ๋ค์ ๊ฐ์ ํ๋ ๊ฒ์ด ์ข๊ฒ ์ต๋๋ค:
- axios ์์ฒญ์ ๋ํ ์๋ฌ ์ฒ๋ฆฌ๊ฐ ๋๋ฝ๋์ด ์์ต๋๋ค
- ์๋ต ๋ฐ์ดํฐ์ ํ์ ์ด ์ ์๋์ด ์์ง ์์ต๋๋ค
- ์ ํ๋ฒํธ ํ์์ ๋ํ ์ ํจ์ฑ ๊ฒ์ฌ๊ฐ ํ์ํฉ๋๋ค
๋ค์๊ณผ ๊ฐ์ด ๊ฐ์ ํด๋ณด์ธ์:
+interface SendSmsResponse {
+ success: boolean;
+ message: string;
+}
+
export const postSendSms = async (phoneNumber: string) => {
if (!phoneNumber) {
toast.error('์ ํ๋ฒํธ๋ฅผ ์
๋ ฅํด์ฃผ์ธ์.');
return;
}
+
+ if (!/^01[0-9]{8,9}$/.test(phoneNumber)) {
+ toast.error('์ฌ๋ฐ๋ฅธ ์ ํ๋ฒํธ ํ์์ด ์๋๋๋ค.');
+ return;
+ }
- const response = await axios.post('/api/auth/sms', { phoneNumber });
- return response;
+ try {
+ const { data } = await axios.post<SendSmsResponse>('/api/auth/sms', { phoneNumber });
+ return data;
+ } catch (error) {
+ if (axios.isAxiosError(error)) {
+ toast.error(error.response?.data?.message || 'SMS ์ ์ก์ ์คํจํ์ต๋๋ค.');
+ }
+ throw error;
+ }
};
๐ 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.
export const postSendSms = async (phoneNumber: string) => { | |
if (!phoneNumber) { | |
toast.error('์ ํ๋ฒํธ๋ฅผ ์ ๋ ฅํด์ฃผ์ธ์.'); | |
return; | |
} | |
const response = await axios.post('/api/auth/sms', { phoneNumber }); | |
return response; | |
}; | |
interface SendSmsResponse { | |
success: boolean; | |
message: string; | |
} | |
export const postSendSms = async (phoneNumber: string) => { | |
if (!phoneNumber) { | |
toast.error('์ ํ๋ฒํธ๋ฅผ ์ ๋ ฅํด์ฃผ์ธ์.'); | |
return; | |
} | |
if (!/^01[0-9]{8,9}$/.test(phoneNumber)) { | |
toast.error('์ฌ๋ฐ๋ฅธ ์ ํ๋ฒํธ ํ์์ด ์๋๋๋ค.'); | |
return; | |
} | |
try { | |
const { data } = await axios.post<SendSmsResponse>('/api/auth/sms', { phoneNumber }); | |
return data; | |
} catch (error) { | |
if (axios.isAxiosError(error)) { | |
toast.error(error.response?.data?.message || 'SMS ์ ์ก์ ์คํจํ์ต๋๋ค.'); | |
} | |
throw error; | |
} | |
}; |
interface SignUpData { | ||
name: string; | ||
nickname: string; | ||
email: string; | ||
password: string; | ||
phoneNumber: string; | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
๐ ๏ธ Refactor suggestion
ํ์๊ฐ์ ๋ฐ์ดํฐ ์ ํจ์ฑ ๊ฒ์ฌ๊ฐ ํ์ํฉ๋๋ค.
SignUpData ์ธํฐํ์ด์ค์ ๋ํ ์ ํจ์ฑ ๊ฒ์ฌ ๋ก์ง์ด ๋๋ฝ๋์ด ์์ต๋๋ค.
๋ค์๊ณผ ๊ฐ์ด Zod๋ฅผ ์ฌ์ฉํ ์คํค๋ง ๊ฒ์ฆ์ ์ถ๊ฐํด๋ณด์ธ์:
import { z } from 'zod';
export const SignUpSchema = z.object({
name: z.string().min(2, '์ด๋ฆ์ 2๊ธ์ ์ด์์ด์ด์ผ ํฉ๋๋ค'),
nickname: z.string().min(2, '๋๋ค์์ 2๊ธ์ ์ด์์ด์ด์ผ ํฉ๋๋ค'),
email: z.string().email('์ฌ๋ฐ๋ฅธ ์ด๋ฉ์ผ ํ์์ด ์๋๋๋ค'),
password: z.string().min(8, '๋น๋ฐ๋ฒํธ๋ 8์ ์ด์์ด์ด์ผ ํฉ๋๋ค'),
phoneNumber: z.string().regex(/^01[0-9]{8,9}$/, '์ฌ๋ฐ๋ฅธ ์ ํ๋ฒํธ ํ์์ด ์๋๋๋ค')
});
export type SignUpData = z.infer<typeof SignUpSchema>;
export const postSignup = async (data: SignUpData) => { | ||
const response = await axios.post('/api/auth/signup', data); | ||
return response; | ||
}; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
๐ ๏ธ Refactor suggestion
์๋ฌ ์ฒ๋ฆฌ์ ์๋ต ํ์ ์ ์๊ฐ ํ์ํฉ๋๋ค.
API ์๋ต์ ๋ํ ํ์ ์ ์์ ์๋ฌ ์ฒ๋ฆฌ๊ฐ ๋๋ฝ๋์ด ์์ต๋๋ค.
๋ค์๊ณผ ๊ฐ์ด ๊ฐ์ ํด๋ณด์ธ์:
+interface SignUpResponse {
+ success: boolean;
+ message: string;
+ userId?: string;
+}
+
export const postSignup = async (data: SignUpData) => {
+ try {
+ await SignUpSchema.parseAsync(data);
+ const { data: response } = await axios.post<SignUpResponse>('/api/auth/signup', data);
+ return response;
+ } catch (error) {
+ if (error instanceof z.ZodError) {
+ toast.error(error.errors[0].message);
+ } else if (axios.isAxiosError(error)) {
+ toast.error(error.response?.data?.message || 'ํ์๊ฐ์
์ ์คํจํ์ต๋๋ค.');
+ }
+ throw error;
+ }
};
Committable suggestion skipped: line range outside the PR's diff.
const response = await axios.get( | ||
`/api/auth/sms?phoneNumber=${phoneNumber}&code=${code}`, | ||
); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
URL ํ๋ผ๋ฏธํฐ ์ธ์ฝ๋ฉ ๋ฐ ์๋ฌ ์ฒ๋ฆฌ๊ฐ ํ์ํฉ๋๋ค
๋ณด์ ๋ฐ ์์ ์ฑ ํฅ์์ ์ํ ์์ ์ฌํญ๋ค์ ๋๋ค:
- URL ํ๋ผ๋ฏธํฐ์ encodeURIComponent๋ฅผ ์ ์ฉํ์ฌ XSS ๊ณต๊ฒฉ์ ๋ฐฉ์งํด์ผ ํฉ๋๋ค
- axios ์์ฒญ์ ๋ํ ์๋ฌ ์ฒ๋ฆฌ๊ฐ ํ์ํฉ๋๋ค
๋ค์๊ณผ ๊ฐ์ด ์์ ํ๋ ๊ฒ์ ์ ์๋๋ฆฝ๋๋ค:
- const response = await axios.get(
- `/api/auth/sms?phoneNumber=${phoneNumber}&code=${code}`,
- );
+ try {
+ const response = await axios.get(
+ `/api/auth/sms?phoneNumber=${encodeURIComponent(phoneNumber)}&code=${encodeURIComponent(code)}`,
+ );
+ return response;
+ } catch (error) {
+ toast.error('์ธ์ฆ๋ฒํธ ํ์ธ์ ์คํจํ์ต๋๋ค.');
+ throw error;
+ }
- return response;
๐ 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.
const response = await axios.get( | |
`/api/auth/sms?phoneNumber=${phoneNumber}&code=${code}`, | |
); | |
try { | |
const response = await axios.get( | |
`/api/auth/sms?phoneNumber=${encodeURIComponent(phoneNumber)}&code=${encodeURIComponent(code)}`, | |
); | |
return response; | |
} catch (error) { | |
toast.error('์ธ์ฆ๋ฒํธ ํ์ธ์ ์คํจํ์ต๋๋ค.'); | |
throw error; | |
} |
} else if (timer === 0) { | ||
setIsSmsSent(false); | ||
} | ||
}, [timer, setTimer]); | ||
}, [timer, setTimer, setIsSmsSent]); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
๐ ๏ธ Refactor suggestion
ํ์ด๋จธ ๋ก์ง ๊ฐ์ ์ด ํ์ํฉ๋๋ค
ํ์ด๋จธ ๊ด๋ จ ์์๋ฅผ ์ ์ํ๊ณ cleanup ๋ก์ง์ ๋ณด์ํ๋ ๊ฒ์ด ์ข์ต๋๋ค.
๋ค์๊ณผ ๊ฐ์ด ์์ ํ๋ ๊ฒ์ ์ ์๋๋ฆฝ๋๋ค:
+ const TIMER_ENDED = 0;
+
useEffect(() => {
if (timer > 0) {
const intervalId = setInterval(() => {
setTimer((prev) => prev - 1);
}, 1000);
return () => clearInterval(intervalId);
- } else if (timer === 0) {
+ } else if (timer === TIMER_ENDED) {
setIsSmsSent(false);
}
+
+ return () => {
+ setIsSmsSent(false);
+ };
}, [timer, setTimer, setIsSmsSent]);
๐ 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.
} else if (timer === 0) { | |
setIsSmsSent(false); | |
} | |
}, [timer, setTimer]); | |
}, [timer, setTimer, setIsSmsSent]); | |
const TIMER_ENDED = 0; | |
useEffect(() => { | |
if (timer > 0) { | |
const intervalId = setInterval(() => { | |
setTimer((prev) => prev - 1); | |
}, 1000); | |
return () => clearInterval(intervalId); | |
} else if (timer === TIMER_ENDED) { | |
setIsSmsSent(false); | |
} | |
return () => { | |
setIsSmsSent(false); | |
}; | |
}, [timer, setTimer, setIsSmsSent]); |
๐ก ๋ฐฐ๊ฒฝ ๋ฐ ๊ฐ์
ํ์๊ฐ์ ํ์ด์ง ๋ฆฌํฉํ ๋ง ์งํ
๐ ์์ ๋ด์ฉ
ํ์๊ฐ์ api -> tanstack query๋ก ๋ณ๊ฒฝ
๋ฌธ์์ ์ก api -> tanstack query๋ก ๋ณ๊ฒฝ
๏ฟฝ๋ฌธ์ํ์ธ api -> tanstack query๋ก ๋ณ๊ฒฝ
ํ์ด๋จธ ์ด๊ธฐํ ๋ถ๊ฐ ์ด์ ํด๊ฒฐ
Summary by CodeRabbit
New Features
Bug Fixes
Refactor
Chores