From a637ae26636fdc9d5e4dcc6df158ce6eb806c0a2 Mon Sep 17 00:00:00 2001 From: chaem03 Date: Sat, 16 Nov 2024 00:28:18 +0900 Subject: [PATCH 1/2] =?UTF-8?q?[Fix]-rank=EB=AC=B8=EC=9E=90=EC=97=B4=20?= =?UTF-8?q?=EC=88=AB=EC=9E=90=EB=A1=9C=20=EB=B3=80=ED=99=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/nuguTest/ChallengerTest.jsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/pages/nuguTest/ChallengerTest.jsx b/src/pages/nuguTest/ChallengerTest.jsx index 9bc3c9c..5d9569f 100644 --- a/src/pages/nuguTest/ChallengerTest.jsx +++ b/src/pages/nuguTest/ChallengerTest.jsx @@ -60,7 +60,8 @@ export const ChallengerTest = () => { const isAnswerinCorrect = selectedAnswer[currentQuestion] === null ? null - : rank[currentQuestion] === selectedAnswer[currentQuestion] + : parseInt(rank[currentQuestion], 10) === + parseInt(selectedAnswer[currentQuestion], 10) ? true : false; From ccd7d4f6710071f54480fea88c439701f92be05d Mon Sep 17 00:00:00 2001 From: chaem03 Date: Sat, 16 Nov 2024 01:16:08 +0900 Subject: [PATCH 2/2] =?UTF-8?q?[Fix]-=20=EB=88=84=EA=B5=AC=20=EC=88=98?= =?UTF-8?q?=EC=A0=95=20=EC=9C=A0=ED=9A=A8=EC=84=B1=20=EA=B2=80=EC=82=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/nuguPatch/NuguPatch.jsx | 20 ++++---- src/pages/nuguPatch/_hooks/useNuguPatch.js | 54 +++++++++++++++++++++- src/pages/nuguPatch/styled.js | 6 +++ src/pages/nuguTest/NuguChallenge.jsx | 1 - 4 files changed, 70 insertions(+), 11 deletions(-) diff --git a/src/pages/nuguPatch/NuguPatch.jsx b/src/pages/nuguPatch/NuguPatch.jsx index 5c1c460..c1a0fdf 100644 --- a/src/pages/nuguPatch/NuguPatch.jsx +++ b/src/pages/nuguPatch/NuguPatch.jsx @@ -15,7 +15,7 @@ import { useNuguPatch } from "./_hooks/useNuguPatch"; import { getNugu } from "@apis/nuguPatch"; export const NuguPatch = () => { const [updateData, setUpdateData] = useRecoilState(signUpState); - const { handleSubmit, isFormValid } = useNuguPatch(); + const { errors, handleSubmit, isFormValid } = useNuguPatch(); const { selectedChip, handleClickStatus, selectedCount } = usePatchChip(); useEffect(() => { @@ -59,13 +59,17 @@ export const NuguPatch = () => { {[...SIGN_UP_FIELDS[1], ...SIGN_UP_FIELDS[2]].map((data, index) => ( - handleInputChange(data.name, e.target.value)} - type={data.type} - /> +
+ handleInputChange(data.name, e.target.value)} + type={data.type} + /> + {errors[data.name] && ( + {errors[data.name]} + )} +
))} diff --git a/src/pages/nuguPatch/_hooks/useNuguPatch.js b/src/pages/nuguPatch/_hooks/useNuguPatch.js index 2329202..3b59e68 100644 --- a/src/pages/nuguPatch/_hooks/useNuguPatch.js +++ b/src/pages/nuguPatch/_hooks/useNuguPatch.js @@ -2,12 +2,36 @@ import { patchNuguInfo } from "@apis/nuguPatch"; import { useRecoilState } from "recoil"; import { signUpState } from "@atoms/signUpState"; import { useNavigate } from "react-router-dom"; - +import { useState } from "react"; export const useNuguPatch = () => { + const [errors, setErrors] = useState({}); + const navigate = useNavigate(); const [updateData, setUpdateData] = useRecoilState(signUpState); const handleSubmit = async () => { console.log(updateData); + + let valid = true; + const tempErrors = {}; + + Object.keys(updateData).forEach((field) => { + const value = updateData[field]; + const error = checkFieldValidity(value, field); + console.log(`Error for ${field}: ${error}`); + + if (error !== "") { + valid = false; + tempErrors[field] = error; + } else { + delete tempErrors[field]; + } + }); + setErrors(tempErrors); + console.log(valid); + if (!valid) { + return; + } + try { const response = await patchNuguInfo({ nickname: updateData.nickname, @@ -25,6 +49,32 @@ export const useNuguPatch = () => { throw err; } }; + const checkFieldValidity = (value, fieldName) => { + let error = ""; + // 각 필드에 대한 유효성 검사 + if (fieldName === "username" && (value.length === 0 || value.length > 20)) { + error = "아이디는 20자 이내로 작성해주세요."; + } else if ( + fieldName === "password" && + (value.length < 8 || value.length > 16) + ) { + error = "비밀번호는 8-16자로 작성해주세요."; + } else if (fieldName === "nickname" && value.length > 5) { + error = "닉네임은 5자 이내로 작성해주세요."; + } else if (fieldName === "mbti") { + value = value.trim(); // 공백 제거 + // 영문 4자 검사 + if (value && !/^[A-Za-z]{4}$/.test(value)) { + error = "MBTI는 영문 4자로 입력해주세요."; // 오류 메시지 + } + } else if (fieldName === "organization" && value.length > 30) { + error = "소속은 30자 이내로 작성해주세요."; + } else if (fieldName === "intro" && value.length > 30) { + error = "한 줄 소개는 30자 이내로 작성해주세요."; + } + + return error; + }; const isFormValid = () => { const requiredFields = [ @@ -39,5 +89,5 @@ export const useNuguPatch = () => { ]; return requiredFields.every((field) => field !== ""); }; - return { handleSubmit, isFormValid }; + return { handleSubmit, isFormValid, errors }; }; diff --git a/src/pages/nuguPatch/styled.js b/src/pages/nuguPatch/styled.js index c882e32..94e6cfa 100644 --- a/src/pages/nuguPatch/styled.js +++ b/src/pages/nuguPatch/styled.js @@ -46,3 +46,9 @@ export const ChipWrapper = styled.div` margin-top: 1rem; `; +export const ErrorMessage = styled.p` + color: ${({ theme }) => theme.colors.red200}; + ${({ theme }) => theme.fonts.pretendardB4}; + + font-size: 0.8rem; +`; diff --git a/src/pages/nuguTest/NuguChallenge.jsx b/src/pages/nuguTest/NuguChallenge.jsx index 5ac560f..c0f28de 100644 --- a/src/pages/nuguTest/NuguChallenge.jsx +++ b/src/pages/nuguTest/NuguChallenge.jsx @@ -16,7 +16,6 @@ import Cookies from "js-cookie"; export const NuguChallenge = () => { const setTestUser = useSetRecoilState(testUser); const navigate = useNavigate(); - const isTestMake = true; const moveOnTest = () => { navigate(`/challenge/test/${Cookies.get("uuid")}`);