diff --git a/README.md b/README.md index 108352a..0270dbb 100644 --- a/README.md +++ b/README.md @@ -23,9 +23,9 @@
-| **공정민** | **임희정** | **김예나** | **배금빈** | -| :---------------------------------------------------------------------------------------------------------------------------------------: | :-----------------------------------------------------------------------------------------------------------------------------------------: | :------------------------------------------------------------------------------------------------------------------------------: | :------------------------------------------------------------------------------------------------------------------------------------------: | -| [
@jeongmin59](https://github.com/jeongmin59) | [
@heejung0413](https://github.com/heejung0413) | [
@yeneua](https://github.com/yeneua) | [
@sunflower888](https://github.com/sunflower888) | +| **임희정** | **김예나** | **공정민** | **배금빈** | +| :-----------------------------------------------------------------------------------------------------------------------------------------: | :------------------------------------------------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------------------------------------------------------: | :------------------------------------------------------------------------------------------------------------------------------------------: | +| [
@heejung0413](https://github.com/heejung0413) | [
@yeneua](https://github.com/yeneua) | [
@jeongmin59](https://github.com/jeongmin59) | [
@sunflower888](https://github.com/sunflower888) |
@@ -56,7 +56,7 @@ - 변수 타입을 지정하고 javascript로 컴파일되어 실행할 수 있습니다. - 컴파일 과정에서 타입을 지정함으로써, 에러 예방과 손쉬운 디버깅이 가능했습니다. -### styled-component, Chakra UI +### styled-components, Chakra UI - styled-component - props를 이용한 조건부 스타일링을 활용하여 상황에 알맞은 스타일을 적용시킬 수 있었습니다. @@ -65,7 +65,7 @@ - Chakra UI - React 애플리케이션을 빌드하는데 필요한 블록을 간단하고 모듈적이며 접근 가능하게 만들 수 있는 UI 컴포넌트 라이브러리입니다. -### eslint, prettier +### Eslint, Prettier - 정해진 규칙에 따라 자동적으로 코드 스타일을 정리해 코드의 일관성을 유지하고자 했습니다. - 코드 품질 관리는 eslint에, 코드 포맷팅은 prettier에 일임해 사용했습니다. @@ -76,16 +76,6 @@ ## 3. 역할 분담 -### 🤩공정민 - -- **UI** - - 페이지 : 회고 생성 페이지, 프로필 페이지, 설문조사 페이지 - - 공통 컴포넌트 : 팀원 초대 모달 -- **기능** - - Cognito 인증 처리 - - Amplify ui를 활용한 로그인 및 회원가입 페이지 구현 - - 개발환경 구축 (webpack 사용) -
### 👻임희정 @@ -96,6 +86,8 @@ - **기능** - 백엔드에서 주어진 API 타입 작성, API 비동기 함수 객체 설정 - 회고 카드 작성 페이지 전반적 작업 ( 댓글 기능, 좋아요, 회고 카드 작성 및 수정) + - 알림 기능 +- **개발환경 구축** - MSW 설정 - ESLint, Prettier 정책 설정 - Chakra UI 공통 theme 설정 및 브랜드 컬러 커스텀 @@ -106,12 +98,25 @@ - **UI** - - 페이지: RetroList 페이지, Main 화면 서브 페이지 디자인, Action Items 담당자 지정 창 + - 페이지: RetroList 페이지, Main 화면 서브 페이지 디자인, Action Items 담당자 지정 창, 그룹화 페이지 - **기능** - 메인 페이지 react-fullpage 라이브러리 적용 - RetroList API 연결 - Action Items 담당자 지정 창 API 연결 + - 그룹화 기능 구현 + +
+ +### 🤩공정민 + +- **UI** + - 페이지 : 회고 생성 페이지, 프로필 페이지, 설문조사 페이지 + - 공통 컴포넌트 : 팀원 초대 모달 +- **기능** + - Cognito 인증 처리 + - Amplify ui를 활용한 로그인 및 회원가입 페이지 구현 + - 개발환경 구축 (webpack 사용)
@@ -123,6 +128,7 @@ - 설문조사 페이지 API 연결 - 메인 페이지 Contact API 연결 - 데이터 분석을 위한 버튼 Id 값 입력 + - 공지사항 게시판 전반적인 기능 구현
@@ -265,3 +271,11 @@ | ![invited](https://github.com/donga-it-club/past-forward-frontend/assets/138123134/fa2f03f1-07ef-4cf3-bb07-07e64de20dc3) |
+ +#### 5. 그룹화 페이지 + +- 생성한 회고들을 그룹화 시킬 수 있습니다. + +| 그룹화페이지 | +| ----------------------------------------------------------------------------------------- | +| ![group](https://github.com/user-attachments/assets/a8d746c4-4621-417a-9092-7a428518ef7a) | diff --git a/src/api/inviteTeamApi/postInviteTeam.tsx b/src/api/inviteTeamApi/postInviteTeam.tsx index 453d1c9..75656d2 100644 --- a/src/api/inviteTeamApi/postInviteTeam.tsx +++ b/src/api/inviteTeamApi/postInviteTeam.tsx @@ -1,7 +1,19 @@ // import { PostInviteTeamRequest } from '../@types/InviteTeam'; import axiosInstance from '../axiosConfig'; -const postInviteTeam = async (invitationId: string) => { +export interface InviteTeamData { + teamId: number; + userId: number; + role: string; +} + +export interface InviteTeamResponse { + code: number; + message: string; + data: InviteTeamData; +} + +const postInviteTeam = async (invitationId: string): Promise => { try { const response = await axiosInstance.post('/teams/accept-invitation', { invitationCode: invitationId, // useParams 로 받아온 코드 diff --git a/src/components/RetroList/ContentsList.tsx b/src/components/RetroList/ContentsList.tsx index 45be3c7..a106683 100644 --- a/src/components/RetroList/ContentsList.tsx +++ b/src/components/RetroList/ContentsList.tsx @@ -104,7 +104,6 @@ const ContentList: React.FC = ({ data, viewMode, searchData, s filename: item.thumbnail, method: 'GET', }); - // console.log('s3 사진 받아오기 성공', imageResponse.data.preSignedUrl); setImage(prevImage => ({ ...prevImage, [item.id]: imageResponse.data.preSignedUrl, diff --git a/src/components/alarm/Alarm.tsx b/src/components/alarm/Alarm.tsx index 54f270d..bb16d53 100644 --- a/src/components/alarm/Alarm.tsx +++ b/src/components/alarm/Alarm.tsx @@ -76,8 +76,10 @@ const Alarm = () => { try { if (user && user.userId) { await NotificationServices.delete({ userId: user.userId }); - setRender(prev => !prev); } + setRender(prev => !prev); + setOtherNotification([]); + setTodayNotification([]); } catch { toast.error('전체 삭제가 처리되지 않았습니다.'); } @@ -87,15 +89,23 @@ const Alarm = () => { try { await NotificationServices.readPost({ notificationId: notificationId }); setRender(prev => !prev); + const isOtherNotification = otherNotification.some( + notification => notification.notificationId === notificationId, + ); + if (isOtherNotification) { + setOtherNotification([]); + } else { + setTodayNotification([]); + } } catch { console.error('error'); } }; useEffect(() => { - fetchNotification(); fetchUser(); - }, [render]); + fetchNotification(); + }, [todayNotification.length, otherNotification.length, render]); useEffect(() => { if (notification) { @@ -108,11 +118,11 @@ const Alarm = () => { - {notification && notification.length > 0 && ( + {todayNotification.concat(otherNotification).length > 0 ? ( <> {todayNotification.concat(otherNotification).length} - )} + ) : null} @@ -208,9 +218,6 @@ const Alarm = () => { 알림 없음 )} - - {/* 어제 받은 알림 - 이채연님이 회고보드에 댓글을 작성했습니다 */} diff --git a/src/components/inviteTeam/AcceptInvite.tsx b/src/components/inviteTeam/AcceptInvite.tsx index 9bd5a60..5b146fb 100644 --- a/src/components/inviteTeam/AcceptInvite.tsx +++ b/src/components/inviteTeam/AcceptInvite.tsx @@ -45,6 +45,11 @@ const AcceptInvite: React.FC = () => { toast.error('리더는 초대 수락을 할 수 없습니다.'); } + if (response.code == 400) { + toast.error('유효하지 않은 초대 메세지입니다.'); + navigate('/'); + } + if (response.data.role === 'MEMBER') { setInviteSuccess(true); // 초대 요청이 성공했을 때 상태를 true로 변경 } else { diff --git a/src/components/layout/parts/ProfileNavBar.tsx b/src/components/layout/parts/ProfileNavBar.tsx index 8115439..b96436a 100644 --- a/src/components/layout/parts/ProfileNavBar.tsx +++ b/src/components/layout/parts/ProfileNavBar.tsx @@ -1,4 +1,3 @@ -import { Gear } from 'react-bootstrap-icons'; import { GiHamburgerMenu } from 'react-icons/gi'; import { useNavigate } from 'react-router-dom'; import { Button, Drawer, DrawerContent, DrawerOverlay, Flex, useDisclosure } from '@chakra-ui/react'; @@ -67,9 +66,6 @@ const PageNavBar = () => { - - - + ) : ( + + )} + )} diff --git a/src/components/writeRetro/task/ReviseCommentModal.tsx b/src/components/writeRetro/task/ReviseCommentModal.tsx index 488ac1f..1243acf 100644 --- a/src/components/writeRetro/task/ReviseCommentModal.tsx +++ b/src/components/writeRetro/task/ReviseCommentModal.tsx @@ -17,14 +17,12 @@ import * as S from '@/styles/writeRetroStyles/Layout.style'; interface Props { comment: CommentData; setRendering: React.Dispatch>; - section: CommentData; } -const ReviseCommentModal: FC = ({ comment, setRendering, section }) => { +const ReviseCommentModal: FC = ({ comment, setRendering }) => { // Input 높이 자동 조절 const [value, setValue] = useState(''); const toast = useCustomToast(); - console.log(section); const ChangeContent = async () => { try { diff --git a/src/components/writeRetro/task/TeamTask.tsx b/src/components/writeRetro/task/TeamTask.tsx index 1c8933e..4e51eac 100644 --- a/src/components/writeRetro/task/TeamTask.tsx +++ b/src/components/writeRetro/task/TeamTask.tsx @@ -77,7 +77,7 @@ const TeamTask: FC = ({ section, setRendering, teamId, imageURL, user, fe setRendering(prev => !prev); toast.info('회고 카드가 삭제되었습니다.'); } catch { - toast.error('존재하지 않는 회고 카드입니다.'); + toast.error('회고 카드가 삭제되지 않았습니다.'); } }; diff --git a/src/components/writeRetro/task/taskMessage/TeamTaskMessage.tsx b/src/components/writeRetro/task/taskMessage/TeamTaskMessage.tsx index 5692ea6..a799244 100644 --- a/src/components/writeRetro/task/taskMessage/TeamTaskMessage.tsx +++ b/src/components/writeRetro/task/taskMessage/TeamTaskMessage.tsx @@ -1,6 +1,6 @@ import { ChangeEvent, FC, useEffect, useState } from 'react'; import { CgProfile } from 'react-icons/cg'; -import { Center, Flex, Spinner } from '@chakra-ui/react'; +import { Button, Center, Flex, Spinner } from '@chakra-ui/react'; import DeleteData from '../DeleteData'; import ReviseCommentModal from '../ReviseCommentModal'; import { CommentData, sectionData } from '@/api/@types/Section'; @@ -23,6 +23,7 @@ const TeamTaskMessage: FC = ({ section, setRendering, user, teamId }) => const toast = useCustomToast(); const [image, setImage] = useState<{ [key: number]: string }>(''); const [isLoading, setIsLoading] = useState(true); + const [isDisabled, setIsDisabled] = useState(false); const [isImageLoaded, setIsImageLoaded] = useState(false); const handleChange = (e: ChangeEvent) => { @@ -30,8 +31,10 @@ const TeamTaskMessage: FC = ({ section, setRendering, user, teamId }) => }; const handlePostComment = async () => { + setIsDisabled(true); try { await CommentService.post({ sectionId: section.sectionId, commentContent: value }); + setTimeout(() => setIsDisabled(false), 1500); setRendering(prev => !prev); setIsLoading(false); setValue(''); @@ -151,7 +154,13 @@ const TeamTaskMessage: FC = ({ section, setRendering, user, teamId }) => {/* AddMessage */} - 확인 + {isDisabled ? ( + + ) : ( + 확인 + )} diff --git a/src/pages/SurveyPage.tsx b/src/pages/SurveyPage.tsx index a3bd3e1..deb6a40 100644 --- a/src/pages/SurveyPage.tsx +++ b/src/pages/SurveyPage.tsx @@ -28,7 +28,7 @@ const SurveyPage: React.FC = () => { const handleSurvey = async () => { try { - const SurveyRequest = await PostSurvey({ + await PostSurvey({ age: numAge, gender: gender, occupation: job, @@ -37,7 +37,6 @@ const SurveyPage: React.FC = () => { purposes: purpose, emailConsents: emailConsents, }); - console.log('설문조사 전송 성공', SurveyRequest); alert('설문조사가 전송되었습니다.'); // 회고 작성 페이지로 이동 navigate('/create'); diff --git a/src/styles/writeRetroStyles/Layout.style.ts b/src/styles/writeRetroStyles/Layout.style.ts index 490afb7..1309e7c 100644 --- a/src/styles/writeRetroStyles/Layout.style.ts +++ b/src/styles/writeRetroStyles/Layout.style.ts @@ -280,9 +280,6 @@ export const TaskText = styled.p` margin: 20px 0; margin-right: 10px; margin-top: 20px; - &:hover { - cursor: pointer; - } `; export const ReviseText = styled.p`