diff --git a/src/api/auth.api.ts b/src/api/auth.api.ts index 44322c56..b00e5634 100644 --- a/src/api/auth.api.ts +++ b/src/api/auth.api.ts @@ -1,8 +1,8 @@ import { ApiVerifyNickname, VerifyEmail } from '../models/auth'; import { httpClient } from './http.api'; -import { registerFormValues } from '../pages/register/Register'; -import { changePasswordFormValues } from '../pages/changePassword/ChangePassword'; import { loginFormValues } from '../pages/login/Login'; +import { registerFormValues } from '../pages/user/register/Register'; +import { changePasswordFormValues } from '../pages/user/changePassword/ChangePassword'; export const postVerificationEmail = async (email: string) => { try { diff --git a/src/components/common/header/Header.tsx b/src/components/common/header/Header.tsx index e5f71ad9..c2dc1aaf 100644 --- a/src/components/common/header/Header.tsx +++ b/src/components/common/header/Header.tsx @@ -11,12 +11,11 @@ import loadingImg from '../../../assets/loadingImg.svg'; import { useModal } from '../../../hooks/useModal'; import Modal from '../modal/Modal'; import { formatImgPath } from '../../../util/formatImgPath'; -import bell from '../../../assets/bell.svg'; -import Notification from './Notification/Notification'; -import bellLogined from '../../../assets/bellLogined.svg'; -import useNotification from '../../../hooks/useNotification'; -import { useEffect } from 'react'; -import { testLiveAlarm } from '../../../api/alarm.api'; +// import bell from '../../../assets/bell.svg'; +// import Notification from './Notification/Notification'; +// import bellLogined from '../../../assets/bellLogined.svg'; +// import { useEffect } from 'react'; +// import { testLiveAlarm } from '../../../api/alarm.api'; import { useMyProfileInfo } from '../../../hooks/user/useMyInfo'; import { ROUTES } from '../../../constants/user/routes'; diff --git a/src/components/common/modal/Modal.tsx b/src/components/common/modal/Modal.tsx index 0a081d8a..ff2711de 100644 --- a/src/components/common/modal/Modal.tsx +++ b/src/components/common/modal/Modal.tsx @@ -8,12 +8,14 @@ import { ModalWrapper } from './ModalWrapper'; interface ModalProps { isOpen: boolean; onClose: () => void; + onConfirm?: () => void; } const Modal = ({ children, isOpen, onClose, + onConfirm, }: PropsWithChildren) => { const modalRefs = useOutsideClick(() => handleClose()); const [isFadingOut, setIsFadingOut] = useState(false); @@ -24,7 +26,11 @@ const Modal = ({ const handleAnimationEnd = () => { if (isFadingOut) { - onClose(); + if (onConfirm) { + onConfirm(); + } else { + onClose(); + } setIsFadingOut(false); } }; @@ -33,7 +39,7 @@ const Modal = ({ return createPortal( - + {}, children, }: PropsWithChildren>) => { const modalProps: ModalContextProps = { isOpen, onClose, + onConfirm, }; return {children}; diff --git a/src/components/user/applyComponents/careersComponent/CareersComponent.styled.ts b/src/components/user/applyComponents/careersComponent/CareersComponent.styled.ts index a2bf796d..38786d3c 100644 --- a/src/components/user/applyComponents/careersComponent/CareersComponent.styled.ts +++ b/src/components/user/applyComponents/careersComponent/CareersComponent.styled.ts @@ -1,5 +1,5 @@ import styled from 'styled-components'; -import Button from '../../common/Button/Button'; +import Button from '../../../common/Button/Button'; export const Container = styled.div` width: 100%; @@ -17,11 +17,15 @@ export const CareerContainer = styled.div` } `; +export const ButtonWrapper = styled.div` + display: flex; + justify-content: center; +`; + export const AddButton = styled(Button)` width: 50px; height: 30px; font-size: 13px; padding: 10px; - cursor: pointer; border: 1px solid ${({ theme }) => theme.color.border}; `; diff --git a/src/components/user/applyComponents/careersComponent/CareersComponent.tsx b/src/components/user/applyComponents/careersComponent/CareersComponent.tsx index 61511ee7..84f868fa 100644 --- a/src/components/user/applyComponents/careersComponent/CareersComponent.tsx +++ b/src/components/user/applyComponents/careersComponent/CareersComponent.tsx @@ -29,22 +29,24 @@ const CareersComponent = ({ control }: CareersComponentProps) => { ))} ))} - - appendCareers({ - name: '', - periodStart: '', - periodEnd: '', - role: '', - }) - } - > - 추가 - + + + appendCareers({ + name: '', + periodStart: '', + periodEnd: '', + role: '', + }) + } + > + 추가 + + ); }; diff --git a/src/components/user/comment/commentComponent/CommentComponentLayout.tsx b/src/components/user/comment/commentComponent/CommentComponentLayout.tsx index 1668babf..a19b5b45 100644 --- a/src/components/user/comment/commentComponent/CommentComponentLayout.tsx +++ b/src/components/user/comment/commentComponent/CommentComponentLayout.tsx @@ -1,13 +1,13 @@ import * as S from './CommentComponentLayout.styled'; import DropDown from '../../../common/dropDown/DropDown'; import DropDownItem from '../DropDownItem'; -import { CommentType } from '../../../../models/comment'; -import dropdownButton from '../../../assets/dropdownButton.svg'; import useComment from '../../../../hooks/user/CommentHooks/useComment'; import ReplyComponent from '../replyComponent/ReplyComponent'; -import ArrowDown from '../../../assets/ArrowDown.svg'; -import ArrowUp from '../../../assets/ArrowUp.svg'; +import ArrowUp from '../../../../assets/ArrowUp.svg'; import CommentComponent from './commentComponent/CommentComponent'; +import { CommentType } from '../../../../models/comment'; +import dropdownButton from '../../../../assets/dropdownButton.svg'; +import ArrowDown from '../../../../assets/ArrowDown.svg'; interface CommentLayoutProps { projectId: number; diff --git a/src/components/user/comment/commentComponent/commentComponent/CommentComponent.tsx b/src/components/user/comment/commentComponent/commentComponent/CommentComponent.tsx index f3bd34b7..b5e63ce6 100644 --- a/src/components/user/comment/commentComponent/commentComponent/CommentComponent.tsx +++ b/src/components/user/comment/commentComponent/commentComponent/CommentComponent.tsx @@ -1,11 +1,11 @@ import { Dispatch, SetStateAction } from 'react'; import * as S from './CommentComponent.styled'; -import Avatar from '../../../common/avatar/Avatar'; -import { CommentType } from '../../../../models/comment'; -import chat from '../../../../assets/chat.svg'; +import chat from '../../../../../assets/chat.svg'; import { Link } from 'react-router-dom'; -import { ROUTES } from '../../../../constants/routes'; import CommentInput from '../../commentInput/CommentInput'; +import { CommentType } from '../../../../../models/comment'; +import { ROUTES } from '../../../../../constants/user/routes'; +import Avatar from '../../../../common/avatar/Avatar'; interface CommentComponentProps { item: CommentType; diff --git a/src/components/user/comment/commentInput/CommentInput.styled.ts b/src/components/user/comment/commentInput/CommentInput.styled.ts index 52c9a482..a609ddbe 100644 --- a/src/components/user/comment/commentInput/CommentInput.styled.ts +++ b/src/components/user/comment/commentInput/CommentInput.styled.ts @@ -1,5 +1,5 @@ import styled from 'styled-components'; -import Button from '../../common/Button/Button'; +import Button from '../../../common/Button/Button'; export const InputContainer = styled.div` display: flex; diff --git a/src/components/user/comment/commentInput/CommentInput.tsx b/src/components/user/comment/commentInput/CommentInput.tsx index 068e5da9..6e39312d 100644 --- a/src/components/user/comment/commentInput/CommentInput.tsx +++ b/src/components/user/comment/commentInput/CommentInput.tsx @@ -2,7 +2,7 @@ import * as S from './CommentInput.styled'; import { Dispatch, SetStateAction, useEffect } from 'react'; import { useMyProfileInfo } from '../../../../hooks/user/useMyInfo'; import { formatImgPath } from '../../../../util/formatImgPath'; -import DefaultImg from '../../../assets/defaultImg.png'; +import DefaultImg from '../../../../assets/defaultImg.png'; import Avatar from '../../../common/avatar/Avatar'; import { useForm } from 'react-hook-form'; import useInputFocus from '../../../../hooks/user/useInputFocus'; diff --git a/src/components/user/comment/replyComponent/ReplyComponent.tsx b/src/components/user/comment/replyComponent/ReplyComponent.tsx index 401bafba..985a9419 100644 --- a/src/components/user/comment/replyComponent/ReplyComponent.tsx +++ b/src/components/user/comment/replyComponent/ReplyComponent.tsx @@ -1,15 +1,15 @@ import Avatar from '../../../common/avatar/Avatar'; import * as S from './ReplyComponent.styled'; -import DefaultImg from '../../../assets/defaultImg.png'; +import DefaultImg from '../../../../assets/defaultImg.png'; import useComment from '../../../../hooks/user/CommentHooks/useComment'; import DropDown from '../../../common/dropDown/DropDown'; import DropDownItem from '../DropDownItem'; -import dropdownButton from '../../../assets/dropdownButton.svg'; import CommentInput from '../commentInput/CommentInput'; import useGetReply from '../../../../hooks/user/CommentHooks/useGetReply'; import LoadingSpinner from '../../../common/loadingSpinner/LoadingSpinner'; import { Link } from 'react-router-dom'; import { ROUTES } from '../../../../constants/user/routes'; +import dropdownButton from '../../../../assets/dropdownButton.svg'; interface ReplyComponentProps { projectId: number; diff --git a/src/components/user/evaluation/EvaluationContent.styled.ts b/src/components/user/evaluation/EvaluationContent.styled.ts index 76242ac1..ca40c6c3 100644 --- a/src/components/user/evaluation/EvaluationContent.styled.ts +++ b/src/components/user/evaluation/EvaluationContent.styled.ts @@ -1,5 +1,5 @@ import styled from 'styled-components'; -import Button from '../common/Button/Button'; +import Button from '../../common/Button/Button'; export const Container = styled.div` display: flex; diff --git a/src/components/user/home/banner/Banner.tsx b/src/components/user/home/banner/Banner.tsx index 25e7107f..7f0afc22 100644 --- a/src/components/user/home/banner/Banner.tsx +++ b/src/components/user/home/banner/Banner.tsx @@ -1,5 +1,5 @@ import * as S from './Banner.styled'; -import banner from '../../../assets/banner.svg'; +import banner from '../../../../assets/banner.svg'; export default function Banner() { return ( diff --git a/src/components/user/home/projectCardLists/cardList/CardList.tsx b/src/components/user/home/projectCardLists/cardList/CardList.tsx index c31912ce..4975a5bb 100644 --- a/src/components/user/home/projectCardLists/cardList/CardList.tsx +++ b/src/components/user/home/projectCardLists/cardList/CardList.tsx @@ -1,10 +1,10 @@ import PositionButton from '../../../../common/positionButton/PositionButton'; import * as S from './CardList.styled'; -import beginner from '../../../../assets/beginner.svg'; -import Avatar from '../../../../common/avatar/Avatar'; import { EyeIcon } from '@heroicons/react/24/outline'; import type { ProjectList } from '../../../../../models/mainProjectLists'; import { formatDate } from '../../../../../util/formatDate'; +import Avatar from '../../../../common/avatar/Avatar'; +import beginner from '../../../../../assets/beginner.svg'; interface CardListProps { list: ProjectList; @@ -28,6 +28,7 @@ export default function CardList({ list }: CardListProps) { ))} {list.positions.length > listPositionTag.length && ( diff --git a/src/components/user/home/searchFiltering/filteringContents/FilteringContents.tsx b/src/components/user/home/searchFiltering/filteringContents/FilteringContents.tsx index 30398fd2..0bcf8133 100644 --- a/src/components/user/home/searchFiltering/filteringContents/FilteringContents.tsx +++ b/src/components/user/home/searchFiltering/filteringContents/FilteringContents.tsx @@ -1,6 +1,5 @@ import Filtering from './filtering/Filtering'; import * as S from './FilteringContents.styled'; -import beginner from '../../../../assets/beginner.svg'; import { ChevronDownIcon } from '@heroicons/react/24/outline'; import SkillTagBox from '../../../../common/skillTagBox/SkillTagBox'; import React, { useState } from 'react'; @@ -8,6 +7,7 @@ import { useSearchFilteringSkillTag } from '../../../../../hooks/user/useSearchF import { useOutsideClick } from '../../../../../hooks/user/useOutsideClick'; import { useSaveSearchFiltering } from '../../../../../hooks/user/useSaveSearchFiltering'; import { SEARCH_FILTERING_DEFAULT_VALUE } from '../../../../../constants/user/homeConstants'; +import beginner from '../../../../../assets/beginner.svg'; export default function FilteringContents() { const { positionTagsData, methodTagsData } = useSearchFilteringSkillTag(); diff --git a/src/components/user/home/searchFiltering/filteringContents/filtering/Filtering.tsx b/src/components/user/home/searchFiltering/filteringContents/filtering/Filtering.tsx index 585c7f94..9e5e5b3a 100644 --- a/src/components/user/home/searchFiltering/filteringContents/filtering/Filtering.tsx +++ b/src/components/user/home/searchFiltering/filteringContents/filtering/Filtering.tsx @@ -1,11 +1,10 @@ import { ChevronDownIcon } from '@heroicons/react/24/outline'; import * as S from './Filtering.styled'; import { useEffect, useState } from 'react'; -import type { MethodTag, PositionTag } from '../../../../../models/tags'; -import { useOutsideClick } from '../../../../../hooks/useOutsideClick'; -import { useSaveSearchFiltering } from '../../../../../hooks/useSaveSearchFiltering'; -import { SEARCH_FILTERING_DEFAULT_VALUE } from '../../../../../constants/homeConstants'; - +import { useSaveSearchFiltering } from '../../../../../../hooks/user/useSaveSearchFiltering'; +import { MethodTag, PositionTag } from '../../../../../../models/tags'; +import { SEARCH_FILTERING_DEFAULT_VALUE } from '../../../../../../constants/user/homeConstants'; +import { useOutsideClick } from '../../../../../../hooks/user/useOutsideClick'; interface FilteringProps { selects: PositionTag[] | MethodTag[]; defaultValue: string; diff --git a/src/components/user/manageProjects/passNonPassList/SendResultButton.styled.ts b/src/components/user/manageProjects/passNonPassList/SendResultButton.styled.ts index f36e72fe..927d382f 100644 --- a/src/components/user/manageProjects/passNonPassList/SendResultButton.styled.ts +++ b/src/components/user/manageProjects/passNonPassList/SendResultButton.styled.ts @@ -1,5 +1,5 @@ import styled from 'styled-components'; -import Button from '../../common/Button/Button'; +import Button from '../../../common/Button/Button'; export const Wrapper = styled.div` width: 100%; diff --git a/src/components/user/mypage/ContentTab.tsx b/src/components/user/mypage/ContentTab.tsx index 623075ec..f1d38833 100644 --- a/src/components/user/mypage/ContentTab.tsx +++ b/src/components/user/mypage/ContentTab.tsx @@ -1,9 +1,9 @@ import { useEffect, useState } from 'react'; import * as S from './ContentTab.styled'; import { Link, Outlet, useLocation } from 'react-router-dom'; -import { ROUTES } from '../../constants/routes'; import ScrollWrapper from './ScrollWrapper'; import MovedInquiredLink from '../customerService/MoveInquiredLink'; +import { ROUTES } from '../../../constants/user/routes'; interface Filter { title: string; diff --git a/src/components/user/mypage/activityLog/inquiries/inquiry/Inquiry.tsx b/src/components/user/mypage/activityLog/inquiries/inquiry/Inquiry.tsx index f59cf02d..82a5735b 100644 --- a/src/components/user/mypage/activityLog/inquiries/inquiry/Inquiry.tsx +++ b/src/components/user/mypage/activityLog/inquiries/inquiry/Inquiry.tsx @@ -1,7 +1,7 @@ import { useState } from 'react'; -import type { MyInquiries } from '../../../../../models/activityLog'; import * as S from './Inquiry.styled'; -import { My_INQUIRIES_MESSAGE } from '../../../../../constants/customerService'; +import { MyInquiries } from '../../../../../../models/activityLog'; +import { My_INQUIRIES_MESSAGE } from '../../../../../../constants/user/customerService'; interface InquiryProps { list: MyInquiries; diff --git a/src/components/user/mypage/joinedProject/Project.tsx b/src/components/user/mypage/joinedProject/Project.tsx index 920c8fa9..ec215e35 100644 --- a/src/components/user/mypage/joinedProject/Project.tsx +++ b/src/components/user/mypage/joinedProject/Project.tsx @@ -1,7 +1,7 @@ import * as S from './Project.styled'; -import BeginnerIcon from '../../../assets/beginner.svg'; import { EllipsisHorizontalIcon } from '@heroicons/react/24/outline'; import { JoinedProject } from '../../../../models/userProject'; +import beginner from '../../../../assets/beginner.svg'; interface ProjectProps { project: JoinedProject; @@ -22,11 +22,7 @@ const Project = ({ project }: ProjectProps) => { - {project.isBeginner ? ( - beginner - ) : ( - '' - )} + {project.isBeginner ? beginner : ''} {project.totalMember}명 diff --git a/src/components/user/mypage/myProfile/profile/Profile.tsx b/src/components/user/mypage/myProfile/profile/Profile.tsx index 27e74e4e..b7fc4ddf 100644 --- a/src/components/user/mypage/myProfile/profile/Profile.tsx +++ b/src/components/user/mypage/myProfile/profile/Profile.tsx @@ -1,5 +1,5 @@ import * as S from './Profile.styled'; -import BeginnerIcon from '../../../../assets/beginner.svg'; +import BeginnerIcon from '../../../../../assets/beginner.svg'; import 'chart.js/auto'; import { ChartOptions } from 'chart.js'; import { Link, useOutletContext } from 'react-router-dom'; diff --git a/src/components/user/projectFormComponents/projectInformationInput/positionComponent/PositionComponent.styled.ts b/src/components/user/projectFormComponents/projectInformationInput/positionComponent/PositionComponent.styled.ts index 51b088fa..35d4340c 100644 --- a/src/components/user/projectFormComponents/projectInformationInput/positionComponent/PositionComponent.styled.ts +++ b/src/components/user/projectFormComponents/projectInformationInput/positionComponent/PositionComponent.styled.ts @@ -1,5 +1,5 @@ import styled from 'styled-components'; -import PositionButton from '../../../common/positionButton/PositionButton'; +import PositionButton from '../../../../common/positionButton/PositionButton'; export const Container = styled.div``; diff --git a/src/components/user/projectFormComponents/projectInformationInput/positionComponent/PositionComponent.tsx b/src/components/user/projectFormComponents/projectInformationInput/positionComponent/PositionComponent.tsx index 5533d9d0..06605ff8 100644 --- a/src/components/user/projectFormComponents/projectInformationInput/positionComponent/PositionComponent.tsx +++ b/src/components/user/projectFormComponents/projectInformationInput/positionComponent/PositionComponent.tsx @@ -36,7 +36,9 @@ const MozipCategoryComponent = ({ handleClick(e, idx + 1)} + onClick={(e: React.MouseEvent) => + handleClick(e, idx + 1) + } key={idx + 1} isHover={true} fontSize={true} diff --git a/src/components/user/projectFormComponents/projectInformationText/ProjectInformation.tsx b/src/components/user/projectFormComponents/projectInformationText/ProjectInformation.tsx index ef754f10..2acf1073 100644 --- a/src/components/user/projectFormComponents/projectInformationText/ProjectInformation.tsx +++ b/src/components/user/projectFormComponents/projectInformationText/ProjectInformation.tsx @@ -5,7 +5,7 @@ import { } from '../../../../models/projectDetail'; import { formatDate } from '../../../../util/formatDate'; import * as S from './ProjectInformation.styled'; -import beginner from '/src/assets/beginner.svg'; +import beginner from '../../../../assets/beginner.svg'; interface ProjectInformationProps { data: ProjectDetailPlusExtended; diff --git a/src/components/user/projectFormComponents/stepComponent/StepComponent.tsx b/src/components/user/projectFormComponents/stepComponent/StepComponent.tsx index d9fe5e30..a80252f8 100644 --- a/src/components/user/projectFormComponents/stepComponent/StepComponent.tsx +++ b/src/components/user/projectFormComponents/stepComponent/StepComponent.tsx @@ -1,22 +1,16 @@ -import React, { Dispatch, SetStateAction } from 'react'; +import React from 'react'; import * as S from './StepComponent.styled'; import { StepProp } from '../../../../hooks/user/ProjectHooks/useMultiStepForm'; type StepComponentProps = { steps: StepProp[]; currentStepIndex: number; - setCurrentStepIndex: Dispatch>; }; const StepComponent: React.FC = ({ steps, currentStepIndex, - setCurrentStepIndex, }) => { - const handleClick = (index: number) => { - setCurrentStepIndex(index); - }; - return ( @@ -25,10 +19,7 @@ const StepComponent: React.FC = ({ return ( - handleClick(index)} - > + {step.title} ); diff --git a/src/components/user/userPage/userProfile/UserProfile.tsx b/src/components/user/userPage/userProfile/UserProfile.tsx index e3a2a9cb..02accded 100644 --- a/src/components/user/userPage/userProfile/UserProfile.tsx +++ b/src/components/user/userPage/userProfile/UserProfile.tsx @@ -1,4 +1,4 @@ -import * as S from '../../../mypage/myProfile/MyProfile.styled'; +import * as S from '../../'; import BeginnerIcon from '../../../assets/beginner.svg'; import { useParams } from 'react-router-dom'; import { useUserProfileInfo } from '../../../../hooks/user/useUserInfo'; diff --git a/src/constants/sidebarItems.tsx b/src/constants/sidebarItems.tsx index dd76a964..d1567109 100644 --- a/src/constants/sidebarItems.tsx +++ b/src/constants/sidebarItems.tsx @@ -1,9 +1,9 @@ -import { ROUTES } from './routes'; import { UserGroupIcon, PencilSquareIcon, UserPlusIcon, } from '@heroicons/react/24/outline'; +import { ROUTES } from './user/routes'; export const applicantsMenuItems = (projectId: number, isDone?: boolean) => { return [ diff --git a/src/constants/user/modalMessage.ts b/src/constants/user/modalMessage.ts index 36586c6a..6d8a5766 100644 --- a/src/constants/user/modalMessage.ts +++ b/src/constants/user/modalMessage.ts @@ -24,4 +24,5 @@ export const MODAL_MESSAGE = { applyProjectSuccess: '해당 공고에 지원을 완료 되었습니다.', applyProjectFail: '해당 공고에 지원을 실패 되었습니다.', projectDetailFail: '해당 공고가 존재하지 않습니다.', + alreadyApply: '이미 참여한/지원하신 공고 입니다.', } as const; diff --git a/src/context/ModalContext.tsx b/src/context/ModalContext.tsx index 12df9830..5e441ff7 100644 --- a/src/context/ModalContext.tsx +++ b/src/context/ModalContext.tsx @@ -3,11 +3,13 @@ import { createContext } from 'react'; export interface ModalContextProps { isOpen: boolean; onClose: (event?: React.SyntheticEvent) => void; + onConfirm: (event?: React.SyntheticEvent) => void; } const defaultContext: Partial = { isOpen: false, onClose: () => {}, + onConfirm: () => {}, }; export const ModalContext = diff --git a/src/hooks/useModal.ts b/src/hooks/useModal.ts index c034084e..d9c0dcfa 100644 --- a/src/hooks/useModal.ts +++ b/src/hooks/useModal.ts @@ -3,17 +3,28 @@ import { useCallback, useState } from 'react'; export const useModal = () => { const [isOpen, setIsOpen] = useState(false); const [message, setMessage] = useState(''); + const [onConfirm, setOnConfirm] = useState<(() => void) | null>(null); - const handleModalOpen = useCallback((newMessage: string) => { - setMessage(newMessage); - setIsOpen(true); - }, []); + const handleModalOpen = useCallback( + (newMessage: string, callback?: () => void) => { + setMessage(newMessage); + setIsOpen(true); + setOnConfirm(() => callback ?? null); + }, + [] + ); const handleModalClose = useCallback(() => { setMessage(''); setIsOpen(false); + setOnConfirm(null); }, []); + const handleConfirm = useCallback(() => { + if (onConfirm) onConfirm(); + handleModalClose(); + }, [onConfirm, handleModalClose]); + const handleOpenReportModal = () => { setIsOpen(true); }; @@ -30,5 +41,6 @@ export const useModal = () => { handleModalOpen, handleOpenReportModal, handleCloseReportModal, + handleConfirm, }; }; diff --git a/src/models/createProject.ts b/src/models/createProject.ts index 6b98dca6..4727c7e9 100644 --- a/src/models/createProject.ts +++ b/src/models/createProject.ts @@ -1,5 +1,5 @@ import { z } from 'zod'; -import { createProjectScheme } from '../constants/projectConstants'; +import { createProjectScheme } from '../constants/user/projectConstants'; export type CreateProjectFormValues = z.infer; diff --git a/src/models/joinProject.ts b/src/models/joinProject.ts index ce7689e6..c644282e 100644 --- a/src/models/joinProject.ts +++ b/src/models/joinProject.ts @@ -1,5 +1,5 @@ import { z } from 'zod'; -import { ApplyScheme } from '../constants/projectConstants'; +import { ApplyScheme } from '../constants/user/projectConstants'; export type ApplySchemeType = z.infer; diff --git a/src/models/projectDetail.ts b/src/models/projectDetail.ts index 5f84f3e3..de1a594a 100644 --- a/src/models/projectDetail.ts +++ b/src/models/projectDetail.ts @@ -33,6 +33,8 @@ export interface ProjectDetailPlusExtended extends ProjectDetailPlus { methodType: MethodTag; positions: PositionTag[]; skills: SkillTag[]; + applicantIds: number[]; + acceptedIds: number[]; } export interface dataPlus extends ApiCommonType { diff --git a/src/pages/login/Login.tsx b/src/pages/login/Login.tsx index c2f2a2ce..4596c1fb 100644 --- a/src/pages/login/Login.tsx +++ b/src/pages/login/Login.tsx @@ -2,17 +2,20 @@ import { Link } from 'react-router-dom'; import * as S from './Login.styled'; import Mainlogo from '../../assets/mainlogo.svg'; import { EnvelopeIcon, KeyIcon } from '@heroicons/react/24/outline'; -import InputText from '../../components/auth/InputText'; import Title from '../../components/common/title/Title'; import { z } from 'zod'; import { Controller, useForm } from 'react-hook-form'; import { zodResolver } from '@hookform/resolvers/zod'; import Button from '../../components/common/Button/Button'; -import { ERROR_MESSAGES, OAUTH_PROVIDERS } from '../../constants/authConstants'; import { useAuth } from '../../hooks/useAuth'; -import { ROUTES } from '../../constants/routes'; import { useModal } from '../../hooks/useModal'; import Modal from '../../components/common/modal/Modal'; +import { + ERROR_MESSAGES, + OAUTH_PROVIDERS, +} from '../../constants/user/authConstants'; +import InputText from '../../components/user/auth/InputText'; +import { ROUTES } from '../../constants/user/routes'; const loginSchema = z.object({ email: z diff --git a/src/pages/login/LoginSuccess.tsx b/src/pages/login/LoginSuccess.tsx index 125171ac..cb42cae1 100644 --- a/src/pages/login/LoginSuccess.tsx +++ b/src/pages/login/LoginSuccess.tsx @@ -1,12 +1,12 @@ import { useEffect } from 'react'; import { useNavigate, useSearchParams } from 'react-router-dom'; import useAuthStore from '../../store/authStore'; -import { ROUTES } from '../../constants/routes'; import * as S from './Login.styled'; import { Spinner } from '../../components/common/loadingSpinner/LoadingSpinner.styled'; import Modal from '../../components/common/modal/Modal'; import { useModal } from '../../hooks/useModal'; -import { AUTH_MESSAGE } from '../../constants/authConstants'; +import { ROUTES } from '../../constants/user/routes'; +import { AUTH_MESSAGE } from '../../constants/user/authConstants'; function LoginSuccess() { const [searchParams] = useSearchParams(); diff --git a/src/pages/user/apply/Apply.styled.ts b/src/pages/user/apply/Apply.styled.ts index 1d946a60..ab3932ff 100644 --- a/src/pages/user/apply/Apply.styled.ts +++ b/src/pages/user/apply/Apply.styled.ts @@ -1,5 +1,5 @@ import styled from 'styled-components'; -import Button from '../../components/common/Button/Button'; +import Button from '../../../components/common/Button/Button'; export const Container = styled.div` max-width: 100%; diff --git a/src/pages/user/apply/ApplyStep.styled.ts b/src/pages/user/apply/ApplyStep.styled.ts index 36f685eb..7c401c5b 100644 --- a/src/pages/user/apply/ApplyStep.styled.ts +++ b/src/pages/user/apply/ApplyStep.styled.ts @@ -1,5 +1,5 @@ import styled from 'styled-components'; -import Button from '../../components/common/Button/Button'; +import Button from '../../../components/common/Button/Button'; export const Container = styled.div` max-width: 100%; @@ -46,7 +46,8 @@ export const StepContainer = styled.div` export const StepButton = styled.div` display: flex; - justify-content: right; + justify-content: left; + padding-top: 20px; gap: 20px; `; diff --git a/src/pages/user/apply/ApplyStep.tsx b/src/pages/user/apply/ApplyStep.tsx index 3a2f831c..29f9f963 100644 --- a/src/pages/user/apply/ApplyStep.tsx +++ b/src/pages/user/apply/ApplyStep.tsx @@ -2,7 +2,7 @@ import * as S from './ApplyStep.styled'; import { useForm } from 'react-hook-form'; import { zodResolver } from '@hookform/resolvers/zod'; -import { useParams } from 'react-router-dom'; +import { useNavigate, useParams } from 'react-router-dom'; import { useModal } from '../../../hooks/useModal'; import useGetProjectData from '../../../hooks/user/useGetProjectData'; import useApplyProject from '../../../hooks/user/ProjectHooks/useApplyProject'; @@ -19,14 +19,17 @@ import LoadingSpinner from '../../../components/common/loadingSpinner/LoadingSpi import { formatDate } from '../../../util/formatDate'; import StepComponent from '../../../components/user/projectFormComponents/stepComponent/StepComponent'; import Button from '../../../components/common/Button/Button'; +import { MODAL_MESSAGE } from '../../../constants/user/modalMessage'; const Apply = () => { const { projectId } = useParams(); const id = Number(projectId); - const { isOpen, handleModalOpen, handleModalClose, message } = useModal(); + const navigate = useNavigate(); + const { isOpen, handleModalOpen, handleModalClose, handleConfirm, message } = + useModal(); const { data: projectData, isLoading, isFetching } = useGetProjectData(id); const { applyProject } = useApplyProject({ id, handleModalOpen }); - const userEmail = useAuthStore((state) => state.userData?.email); + const userData = useAuthStore((state) => state.userData); const { handleSubmit: onSubmitHandler, formState: { errors }, @@ -43,6 +46,19 @@ const Apply = () => { }, }); + useEffect(() => { + if (!userData) { + return handleModalOpen(MODAL_MESSAGE.isNotLoggedIn, () => navigate(-1)); + } + if ( + userData?.id === projectData?.user.id || + projectData?.acceptedIds.includes(userData?.id) || + projectData?.applicantIds.includes(userData?.id) + ) { + handleModalOpen(MODAL_MESSAGE.alreadyApply, () => navigate(-1)); + } + }, [userData, projectData, navigate, handleModalOpen]); + const stepFields: (keyof ApplySchemeType)[][] = [ ['email'], ['phone'], @@ -86,8 +102,8 @@ const Apply = () => { ]; useEffect(() => { - if (userEmail) setValue('email', userEmail); - }, [userEmail, setValue]); + if (userData?.email) setValue('email', userData.email); + }, [userData, setValue]); const { currentStepIndex, @@ -96,7 +112,6 @@ const Apply = () => { isLastStep, prev, next, - setCurrentStepIndex, } = useMultiStepForm(stepList); const handleNextStep = async () => { @@ -119,7 +134,11 @@ const Apply = () => { if (!projectData) { return ( - + {message} ); @@ -135,11 +154,7 @@ const Apply = () => { projectData?.recruitmentEndDate )}`} - +
@@ -183,7 +198,11 @@ const Apply = () => { )} - + {message}
diff --git a/src/pages/user/manage/myProjectParticipantsPass/MyProjectVolunteersPass.tsx b/src/pages/user/manage/myProjectParticipantsPass/MyProjectVolunteersPass.tsx index 50c61948..b60bf2d1 100644 --- a/src/pages/user/manage/myProjectParticipantsPass/MyProjectVolunteersPass.tsx +++ b/src/pages/user/manage/myProjectParticipantsPass/MyProjectVolunteersPass.tsx @@ -1,6 +1,6 @@ import * as S from './MyProjectVolunteersPass.styled'; import { useParams } from 'react-router-dom'; -import MainLogo from '../../../assets/mainlogo.svg'; +import MainLogo from '../../../../assets/mainlogo.svg'; import { Suspense, useMemo } from 'react'; import useGetProjectData from '../../../../hooks/user/useGetProjectData'; import { usePassNonPassList } from '../../../../hooks/user/usePassNonPassList'; diff --git a/src/pages/user/manage/myProjectVolunteer/MyProjectVolunteer.tsx b/src/pages/user/manage/myProjectVolunteer/MyProjectVolunteer.tsx index f725c37e..d65bc856 100644 --- a/src/pages/user/manage/myProjectVolunteer/MyProjectVolunteer.tsx +++ b/src/pages/user/manage/myProjectVolunteer/MyProjectVolunteer.tsx @@ -1,6 +1,6 @@ import { useParams } from 'react-router-dom'; import * as S from './MyProjectVolunteer.styled'; -import MainLogo from '../../../assets/mainlogo.svg'; +import MainLogo from '../../../../assets/mainlogo.svg'; import { useMemo } from 'react'; import useGetProjectData from '../../../../hooks/user/useGetProjectData'; import { useModal } from '../../../../hooks/useModal'; diff --git a/src/pages/user/mypage/MyPage.tsx b/src/pages/user/mypage/MyPage.tsx index b70c6dda..b1b6d72f 100644 --- a/src/pages/user/mypage/MyPage.tsx +++ b/src/pages/user/mypage/MyPage.tsx @@ -6,7 +6,7 @@ import { PencilSquareIcon, BellIcon, } from '@heroicons/react/24/outline'; -import loadingImg from '../../assets/loadingImg.svg'; +import loadingImg from '../../../assets/loadingImg.svg'; import { ROUTES } from '../../../constants/user/routes'; import { useMyProfileInfo } from '../../../hooks/user/useMyInfo'; import Sidebar from '../../../components/common/sidebar/Sidebar'; diff --git a/src/pages/user/projectDetail/ProjectDetail.styled.ts b/src/pages/user/projectDetail/ProjectDetail.styled.ts index efe0746f..afcda36c 100644 --- a/src/pages/user/projectDetail/ProjectDetail.styled.ts +++ b/src/pages/user/projectDetail/ProjectDetail.styled.ts @@ -1,5 +1,5 @@ import styled from 'styled-components'; -import Button from '../../components/common/Button/Button'; +import Button from '../../../components/common/Button/Button'; export const Container = styled.div` width: 100%; diff --git a/src/pages/user/projectDetail/ProjectDetail.tsx b/src/pages/user/projectDetail/ProjectDetail.tsx index bc9b6195..14079c45 100644 --- a/src/pages/user/projectDetail/ProjectDetail.tsx +++ b/src/pages/user/projectDetail/ProjectDetail.tsx @@ -41,6 +41,14 @@ const ProjectDetail = () => { ); } + if (!userData) { + return ( + + {message} + + ); + } + const handleApplyClick = () => { navigate(`${ROUTES.apply}/${id}`); }; @@ -50,6 +58,9 @@ const ProjectDetail = () => { navigate(`/user/${userId}`); }; + console.log(data); + console.log(userData.id); + return ( @@ -80,7 +91,9 @@ const ProjectDetail = () => { - {userData?.id !== data.user.id ? ( + {userData.id !== data.user.id && + !data.acceptedIds.includes(userData.id) && + !data.applicantIds.includes(userData.id) ? (