Merge pull request #191 from MeeTeamNumdle/release-1.0

deploy: 로그인 여부 버그 및 일부 버그 수정
MeeTeamIdle · May 16, 2024 · d603a0f · d603a0f
2 parents 918e9b4 + e69a803
commit d603a0f
Show file tree

Hide file tree

Showing 16 changed files with 53 additions and 61 deletions.
diff --git a/src/atom.tsx b/src/atom.tsx
@@ -14,6 +14,7 @@ export const userState = atom<User | null>({
 export const loginState = atom<boolean>({
 	key: 'loginState',
 	default: false,
+	effects: [LocalStorageEffect<boolean>('loginState')],
 });
 
 export const pageState = atom({

diff --git a/src/components/comment/comment/Comment.tsx b/src/components/comment/comment/Comment.tsx
@@ -24,7 +24,7 @@ const Comment = ({
 }: CommentType) => {
 	const { id: recruitId } = useParams();
 	const pageNum = Number(recruitId);
-	const { isLoggedIn } = useLogin();
+	const { isLogin } = useLogin();
 	const [replyClicked, setReplyClicked] = useState<boolean>(false);
 	const [value, setValue] = useState<string>(content);
 	const [showKebab, setShowKebab] = useState<boolean>(true);
@@ -170,7 +170,7 @@ const Comment = ({
 						)}
 					</section>
 				</article>
-				{showKebab && isLoggedIn && (
+				{showKebab && isLogin && (
 					<KebabMenu options={isCommentWriter ? optionLists : optionListsOthers} />
 				)}
 			</section>
@@ -187,7 +187,6 @@ const Comment = ({
 						onClickCancel={onClickCancel}
 						groupNumber={groupNumber}
 						pageNum={pageNum}
-						mention={mention}
 						replyInputHandler={replyInputHandler}
 					/>
 				)}

diff --git a/src/components/comment/comment/ReplyComment.tsx b/src/components/comment/comment/ReplyComment.tsx
@@ -23,7 +23,7 @@ const ReplyComment = ({
 	replyComment,
 }: CommentType) => {
 	const { id: recruitId } = useParams();
-	const { isLoggedIn } = useLogin();
+	const { isLogin } = useLogin();
 	const pageNum = Number(recruitId);
 	const [value, setValue] = useState<string>(content);
 	const [showKebab, setShowKebab] = useState<boolean>(true);
@@ -161,7 +161,7 @@ const ReplyComment = ({
 						)}
 					</section>
 				</article>
-				{showKebab && isLoggedIn && (
+				{showKebab && isLogin && (
 					<KebabMenu options={isCommentWriter ? optionLists : optionListsOthers} />
 				)}
 			</section>

diff --git a/src/components/comment/replyInput/ReplyInput.tsx b/src/components/comment/replyInput/ReplyInput.tsx
@@ -8,23 +8,16 @@ import { useRecoilValue } from 'recoil';
 import { userState } from '../../../atom';
 
 interface ReplyHandler {
-	mention?: string;
 	pageNum: number;
 	groupNumber: number;
 	onClickCancel: () => void;
 	replyInputHandler: () => void;
 }
 
-const ReplyInput = ({
-	mention,
-	pageNum,
-	groupNumber,
-	onClickCancel,
-	replyInputHandler,
-}: ReplyHandler) => {
+const ReplyInput = ({ pageNum, groupNumber, onClickCancel, replyInputHandler }: ReplyHandler) => {
 	const postComment = useComment();
 	const queryClient = useQueryClient();
-	const [contents, setContents] = useState<string>(mention ? `@${mention + ' '}` : '');
+	const [contents, setContents] = useState<string>('');
 	const userInfo = useRecoilValue(userState);
 
 	const addReply = () => {

diff --git a/src/components/dropdown/Dropdown.tsx b/src/components/dropdown/Dropdown.tsx
@@ -43,7 +43,7 @@ const Dropdown = ({ data, initialData, scope, category, applicant, roleObj }: Dr
 		course: false,
 		professor: false,
 	});
-	const { isLoggedIn } = useLogin();
+	const { isLogin } = useLogin();
 	const [isScopeSelected, setIsScopeSelected] = useState(false);
 	const [isCategorySelected, setIsCategorySelected] = useState(false);
 	const insideRef = useRef<HTMLDivElement | null>(null);
@@ -68,14 +68,14 @@ const Dropdown = ({ data, initialData, scope, category, applicant, roleObj }: Dr
 	const { data: dataCourse, isLoading: isLoadingCourse } = useQuery({
 		queryKey: ['searchCourse', keywordCourse],
 		queryFn: () => getCourseKeyword(keywordCourse),
-		enabled: isLoggedIn,
+		enabled: isLogin,
 		staleTime: Infinity,
 		gcTime: Infinity,
 	});
 	const { data: dataProfessor, isLoading: isLoadingProfessor } = useQuery({
 		queryKey: ['searchProfessor', keywordProfessor],
 		queryFn: () => getProfessorKeyword(keywordProfessor),
-		enabled: isLoggedIn,
+		enabled: isLogin,
 		staleTime: Infinity,
 		gcTime: Infinity,
 	});

diff --git a/src/components/header/Header.tsx b/src/components/header/Header.tsx
@@ -3,7 +3,7 @@ import S from './Header.styled';
 import { useLocation, useNavigate, useParams } from 'react-router-dom';
 import { DropdownArrow, Logo, LogoName } from '../../assets';
 import { ProfileImage, WaitModal } from '..';
-import { useRecoilState, useSetRecoilState } from 'recoil';
+import { useRecoilState, useSetRecoilState, useRecoilValue } from 'recoil';
 import { recruitFilterState, userState, waitModalState, loginState } from '../../atom';
 import { useLogin, useSignOut } from '../../hooks';
 import { fixModalBackground, resetFormData } from '../../utils';
@@ -12,7 +12,7 @@ const Header = () => {
 	const navigate = useNavigate();
 	const { id } = useParams();
 	const location = useLocation();
-	const { isLoggedIn } = useLogin();
+	const isLogin = useRecoilValue(loginState);
 	const setLoginState = useSetRecoilState(loginState);
 	const [userInfo, setUserState] = useRecoilState(userState);
 	const dropdownRef = useRef<HTMLDivElement | null>(null);
@@ -45,7 +45,7 @@ const Header = () => {
 	};
 
 	const onClickMy = () => {
-		if (!isLoggedIn) {
+		if (!isLogin) {
 			navigate('/signin');
 		} else {
 			setOpenDrop(prev => !prev);
@@ -89,13 +89,13 @@ const Header = () => {
 	resetFormData();
 
 	return (
-		<S.Header $isLogin={isLoggedIn}>
+		<S.Header $isLogin={isLogin}>
 			<div className='header'>
 				<section className='header-leftside'>
 					<div className='header__logo' onClick={goRecruit}>
 						<img className='logo' src={Logo} />
 						<img className='logo-name' src={LogoName} />
-						{isLoggedIn && <span className='university'>광운대학교</span>}
+						{isLogin && <span className='university'>광운대학교</span>}
 					</div>
 					<div className='header__navigation'>
 						<div
@@ -116,7 +116,7 @@ const Header = () => {
 					<div className='header__menu'>
 						<div className='header__menu--my' ref={dropdownRef}>
 							<section onClick={onClickMy}>
-								{isLoggedIn ? (
+								{isLogin ? (
 									<article className='icon-container'>
 										<div className='icon-border'>
 											<ProfileImage url={userInfo?.imageUrl} size='3rem' />

diff --git a/src/components/meeteam/card/RecruitCard.tsx b/src/components/meeteam/card/RecruitCard.tsx
@@ -31,7 +31,7 @@ const RecruitCard = ({
 	const location = useLocation();
 	const navigate = useNavigate();
 	const [path, setPath] = useState('');
-	const { isLoggedIn } = useLogin();
+	const { isLogin } = useLogin();
 	const { mutate: bookmarked } = useBookmark({
 		queryKey: path,
 	});
@@ -50,7 +50,7 @@ const RecruitCard = ({
 
 	const onClickBookmark = (event: React.MouseEvent<HTMLDivElement>) => {
 		event.stopPropagation();
-		if (!isLoggedIn) {
+		if (!isLogin) {
 			setNeedLoginModal({ isOpen: true, type: 'BOOKMARK' });
 			return;
 		}

diff --git a/src/components/recruit/create/recruitRoles/RecruitRolesForm.tsx b/src/components/recruit/create/recruitRoles/RecruitRolesForm.tsx
@@ -8,6 +8,7 @@ import { RecruitApplicantsList } from '../../../../types';
 
 const RecruitRoleForm = ({ applicantsList }: RecruitApplicantsList) => {
 	const { id } = useParams();
+	const pageNum = Number(id);
 	const [info, setInfo] = useRecoilState(recruitInputState);
 	const setWarnRoleDeleteState = useSetRecoilState(warnRoleDeleteModalState);
 
@@ -23,6 +24,11 @@ const RecruitRoleForm = ({ applicantsList }: RecruitApplicantsList) => {
 			} else {
 				setWarnRoleDeleteState(true);
 			}
+		} else {
+			setInfo(prev => ({
+				...prev,
+				recruitmentRoles: prev.recruitmentRoles?.filter(elem => elem.roleId !== id),
+			}));
 		}
 	};
 

diff --git a/src/components/recruit/recruitDetail/footer/ApplierFooter.tsx b/src/components/recruit/recruitDetail/footer/ApplierFooter.tsx
@@ -16,7 +16,7 @@ interface ApplierData {
 const ApplierFooter = ({ deadline, isApplied, isBookmarked }: ApplierData) => {
 	const { id } = useParams();
 	const pageNum = Number(id);
-	const { isLoggedIn } = useLogin();
+	const { isLogin } = useLogin();
 	const diffDate = calculateDate(deadline);
 	const setIsModal = useSetRecoilState(applyModalState);
 	const setNeedLoginModal = useSetRecoilState(needLoginModalState);
@@ -26,7 +26,7 @@ const ApplierFooter = ({ deadline, isApplied, isBookmarked }: ApplierData) => {
 	const setIsCancel = useSetRecoilState(applyCancelModalState);
 
 	const onClickApply = () => {
-		if (isLoggedIn) {
+		if (isLogin) {
 			setIsModal(true);
 		} else {
 			setNeedLoginModal({ isOpen: true, type: 'RECRUIT_APPLY' });
@@ -38,7 +38,7 @@ const ApplierFooter = ({ deadline, isApplied, isBookmarked }: ApplierData) => {
 	};
 
 	const onClickBookmark = () => {
-		if (!isLoggedIn) {
+		if (!isLogin) {
 			setNeedLoginModal({ isOpen: true, type: 'BOOKMARK' });
 			return;
 		}

diff --git a/src/components/recruit/recruitDetail/titleInfo/TitleInfo.tsx b/src/components/recruit/recruitDetail/titleInfo/TitleInfo.tsx
@@ -21,13 +21,13 @@ const TitleInfo = ({
 	isBookmarked,
 }: TitleAndEtc) => {
 	const { id } = useParams();
-	const { isLoggedIn } = useLogin();
+	const { isLogin } = useLogin();
 	const { mutate: bookmarked } = useBookmark({ queryKey: 'detailedPage' });
 	const { mutate: unBookmarked } = useDelBookmark({ queryKey: 'detailedPage' });
 	const [needLoginModal, setNeedLoginModal] = useRecoilState(needLoginModalState);
 
 	const toggleBookmark = () => {
-		if (!isLoggedIn) {
+		if (!isLogin) {
 			setNeedLoginModal({ isOpen: true, type: 'BOOKMARK' });
 			return;
 		}

diff --git a/src/hooks/useLogin.ts b/src/hooks/useLogin.ts
@@ -4,18 +4,9 @@ import { loginState } from '../atom';
 
 // 임시
 const useLogin = () => {
-	const [isLoggedIn, setIsLoggedIn] = useState(false);
 	const isLogin = useRecoilValue(loginState);
 
-	useEffect(() => {
-		if (isLogin) {
-			setIsLoggedIn(true);
-		} else {
-			setIsLoggedIn(false);
-		}
-	}, [isLogin]);
-
-	return { isLoggedIn };
+	return { isLogin };
 };
 
 export default useLogin;
diff --git a/src/pages/create/recruitCreatePage/RecruitCreatePage.tsx b/src/pages/create/recruitCreatePage/RecruitCreatePage.tsx
@@ -22,7 +22,7 @@ const RecruitCreatePage = () => {
 	const { id } = useParams();
 	const location = useLocation();
 	const navigate = useNavigate();
-	const { isLoggedIn } = useLogin();
+	const { isLogin } = useLogin();
 	const validCheck = useRecoilValue(validState);
 	const setIsSubmit = useSetRecoilState(validState);
 	const [beforeSubmit, setBeforeSubmit] = useState<boolean>(false);
@@ -47,8 +47,8 @@ const RecruitCreatePage = () => {
 	const pageNum = Number(id);
 
 	const { data, isSuccess } = useQuery({
-		queryKey: ['detailedPage', { pageNum, isLoggedIn }],
-		queryFn: () => getPostingData({ pageNum, isLoggedIn }),
+		queryKey: ['detailedPage', { pageNum, isLogin }],
+		queryFn: () => getPostingData({ pageNum, isLogin }),
 		enabled: !!id,
 	});
 

diff --git a/src/pages/recruit/recruitDetailPage/RecruitDetailPage.tsx b/src/pages/recruit/recruitDetailPage/RecruitDetailPage.tsx
@@ -53,11 +53,13 @@ const RecruitDetailPage = () => {
 		1: <ConfirmModal />,
 		2: <FinalModal />,
 	};
-	const { isLoggedIn } = useLogin();
+	const { isLogin } = useLogin();
 	const { data: detailedData, isSuccess } = useQuery({
-		queryKey: ['detailedPage', { pageNum, isLoggedIn }],
-		queryFn: () => getPostingData({ pageNum, isLoggedIn }),
+		queryKey: ['detailedPage', { pageNum, isLogin }],
+		queryFn: () => getPostingData({ pageNum, isLogin }),
 	});
+
+	console.log(detailedData?.comments);
 	const period = detailedData?.proceedingStart + ' ~ ' + detailedData?.proceedingEnd;
 	const diffDate = detailedData && calculateDate(detailedData.deadline);
 	const totalCommentsCount = useMemo(() => {
@@ -122,7 +124,7 @@ const RecruitDetailPage = () => {
 										return <Comment key={comment.id} {...comment} />;
 									})}
 							</ul>
-							{isLoggedIn ? (
+							{isLogin ? (
 								<CommentInput />
 							) : (
 								<section className='need-login'>

diff --git a/src/pages/recruit/recruitPage/RecruitPage.tsx b/src/pages/recruit/recruitPage/RecruitPage.tsx
@@ -66,10 +66,10 @@ const RecruitPage = () => {
 	});
 	const [searchParams, setSearchParams] = useSearchParams();
 	const [needLoginModal, setNeedLoginModal] = useRecoilState(needLoginModalState);
-	const { isLoggedIn } = useLogin();
+	const { isLogin } = useLogin();
 	const { data, isLoading } = useQuery({
-		queryKey: ['recruit_board', { filterState, isLoggedIn, page }],
-		queryFn: () => getPostList({ filterState, isLoggedIn, page }),
+		queryKey: ['recruit_board', { filterState, isLogin, page }],
+		queryFn: () => getPostList({ filterState, isLogin, page }),
 	});
 
 	const onClickDetailed = (event: React.MouseEvent) => {
@@ -170,31 +170,31 @@ const RecruitPage = () => {
 	};
 
 	const recruitCreateHandler = () => {
-		if (isLoggedIn) {
+		if (isLogin) {
 			navigate('/recruitment/postings');
 		} else {
 			setNeedLoginModal({ isOpen: true, type: 'RECRUIT_CREATE' });
 		}
 	};
 
 	const bookmarkNavigateHandler = () => {
-		if (isLoggedIn) {
+		if (isLogin) {
 			navigate('/management/bookmark');
 		} else {
 			setNeedLoginModal({ isOpen: true, type: 'MANAGE_BOOKMARK' });
 		}
 	};
 
 	const profileCreateHandler = () => {
-		if (isLoggedIn) {
+		if (isLogin) {
 			navigate('/profile/edit');
 		} else {
 			setNeedLoginModal({ isOpen: true, type: 'PROFILE_CREATE' });
 		}
 	};
 
 	const portfolioCreateHandler = () => {
-		if (isLoggedIn) {
+		if (isLogin) {
 			navigate('/portfolio/edit');
 		} else {
 			setNeedLoginModal({ isOpen: true, type: 'PORTFOLIO_CREATE' });
@@ -327,7 +327,7 @@ const RecruitPage = () => {
 					</section>
 					<section className='wrapper-filters'>
 						<section className='container-filters'>
-							{isLoggedIn && (
+							{isLogin && (
 								<Dropdown data={['모든 범위', '교내', '교외']} initialData='범위' scope />
 							)}
 							<Dropdown

diff --git a/src/service/recruit/board.ts b/src/service/recruit/board.ts
@@ -3,13 +3,13 @@ import { ListResult, FilterData } from '../../types';
 
 interface FilterItem {
 	filterState: FilterData;
-	isLoggedIn: boolean;
+	isLogin: boolean;
 	page: number;
 }
 
-export const getPostList = async ({ filterState, isLoggedIn, page }: FilterItem) => {
+export const getPostList = async ({ filterState, isLogin, page }: FilterItem) => {
 	try {
-		if (isLoggedIn) {
+		if (isLogin) {
 			const response = await axiosAuthInstance.get<ListResult>(EndPoint.RECRUITMENT_BOARD.list, {
 				params: {
 					skill: filterState.skill,

diff --git a/src/service/recruit/detail.ts b/src/service/recruit/detail.ts
@@ -10,12 +10,12 @@ import {
 
 interface PostingData {
 	pageNum: number;
-	isLoggedIn: boolean;
+	isLogin: boolean;
 }
 
-export const getPostingData = async ({ pageNum, isLoggedIn }: PostingData) => {
+export const getPostingData = async ({ pageNum, isLogin }: PostingData) => {
 	try {
-		if (isLoggedIn) {
+		if (isLogin) {
 			const response = await axiosAuthInstance.get<RecruitPostings>(
 				EndPoint.RECRUIT_DETAIL.posting(pageNum)
 			);