From a76fb1c71f8bb48ae011aaeb352ae9c595d12a38 Mon Sep 17 00:00:00 2001 From: idx123 Date: Tue, 30 May 2023 11:19:34 +0900 Subject: [PATCH 01/17] =?UTF-8?q?feat=20:=20secure=20:=20false=EB=A1=9C=20?= =?UTF-8?q?=EC=84=A4=EC=A0=95(http=EC=97=90=EC=84=9C=EB=8F=84=20=EB=8F=99?= =?UTF-8?q?=EC=9E=91=ED=95=98=20=ED=97=88=EC=9A=A9)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/pages/UserSignIn.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/client/src/pages/UserSignIn.tsx b/client/src/pages/UserSignIn.tsx index 547b5b4..9ea9e4d 100644 --- a/client/src/pages/UserSignIn.tsx +++ b/client/src/pages/UserSignIn.tsx @@ -55,7 +55,6 @@ const UserSignIn = () => { setCookie('access', tokenWithNoBearer, { path: '/', - secure: true, expires: current, sameSite: 'none', }) @@ -63,7 +62,6 @@ const UserSignIn = () => { current.setMinutes(current.getMinutes() + 1440) setCookie('refresh', tokenForReissue, { path: '/', - secure: true, expires: current, sameSite: 'none', }) From 1fc35dcc775daf8ddf2fad5ef03779021e1c57cf Mon Sep 17 00:00:00 2001 From: idx123 Date: Sat, 30 Sep 2023 18:14:39 +0900 Subject: [PATCH 02/17] =?UTF-8?q?feat=20:=20=EC=83=9D=EB=85=84=EC=9B=94?= =?UTF-8?q?=EC=9D=BC,=20=EC=8B=A0=EC=9E=A5,=20=EC=B2=B4=EC=A4=91=20?= =?UTF-8?q?=EC=9E=85=EB=A0=A5=EA=B0=92=20=EA=B2=80=EC=A6=9D=EC=9D=84=20?= =?UTF-8?q?=EC=9C=84=ED=95=9C=20=EB=A1=9C=EC=A7=81=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/components/User/EditProfile.tsx | 36 ++++++----- client/src/pages/UserSignUp.tsx | 70 ++++++++++++++-------- client/src/utils/userfunc.ts | 36 +++++++++++ 3 files changed, 104 insertions(+), 38 deletions(-) diff --git a/client/src/components/User/EditProfile.tsx b/client/src/components/User/EditProfile.tsx index 0b3c2e0..036d7ad 100644 --- a/client/src/components/User/EditProfile.tsx +++ b/client/src/components/User/EditProfile.tsx @@ -14,7 +14,7 @@ import { useSelector, useDispatch } from 'react-redux' import { RootState } from '../../store' import { getCookie } from '../../utils/Cookie' import { __editUser } from '../../store/slices/profileSlice' -import { userLogout } from '../../utils/userfunc' +import { userLogout, checkDate, checkNumber } from '../../utils/userfunc' interface noticeType { nickName: string @@ -73,6 +73,24 @@ const EditProfile = () => { const { name, value } = e.target setProfile({ ...profile, [name]: value }) + + if (name === 'birth') { + if (!checkDate(value)) { + setNotice({ ...notice, birth: '유효하지 생년월일입니다.' }) + } else { + setProfile({ ...profile, birth: value }) + setNotice({ ...notice, birth: '' }) + } + } + + if (name === 'height' || name === 'weight') { + if (!checkNumber(value)) { + setNotice({ ...notice, [name]: '유효하지 않은 값입니다.' }) + } else { + setProfile({ ...profile, [name]: Number(value) }) + setNotice({ ...notice, [name]: '' }) + } + } } // 닉네임 중복 확인 @@ -132,12 +150,6 @@ const EditProfile = () => { return } - if (weight <= 0 && weight >= 500) { - msg.weight = '유효하지 않은 값입니다.' - } - if (height <= 0 && height >= 300) { - msg.height = '유효하지 않은 값입니다.' - } if (birth === '') { msg.birth = '생년월일을 입력해주세요.' } @@ -175,7 +187,7 @@ const EditProfile = () => { } // 회원탈퇴 - const deleteUser = () => { + const deleteUser = async () => { setDel(false) openModal( '회원 탈퇴가 완료되었습니다. \n그동안 라이팅을 이용해주셔서 감사합니다.' @@ -258,20 +270,16 @@ const EditProfile = () => { /> { birth: '', }) - const { email, nickName, password } = values + const { email, nickName, password, birth, weight, height } = values const [ckPassword, setCkPassword] = useState('') const [nameCheck, setNameCheck] = useState('') // 닉네임 비교 @@ -79,6 +81,9 @@ const UserSignUp = ({ social }: Props) => { nickName: '', password: '', ckPassword: '', + birth: '', + weight: '', + height: '', }) const [success, setSuccess] = useState({ @@ -106,13 +111,20 @@ const UserSignUp = ({ social }: Props) => { const handleInput = (e: React.ChangeEvent) => { const { name, value } = e.target - setValues({ ...values, [name]: value }) - } - - const handleAuthNum = (e: React.ChangeEvent) => { - const { name, value } = e.target + if (name === 'ckAuth') { + setAuthNums({ ...authNums, ckAuth: value }) + } else { + setValues({ ...values, [name]: value }) + } - setAuthNums({ ...authNums, [name]: value }) + if (name === 'height' || name === 'weight') { + if (!checkNumber(value)) { + setError({ ...error, [name]: '유효하지 않은 값입니다.' }) + } else { + setValues({ ...values, [name]: Number(value) }) + setError({ ...error, [name]: '' }) + } + } } // 인증번호 전송 @@ -263,6 +275,18 @@ const UserSignUp = ({ social }: Props) => { } } + // 생년월일 유효성 검사 + const isValidBirth = () => { + const msg = { birth: '' } + + if (!checkDate(birth)) { + msg.birth = '유효하지 않은 생년월일입니다.' + setError({ ...error, ...msg }) + } else { + setError({ ...error, ...msg }) + } + } + // 버튼 활성화를 위한 입력값 검증 const checkValues = useCallback( debounce((values: userInfo, isConfirm: boolean, ckpwd: string) => { @@ -275,13 +299,7 @@ const UserSignUp = ({ social }: Props) => { } } - if ( - !isBlank && - isConfirm && - ckpwd === values.password && - values.height > 0 && - values.weight > 0 - ) { + if (!isBlank && isConfirm && ckpwd === values.password) { isNotValid = false } @@ -349,7 +367,7 @@ const UserSignUp = ({ social }: Props) => { error={error.auth} success={isConfirm ? success.auth : ''} disabled={isConfirm} - onChange={handleAuthNum} + onChange={handleInput} />
diff --git a/client/src/utils/userfunc.ts b/client/src/utils/userfunc.ts index cd3a0ef..b42ee00 100644 --- a/client/src/utils/userfunc.ts +++ b/client/src/utils/userfunc.ts @@ -12,6 +12,42 @@ export const checkPassword = (password: string): boolean => { return pwdRegex.test(password) } +export const checkDate = (date: string): boolean => { + // yyyy-mm-dd + const dateRegex = /^\d{4}-\d{2}-\d{2}$/ + + if (!dateRegex.test(date)) { + return false + } + + const convertedDate = new Date(date) + convertedDate.setHours(0, 0, 0, 0) + + if (isNaN(convertedDate.getTime())) { + return false + } + + const Today = new Date() + Today.setHours(0, 0, 0, 0) + + if (Today < convertedDate) { + // 현재 날짜보다 미래를 입력했으면 false + return false + } + + return true +} + +export const checkNumber = (nums: string): boolean => { + const converted = Number(nums) + + if (typeof converted === 'number' && converted > 0 && converted < 300) { + return true + } + + return false +} + export const userLogout = () => { removeCookie('access', { path: '/' }) removeCookie('refresh', { path: '/' }) From b38d408c9bee5692ddfeb6b7788e370c231f5bab Mon Sep 17 00:00:00 2001 From: idx123 Date: Tue, 5 Dec 2023 00:23:35 +0900 Subject: [PATCH 03/17] =?UTF-8?q?fix:=20=EC=98=A4=ED=83=80=20=EC=A0=9C?= =?UTF-8?q?=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/pages/NotFound.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/src/pages/NotFound.tsx b/client/src/pages/NotFound.tsx index 367cd55..4e4d989 100644 --- a/client/src/pages/NotFound.tsx +++ b/client/src/pages/NotFound.tsx @@ -62,7 +62,7 @@ const Icon = styled.span` ` const ErrorWrapper = styled.div` - width: 55srem; + width: 55rem; text-align: center; h1 { From 768cac7846af5c323066d2660f08ba9a59b973d4 Mon Sep 17 00:00:00 2001 From: idx123 Date: Wed, 6 Dec 2023 00:49:52 +0900 Subject: [PATCH 04/17] =?UTF-8?q?design:=20=EB=B6=88=ED=95=84=EC=9A=94?= =?UTF-8?q?=ED=95=9C=20=EC=8A=A4=ED=83=80=EC=9D=BC=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/components/Common/Input.tsx | 9 ++------- 1 file changed, 2 insertions(+), 7 deletions(-) diff --git a/client/src/components/Common/Input.tsx b/client/src/components/Common/Input.tsx index c9d5ac5..a074520 100644 --- a/client/src/components/Common/Input.tsx +++ b/client/src/components/Common/Input.tsx @@ -39,7 +39,7 @@ const Input = (props: inputProps) => { } = props return ( - +
{label && {label}} { /> {error && {error}} {success && {success}} - +
) } -const InputWrapper = styled.div` - height: 6rem; - flex: 1; -` - const StyledLabel = styled.label` display: inline-block; margin: 0 0 0.4rem 0.4rem; From daf3515d13ca5fe8c17f69d5389cb1ee488e249d Mon Sep 17 00:00:00 2001 From: idx123 Date: Wed, 6 Dec 2023 01:06:32 +0900 Subject: [PATCH 05/17] =?UTF-8?q?design:=20=EB=9D=BC=EB=94=94=EC=98=A4?= =?UTF-8?q?=EB=B2=84=ED=8A=BC=20=EC=8A=A4=ED=83=80=EC=9D=BC=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/components/Common/Radio.tsx | 27 +++++++++++++++++--------- 1 file changed, 18 insertions(+), 9 deletions(-) diff --git a/client/src/components/Common/Radio.tsx b/client/src/components/Common/Radio.tsx index 1643f4f..6f232e0 100644 --- a/client/src/components/Common/Radio.tsx +++ b/client/src/components/Common/Radio.tsx @@ -10,7 +10,7 @@ const Radio = (props: radioProps) => { {legend} {radioArray.map((i) => ( -
+ { onChange={onChange} /> {i.label} -
+ ))} @@ -30,18 +30,22 @@ const Radio = (props: radioProps) => { const RadioWrapper = styled.div` display: flex; flex-wrap: wrap; - gap: 2rem; + gap: 1rem; + + input[type='radio'] { + display: none; + } - input[type='radio'], input[type='radio']:checked + label { - color: var(--color-point); - accent-color: var(--color-point); + color: var(--color-white); + background-color: var(--color-primary); font-weight: 600; + transition: all 0.1s; } +` - .radio-div { - margin-top: 0.8rem; - } +const RadioInputWrapper = styled.div` + margin-top: 1rem; ` const Legend = styled.legend` @@ -53,6 +57,11 @@ const Legend = styled.legend` const StyledLabel = styled.label` font-size: 1.4rem; + color: var(--color-secondary); + border: 1px solid var(--color-secondary); + border-radius: 1rem; + padding: 0.8rem 1rem; + cursor: pointer; ` export default Radio From bcbe9b3a04c9df37fe29ccca0375655b36679e8b Mon Sep 17 00:00:00 2001 From: idx123 Date: Wed, 6 Dec 2023 01:10:38 +0900 Subject: [PATCH 06/17] =?UTF-8?q?refactor:=20=EC=9C=A0=ED=9A=A8=EC=84=B1?= =?UTF-8?q?=20=EA=B2=80=EC=A6=9D=20=EB=A1=9C=EC=A7=81=20=EB=B0=8F=20?= =?UTF-8?q?=EB=94=94=EC=9E=90=EC=9D=B8=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/pages/UserSignUp.tsx | 107 ++++++++++++++++---------------- 1 file changed, 55 insertions(+), 52 deletions(-) diff --git a/client/src/pages/UserSignUp.tsx b/client/src/pages/UserSignUp.tsx index 1a6dc26..ad7d085 100644 --- a/client/src/pages/UserSignUp.tsx +++ b/client/src/pages/UserSignUp.tsx @@ -125,6 +125,30 @@ const UserSignUp = ({ social }: Props) => { setError({ ...error, [name]: '' }) } } + + if (name === 'password') { + if (!checkPassword(value)) { + setError({ + ...error, + [name]: + '최소 8자, 영문+숫자+특수문자(!@#$%&*?) 조합으로 구성되어야 합니다.', + }) + } else { + setValues({ ...values, [name]: value }) + setError({ ...error, [name]: '' }) + } + } + + if (name === 'birth') { + if (!checkDate(value)) { + setError({ + ...error, + [name]: '유효하지 않은 생년월일입니다.', + }) + } else { + setError({ ...error, [name]: '' }) + } + } } // 인증번호 전송 @@ -259,34 +283,6 @@ const UserSignUp = ({ social }: Props) => { }) } - // 비밀번호 유효성 검사 - const isValidPassword = () => { - const msg = { password: '', ckPassword: '' } - - if (!checkPassword(password)) { - msg.password = - '최소 8자, 영문+숫자+특수문자(!@#$%&*?) 조합으로 구성되어야 합니다.' - setError({ ...error, ...msg }) - } else if (password !== ckPassword) { - msg.ckPassword = '비밀번호가 일치하지 않습니다.' - setError({ ...error, ...msg }) - } else { - setError({ ...error, ...msg }) - } - } - - // 생년월일 유효성 검사 - const isValidBirth = () => { - const msg = { birth: '' } - - if (!checkDate(birth)) { - msg.birth = '유효하지 않은 생년월일입니다.' - setError({ ...error, ...msg }) - } else { - setError({ ...error, ...msg }) - } - } - // 버튼 활성화를 위한 입력값 검증 const checkValues = useCallback( debounce((values: userInfo, isConfirm: boolean, ckpwd: string) => { @@ -349,7 +345,7 @@ const UserSignUp = ({ social }: Props) => { disabled={isConfirm} onChange={handleInput} /> -
+
@@ -388,7 +384,7 @@ const UserSignUp = ({ social }: Props) => { success={success.nickName} onChange={handleInput} /> -
+
@@ -400,34 +396,32 @@ const UserSignUp = ({ social }: Props) => { placeholder="영문, 숫자, 특수문자를 조합하여 최소 8자 이상" error={error.password} onChange={handleInput} - onBlur={isValidPassword} /> - setCkPassword(e.target.value)} - onBlur={isValidPassword} /> )} + +
- - { />
+ Date: Wed, 6 Dec 2023 01:42:47 +0900 Subject: [PATCH 07/17] =?UTF-8?q?fix:=20=ED=95=84=EB=93=9C=EA=B0=92?= =?UTF-8?q?=EC=9D=B4=20=EC=9C=A0=ED=9A=A8=ED=95=98=EC=A7=80=20=EC=95=8A?= =?UTF-8?q?=EC=9D=8C=EC=97=90=EB=8F=84=20=EC=88=98=EC=A0=95=EC=9D=B4=20?= =?UTF-8?q?=EA=B0=80=EB=8A=A5=ED=95=98=EB=8D=98=20=EB=AC=B8=EC=A0=9C=20?= =?UTF-8?q?=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/components/User/EditProfile.tsx | 26 +++++++++++----------- client/src/pages/UserSignIn.tsx | 2 -- client/src/utils/userfunc.ts | 2 +- 3 files changed, 14 insertions(+), 16 deletions(-) diff --git a/client/src/components/User/EditProfile.tsx b/client/src/components/User/EditProfile.tsx index 036d7ad..f842799 100644 --- a/client/src/components/User/EditProfile.tsx +++ b/client/src/components/User/EditProfile.tsx @@ -76,7 +76,7 @@ const EditProfile = () => { if (name === 'birth') { if (!checkDate(value)) { - setNotice({ ...notice, birth: '유효하지 생년월일입니다.' }) + setNotice({ ...notice, birth: '유효하지 않은 생년월일입니다.' }) } else { setProfile({ ...profile, birth: value }) setNotice({ ...notice, birth: '' }) @@ -136,13 +136,18 @@ const EditProfile = () => { // 프로필 수정 const updateProfile = () => { + console.log(profile) const msg = { nickName: '', weight: '', height: '', birth: '' } let isBlank = false - for (const key in profile) { - if (profile[key] === '') { - isBlank = true - } + // for (const key in profile) { + // if (profile[key] === '') { + // isBlank = true + // } + // } + + if (notice.birth !== '' || notice.weight !== '' || notice.height !== '') { + isBlank = true } if ((isActive && nameCheck === cantUse) || nameCheck !== nickName) { @@ -150,12 +155,8 @@ const EditProfile = () => { return } - if (birth === '') { - msg.birth = '생년월일을 입력해주세요.' - } - if (isBlank) { - setNotice({ ...notice, ...msg }) + openModal('입력값을 확인해주세요.') } else { axios .patch( @@ -260,11 +261,10 @@ const EditProfile = () => { /> diff --git a/client/src/pages/UserSignIn.tsx b/client/src/pages/UserSignIn.tsx index 9ea9e4d..a7e11eb 100644 --- a/client/src/pages/UserSignIn.tsx +++ b/client/src/pages/UserSignIn.tsx @@ -56,14 +56,12 @@ const UserSignIn = () => { setCookie('access', tokenWithNoBearer, { path: '/', expires: current, - sameSite: 'none', }) current.setMinutes(current.getMinutes() + 1440) setCookie('refresh', tokenForReissue, { path: '/', expires: current, - sameSite: 'none', }) }) .catch((error) => { diff --git a/client/src/utils/userfunc.ts b/client/src/utils/userfunc.ts index b42ee00..f2c6247 100644 --- a/client/src/utils/userfunc.ts +++ b/client/src/utils/userfunc.ts @@ -41,7 +41,7 @@ export const checkDate = (date: string): boolean => { export const checkNumber = (nums: string): boolean => { const converted = Number(nums) - if (typeof converted === 'number' && converted > 0 && converted < 300) { + if (typeof converted === 'number' && converted > 0 && converted < 500) { return true } From 98ae9c1c76c727b85732eb00e8e1866e1a306625 Mon Sep 17 00:00:00 2001 From: idx123 Date: Wed, 6 Dec 2023 15:31:16 +0900 Subject: [PATCH 08/17] =?UTF-8?q?fix:=20=EC=9C=A0=ED=9A=A8=EC=84=B1=20?= =?UTF-8?q?=EA=B2=80=EC=A6=9D=EC=9D=B4=20=EC=A0=95=EC=83=81=EC=A0=81?= =?UTF-8?q?=EC=9C=BC=EB=A1=9C=20=EB=90=98=EC=A7=80=20=EC=95=8A=EB=8D=98=20?= =?UTF-8?q?=EB=AC=B8=EC=A0=9C=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/pages/UserSignUp.tsx | 78 ++++++++++++++++++++++++--------- 1 file changed, 57 insertions(+), 21 deletions(-) diff --git a/client/src/pages/UserSignUp.tsx b/client/src/pages/UserSignUp.tsx index ad7d085..834b439 100644 --- a/client/src/pages/UserSignUp.tsx +++ b/client/src/pages/UserSignUp.tsx @@ -27,8 +27,8 @@ interface userInfo { password: string gender: string activity: string - height: number - weight: number + height: string + weight: string birth: string } @@ -38,11 +38,12 @@ interface authentication { } interface errorType { + [key: string]: any email: string auth: string nickName: string password: string - ckPassword: string + passwordcheck: string birth: string weight: string height: string @@ -61,12 +62,12 @@ const UserSignUp = ({ social }: Props) => { password: '', gender: 'male', activity: 'NONE_ACTIVE', - height: 0, - weight: 0, + height: '', + weight: '', birth: '', }) - const { email, nickName, password, birth, weight, height } = values + const { email, nickName, password } = values const [ckPassword, setCkPassword] = useState('') const [nameCheck, setNameCheck] = useState('') // 닉네임 비교 @@ -80,7 +81,7 @@ const UserSignUp = ({ social }: Props) => { auth: '', nickName: '', password: '', - ckPassword: '', + passwordcheck: '', birth: '', weight: '', height: '', @@ -108,15 +109,15 @@ const UserSignUp = ({ social }: Props) => { } // 사용자 입력값 핸들링 - const handleInput = (e: React.ChangeEvent) => { + const handleInput = debounce((e: React.ChangeEvent) => { const { name, value } = e.target + // 인증번호 if (name === 'ckAuth') { setAuthNums({ ...authNums, ckAuth: value }) - } else { - setValues({ ...values, [name]: value }) } + // 신장, 체중 if (name === 'height' || name === 'weight') { if (!checkNumber(value)) { setError({ ...error, [name]: '유효하지 않은 값입니다.' }) @@ -126,6 +127,7 @@ const UserSignUp = ({ social }: Props) => { } } + // 비밀번호 if (name === 'password') { if (!checkPassword(value)) { setError({ @@ -139,6 +141,11 @@ const UserSignUp = ({ social }: Props) => { } } + if (name === 'passwordcheck') { + setCkPassword(value) + } + + // 생년월일 if (name === 'birth') { if (!checkDate(value)) { setError({ @@ -146,10 +153,15 @@ const UserSignUp = ({ social }: Props) => { [name]: '유효하지 않은 생년월일입니다.', }) } else { + setValues({ ...values, [name]: value }) setError({ ...error, [name]: '' }) } } - } + + if (name) { + setValues({ ...values, [name]: value }) + } + }, 300) // 인증번호 전송 const sendNumbers = async (email: string) => { @@ -285,23 +297,38 @@ const UserSignUp = ({ social }: Props) => { // 버튼 활성화를 위한 입력값 검증 const checkValues = useCallback( - debounce((values: userInfo, isConfirm: boolean, ckpwd: string) => { + debounce((values: userInfo, isConfirm: boolean) => { let isBlank = false + let isNotError = true let isNotValid = true + for (const key in error) { + if (error[key] !== '') { + isNotError = false + break + } + } + for (const key in values) { if (values[key] === '') { isBlank = true + break } } - if (!isBlank && isConfirm && ckpwd === values.password) { + if ( + !isBlank && + isNotError && + isConfirm && + values.passwordcheck === values.password + ) { isNotValid = false } + console.log(values) setIsEmpty(isNotValid) - }, 700), - [] + }, 300), + [error] ) // 가입하기 - 모든 값이 유효한 경우 버튼 활성화 @@ -312,9 +339,18 @@ const UserSignUp = ({ social }: Props) => { return } + const convertedUserinfo = { + ...values, + weight: Number(values.weight), + height: Number(values.height), + } + axios - .post(`${process.env.REACT_APP_SERVER_URL}/members/signup`, values) - .then((response) => { + .post( + `${process.env.REACT_APP_SERVER_URL}/members/signup`, + convertedUserinfo + ) + .then(() => { openModal('회원가입이 완료되었습니다. \n로그인 페이지로 이동합니다.') }) .catch((error) => { @@ -325,8 +361,8 @@ const UserSignUp = ({ social }: Props) => { } useEffect(() => { - checkValues(values, isConfirm, ckPassword) - }, [values, isConfirm, ckPassword]) + checkValues(values, isConfirm) + }, [values, ckPassword, isConfirm]) return ( <> @@ -403,11 +439,11 @@ const UserSignUp = ({ social }: Props) => { name="passwordcheck" placeholder="비밀번호를 입력해주세요" error={ - ckPassword !== '' && ckPassword !== password + ckPassword !== password && ckPassword !== '' ? '비밀번호가 일치하지 않습니다.' : '' } - onChange={(e) => setCkPassword(e.target.value)} + onChange={handleInput} /> )} From 09f8d8fd8392e5194038b5b30738425588dc7bed Mon Sep 17 00:00:00 2001 From: idx123 Date: Wed, 6 Dec 2023 19:09:56 +0900 Subject: [PATCH 09/17] =?UTF-8?q?design:=20=EB=B0=98=EC=9D=91=ED=98=95=20?= =?UTF-8?q?=EB=94=94=EC=9E=90=EC=9D=B8=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/components/Common/Tab.tsx | 5 +- client/src/components/User/ChangePwd.tsx | 82 +++++----- client/src/components/User/EditProfile.tsx | 179 +++++++++++---------- client/src/components/User/TabFrame.tsx | 6 +- client/src/pages/UserPage.tsx | 24 ++- 5 files changed, 155 insertions(+), 141 deletions(-) diff --git a/client/src/components/Common/Tab.tsx b/client/src/components/Common/Tab.tsx index 1774ab7..3157785 100644 --- a/client/src/components/Common/Tab.tsx +++ b/client/src/components/Common/Tab.tsx @@ -15,7 +15,7 @@ const Tab = ({ tabItem }: TabMenus) => { }, []) return ( -
+ <> {tabItem.map((i, idx) => ( { -
+ ) } @@ -52,6 +52,7 @@ const TabLink = styled(Link)` } ` const SubpageContainer = styled.div` + width: 100%; min-height: 30rem; padding: 2.6rem; border: 1px solid var(--color-light-gray); diff --git a/client/src/components/User/ChangePwd.tsx b/client/src/components/User/ChangePwd.tsx index 61b9ce6..36e9a38 100644 --- a/client/src/components/User/ChangePwd.tsx +++ b/client/src/components/User/ChangePwd.tsx @@ -106,38 +106,36 @@ const ChangePwd = () => { return ( <> - -
- - - - -
- +
+ + + + +
{ ) } -const Wrapper = styled.div` - width: 63.7rem; - min-height: 40rem; - - @media ${({ theme }) => theme.device.tablet} { - width: 88vw; - } -` - const Form = styled.form` - width: 35rem; + width: 40rem; display: flex; flex-direction: column; gap: 1rem; @@ -168,6 +157,15 @@ const Form = styled.form` > button { margin-top: 0.8rem; } + + @media ${({ theme }) => theme.device.tablet} { + width: 80%; + min-width: 20rem; + } + + @media ${({ theme }) => theme.device.mobile} { + width: 100%; + } ` export default ChangePwd diff --git a/client/src/components/User/EditProfile.tsx b/client/src/components/User/EditProfile.tsx index f842799..e1cf092 100644 --- a/client/src/components/User/EditProfile.tsx +++ b/client/src/components/User/EditProfile.tsx @@ -215,97 +215,95 @@ const EditProfile = () => { return ( <> - - - - - - -
- - {!isActive ? ( -
- -
- ) : ( -
- -
- )} -
- - - + + + + + +
- + {!isActive ? ( +
+ +
+ ) : ( +
+ +
+ )} +
+ + + - - - - - + + + + + + theme.device.tablet} { - width: 88vw; - } -` const GridContainer = styled.div` display: grid; @@ -353,6 +346,14 @@ const GridContainer = styled.div` @media ${({ theme }) => theme.device.tablet} { grid-template-columns: none; + + .flex-div { + flex-direction: column; + + button { + top: 0; + } + } } ` diff --git a/client/src/components/User/TabFrame.tsx b/client/src/components/User/TabFrame.tsx index c5d1e6f..2f98dc3 100644 --- a/client/src/components/User/TabFrame.tsx +++ b/client/src/components/User/TabFrame.tsx @@ -11,7 +11,7 @@ const TabFrame = ({ title, children }: propType) => {

{title}

- {children} + {children} ) } @@ -28,4 +28,8 @@ const Container = styled.div` } ` +const Wrapper = styled.div` + min-height: 40rem; +` + export default TabFrame diff --git a/client/src/pages/UserPage.tsx b/client/src/pages/UserPage.tsx index 46b28b5..f96d581 100644 --- a/client/src/pages/UserPage.tsx +++ b/client/src/pages/UserPage.tsx @@ -53,16 +53,19 @@ const UserPage = () => {
- +
+ +
) } const Container = styled.div` + width: 100%; max-width: 88rem; ` @@ -108,7 +111,14 @@ const UserProfile = styled.div` margin-bottom: 2rem; } - @media screen and (max-width: 500px) { + @media ${({ theme }) => theme.device.mobile} { + flex-direction: column; + gap: 2rem; + + img { + width: 9rem; + height: 9rem; + } } ` From beadfa63334a6266b6a8194f5ab8badc1515cf68 Mon Sep 17 00:00:00 2001 From: idx123 Date: Wed, 6 Dec 2023 21:14:53 +0900 Subject: [PATCH 10/17] =?UTF-8?q?design:=20=EB=B0=98=EC=9D=91=ED=98=95=20?= =?UTF-8?q?=EC=9B=B9=20=EC=8A=A4=ED=83=80=EC=9D=BC=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/components/Common/Radio.tsx | 2 +- client/src/pages/UserFindPwd.tsx | 21 ++++++++++++++++++--- client/src/pages/UserSignIn.tsx | 5 +++++ client/src/pages/UserSignUp.tsx | 21 ++++++++++++++++++++- 4 files changed, 44 insertions(+), 5 deletions(-) diff --git a/client/src/components/Common/Radio.tsx b/client/src/components/Common/Radio.tsx index 6f232e0..903e816 100644 --- a/client/src/components/Common/Radio.tsx +++ b/client/src/components/Common/Radio.tsx @@ -31,6 +31,7 @@ const RadioWrapper = styled.div` display: flex; flex-wrap: wrap; gap: 1rem; + row-gap: 2rem; input[type='radio'] { display: none; @@ -49,7 +50,6 @@ const RadioInputWrapper = styled.div` ` const Legend = styled.legend` - display: inline-block; margin: 0 0 0.4rem 0.4rem; font-size: 1.4rem; font-weight: 700; diff --git a/client/src/pages/UserFindPwd.tsx b/client/src/pages/UserFindPwd.tsx index f29668a..9c15fdd 100644 --- a/client/src/pages/UserFindPwd.tsx +++ b/client/src/pages/UserFindPwd.tsx @@ -269,13 +269,28 @@ const Container = styled.div` .flex-div { width: 100%; - display: flex; - align-items: flex-center; + display: grid; + grid-template-columns: 2fr 1.2fr; gap: 0.6rem; button { + width: 100%; position: relative; - top: 2rem; + top: 1.8rem; + } + } + + @media ${({ theme }) => theme.device.mobile} { + width: 100%; + padding: 2rem 1.8rem; + + .flex-div { + grid-template-columns: 1fr; + + button { + width: 100%; + position: relative; + top: 0; } } ` diff --git a/client/src/pages/UserSignIn.tsx b/client/src/pages/UserSignIn.tsx index a7e11eb..5239179 100644 --- a/client/src/pages/UserSignIn.tsx +++ b/client/src/pages/UserSignIn.tsx @@ -147,6 +147,11 @@ const Container = styled.div` span { font-size: 1.2rem; } + + @media ${({ theme }) => theme.device.mobile} { + width: 100%; + padding: 2rem 1.8rem; + } ` const Logo = styled.div` diff --git a/client/src/pages/UserSignUp.tsx b/client/src/pages/UserSignUp.tsx index 834b439..516c7fe 100644 --- a/client/src/pages/UserSignUp.tsx +++ b/client/src/pages/UserSignUp.tsx @@ -528,6 +528,11 @@ const Container = styled.div` li:nth-child(even) { margin: 0.4rem 0; } + + @media ${({ theme }) => theme.device.mobile} { + width: 100%; + padding: 2rem 1.8rem; + } ` const Form = styled.form` display: flex; @@ -547,7 +552,7 @@ const Form = styled.form` button { width: 100%; position: relative; - top: 2rem; + top: 1.8rem; } } @@ -556,5 +561,19 @@ const Form = styled.form` grid-template-columns: 1fr 1fr; column-gap: 0.6rem; } + + @media ${({ theme }) => theme.device.mobile} { + .flex-div { + width: 100%; + display: grid; + grid-template-columns: 2fr 1fr; + gap: 0.6rem; + } + + .grid-div { + grid-template-columns: 1fr; + row-gap: 2rem; + } + } ` export default UserSignUp From b83300ac748b9128aed618f52a5ce99778d187fe Mon Sep 17 00:00:00 2001 From: idx123 Date: Wed, 6 Dec 2023 21:35:58 +0900 Subject: [PATCH 11/17] =?UTF-8?q?design:=20input=20flex=20=EC=84=A4?= =?UTF-8?q?=EC=A0=95=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/components/Common/Input.tsx | 7 +++++-- client/src/pages/UserSignUp.tsx | 2 +- 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/client/src/components/Common/Input.tsx b/client/src/components/Common/Input.tsx index a074520..289ec6f 100644 --- a/client/src/components/Common/Input.tsx +++ b/client/src/components/Common/Input.tsx @@ -39,7 +39,7 @@ const Input = (props: inputProps) => { } = props return ( -
+ {label && {label}} { /> {error && {error}} {success && {success}} -
+ ) } +const InputWrapper = styled.div` + flex: 1; +` const StyledLabel = styled.label` display: inline-block; diff --git a/client/src/pages/UserSignUp.tsx b/client/src/pages/UserSignUp.tsx index 516c7fe..856b6d3 100644 --- a/client/src/pages/UserSignUp.tsx +++ b/client/src/pages/UserSignUp.tsx @@ -547,7 +547,7 @@ const Form = styled.form` } .btn-div { - flex: 2 1 0; + flex: 1 1 1; button { width: 100%; From 05442f8aac27d51f9dc9dbd1ee9957682c177a63 Mon Sep 17 00:00:00 2001 From: idx123 Date: Wed, 10 Jan 2024 22:02:10 +0900 Subject: [PATCH 12/17] =?UTF-8?q?fix=20:=20og-image=20=EB=A7=81=ED=81=AC?= =?UTF-8?q?=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/public/index.html | 2 +- client/src/store/hooks/useTokenCheck.tsx | 20 -------------------- 2 files changed, 1 insertion(+), 21 deletions(-) delete mode 100644 client/src/store/hooks/useTokenCheck.tsx diff --git a/client/public/index.html b/client/public/index.html index f08253e..2822e8a 100644 --- a/client/public/index.html +++ b/client/public/index.html @@ -12,7 +12,7 @@ /> { - const navigate = useNavigate() - - useEffect(() => { - const checkToken = () => { - if (!getCookie('access')) { - navigate('/sign-in', { replace: true }) - } - } - - checkToken() - }, []) -} - -export default useTokenCheck From bf11d6fd79afe6c6884f1635047cbb142273a19c Mon Sep 17 00:00:00 2001 From: YujunSun0 <120611048+YujunSun0@users.noreply.github.com> Date: Thu, 11 Jan 2024 19:47:25 +0900 Subject: [PATCH 13/17] Update gradle.yml --- .github/workflows/gradle.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/gradle.yml b/.github/workflows/gradle.yml index 05d9c43..3b8ef2d 100644 --- a/.github/workflows/gradle.yml +++ b/.github/workflows/gradle.yml @@ -17,7 +17,7 @@ permissions: contents: read env: - S3_BUCKET_NAME: 004-s3-bucket + S3_BUCKET_NAME: fe-004-s3-bucket jobs: build: From dbf27f6182c6900bad630c67a52cd2ea0734e9c6 Mon Sep 17 00:00:00 2001 From: YujunSun0 <120611048+YujunSun0@users.noreply.github.com> Date: Thu, 11 Jan 2024 19:57:55 +0900 Subject: [PATCH 14/17] Update gradle.yml --- .github/workflows/gradle.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/gradle.yml b/.github/workflows/gradle.yml index 3b8ef2d..05d9c43 100644 --- a/.github/workflows/gradle.yml +++ b/.github/workflows/gradle.yml @@ -17,7 +17,7 @@ permissions: contents: read env: - S3_BUCKET_NAME: fe-004-s3-bucket + S3_BUCKET_NAME: 004-s3-bucket jobs: build: From 0dad8b6d97ff3521eed7b1135af39e5e506bce20 Mon Sep 17 00:00:00 2001 From: YujunSun0 <120611048+YujunSun0@users.noreply.github.com> Date: Thu, 11 Jan 2024 20:29:14 +0900 Subject: [PATCH 15/17] Update deployment.yml --- .github/workflows/deployment.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/deployment.yml b/.github/workflows/deployment.yml index a0a5cf9..84cba63 100644 --- a/.github/workflows/deployment.yml +++ b/.github/workflows/deployment.yml @@ -37,7 +37,7 @@ jobs: aws-region: ${{ secrets.AWS_REGION }} - name: Deploy to S3 - run: aws s3 sync ./client/build s3://${{ secrets.DEV_AWS_S3_BUCKET }} --delete + run: aws s3 sync ./client/build s3://${{ secrets.DEV_AWS_S3_BUCKETNAME }} --delete - name: Invalidate CloudFront Cache run: aws cloudfront create-invalidation --distribution-id ${{secrets.DEV_AWS_DISTRIBUTION_ID}} --paths "/*" From fc81b91dbdeadc3a480da04df5cf4dc046dc8088 Mon Sep 17 00:00:00 2001 From: YujunSun0 <120611048+YujunSun0@users.noreply.github.com> Date: Thu, 11 Jan 2024 20:42:46 +0900 Subject: [PATCH 16/17] Update deployment.yml --- .github/workflows/deployment.yml | 3 --- 1 file changed, 3 deletions(-) diff --git a/.github/workflows/deployment.yml b/.github/workflows/deployment.yml index 84cba63..68cfb9b 100644 --- a/.github/workflows/deployment.yml +++ b/.github/workflows/deployment.yml @@ -38,6 +38,3 @@ jobs: - name: Deploy to S3 run: aws s3 sync ./client/build s3://${{ secrets.DEV_AWS_S3_BUCKETNAME }} --delete - - - name: Invalidate CloudFront Cache - run: aws cloudfront create-invalidation --distribution-id ${{secrets.DEV_AWS_DISTRIBUTION_ID}} --paths "/*" From 25185cfabe0ecd5ac94d5a8a0069031cbed69b12 Mon Sep 17 00:00:00 2001 From: YujunSun0 <120611048+YujunSun0@users.noreply.github.com> Date: Thu, 11 Jan 2024 20:50:37 +0900 Subject: [PATCH 17/17] Update gradle.yml --- .github/workflows/gradle.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/gradle.yml b/.github/workflows/gradle.yml index 05d9c43..3b8ef2d 100644 --- a/.github/workflows/gradle.yml +++ b/.github/workflows/gradle.yml @@ -17,7 +17,7 @@ permissions: contents: read env: - S3_BUCKET_NAME: 004-s3-bucket + S3_BUCKET_NAME: fe-004-s3-bucket jobs: build: