diff --git a/src/hooks/useValidateNickname.ts b/src/hooks/useValidateNickname.ts new file mode 100644 index 00000000..8591397a --- /dev/null +++ b/src/hooks/useValidateNickname.ts @@ -0,0 +1,45 @@ +import { useCheckValidNicknameMutation } from '@apis' +import { VALID_NICKNAME_MESSAGE } from '@constants' + +export const useValidateNickname = () => { + const checkValidNickname = useCheckValidNicknameMutation() + + const validateNickname = async (nickname: string) => { + if (nickname.length === 0) { + return { + isSuccess: false, + message: VALID_NICKNAME_MESSAGE.EMPTY_ERROR + } + } + + if (nickname.length < 2) { + return { + isSuccess: false, + message: VALID_NICKNAME_MESSAGE.MIN_LENGTH_ERROR + } + } + + try { + const { duplicate } = await checkValidNickname.mutateAsync(nickname) + + if (duplicate) { + return { + isSuccess: false, + message: VALID_NICKNAME_MESSAGE.DUPLICATED_ERROR + } + } else { + return { + isSuccess: true, + message: VALID_NICKNAME_MESSAGE.SUCCESS + } + } + } catch (e) { + return { + isSuccess: false, + message: 'An error occurred during nickname validation.' + } + } + } + + return validateNickname +} diff --git a/src/pages/shop/view/index.tsx b/src/pages/shop/view/index.tsx index 460af2a3..2c73509f 100644 --- a/src/pages/shop/view/index.tsx +++ b/src/pages/shop/view/index.tsx @@ -3,9 +3,8 @@ import { useRouter } from 'next/router' import { useState } from 'react' import { Styled } from './styled' import { pageTabs, tabList } from '../pageTabs' -import { VALID_NICKNAME_MESSAGE } from '@constants/message' +import { useValidateNickname } from '@hooks/useValidateNickname' import { - useCheckValidNicknameMutation, useCreateUploadImagesMutation, useGetProfileQuery, useUpdateMyProfileMutation @@ -34,12 +33,12 @@ export const ShopPageView = ({ memberId, currentTab }: ShopPageViewProps) => { const profile = useGetProfileQuery(memberId) const createUploadImage = useCreateUploadImagesMutation() - const checkValidNickname = useCheckValidNicknameMutation() const updateMyProfile = useUpdateMyProfileMutation() - const hasToken = !isNumber(memberId) + const isLogin = !isNumber(memberId) const profileModal = useModal() const router = useRouter() + const validateNickname = useValidateNickname() const handleChangePage = (code: TradeActivityCodes) => (): void => { router.push(`${router.pathname}?tab=${code}`) @@ -47,35 +46,8 @@ export const ShopPageView = ({ memberId, currentTab }: ShopPageViewProps) => { } const handleValidateNickname = async (nickname: string) => { - if (nickname.length === 0) { - setEditProfileValidate({ - isSuccess: false, - message: VALID_NICKNAME_MESSAGE.EMPTY_ERROR - }) - return - } - - if (nickname.length < 2) { - setEditProfileValidate({ - isSuccess: false, - message: VALID_NICKNAME_MESSAGE.MIN_LENGTH_ERROR - }) - return - } - - const { duplicate } = await checkValidNickname.mutateAsync(nickname) - - if (duplicate) { - setEditProfileValidate({ - isSuccess: false, - message: VALID_NICKNAME_MESSAGE.DUPLICATED_ERROR - }) - } else { - setEditProfileValidate({ - isSuccess: true, - message: VALID_NICKNAME_MESSAGE.SUCCESS - }) - } + const validate = await validateNickname(nickname) + setEditProfileValidate(validate) } const handleChangeProfileImage = async (image: EditProfileForm['image']) => { if (!image.file) { @@ -112,7 +84,7 @@ export const ShopPageView = ({ memberId, currentTab }: ShopPageViewProps) => { {pageTabs - .filter(pageTab => (hasToken ? true : pageTab.tab.code !== 'buy')) + .filter(pageTab => (isLogin ? true : pageTab.tab.code !== 'buy')) .map(({ tab }) => ( { {pageTabs - .filter(pageTab => (hasToken ? true : pageTab.tab.code !== 'buy')) + .filter(pageTab => (isLogin ? true : pageTab.tab.code !== 'buy')) .map(({ tab, panel }) => ( - {panel({ hasToken, memberId })} + {panel({ isLogin, memberId })} ))}