From 255ecba37bdf33e3f9e2afef1137b6fffdc0eef1 Mon Sep 17 00:00:00 2001 From: jisu Seo Date: Tue, 9 Jan 2024 20:09:51 +0900 Subject: [PATCH 01/21] =?UTF-8?q?Refactor:=20=EC=B9=B4=EC=B9=B4=EC=98=A4?= =?UTF-8?q?=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20=EC=9E=84=EC=8B=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/authClient.ts | 2 +- src/api/client.ts | 2 +- .../Auth/Login/AuthButtons/KakaoLoginButton.tsx | 11 ++++++----- 3 files changed, 8 insertions(+), 7 deletions(-) diff --git a/src/api/authClient.ts b/src/api/authClient.ts index 57f7f4a9..b84aecba 100644 --- a/src/api/authClient.ts +++ b/src/api/authClient.ts @@ -1,7 +1,7 @@ import axios from 'axios'; const authClient = axios.create({ - baseURL: import.meta.env.VITE_SERVER_URL, + baseURL: `${import.meta.env.VITE_SERVER_URL}api/`, headers: { 'Content-Type': 'application/json', }, diff --git a/src/api/client.ts b/src/api/client.ts index 07bd5c25..e73881dc 100644 --- a/src/api/client.ts +++ b/src/api/client.ts @@ -1,7 +1,7 @@ import axios from 'axios'; const client = axios.create({ - baseURL: import.meta.env.VITE_SERVER_URL, + baseURL: `${import.meta.env.VITE_SERVER_URL}api/`, headers: { 'Content-Type': 'application/json', }, diff --git a/src/components/Auth/Login/AuthButtons/KakaoLoginButton.tsx b/src/components/Auth/Login/AuthButtons/KakaoLoginButton.tsx index aba29b0f..1829eedb 100644 --- a/src/components/Auth/Login/AuthButtons/KakaoLoginButton.tsx +++ b/src/components/Auth/Login/AuthButtons/KakaoLoginButton.tsx @@ -1,14 +1,15 @@ import { KakaoIcon } from '@components/common/icons/Icons'; const KakaoLoginButton = () => { - const VITE_KAKAO_LOGIN_TEST_API_KEY = import.meta.env - .VITE_KAKAO_LOGIN_TEST_API_KEY; - const REDIRECT_URI = `${window.location.href}/kakao`; - const KAKAO_LOGIN_URL = `https://kauth.kakao.com/oauth/authorize?client_id=${VITE_KAKAO_LOGIN_TEST_API_KEY}&redirect_uri=${REDIRECT_URI}&response_type=code`; + // const VITE_KAKAO_LOGIN_TEST_API_KEY = import.meta.env + // .VITE_KAKAO_LOGIN_TEST_API_KEY; + // const REDIRECT_URI = `${window.location.href}/kakao`; + // const KAKAO_LOGIN_URL = `https://kauth.kakao.com/oauth/authorize?client_id=${VITE_KAKAO_LOGIN_TEST_API_KEY}&redirect_uri=${REDIRECT_URI}&response_type=code`; return ( 카카오로 로그인 From 17653ff39b87104a33dbb66674a94480ec3f6906 Mon Sep 17 00:00:00 2001 From: jisu Seo Date: Fri, 12 Jan 2024 00:56:39 +0900 Subject: [PATCH 02/21] =?UTF-8?q?Refactor:=20=ED=98=84=EC=9E=AC=20?= =?UTF-8?q?=EB=B9=84=EB=B0=80=EB=B2=88=ED=98=B8=20=ED=99=95=EC=9D=B8=20?= =?UTF-8?q?=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 --- src/@types/auth.types.ts | 1 + src/api/authClient.ts | 2 -- .../Mypage/EditPassword/EditPwForm.tsx | 23 ++++++++----------- 3 files changed, 10 insertions(+), 16 deletions(-) diff --git a/src/@types/auth.types.ts b/src/@types/auth.types.ts index 98ce9d08..21ad8c97 100644 --- a/src/@types/auth.types.ts +++ b/src/@types/auth.types.ts @@ -23,6 +23,7 @@ export interface EditPassword { export interface EditPasswordProps { password: string; + newPassword: string; } export interface AuthInputBoxProps { diff --git a/src/api/authClient.ts b/src/api/authClient.ts index 9590a509..41324f30 100644 --- a/src/api/authClient.ts +++ b/src/api/authClient.ts @@ -38,8 +38,6 @@ authClient.interceptors.response.use( return res; }, function (error) { - console.error(error); - if (error.response.status === 401) { // 응답이 401으로 오는 경우 // 1. 엑세스 토큰이 없는 경우(엑세스 토큰이 없습니다.) diff --git a/src/components/Mypage/EditPassword/EditPwForm.tsx b/src/components/Mypage/EditPassword/EditPwForm.tsx index 25d5865d..eb83a914 100644 --- a/src/components/Mypage/EditPassword/EditPwForm.tsx +++ b/src/components/Mypage/EditPassword/EditPwForm.tsx @@ -6,6 +6,7 @@ import { AuthPwInputBox, } from '@components/Auth'; import SubmitBtn from '@components/common/button/SubmitBtn'; +import { AxiosError } from 'axios'; import { SubmitHandler, useForm } from 'react-hook-form'; import { useNavigate } from 'react-router-dom'; @@ -26,31 +27,25 @@ const EditPwForm = () => { const navigate = useNavigate(); const onEditPwSubmit: SubmitHandler = async (data) => { - const { password } = data; + const { currentPw, password } = data; - // 비밀번호 확인 로직 - // try { - // const res = await getCheckPw(inputValue); - // if (res.status === 200) { try { const res = await putMemberPassword({ - password, + password: currentPw, + newPassword: password, }); if (res.status === 200) { alert('비밀번호가 변경되었습니다.'); navigate('/mypage/info'); } } catch (err) { - alert('오류가 발생했습니다. 다시 시도해주세요'); console.error('비밀번호 수정 요청 중 에러 발생', err); + if (err instanceof AxiosError) { + if (err.response?.data.status === 404) { + setError('currentPw', { message: '비밀번호가 올바르지 않습니다.' }); + } + } } - // if (isExist) { - // setError('currentPw', { message: '비밀번호가 올바르지 않습니다.' }); - // } - // } - // } catch (err) { - // console.error(err); - // } }; return (
Date: Fri, 12 Jan 2024 01:17:00 +0900 Subject: [PATCH 03/21] =?UTF-8?q?Refactor:=20=EB=82=98=EC=9D=98=20?= =?UTF-8?q?=EB=A6=AC=EB=B7=B0=20=EA=B2=BD=EB=A1=9C=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Mypage/MypageList.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Mypage/MypageList.tsx b/src/components/Mypage/MypageList.tsx index 1854aefd..7266264e 100644 --- a/src/components/Mypage/MypageList.tsx +++ b/src/components/Mypage/MypageList.tsx @@ -5,7 +5,7 @@ const MypageList = () => {
나의 여정 나의 관심 여행지 - 나의 리뷰 + 나의 리뷰 나의 여행 취향 설정
); From 10f55f3a86c503f95ab7267287f328a09b32b3df Mon Sep 17 00:00:00 2001 From: jisu Seo Date: Fri, 12 Jan 2024 03:57:16 +0900 Subject: [PATCH 04/21] =?UTF-8?q?Feat:=20=EC=B9=B4=EC=B9=B4=EC=98=A4=20?= =?UTF-8?q?=EB=A1=9C=EA=B7=B8=EC=9D=B8=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/@types/member.types.ts | 18 ++++---- .../Login/AuthButtons/KakaoLoginButton.tsx | 7 +-- src/components/Auth/Login/KakaoLogin.tsx | 44 +++++++++++++++++++ src/components/Auth/Login/index.ts | 3 +- src/pages/login/loginKakao.page.tsx | 15 +------ src/pages/signup/signupInfo.page.tsx | 8 +++- 6 files changed, 65 insertions(+), 30 deletions(-) create mode 100644 src/components/Auth/Login/KakaoLogin.tsx diff --git a/src/@types/member.types.ts b/src/@types/member.types.ts index bdb4b699..a7ef7fd7 100644 --- a/src/@types/member.types.ts +++ b/src/@types/member.types.ts @@ -14,15 +14,15 @@ interface MemberInfo { nickname: string; email: string; profileImageUrl: string | null; - ageType: - | 'TEENAGER' - | 'TWENTIES' - | 'THIRTIES' - | 'FOURTIES' - | 'ABOVE_FIFTIES' - | 'DEFATULT' - | null; - genderType: 'MALE' | 'FEMALE' | 'NON_BINARY' | null; + ageType: string | null; + // | 'TEENAGER' + // | 'TWENTIES' + // | 'THIRTIES' + // | 'FOURTIES' + // | 'ABOVE_FIFTIES' + // | 'DEFATULT' + genderType: string | null; + // 'MALE' | 'FEMALE' | 'NON_BINARY' | 'DEFATULT'; survey: Survey | null; } diff --git a/src/components/Auth/Login/AuthButtons/KakaoLoginButton.tsx b/src/components/Auth/Login/AuthButtons/KakaoLoginButton.tsx index 1829eedb..c5227cc7 100644 --- a/src/components/Auth/Login/AuthButtons/KakaoLoginButton.tsx +++ b/src/components/Auth/Login/AuthButtons/KakaoLoginButton.tsx @@ -1,15 +1,10 @@ import { KakaoIcon } from '@components/common/icons/Icons'; const KakaoLoginButton = () => { - // const VITE_KAKAO_LOGIN_TEST_API_KEY = import.meta.env - // .VITE_KAKAO_LOGIN_TEST_API_KEY; - // const REDIRECT_URI = `${window.location.href}/kakao`; - // const KAKAO_LOGIN_URL = `https://kauth.kakao.com/oauth/authorize?client_id=${VITE_KAKAO_LOGIN_TEST_API_KEY}&redirect_uri=${REDIRECT_URI}&response_type=code`; - return (
카카오로 로그인 diff --git a/src/components/Auth/Login/KakaoLogin.tsx b/src/components/Auth/Login/KakaoLogin.tsx new file mode 100644 index 00000000..541ce440 --- /dev/null +++ b/src/components/Auth/Login/KakaoLogin.tsx @@ -0,0 +1,44 @@ +import { UserInfoState } from '@recoil/Auth.atom'; +import { setItem } from '@utils/localStorageFun'; +import { useEffect } from 'react'; +import { useNavigate, useSearchParams } from 'react-router-dom'; +import { useSetRecoilState } from 'recoil'; + +const KakaoLogin = () => { + const setUserInfo = useSetRecoilState(UserInfoState); + const navigate = useNavigate(); + + const [searchParams, _] = useSearchParams(); + const nickname = searchParams.get('nickname'); + const email = searchParams.get('email'); + const gender = searchParams.get('gender'); + const age_range = searchParams.get('age_range'); + const accessToken = searchParams.get('token'); + const profile_image = searchParams.get('profile_image'); + const signup = searchParams.get('signup'); + + useEffect(() => { + if (accessToken) { + setItem('accessToken', accessToken); + setUserInfo({ + nickname: nickname!, + email: email!, + profileImageUrl: profile_image, + ageType: age_range, + genderType: gender, + survey: null, + }); + if (signup) { + navigate('/signup/success'); + } else { + navigate('/'); + } + } else { + alert('로그인에 실패했습니다. 다시 시도해주세요.'); + navigate('/login'); + } + }, []); + return <>카카오 로그인 중입니다.; +}; + +export default KakaoLogin; diff --git a/src/components/Auth/Login/index.ts b/src/components/Auth/Login/index.ts index 424a52d4..33ef9f5a 100644 --- a/src/components/Auth/Login/index.ts +++ b/src/components/Auth/Login/index.ts @@ -1,5 +1,6 @@ import LoginLogo from './LoginLogo'; import LoginForm from './LoginForm'; import AuthButtonsWrapper from './AuthButtons/AuthButtonsWrapper'; +import KakaoLogin from './KakaoLogin'; -export { LoginLogo, LoginForm, AuthButtonsWrapper }; +export { LoginLogo, LoginForm, AuthButtonsWrapper, KakaoLogin }; diff --git a/src/pages/login/loginKakao.page.tsx b/src/pages/login/loginKakao.page.tsx index 3d8ee18a..a3f10231 100644 --- a/src/pages/login/loginKakao.page.tsx +++ b/src/pages/login/loginKakao.page.tsx @@ -1,18 +1,7 @@ -import { useEffect } from 'react'; +import { KakaoLogin } from '@components/Auth/Login'; const LoginKakao = () => { - const code = new URL(window.location.href).searchParams.get('code'); - - useEffect(() => { - console.log(code); - try { - // const res = postKakaoLogin(); - } catch (err) { - console.log('카카오 로그인 중 에러 발생'); - } - }, []); - - return
잠시만 기다려주세요
; + return ; }; export default LoginKakao; diff --git a/src/pages/signup/signupInfo.page.tsx b/src/pages/signup/signupInfo.page.tsx index cf5e2c16..7438e5a7 100644 --- a/src/pages/signup/signupInfo.page.tsx +++ b/src/pages/signup/signupInfo.page.tsx @@ -77,7 +77,13 @@ const SignupInfo = () => { return (
- + { + navigate('/'); + }} + /> From eddf8d1d6f762b69a805552469a5a75139f3a967 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EC=96=B4=EC=8A=B9=EC=A4=80?= Date: Fri, 12 Jan 2024 04:14:26 +0900 Subject: [PATCH 05/21] =?UTF-8?q?Feat:=20=EB=A6=AC=EB=B7=B0/=EB=8C=93?= =?UTF-8?q?=EA=B8=80=20=EB=93=B1=EB=A1=9D=20=EB=B9=84=ED=9A=8C=EC=9B=90=20?= =?UTF-8?q?alert?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../DetailSectionBottom/DetailReviews.tsx | 13 +++++- .../DetailSectionTop/DetailToursButtons.tsx | 43 ++++++++----------- src/components/Review/MyReview.tsx | 5 ++- src/components/Review/ReviewComments.tsx | 14 +++++- .../common/modal/children/EditDelete.tsx | 4 +- .../common/modal/children/MyAlert.tsx | 22 +++++++--- src/components/common/nav/InputComment.tsx | 28 +++++++++--- src/recoil/modal.ts | 5 +++ 8 files changed, 90 insertions(+), 44 deletions(-) diff --git a/src/components/DetailSectionBottom/DetailReviews.tsx b/src/components/DetailSectionBottom/DetailReviews.tsx index 7eddf34e..fe0e7e83 100644 --- a/src/components/DetailSectionBottom/DetailReviews.tsx +++ b/src/components/DetailSectionBottom/DetailReviews.tsx @@ -25,6 +25,8 @@ import ReviewItem from './ReviewItem'; import ToastPopUp from '@components/common/toastpopup/ToastPopUp'; import EditDelete from '@components/common/modal/children/EditDelete'; import MyAlert from '@components/common/modal/children/MyAlert'; +import { alertTypeState } from '@recoil/modal'; + interface reviewProps { reviewData: any; } @@ -45,6 +47,7 @@ export default function DetailReviews({ reviewData }: reviewProps) { const setIsModifyingReview = useSetRecoilState(isModifyingReviewState); const [toastPopUp, setToastPopUp] = useRecoilState(toastPopUpState); const modalChildren = useRecoilValue(modalChildrenState); + const alertType = useRecoilValue(alertTypeState); const { data: toursReviews, @@ -129,7 +132,7 @@ export default function DetailReviews({ reviewData }: reviewProps) {
{reviewDataLength == 0 && (
{Array.from({ length: 5 }, (_, index) => ( @@ -179,9 +182,15 @@ export default function DetailReviews({ reviewData }: reviewProps) { {modalChildren === 'EditDelete' && } - {modalChildren === 'MyAlert' && ( + {modalChildren === 'MyAlert' && alertType === 'DeleteReview' && ( )} + {modalChildren === 'MyAlert' && alertType === 'LoginReview' && ( + + )} ); diff --git a/src/components/DetailSectionTop/DetailToursButtons.tsx b/src/components/DetailSectionTop/DetailToursButtons.tsx index 8947bb35..086a6eff 100644 --- a/src/components/DetailSectionTop/DetailToursButtons.tsx +++ b/src/components/DetailSectionTop/DetailToursButtons.tsx @@ -1,11 +1,14 @@ import DetailAddSchedule from '@components/DetailSectionTop/DetailAddSchedule'; import { PenIcon } from '@components/common/icons/Icons'; -import { Modal } from '@components/common/modal'; -import MyAlert from '@components/common/modal/children/MyAlert'; -import { isModalOpenState, modalChildrenState } from '@recoil/modal'; +import { + isModalOpenState, + modalChildrenState, + alertTypeState, +} from '@recoil/modal'; import { isModifyingReviewState } from '@recoil/review'; import { useNavigate, useParams } from 'react-router-dom'; -import { useRecoilState, useSetRecoilState } from 'recoil'; +import { useSetRecoilState } from 'recoil'; +import { getItem } from '@utils/localStorageFun'; interface reviewProps { reviewData: any; @@ -17,45 +20,35 @@ export default function DetailTourButtons({ reviewData }: reviewProps) { const tourItemId = Number(params.id); const navigate = useNavigate(); const setIsModifyingReview = useSetRecoilState(isModifyingReviewState); - const [isModalOpen, setIsModalOpen] = useRecoilState(isModalOpenState); - const [modalChildren, setModalChildren] = useRecoilState(modalChildrenState); + const setIsModalOpen = useSetRecoilState(isModalOpenState); + const setModalChildren = useSetRecoilState(modalChildrenState); + const setAlertType = useSetRecoilState(alertTypeState); const handlePostingReivew = () => { - const accessToken = localStorage.getItem('accessToken'); - if (accessToken) { + const token = getItem('accessToken'); + if (token) { navigate(`/reviewPosting/${tourItemId}`, { state: { title, contentTypeId }, }); } else { + setModalChildren('MyAlert'); + setAlertType('LoginReview'); setIsModifyingReview(false); - setModalChildren('EditDelete'); setIsModalOpen(true); } }; - const closeModal = () => { - setIsModalOpen(false); - }; - return ( <>
-
- - {modalChildren === 'MyAlert' && ( - - )} - ); } diff --git a/src/components/Review/MyReview.tsx b/src/components/Review/MyReview.tsx index c6cca236..08ddf50c 100644 --- a/src/components/Review/MyReview.tsx +++ b/src/components/Review/MyReview.tsx @@ -19,6 +19,7 @@ import ReviewItem from '@components/DetailSectionBottom/ReviewItem'; import ToastPopUp from '@components/common/toastpopup/ToastPopUp'; import EditDelete from '@components/common/modal/children/EditDelete'; import MyAlert from '@components/common/modal/children/MyAlert'; +import { alertTypeState } from '@recoil/modal'; export default function MyReview() { const [reviewDataLength, setReviewDataLength] = useState(0); @@ -31,6 +32,8 @@ export default function MyReview() { const setIsModifyingReview = useSetRecoilState(isModifyingReviewState); const [toastPopUp, setToastPopUp] = useRecoilState(toastPopUpState); const modalChildren = useRecoilValue(modalChildrenState); + const [alertType] = useRecoilValue(alertTypeState); + const { data: myReviews, fetchNextPage, @@ -148,7 +151,7 @@ export default function MyReview() { {modalChildren === 'EditDelete' && } - {modalChildren === 'MyAlert' && ( + {modalChildren === 'MyAlert' && alertType === 'DeleteReview' && ( )} diff --git a/src/components/Review/ReviewComments.tsx b/src/components/Review/ReviewComments.tsx index fbdc53ae..03ccadd7 100644 --- a/src/components/Review/ReviewComments.tsx +++ b/src/components/Review/ReviewComments.tsx @@ -11,6 +11,7 @@ import InfiniteScroll from 'react-infinite-scroller'; import EditDelete from '@components/common/modal/children/EditDelete'; import MyAlert from '@components/common/modal/children/MyAlert'; import { commentState } from '@recoil/review'; +import { alertTypeState } from '@recoil/modal'; export default function ReviewComments() { const params = useParams(); @@ -21,6 +22,7 @@ export default function ReviewComments() { const [commentDataLength, setCommentDataLength] = useState(0); const modalChildren = useRecoilValue(modalChildrenState); const setComment = useSetRecoilState(commentState); + const alertType = useRecoilValue(alertTypeState); const { data: reviewComments, @@ -46,9 +48,10 @@ export default function ReviewComments() { } const closeModal = () => { - setIsModalOpen(false); setComment(''); + setIsModalOpen(false); }; + useEffect(() => { { reviewComments?.pages.map((group) => { @@ -57,6 +60,7 @@ export default function ReviewComments() { } console.log('reviewComments', reviewComments); }, [reviewComments]); + return ( <>
@@ -104,9 +108,15 @@ export default function ReviewComments() {
{modalChildren === 'EditDelete' && } - {modalChildren === 'MyAlert' && ( + {modalChildren === 'MyAlert' && alertType === 'DeleteReview' && ( )} + {modalChildren === 'MyAlert' && alertType === 'LoginComment' && ( + + )} ); diff --git a/src/components/common/modal/children/EditDelete.tsx b/src/components/common/modal/children/EditDelete.tsx index 84754048..28908345 100644 --- a/src/components/common/modal/children/EditDelete.tsx +++ b/src/components/common/modal/children/EditDelete.tsx @@ -4,6 +4,7 @@ import { isModalOpenState, titleState, modalChildrenState, + alertTypeState, } from '@recoil/modal'; import { contentState, @@ -37,7 +38,7 @@ const EditDelete: React.FC = () => { const setIsModalOpen = useSetRecoilState(isModalOpenState); const setModalChildren = useSetRecoilState(modalChildrenState); const setComment = useSetRecoilState(commentState); - + const setAlertType = useSetRecoilState(alertTypeState); const queryClient = useQueryClient(); const handleEdit = () => { @@ -71,6 +72,7 @@ const EditDelete: React.FC = () => { const handleDelete = async () => { if (title === '내 리뷰') { setModalChildren('MyAlert'); + setAlertType('DeleteReview'); } else if (title === '내 댓글') { await deleteCommentMutate(targetCommentId); setIsModalOpen(false); diff --git a/src/components/common/modal/children/MyAlert.tsx b/src/components/common/modal/children/MyAlert.tsx index 4257612a..e5f50f7e 100644 --- a/src/components/common/modal/children/MyAlert.tsx +++ b/src/components/common/modal/children/MyAlert.tsx @@ -5,6 +5,7 @@ import { toastPopUpState, targetReviewIdState, tourItemIdState, + commentState, } from '@recoil/review'; import { useNavigate } from 'react-router-dom'; import { useRecoilValue, useSetRecoilState } from 'recoil'; @@ -21,6 +22,7 @@ const MyAlert: React.FC = ({ title, content }) => { const setIsModalOpen = useSetRecoilState(isModalOpenState); const setToastPopUp = useSetRecoilState(toastPopUpState); const queryClient = useQueryClient(); + const setComment = useSetRecoilState(commentState); const { mutate: deleteReviewMutate } = useMutation({ mutationFn: (targetReviewId: number) => deleteReview(targetReviewId), @@ -52,23 +54,29 @@ const MyAlert: React.FC = ({ title, content }) => { } } } else if (title == '로그인') { + setComment(''); setIsModalOpen(false); navigate(`/login`); } }; + const closeModal = () => { + setComment(''); + setIsModalOpen(false); + }; + return (
{title}
-
- {content} +
+ {content.split('. ').map((sentence, index) => ( +
+ {sentence} +
+ ))}
- { - setIsModalOpen(false); - }} - className="text-sm"> + 취소 diff --git a/src/components/common/nav/InputComment.tsx b/src/components/common/nav/InputComment.tsx index 76fbba1f..eb21cbf6 100644 --- a/src/components/common/nav/InputComment.tsx +++ b/src/components/common/nav/InputComment.tsx @@ -2,10 +2,16 @@ import { KeyboardEvent, ChangeEvent } from 'react'; import { postComments } from '@api/comments'; import { useParams } from 'react-router-dom'; import { commentState } from '@recoil/review'; -import { useRecoilState, useRecoilValue } from 'recoil'; +import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'; import { putComments } from '@api/comments'; import { isModifyingCommentState, targetCommentIdState } from '@recoil/review'; import { useMutation, useQueryClient } from '@tanstack/react-query'; +import { getItem } from '@utils/localStorageFun'; +import { + isModalOpenState, + modalChildrenState, + alertTypeState, +} from '@recoil/modal'; interface InputCommentProps { classNameName?: string; @@ -30,6 +36,9 @@ export const InputComment: React.FC = () => { ); const targetCommentId = useRecoilValue(targetCommentIdState); const queryClient = useQueryClient(); + const setIsModalOpen = useSetRecoilState(isModalOpenState); + const setModalChildren = useSetRecoilState(modalChildrenState); + const setAlertType = useSetRecoilState(alertTypeState); const { mutate: postReviewMutate } = useMutation({ mutationFn: ({ comment, reviewId }: PostCommentMutationParams) => @@ -64,13 +73,20 @@ export const InputComment: React.FC = () => { }; const handleSubmit = async () => { - if (isModifyingComment) { - await editReviewMutate({ comment, targetCommentId }); - setIsModifyingComment(false); + const token = getItem('accessToken'); + if (token) { + if (isModifyingComment) { + await editReviewMutate({ comment, targetCommentId }); + setIsModifyingComment(false); + } else { + await postReviewMutate({ comment, reviewId }); + } + setComment(''); } else { - await postReviewMutate({ comment, reviewId }); + setModalChildren('MyAlert'); + setAlertType('LoginComment'); + setIsModalOpen(true); } - setComment(''); }; const handleKeyPress = (event: KeyboardEvent) => { if (event.key === 'Enter') { diff --git a/src/recoil/modal.ts b/src/recoil/modal.ts index eecef4b1..a687f33b 100644 --- a/src/recoil/modal.ts +++ b/src/recoil/modal.ts @@ -14,3 +14,8 @@ export const modalChildrenState = atom({ key: 'modalChildrenState', default: '', }); + +export const alertTypeState = atom({ + key: 'alertTypeState', + default: '', +}); From 66c49c2aa44a1e37ce4ee7fa742340fd3774aeab Mon Sep 17 00:00:00 2001 From: jisu Seo Date: Fri, 12 Jan 2024 04:18:31 +0900 Subject: [PATCH 06/21] =?UTF-8?q?Fix:=20=EB=AC=B4=ED=95=9C=20=EB=A1=9C?= =?UTF-8?q?=EA=B7=B8=EC=95=84=EC=9B=83=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/authClient.ts | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/src/api/authClient.ts b/src/api/authClient.ts index 16f298a8..82b54e3c 100644 --- a/src/api/authClient.ts +++ b/src/api/authClient.ts @@ -1,6 +1,8 @@ import { getItem, removeItem, setItem } from '@utils/localStorageFun'; import axios from 'axios'; import { postLogout } from './auth'; +import { useSetRecoilState } from 'recoil'; +import { UserInfoState } from '@recoil/Auth.atom'; const authClient = axios.create({ baseURL: `${import.meta.env.VITE_SERVER_URL}api/`, @@ -44,10 +46,10 @@ authClient.interceptors.response.use( // 2. 리프레시 토큰이 만료된 경우(리프레시 토큰이 존재하지 않습니다.) // 3. 리프레시 토큰이 없는 경우 // 전부 비로그인으로 처리합니다. - // TODO 서지수 | 로그아웃 요청 console.log('401에러 발생 로그인 페이지로 이동시키면 됩니다.'); - postLogout(); - removeItem('accessToken'); + if (getItem('accessToken')) { + removeItem('accessToken'); + } } return Promise.reject(error); }, From e2bd8e9fdebbcd0fe083738062934333bbef00f3 Mon Sep 17 00:00:00 2001 From: jisu Seo Date: Fri, 12 Jan 2024 04:24:06 +0900 Subject: [PATCH 07/21] =?UTF-8?q?Fix:=20=EB=B9=8C=EB=93=9C=EB=AC=B8?= =?UTF-8?q?=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 --- src/api/authClient.ts | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/api/authClient.ts b/src/api/authClient.ts index 82b54e3c..132102e2 100644 --- a/src/api/authClient.ts +++ b/src/api/authClient.ts @@ -1,8 +1,5 @@ import { getItem, removeItem, setItem } from '@utils/localStorageFun'; import axios from 'axios'; -import { postLogout } from './auth'; -import { useSetRecoilState } from 'recoil'; -import { UserInfoState } from '@recoil/Auth.atom'; const authClient = axios.create({ baseURL: `${import.meta.env.VITE_SERVER_URL}api/`, From f4b510dd265d43e1c7b84844f9f4b89dcf551062 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EC=96=B4=EC=8A=B9=EC=A4=80?= Date: Fri, 12 Jan 2024 04:49:02 +0900 Subject: [PATCH 08/21] =?UTF-8?q?Feat:=20=EB=82=98=EC=9D=98=20=EB=A6=AC?= =?UTF-8?q?=EB=B7=B0=200=EA=B0=9C=20=EC=9D=BC=EB=95=8C=20=EB=94=94?= =?UTF-8?q?=EC=9E=90=EC=9D=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/DetailSectionBottom/ReviewItem.tsx | 2 +- .../DetailSectionTop/DetailAddSchedule.tsx | 2 +- .../DetailSectionTop/DetailToursButtons.tsx | 2 +- src/components/Mypage/MypageList.tsx | 2 +- src/components/Review/MyReview.tsx | 14 +++++++++++--- 5 files changed, 15 insertions(+), 7 deletions(-) diff --git a/src/components/DetailSectionBottom/ReviewItem.tsx b/src/components/DetailSectionBottom/ReviewItem.tsx index a8c61a7d..eac39511 100644 --- a/src/components/DetailSectionBottom/ReviewItem.tsx +++ b/src/components/DetailSectionBottom/ReviewItem.tsx @@ -161,7 +161,7 @@ const Item: React.FC = (props: ItemProps) => {
{content}
)} -
+
{!showMoreKeywords && keywords.slice(0, 2).map((keyword, idx) => ( diff --git a/src/components/DetailSectionTop/DetailAddSchedule.tsx b/src/components/DetailSectionTop/DetailAddSchedule.tsx index 136f5ad0..0e3f76ff 100644 --- a/src/components/DetailSectionTop/DetailAddSchedule.tsx +++ b/src/components/DetailSectionTop/DetailAddSchedule.tsx @@ -15,7 +15,7 @@ const DetailAddSchedule = () => { diff --git a/src/components/DetailSectionTop/DetailToursButtons.tsx b/src/components/DetailSectionTop/DetailToursButtons.tsx index 086a6eff..13025a25 100644 --- a/src/components/DetailSectionTop/DetailToursButtons.tsx +++ b/src/components/DetailSectionTop/DetailToursButtons.tsx @@ -46,7 +46,7 @@ export default function DetailTourButtons({ reviewData }: reviewProps) { onClick={handlePostingReivew} className="flex h-[53px] w-1/2 items-center justify-center gap-2 rounded-lg border border-solid border-gray3 p-2"> - 리뷰 쓰기 + 리뷰 쓰기
diff --git a/src/components/Mypage/MypageList.tsx b/src/components/Mypage/MypageList.tsx index 4d073479..266dad60 100644 --- a/src/components/Mypage/MypageList.tsx +++ b/src/components/Mypage/MypageList.tsx @@ -5,7 +5,7 @@ const MypageList = () => {
나의 여정 나의 관심 여행지 - 나의 리뷰 + 나의 리뷰 나의 여행 취향 설정
); diff --git a/src/components/Review/MyReview.tsx b/src/components/Review/MyReview.tsx index 08ddf50c..1db45243 100644 --- a/src/components/Review/MyReview.tsx +++ b/src/components/Review/MyReview.tsx @@ -20,6 +20,7 @@ import ToastPopUp from '@components/common/toastpopup/ToastPopUp'; import EditDelete from '@components/common/modal/children/EditDelete'; import MyAlert from '@components/common/modal/children/MyAlert'; import { alertTypeState } from '@recoil/modal'; +import { PenIcon } from '@components/common/icons/Icons'; export default function MyReview() { const [reviewDataLength, setReviewDataLength] = useState(0); @@ -106,9 +107,16 @@ export default function MyReview() { 나의 리뷰{reviewDataLength}
{reviewDataLength == 0 && ( -
-
작성한 리뷰가 없습니다
-
다녀온 여행지의 리뷰를 남겨보세요!
+
+
+ +
+
+ 작성한 리뷰가 없습니다 +
+
+ 다녀온 여행지의 리뷰를 남겨보세요! +
)} Date: Fri, 12 Jan 2024 04:52:34 +0900 Subject: [PATCH 09/21] =?UTF-8?q?Refactor:=20=EB=B9=84=EB=B0=80=EB=B2=88?= =?UTF-8?q?=ED=98=B8=20=ED=8B=80=EB=A0=B8=EC=9D=84=20=EA=B2=BD=EC=9A=B0=20?= =?UTF-8?q?=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Mypage/EditPassword/EditPwForm.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/Mypage/EditPassword/EditPwForm.tsx b/src/components/Mypage/EditPassword/EditPwForm.tsx index eb83a914..75d3c58f 100644 --- a/src/components/Mypage/EditPassword/EditPwForm.tsx +++ b/src/components/Mypage/EditPassword/EditPwForm.tsx @@ -42,6 +42,7 @@ const EditPwForm = () => { console.error('비밀번호 수정 요청 중 에러 발생', err); if (err instanceof AxiosError) { if (err.response?.data.status === 404) { + resetField('currentPw'); setError('currentPw', { message: '비밀번호가 올바르지 않습니다.' }); } } From 2f3cf40f2a696b5fb512f7ea39c494ed20e99c48 Mon Sep 17 00:00:00 2001 From: jisu Seo Date: Fri, 12 Jan 2024 05:02:30 +0900 Subject: [PATCH 10/21] =?UTF-8?q?Refactor:=20=EB=92=A4=EB=A1=9C=20?= =?UTF-8?q?=EA=B0=80=EA=B8=B0=20=EA=B2=BD=EB=A1=9C=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/BackBox/BackBox.tsx | 8 +++----- src/pages/mypage/editPassword.page.tsx | 10 +++++++++- src/pages/mypage/editUserInfo.page.tsx | 11 +++++++++-- src/pages/mypage/editUserSurvey.page.tsx | 11 ++++++++++- src/pages/signup/signup.page.tsx | 6 +++++- src/pages/signup/signupInfo.page.tsx | 3 +++ 6 files changed, 39 insertions(+), 10 deletions(-) diff --git a/src/components/common/BackBox/BackBox.tsx b/src/components/common/BackBox/BackBox.tsx index d440deb9..16238ef0 100644 --- a/src/components/common/BackBox/BackBox.tsx +++ b/src/components/common/BackBox/BackBox.tsx @@ -4,7 +4,7 @@ import { ReactNode } from 'react'; interface Props { showBack?: boolean; - // backHandler?: VoidFunction; + backHandler?: VoidFunction; children?: ReactNode; showSkip?: boolean; skipHandler?: VoidFunction; @@ -14,17 +14,15 @@ interface Props { const BackBox = ({ showBack, - // backHandler, + backHandler, children, showSkip, skipHandler, showSave, saveHandler, }: Props) => { - const navigate = useNavigate(); - const onBackClick = () => { - navigate(-1); + backHandler && backHandler(); }; const onSkipClick = () => { skipHandler && skipHandler(); diff --git a/src/pages/mypage/editPassword.page.tsx b/src/pages/mypage/editPassword.page.tsx index bc5e73e8..a15f89e6 100644 --- a/src/pages/mypage/editPassword.page.tsx +++ b/src/pages/mypage/editPassword.page.tsx @@ -1,10 +1,18 @@ import EditPwForm from '@components/Mypage/EditPassword/EditPwForm'; import { BackBox } from '@components/common'; +import { useNavigate } from 'react-router-dom'; const EditPassword = () => { + const navigate = useNavigate(); return ( <> - 비밀번호 변경 + { + navigate('/mypage'); + }}> + 비밀번호 변경 + ); diff --git a/src/pages/mypage/editUserInfo.page.tsx b/src/pages/mypage/editUserInfo.page.tsx index 79bf4dfe..eec6457b 100644 --- a/src/pages/mypage/editUserInfo.page.tsx +++ b/src/pages/mypage/editUserInfo.page.tsx @@ -1,11 +1,18 @@ import DeleteMemberButton from '@components/Mypage/DeleteMemberButton'; import { BackBox } from '@components/common'; -import { Link } from 'react-router-dom'; +import { Link, useNavigate } from 'react-router-dom'; const EditUserInfo = () => { + const navigate = useNavigate(); return ( <> - {}}> + { + navigate('/mypage'); + }} + showSave + saveHandler={() => {}}> 회원정보 수정
diff --git a/src/pages/mypage/editUserSurvey.page.tsx b/src/pages/mypage/editUserSurvey.page.tsx index f6551e50..2ec9c382 100644 --- a/src/pages/mypage/editUserSurvey.page.tsx +++ b/src/pages/mypage/editUserSurvey.page.tsx @@ -1,10 +1,19 @@ import AuthSurvey from '@components/Auth/AuthSurvey/AuthSurvey'; import { BackBox } from '@components/common'; +import { useNavigate } from 'react-router-dom'; const EditUserSurvey = () => { + const navigate = useNavigate(); + return ( <> - 나의 여행 취향 설정 + { + navigate('/mypage'); + }}> + 나의 여행 취향 설정 +
diff --git a/src/pages/signup/signup.page.tsx b/src/pages/signup/signup.page.tsx index b24f7d6b..b3624c57 100644 --- a/src/pages/signup/signup.page.tsx +++ b/src/pages/signup/signup.page.tsx @@ -48,7 +48,11 @@ const Signup = () => { return (
- + { + navigate('/login'); + }} + /> diff --git a/src/pages/signup/signupInfo.page.tsx b/src/pages/signup/signupInfo.page.tsx index 7438e5a7..de51184d 100644 --- a/src/pages/signup/signupInfo.page.tsx +++ b/src/pages/signup/signupInfo.page.tsx @@ -79,6 +79,9 @@ const SignupInfo = () => {
{ + navigate('/signup/survey'); + }} showSkip skipHandler={() => { navigate('/'); From 17f0dc2c22c91167916447e21a1c8a3048a8caf7 Mon Sep 17 00:00:00 2001 From: jisu Seo Date: Fri, 12 Jan 2024 05:15:51 +0900 Subject: [PATCH 11/21] =?UTF-8?q?Refactor:=20=EB=A1=9C=EA=B7=B8=EC=9D=B8?= =?UTF-8?q?=20=EB=92=A4=EB=A1=9C=EA=B0=80=EA=B8=B0=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/login/login.page.tsx | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/src/pages/login/login.page.tsx b/src/pages/login/login.page.tsx index 98ffc729..2e4a1ed9 100644 --- a/src/pages/login/login.page.tsx +++ b/src/pages/login/login.page.tsx @@ -4,12 +4,19 @@ import { LoginForm, LoginLogo, } from '@components/Auth/Login'; +import { useNavigate } from 'react-router-dom'; const Login = () => { + const navigate = useNavigate(); return (
- + { + navigate(-1); + }} + />
From 6dbb7f628d2da0f89d556885a0fa16c918a3d6eb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EC=96=B4=EC=8A=B9=EC=A4=80?= Date: Fri, 12 Jan 2024 05:28:12 +0900 Subject: [PATCH 12/21] =?UTF-8?q?Fix:=20=EB=A6=AC=EB=B7=B0/=EB=8C=93?= =?UTF-8?q?=EA=B8=80=20=EB=94=94=EC=9E=90=EC=9D=B8=20=EA=B0=9C=EC=84=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../DetailSectionBottom/ReviewItem.tsx | 159 +++++++++--------- src/components/Review/CommentItem.tsx | 10 +- src/components/Review/DetailReview.tsx | 30 ++-- src/components/Review/ReviewComments.tsx | 4 +- 4 files changed, 101 insertions(+), 102 deletions(-) diff --git a/src/components/DetailSectionBottom/ReviewItem.tsx b/src/components/DetailSectionBottom/ReviewItem.tsx index eac39511..4bc2caec 100644 --- a/src/components/DetailSectionBottom/ReviewItem.tsx +++ b/src/components/DetailSectionBottom/ReviewItem.tsx @@ -111,25 +111,25 @@ const Item: React.FC = (props: ItemProps) => { }; return ( - <> -
-
-
- {!( - authorProfileImageUrl === 'http://asiduheimage.jpg' || - authorProfileImageUrl === null - ) ? ( - 유저 프로필 - ) : ( - - )} -
-
-
{authorNickname}
+
+
+
+ {!( + authorProfileImageUrl === 'http://asiduheimage.jpg' || + authorProfileImageUrl === null + ) ? ( + 유저 프로필 + ) : ( + + )} +
+
+
{authorNickname}
+
{Array.from({ length: 5 }, (_, index) => ( = (props: ItemProps) => { /> ))}
+
+ {formatCreatedTime(createdTime)} +
-
- {formatCreatedTime(createdTime)} +
+ + {isAuthor && ( +
openModal('내 리뷰', reviewId, e)}> +
- {isAuthor && ( + )} +
+ {canTextOverflow ? ( +
+ {content.length > 55 ? `${content.slice(0, 55)}...` : content} +
+ ) : ( +
{content}
+ )} + +
+
+ {!showMoreKeywords && + keywords.slice(0, 2).map((keyword, idx) => ( +
+ {getEmoji(keyword.content)} {keyword.content} +
+ ))} + {keywords.length > 2 && !showMoreKeywords && (
openModal('내 리뷰', reviewId, e)}> - + className="rounded-md bg-gray1 px-2 py-1 text-xs text-gray6" + onClick={(e) => { + handleClickPlusButton(e); + }}> + +{keywords.length - 2}
)}
- {canTextOverflow ? ( -
- {content.length > 75 ? `${content.slice(0, 75)}...` : content} -
- ) : ( -
{content}
- )} - -
-
- {!showMoreKeywords && - keywords.slice(0, 2).map((keyword, idx) => ( +
+ {showMoreKeywords && + Array.from({ length: Math.ceil(keywords.length / 2) }).map( + (_, lineIdx) => (
- {getEmoji(keyword.content)} {keyword.content} + key={lineIdx} + className={`flex gap-2 ${ + lineIdx === Math.ceil(keywords.length / 2) - 1 + ? '' + : ' mb-3' + }`}> + {keywords + .slice(lineIdx * 2, lineIdx * 2 + 2) + .map((keyword, idx) => ( +
+ {getEmoji(keyword.content)} {keyword.content} +
+ ))}
- ))} - {keywords.length > 2 && !showMoreKeywords && ( -
{ - handleClickPlusButton(e); - }}> - +{keywords.length - 2} -
+ ), )} -
-
- {showMoreKeywords && - Array.from({ length: Math.ceil(keywords.length / 2) }).map( - (_, lineIdx) => ( -
- {keywords - .slice(lineIdx * 2, lineIdx * 2 + 2) - .map((keyword, idx) => ( -
- {getEmoji(keyword.content)} {keyword.content} -
- ))} -
- ), - )} -
+
-
- -
{commentCount}
-
+
+ +
{commentCount}
- +
); }; diff --git a/src/components/Review/CommentItem.tsx b/src/components/Review/CommentItem.tsx index 7305ed3f..c4e4d264 100644 --- a/src/components/Review/CommentItem.tsx +++ b/src/components/Review/CommentItem.tsx @@ -56,7 +56,7 @@ const CommentItem: React.FC = (props: ItemProps) => { return (
-
+
{!( authorProfileImageUrl === 'http://asiduheimage.jpg' || @@ -65,15 +65,15 @@ const CommentItem: React.FC = (props: ItemProps) => { 유저 프로필 ) : ( - + )}
{authorNickname}
-
+
{formatCreatedTime(createdTime)}
@@ -85,7 +85,7 @@ const CommentItem: React.FC = (props: ItemProps) => {
)}
-
{content}
+
{content}
); }; diff --git a/src/components/Review/DetailReview.tsx b/src/components/Review/DetailReview.tsx index 9e1db449..8d5539e7 100644 --- a/src/components/Review/DetailReview.tsx +++ b/src/components/Review/DetailReview.tsx @@ -8,21 +8,19 @@ export default function DetailReview() { const { item, tourItemId } = state; return ( -
- -
+ ); } diff --git a/src/components/Review/ReviewComments.tsx b/src/components/Review/ReviewComments.tsx index 03ccadd7..8cde28ec 100644 --- a/src/components/Review/ReviewComments.tsx +++ b/src/components/Review/ReviewComments.tsx @@ -63,9 +63,9 @@ export default function ReviewComments() { return ( <> -
+
댓글 - {commentDataLength} + {commentDataLength}
{commentDataLength == 0 && ( From 8b4caa2dbdcf985b474c665d02279ec1e11b28cf Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EC=96=B4=EC=8A=B9=EC=A4=80?= Date: Fri, 12 Jan 2024 05:35:02 +0900 Subject: [PATCH 13/21] =?UTF-8?q?Fix:=20=EB=A6=AC=EB=B7=B0/=EB=8C=93?= =?UTF-8?q?=EA=B8=80=20=EB=94=94=EC=9E=90=EC=9D=B8=20=EA=B0=9C=EC=84=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/DetailSectionTop/DetailAddSchedule.tsx | 4 ++-- src/components/DetailSectionTop/DetailToursButtons.tsx | 4 ++-- src/components/common/icons/Icons.tsx | 2 ++ 3 files changed, 6 insertions(+), 4 deletions(-) diff --git a/src/components/DetailSectionTop/DetailAddSchedule.tsx b/src/components/DetailSectionTop/DetailAddSchedule.tsx index 0e3f76ff..d805968c 100644 --- a/src/components/DetailSectionTop/DetailAddSchedule.tsx +++ b/src/components/DetailSectionTop/DetailAddSchedule.tsx @@ -13,8 +13,8 @@ const DetailAddSchedule = () => { return ( - diff --git a/src/components/DetailSectionTop/DetailToursButtons.tsx b/src/components/DetailSectionTop/DetailToursButtons.tsx index 13025a25..85a44d0c 100644 --- a/src/components/DetailSectionTop/DetailToursButtons.tsx +++ b/src/components/DetailSectionTop/DetailToursButtons.tsx @@ -44,8 +44,8 @@ export default function DetailTourButtons({ reviewData }: reviewProps) {
diff --git a/src/components/common/icons/Icons.tsx b/src/components/common/icons/Icons.tsx index 52355fba..18f154b1 100644 --- a/src/components/common/icons/Icons.tsx +++ b/src/components/common/icons/Icons.tsx @@ -268,6 +268,7 @@ export const PenIcon: React.FC = ({ size = 25, color = 'black', fill = 'none', + className, }) => { return ( = ({ height={size} viewBox="0 0 21 21" fill={fill} + className={className} xmlns="http://www.w3.org/2000/svg"> From 1b3bb7ee4f91a8ad3d91898d5b3cf51d9c2720eb Mon Sep 17 00:00:00 2001 From: jisu Seo Date: Fri, 12 Jan 2024 05:49:25 +0900 Subject: [PATCH 14/21] =?UTF-8?q?Refactor:=20=EB=A1=9C=EA=B7=B8=EC=95=84?= =?UTF-8?q?=EC=9B=83=20=ED=99=95=EC=9D=B8=20=EB=A1=9C=EC=A7=81=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Mypage/LogoutButton.tsx | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/src/components/Mypage/LogoutButton.tsx b/src/components/Mypage/LogoutButton.tsx index 2229dcf4..d6e3ecf0 100644 --- a/src/components/Mypage/LogoutButton.tsx +++ b/src/components/Mypage/LogoutButton.tsx @@ -8,14 +8,16 @@ const LogoutButton = () => { const onLogoutClick = async (e: any) => { e.stopPropagation(); - try { - const res = await postLogout(); - if (res.data === 'LOGOUT!') { - setUserInfo(null); - removeItem('accessToken'); + if (confirm('로그아웃 하시겠습니까?')) { + try { + const res = await postLogout(); + if (res.data === 'LOGOUT!') { + setUserInfo(null); + removeItem('accessToken'); + } + } catch (err) { + console.error(err); } - } catch (err) { - console.error(err); } }; From 734f965c49af37843b299b9fa1e96c729048eab7 Mon Sep 17 00:00:00 2001 From: jisu Seo Date: Fri, 12 Jan 2024 05:49:58 +0900 Subject: [PATCH 15/21] =?UTF-8?q?Fix:=20=EB=B9=8C=EB=93=9C=20=EC=98=A4?= =?UTF-8?q?=EB=A5=98=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/BackBox/BackBox.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/common/BackBox/BackBox.tsx b/src/components/common/BackBox/BackBox.tsx index 16238ef0..4f724838 100644 --- a/src/components/common/BackBox/BackBox.tsx +++ b/src/components/common/BackBox/BackBox.tsx @@ -1,4 +1,3 @@ -import { useNavigate } from 'react-router-dom'; import { LeftIcon } from '../icons/Icons'; import { ReactNode } from 'react'; From 7ae650e5a822095a128b29f5f3d593fcb19b88fb Mon Sep 17 00:00:00 2001 From: jisu Seo Date: Fri, 12 Jan 2024 06:09:06 +0900 Subject: [PATCH 16/21] =?UTF-8?q?Feat:=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20?= =?UTF-8?q?=EC=97=AC=EB=B6=80=20=ED=8C=90=EB=8B=A8=20=ED=9B=84=20=EB=A7=88?= =?UTF-8?q?=EC=9D=B4=ED=8E=98=EC=9D=B4=EC=A7=80=20=EC=9D=B4=EB=8F=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Mypage/MypageItem.tsx | 21 +++++++++++++++++---- 1 file changed, 17 insertions(+), 4 deletions(-) diff --git a/src/components/Mypage/MypageItem.tsx b/src/components/Mypage/MypageItem.tsx index d0444b4d..03bced8b 100644 --- a/src/components/Mypage/MypageItem.tsx +++ b/src/components/Mypage/MypageItem.tsx @@ -1,5 +1,6 @@ import { RightIcon } from '@components/common/icons/Icons'; -import { Link } from 'react-router-dom'; +import { getItem } from '@utils/localStorageFun'; +import { useNavigate } from 'react-router-dom'; interface Props { link: string; @@ -7,13 +8,25 @@ interface Props { } const MypageItem = ({ link, children }: Props) => { + const navigate = useNavigate(); + + const onMypageClick = () => { + if (getItem('accessToken')) { + navigate(link); + } else { + if (confirm('로그인이 필요해요. 로그인하시겠어요?')) { + navigate('/login'); + } + } + }; + return ( - {children} - + ); }; From 29af634af0ee9d178593768694936ba895e3e439 Mon Sep 17 00:00:00 2001 From: jisu Seo Date: Fri, 12 Jan 2024 06:09:22 +0900 Subject: [PATCH 17/21] =?UTF-8?q?Style:=20console.log=20=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Auth/AuthSurvey/AuthSurvey.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/Auth/AuthSurvey/AuthSurvey.tsx b/src/components/Auth/AuthSurvey/AuthSurvey.tsx index da9558bb..8ae2db73 100644 --- a/src/components/Auth/AuthSurvey/AuthSurvey.tsx +++ b/src/components/Auth/AuthSurvey/AuthSurvey.tsx @@ -51,7 +51,6 @@ const AuthSurvey = ({ path }: Props) => { alert('오류가 발생했습니다. 다시 시도해주세요'); } }; - console.log(isDirty); return ( From fad30c7d24959a92d7321a979407d0a0f9ded3c9 Mon Sep 17 00:00:00 2001 From: jisu Seo Date: Fri, 12 Jan 2024 11:00:39 +0900 Subject: [PATCH 18/21] =?UTF-8?q?Comment:=20TODO=20=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Auth/Login/LoginForm.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/Auth/Login/LoginForm.tsx b/src/components/Auth/Login/LoginForm.tsx index b1d42caf..db12f7bc 100644 --- a/src/components/Auth/Login/LoginForm.tsx +++ b/src/components/Auth/Login/LoginForm.tsx @@ -38,7 +38,6 @@ const LoginForm = () => { if (res.data.status === 200) { setItem('accessToken', res.data.data.tokenInfo.accessToken); // setUserInfo(res.data.data.memberDto); - // TODO 서지수 | 로그인 후 어디로 갈지 물어보고 수정 navigate('/'); } } catch (err) { From a08debb38030c39554a20f22300377f78dd935d9 Mon Sep 17 00:00:00 2001 From: jisu Seo Date: Fri, 12 Jan 2024 11:01:04 +0900 Subject: [PATCH 19/21] =?UTF-8?q?Refactor:=20=ED=9A=8C=EC=9B=90=EA=B0=80?= =?UTF-8?q?=EC=9E=85=20=ED=9B=84=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20=EC=B2=98?= =?UTF-8?q?=EB=A6=AC=20=EC=95=88=EB=90=98=EB=8A=94=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 --- src/pages/signup/signup.page.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/signup/signup.page.tsx b/src/pages/signup/signup.page.tsx index b3624c57..a91dfafb 100644 --- a/src/pages/signup/signup.page.tsx +++ b/src/pages/signup/signup.page.tsx @@ -9,6 +9,7 @@ import { } from '@components/Auth'; import { BackBox } from '@components/common'; import SubmitBtn from '@components/common/button/SubmitBtn'; +import { setItem } from '@utils/localStorageFun'; import { SubmitHandler, useForm } from 'react-hook-form'; import { useNavigate } from 'react-router-dom'; @@ -37,8 +38,7 @@ const Signup = () => { password, }); if (res.status === 200) { - authClient.defaults.headers.common['Authorization'] = - res.data.data.tokenInfo.accessToken; + setItem('accessToken', res.data.data.tokenInfo.accessToken); navigate('/signup/success'); } } catch (err) { From 2bdb1ca33122eb3697024d3bfdd900f182d1b311 Mon Sep 17 00:00:00 2001 From: jisu Seo Date: Fri, 12 Jan 2024 11:11:17 +0900 Subject: [PATCH 20/21] =?UTF-8?q?Refactor:=20=EB=AA=A8=EB=8B=AC=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Auth/AuthSurvey/AuthSurvey.tsx | 1 - src/components/Mypage/DeleteMemberButton.tsx | 37 ++++++++------ src/components/Mypage/LogoutButton.tsx | 37 +++++++++----- src/components/Mypage/MypageItem.tsx | 48 ++++++++++++++----- 4 files changed, 84 insertions(+), 39 deletions(-) diff --git a/src/components/Auth/AuthSurvey/AuthSurvey.tsx b/src/components/Auth/AuthSurvey/AuthSurvey.tsx index 8ae2db73..94811ff6 100644 --- a/src/components/Auth/AuthSurvey/AuthSurvey.tsx +++ b/src/components/Auth/AuthSurvey/AuthSurvey.tsx @@ -43,7 +43,6 @@ const AuthSurvey = ({ path }: Props) => { // newPrevUserInfo.survey = data; // return newPrevUserInfo; // }); - alert('변경되었습니다.'); navigate(path); } } catch (err) { diff --git a/src/components/Mypage/DeleteMemberButton.tsx b/src/components/Mypage/DeleteMemberButton.tsx index fb359241..8313f23b 100644 --- a/src/components/Mypage/DeleteMemberButton.tsx +++ b/src/components/Mypage/DeleteMemberButton.tsx @@ -1,4 +1,5 @@ import { deleteMember } from '@api/member'; +import Alert from '@components/common/alert/Alert'; import { UserInfoState } from '@recoil/Auth.atom'; import { useNavigate } from 'react-router-dom'; import { useSetRecoilState } from 'recoil'; @@ -6,24 +7,32 @@ import { useSetRecoilState } from 'recoil'; const DeleteMemberButton = () => { const setUserInfo = useSetRecoilState(UserInfoState); const navigate = useNavigate(); - const onDeleteClick = async () => { - if (confirm('정말 탈퇴 하시겠습니까?')) { - try { - const res = await deleteMember(); - if (res.data.status === 200) { - setUserInfo(null); - navigate('/'); - alert('회원 탈퇴되었습니다. 감사합니다.'); - } - } catch (err) { - console.log(err); + + const handleConfirm = async (e: React.MouseEvent) => { + e.stopPropagation(); + try { + const res = await deleteMember(); + if (res.data.status === 200) { + setUserInfo(null); + navigate('/'); + alert('회원 탈퇴되었습니다. 감사합니다.'); } + } catch (err) { + console.log(err); } }; + + const handleCancel = (e: React.MouseEvent) => { + e.stopPropagation(); + }; return ( - + + + ); }; diff --git a/src/components/Mypage/LogoutButton.tsx b/src/components/Mypage/LogoutButton.tsx index d6e3ecf0..4a30c9f4 100644 --- a/src/components/Mypage/LogoutButton.tsx +++ b/src/components/Mypage/LogoutButton.tsx @@ -1,4 +1,5 @@ import { postLogout } from '@api/auth'; +import Alert from '@components/common/alert/Alert'; import { UserInfoState } from '@recoil/Auth.atom'; import { removeItem } from '@utils/localStorageFun'; import { useSetRecoilState } from 'recoil'; @@ -8,23 +9,35 @@ const LogoutButton = () => { const onLogoutClick = async (e: any) => { e.stopPropagation(); - if (confirm('로그아웃 하시겠습니까?')) { - try { - const res = await postLogout(); - if (res.data === 'LOGOUT!') { - setUserInfo(null); - removeItem('accessToken'); - } - } catch (err) { - console.error(err); + }; + + const handleConfirm = async (e: React.MouseEvent) => { + e.stopPropagation(); + try { + const res = await postLogout(); + if (res.data === 'LOGOUT!') { + setUserInfo(null); + removeItem('accessToken'); } + } catch (err) { + console.error(err); } }; + const handleCancel = (e: React.MouseEvent) => { + e.stopPropagation(); + }; + return ( - + + + ); }; diff --git a/src/components/Mypage/MypageItem.tsx b/src/components/Mypage/MypageItem.tsx index 03bced8b..c033a568 100644 --- a/src/components/Mypage/MypageItem.tsx +++ b/src/components/Mypage/MypageItem.tsx @@ -1,6 +1,7 @@ +import Alert from '@components/common/alert/Alert'; import { RightIcon } from '@components/common/icons/Icons'; import { getItem } from '@utils/localStorageFun'; -import { useNavigate } from 'react-router-dom'; +import { Link, useNavigate } from 'react-router-dom'; interface Props { link: string; @@ -9,24 +10,47 @@ interface Props { const MypageItem = ({ link, children }: Props) => { const navigate = useNavigate(); + const isLogin = getItem('accessToken'); - const onMypageClick = () => { + const handleConfirm = async (e: React.MouseEvent) => { + e.stopPropagation(); if (getItem('accessToken')) { navigate(link); - } else { - if (confirm('로그인이 필요해요. 로그인하시겠어요?')) { - navigate('/login'); - } } }; + const handleCancel = (e: React.MouseEvent) => { + e.stopPropagation(); + }; + return ( - + <> + {isLogin ? ( + + {children} + + + ) : ( + + 조회 시 로그인이 필요합니다. +
+ 로그인 하시겠습니까? + + } + onConfirm={handleConfirm} + onCancel={handleCancel}> + +
+ )} + ); }; From 70c8fa93c31095ce95f6567ad02e3c60838835bb Mon Sep 17 00:00:00 2001 From: jisu Seo Date: Fri, 12 Jan 2024 11:14:49 +0900 Subject: [PATCH 21/21] =?UTF-8?q?Fix:=20=EB=B9=8C=EB=93=9C=20=EC=98=A4?= =?UTF-8?q?=EB=A5=98=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/signup/signup.page.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/pages/signup/signup.page.tsx b/src/pages/signup/signup.page.tsx index a91dfafb..289e5746 100644 --- a/src/pages/signup/signup.page.tsx +++ b/src/pages/signup/signup.page.tsx @@ -1,6 +1,5 @@ import type { SignupFormValue } from '@/@types/auth.types'; import { postSignup } from '@api/auth'; -import authClient from '@api/authClient'; import { AuthTitle, AuthEmailInputBox,