diff --git a/src/app/Provider.tsx b/src/app/Provider.tsx
index 28151a80..3e13abd2 100644
--- a/src/app/Provider.tsx
+++ b/src/app/Provider.tsx
@@ -18,7 +18,7 @@ export function Provider({ children }: { children: React.ReactNode }) {
{children}
- {/**/}
+
);
}
diff --git a/src/features/posts/queries/useGetPost.tsx b/src/features/posts/queries/useGetPost.tsx
index 01d419ab..f8b545ee 100644
--- a/src/features/posts/queries/useGetPost.tsx
+++ b/src/features/posts/queries/useGetPost.tsx
@@ -1,5 +1,4 @@
import { useQuery } from '@tanstack/react-query';
-import { isNumber } from 'lodash';
import { axiosInstance } from '@/common/libs/axios';
import { GetPostResponse } from './dto/get-post';
diff --git a/src/features/register/components/form/GenderSelect/GenderSelect.tsx b/src/features/register/components/form/GenderSelect/GenderSelect.tsx
index 3f4aabb2..a7040dfc 100644
--- a/src/features/register/components/form/GenderSelect/GenderSelect.tsx
+++ b/src/features/register/components/form/GenderSelect/GenderSelect.tsx
@@ -17,7 +17,7 @@ export function GenderSelect({ defaultValue, onChange }: GenderSelectProps) {
if (gender) {
onChange(gender);
}
- }, [gender]);
+ }, [gender, onChange]);
return (
diff --git a/src/features/user/components/NicknameAgeGenderForm/NicknameAgeGenderForm.tsx b/src/features/user/components/NicknameAgeGenderForm/NicknameAgeGenderForm.tsx
index 2f7d0457..cb642e56 100644
--- a/src/features/user/components/NicknameAgeGenderForm/NicknameAgeGenderForm.tsx
+++ b/src/features/user/components/NicknameAgeGenderForm/NicknameAgeGenderForm.tsx
@@ -1,5 +1,5 @@
import { AxiosError } from 'axios';
-import { useEffect, useState } from 'react';
+import { useCallback, useEffect, useState } from 'react';
import { axiosInstance } from '@/common/libs/axios';
import { parseDateString } from '@/common/utils/date/parseDateString';
import { validateBirthDate } from '@/common/utils/validations/birth-date';
@@ -45,29 +45,35 @@ export function NicknameAgeGenderForm({
birthDate: null,
});
- const handleNicknameChange = async (nickname: string) => {
- setIsDirty({ ...isDirty, nickname: true });
- setFormData({ ...formData, nickname });
+ const handleNicknameChange = useCallback(
+ async (nickname: string) => {
+ setIsDirty((prevIsDirty) => ({ ...prevIsDirty, nickname: true }));
+ setFormData((prevFormData) => ({ ...prevFormData, nickname }));
- let error = validateNickname(nickname);
- if (!error) {
- try {
- await axiosInstance.get(`/user/${user?.id}/validate-nickname`, {
- params: { nickname },
- });
- } catch (e) {
- if (e instanceof AxiosError && e.response?.status === 400) {
- const errorCode = e.response.data.errorCode;
- if (errorCode === 'IS_DUPLICATED_NICKNAME') {
- error = '이미 존재하는 닉네임입니다.';
- } else if (errorCode === 'IS_BAD_WORD') {
- error = '금칙어 입력이 불가합니다.';
+ let error = validateNickname(nickname);
+ if (!error) {
+ try {
+ await axiosInstance.get(`/user/${user?.id}/validate-nickname`, {
+ params: { nickname },
+ });
+ } catch (e) {
+ if (e instanceof AxiosError && e.response?.status === 400) {
+ const errorCode = e.response.data.errorCode;
+ if (errorCode === 'IS_DUPLICATED_NICKNAME') {
+ error = '이미 존재하는 닉네임입니다.';
+ } else if (errorCode === 'IS_BAD_WORD') {
+ error = '금칙어 입력이 불가합니다.';
+ }
}
}
}
- }
- setErrorMessage({ ...errorMessage, nickname: error });
- };
+ setErrorMessage((prevErrorMessage) => ({
+ ...prevErrorMessage,
+ nickname: error,
+ }));
+ },
+ [user?.id],
+ );
const nicknameSuccessMessage =
isDirty.nickname && !errorMessage.nickname
@@ -76,21 +82,26 @@ export function NicknameAgeGenderForm({
const birthDateSuccessMessage =
isDirty.birthDate && !errorMessage.birthDate ? ' ' : null;
- const handleBirthDateChange = ({ year, month, day }: BirthDate) => {
- setIsDirty({ ...isDirty, birthDate: true });
- setFormData({ ...formData, birthDate: `${year}-${month}-${day}` });
-
- setErrorMessage({
- ...errorMessage,
- birthDate: isDirty.birthDate
- ? validateBirthDate({ year, month, day })
- : null,
- });
- };
+ const handleBirthDateChange = useCallback(
+ ({ year, month, day }: BirthDate) => {
+ setIsDirty((prevIsDirty) => ({ ...prevIsDirty, birthDate: true }));
+ setFormData((prevFormData) => ({
+ ...prevFormData,
+ birthDate: `${year}-${month}-${day}`,
+ }));
+ setErrorMessage((prevErrorMessage) => ({
+ ...prevErrorMessage,
+ birthDate: isDirty.birthDate
+ ? validateBirthDate({ year, month, day })
+ : null,
+ }));
+ },
+ [isDirty.birthDate],
+ );
- const handleGenderChange = (gender: Gender) => {
- setFormData({ ...formData, gender });
- };
+ const handleGenderChange = useCallback((gender: Gender) => {
+ setFormData((prevFormData) => ({ ...prevFormData, gender }));
+ }, []);
useEffect(() => {
const isValid = Boolean(
@@ -101,7 +112,7 @@ export function NicknameAgeGenderForm({
!errorMessage.birthDate,
);
onChange(formData, isValid);
- }, [formData, errorMessage]);
+ }, [formData, errorMessage, onChange]);
return (
diff --git a/src/features/user/components/RegionJobCategoryForm/RegionJobCategoryForm.tsx b/src/features/user/components/RegionJobCategoryForm/RegionJobCategoryForm.tsx
index e73a7e56..37d6702b 100644
--- a/src/features/user/components/RegionJobCategoryForm/RegionJobCategoryForm.tsx
+++ b/src/features/user/components/RegionJobCategoryForm/RegionJobCategoryForm.tsx
@@ -74,7 +74,7 @@ export function RegionJobCategoryForm({
);
onChange(formData, isValid);
- }, [formData, jobErrorMessage, isDirty]);
+ }, [formData, jobErrorMessage, isDirty, onChange]);
useEffect(() => {
if (formData.job) {
diff --git a/src/features/vote/components/VoteButton/VoteButton.tsx b/src/features/vote/components/VoteButton/VoteButton.tsx
index f9221405..db391ce8 100644
--- a/src/features/vote/components/VoteButton/VoteButton.tsx
+++ b/src/features/vote/components/VoteButton/VoteButton.tsx
@@ -1,5 +1,4 @@
import { useAtom, useSetAtom } from 'jotai';
-import { useEffect } from 'react';
import { FloatingButton } from '@/common/components/ui/buttons';
import { useUser } from '@/features/user/queries';
import { useChooseOption } from '@/features/vote/queries';
diff --git a/src/features/vote/components/VoteSection.tsx b/src/features/vote/components/VoteSection.tsx
index 4b1cb9aa..10a2581d 100644
--- a/src/features/vote/components/VoteSection.tsx
+++ b/src/features/vote/components/VoteSection.tsx
@@ -1,5 +1,4 @@
import { useAtomValue, useSetAtom } from 'jotai';
-import { useAtom } from 'jotai/index';
import { useEffect } from 'react';
import { Spacing } from '@/common/components/ui';
import { getRemainingTime } from '@/features/posts/utils/get-remaining-time';
diff --git a/src/features/vote/queries/useGetChoiceOptions.tsx b/src/features/vote/queries/useGetChoiceOptions.tsx
index 91179450..0dfa4554 100644
--- a/src/features/vote/queries/useGetChoiceOptions.tsx
+++ b/src/features/vote/queries/useGetChoiceOptions.tsx
@@ -1,5 +1,4 @@
import { useSuspenseQuery } from '@suspensive/react-query';
-import { useQuery } from '@tanstack/react-query';
import { axiosInstance } from '@/common/libs/axios';
import { GetChoiceOptionsResponse } from './dto/get-choice-options';
diff --git a/src/features/vote/queries/useGetMyChoice.tsx b/src/features/vote/queries/useGetMyChoice.tsx
index 0ca414ed..e90e1c37 100644
--- a/src/features/vote/queries/useGetMyChoice.tsx
+++ b/src/features/vote/queries/useGetMyChoice.tsx
@@ -1,5 +1,4 @@
import { useQuery } from '@tanstack/react-query';
-import { isNumber } from 'lodash';
import { axiosInstance } from '@/common/libs/axios';
import { GetMyChoiceResponse } from './dto/get-my-choice';