[Feature]: 스터디 상세 정보 작성 (#56)

* chore: lock 패키지 변경 사항 반영 * chore: 중복된 Navbar 컴포넌트 삭제 * feat: 개설 스터디 기본 잡기 * feat: 스터디 개설 페이지 레이아웃 * fix: 찌그러짐 방지용 minWidth 추가 * feat: 스터디 개설하기 뷰 생성 * fix: 개설된 스터디로 화면 옮기기 * feat: auth 체크용 middleWare 생성 * fix: utils fetcher 함수 export 경로 변경 * feat: 스터디 생성하기 페이지 생성 * fix: router handler 삭제 * refactor: api path 상수로 수정 * feat: isAdmin 함수 추가 * fix: 코드리뷰 반영 * fix: admin여부에 따라 스터디 생성 박스 보이지 않도록 * chore: 패키지 설치 * fix: 빌드에러 고치기 * fix: isadmin 판별 로직 미들웨어에서 진행 * feat: 역할 논리 다시 * fix: 폴더명 변경 * fix: createStudy 경로 변경 * feat:wow-icons 추가 * refactor: 컴포넌트 폴더위치 변경 * chore:react-hook-form 설치 * feat: 복잡한 UI 설계 react-hook-form * feat: 스터디 수강 시작 날짜 지정 * chore: timepicker 패키지 설치 * feat: 스터디 신청 UI 완성 * fix: 쓸데없는 콘솔로그 제거 * feat: api 연결 * feat:api 호출 성공시 redirect * fix: 캐시 지워서 빌드에러 해결 * chore: 패키지 설치 * feat: 스터디 리스트 보기 뷰 * fix: api 관련 코드리뷰 반영 * fix: 코드리뷰 반영 * fix: navbar 두개인것 고치기 * feat: Header, 기본 레이아웃 세팅 * feat: Header 생성 * feat: 출석 보기 * fix: 코드리뷰 반영 * fix: 코드리뷰 반영 * fix: 코드리뷰 반영 * fix: api 추가 및 하드코딩 제거 * feat: 과제 목록 보기 api 연결 * feat: 과제 목록 생성 * feat: 스터디 커리큘럼 생성 기능 및 api 연결 * feat: 스터디 기본 정보 대시보드 * fix: 노션 링크 없을 때에 에러페이지 안뜨게끔 수정 * fix: padwithzero 추가 * fix: 노션 null 처리 진행 * fix: 중복 요소 제거 * fix: 코드리뷰 반영 및 모든 mock 데이터 제거 * fix: 필요없는 console 삭제 * fix: entity 관리하기 쉽게 분리 * feat: 스터디 상세 정보 생성 api 연결 * feat: StudyInfobox 컴포넌트 구성 완료 * feat: 스터디 상세 정보 입력 api 연결 * fix: timeType 추가 * fix: type 고치기 * fix: next-cache 쓸데없이 하는 부분 제거 * feat: 스터디 상세 정보 입력 모달창 생성 * fix: entity 분리한거 합치기 * fix: 코드리뷰 반영 * feat: 커스텀 훅으로 로직 분리 * fix: 코드리뷰 반영, 빌드에러 해결 * fix: 폴더명 수정 * fix: 빌드에러 해결 * fix: 캐시 지우고 폴더명 다시 시도 * fix: 파일명 오류 수정 * fix: 빌드 캐시 지우기 * fix: 새로운 폴더 생성 * fix: 폴더명 다시 되돌림 * fix: 폴더명 명확하게 변경 * fix: 빌드에러 해결 * fix: sessions로 API 변경, 선언적인 코드로 변경 * fix: 세션을커리큘럼으로 바꾸어요 * fix: 스터디 시간 없을 경우 예외처리 * fix: layout overscroll 처리 * fix: query사용 방법 수정 * fix: 스타일 수정 * fix: 코드리뷰 반영 --------- Co-authored-by: ghdtjgus76 <[email protected]>
GDSC-Hongik · Aug 30, 2024 · 6a5c088 · 6a5c088
1 parent 153759f
commit 6a5c088
Show file tree

Hide file tree

Showing 51 changed files with 1,030 additions and 216 deletions.
diff --git a/apps/admin/apis/form/createStudyApi.ts b/apps/admin/apis/form/createStudyApi.ts
diff --git a/apps/admin/apis/study/createStudyApi.ts b/apps/admin/apis/study/createStudyApi.ts
@@ -1,18 +1,22 @@
 import { fetcher } from "@wow-class/utils";
 import { apiPath } from "constants/apiPath";
-import { tags } from "constants/tags";
-import type { StudyListApiResponseDto } from "types/dtos/studyList";
+import type { CreateStudyApiRequestDto } from "types/dtos/createStudy";
+import type { CreateStudyDetailInfoApiRequestDto } from "types/dtos/studyDetailInfo";
 
 export const createStudyApi = {
-  getStudyList: async () => {
-    const response = await fetcher.get<StudyListApiResponseDto[]>(
-      apiPath.studyList,
-      {
-        next: { tags: [tags.studyList] },
-        cache: "force-cache",
-      }
-    );
+  postCreateStudy: async (data: CreateStudyApiRequestDto) => {
+    const response = await fetcher.post(apiPath.createStudy, data);
 
-    return response.data;
+    return { success: response.ok };
+  },
+  postStudyDetailInfo: async (
+    data: CreateStudyDetailInfoApiRequestDto,
+    studyId: number
+  ) => {
+    const response = await fetcher.patch(
+      `${apiPath.createStudyDetailInfo}/${studyId}`,
+      data
+    );
+    return { success: response.ok };
   },
 };
diff --git a/apps/admin/apis/study/studyInfoApi.ts → apps/admin/apis/study/studyApi.ts b/apps/admin/apis/study/studyInfoApi.ts → apps/admin/apis/study/studyApi.ts
@@ -1,13 +1,25 @@
 import { fetcher } from "@wow-class/utils";
-import { mentorApiPath } from "constants/apiPath";
+import { apiPath, mentorApiPath } from "constants/apiPath";
 import { tags } from "constants/tags";
 import type { AnnouncementApiResponseDto } from "types/dtos/announcement";
 import type { AssignmentApiResponseDto } from "types/dtos/assignmentList";
-import type { SessionApiResponseDto } from "types/dtos/sessionList";
+import type { CurriculumApiResponseDto } from "types/dtos/curriculumList";
 import type { StudyBasicInfoApiResponseDto } from "types/dtos/studyBasicInfo";
 import type { StudyAnnouncementType } from "types/entities/study";
 
-export const studyInfoApi = {
+import type { StudyListApiResponseDto } from "../../types/dtos/studyList";
+
+export const studyApi = {
+  getStudyList: async () => {
+    const response = await fetcher.get<StudyListApiResponseDto[]>(
+      apiPath.studyList,
+      {
+        next: { tags: [tags.studyList] },
+      }
+    );
+
+    return response.data;
+  },
   getStudyBasicInfo: async (studyId: number) => {
     const response = await fetcher.get<StudyBasicInfoApiResponseDto>(
       `/common/studies/${studyId}`,
@@ -36,11 +48,11 @@ export const studyInfoApi = {
 
     return { success: response.ok };
   },
-  getSessionList: async (studyId: number) => {
-    const response = await fetcher.get<SessionApiResponseDto[]>(
-      `${mentorApiPath.sessions}?study=${studyId}`,
+  getCurriculumList: async (studyId: number) => {
+    const response = await fetcher.get<CurriculumApiResponseDto[]>(
+      `${mentorApiPath.curriculums}?studyId=${studyId}`,
       {
-        next: { tags: [tags.sessions] },
+        next: { tags: [tags.curriculums] },
         cache: "force-cache",
       }
     );

diff --git a/apps/admin/app/global.css b/apps/admin/app/global.css
@@ -8,3 +8,6 @@ body {
   flex-direction: row;
   min-height: 100vh;
 }
+::-webkit-scrollbar {
+  display: none;
+}
diff --git a/apps/admin/app/studies/[studyId]/@modal/(.)announcement-delete/page.tsx b/apps/admin/app/studies/[studyId]/@modal/(.)announcement-delete/page.tsx
@@ -3,7 +3,7 @@
 import { Flex } from "@styled-system/jsx";
 import { Modal, Space, Text } from "@wow-class/ui";
 import { useModalRoute } from "@wow-class/ui/hooks";
-import { studyInfoApi } from "apis/study/studyInfoApi";
+import { studyApi } from "apis/study/studyApi";
 import { tags } from "constants/tags";
 import { useSearchParams } from "next/navigation";
 import { revalidateTagByName } from "utils/revalidateTagByName";
@@ -17,7 +17,7 @@ const AnnouncementDeleteModal = () => {
   const { closeModal } = useModalRoute();
 
   const handleClickDeleteButton = async () => {
-    const result = await studyInfoApi.deleteStudyAnnouncement(
+    const result = await studyApi.deleteStudyAnnouncement(
       Number(studyAnnouncementId)
     );
     if (result.success) {

diff --git a/apps/admin/app/studies/[studyId]/@modal/(.)announcement-modify/page.tsx b/apps/admin/app/studies/[studyId]/@modal/(.)announcement-modify/page.tsx
@@ -3,7 +3,7 @@
 import { Flex } from "@styled-system/jsx";
 import { Modal, Space, Text } from "@wow-class/ui";
 import { useModalRoute } from "@wow-class/ui/hooks";
-import { studyInfoApi } from "apis/study/studyInfoApi";
+import { studyApi } from "apis/study/studyApi";
 import { tags } from "constants/tags";
 import { useSearchParams } from "next/navigation";
 import { useState } from "react";
@@ -25,7 +25,7 @@ const AnnouncementModifyModal = () => {
   const { closeModal } = useModalRoute();
 
   const handleClickModifyButton = async () => {
-    const result = await studyInfoApi.modifyStudyAnnouncement(
+    const result = await studyApi.modifyStudyAnnouncement(
       Number(studyAnnouncementId),
       studyAnnouncement
     );

diff --git a/apps/admin/app/studies/[studyId]/_components/announcement/CreateStudyAnnouncement.tsx b/apps/admin/app/studies/[studyId]/_components/announcement/CreateStudyAnnouncement.tsx
@@ -3,7 +3,7 @@
 import { css } from "@styled-system/css";
 import { Flex } from "@styled-system/jsx";
 import { Text } from "@wow-class/ui";
-import { studyInfoApi } from "apis/study/studyInfoApi";
+import { studyApi } from "apis/study/studyApi";
 import { tags } from "constants/tags";
 import { useState } from "react";
 import type { StudyAnnouncementType } from "types/entities/study";
@@ -19,7 +19,7 @@ const CreateStudyAnnouncement = ({ studyId }: { studyId: string }) => {
     });
 
   const handlePublishAnnouncement = async (studyId: string) => {
-    const { success } = await studyInfoApi.publishStudyAnnouncement(
+    const { success } = await studyApi.publishStudyAnnouncement(
       parseInt(studyId, 10),
       studyAnnouncement
     );

diff --git a/apps/admin/app/studies/[studyId]/_components/announcement/StudyAnnouncement.tsx b/apps/admin/app/studies/[studyId]/_components/announcement/StudyAnnouncement.tsx
@@ -1,7 +1,7 @@
 import { css } from "@styled-system/css";
 import { Flex } from "@styled-system/jsx";
 import { Space, Table, Text } from "@wow-class/ui";
-import { studyInfoApi } from "apis/study/studyInfoApi";
+import { studyApi } from "apis/study/studyApi";
 import { routerPath } from "constants/router/routerPath";
 import Image from "next/image";
 import Link from "next/link";
@@ -12,12 +12,12 @@ import TextButton from "wowds-ui/TextButton";
 import CreateStudyAnnouncement from "./CreateStudyAnnouncement";
 
 const StudyAnnouncement = async ({ studyId }: { studyId: string }) => {
-  const announcementList = await studyInfoApi.getStudyAnnouncement(
+  const announcementList = await studyApi.getStudyAnnouncement(
     parseInt(studyId, 10)
   );
 
   return (
-    <section aria-label="session-list">
+    <section aria-label="curriculum-list">
       <Text typo="h2">스터디 공지</Text>
       <Space height={24} />
       <CreateStudyAnnouncement studyId={studyId} />

diff --git a/apps/admin/app/studies/[studyId]/_components/assignment/AssignmentList.tsx b/apps/admin/app/studies/[studyId]/_components/assignment/AssignmentList.tsx
@@ -1,10 +1,10 @@
 import { Space, Text } from "@wow-class/ui";
-import { studyInfoApi } from "apis/study/studyInfoApi";
+import { studyApi } from "apis/study/studyApi";
 
 import AssignmentListItem from "./AssignmentListItem";
 
 const AssignmentList = async ({ studyId }: { studyId: string }) => {
-  const assignmentList = await studyInfoApi.getAssignmentList(
+  const assignmentList = await studyApi.getAssignmentList(
     parseInt(studyId, 10)
   );
 

diff --git a/apps/admin/app/studies/[studyId]/_components/assignment/AssignmentListItem.tsx b/apps/admin/app/studies/[studyId]/_components/assignment/AssignmentListItem.tsx
@@ -3,7 +3,7 @@ import { cva } from "@styled-system/css";
 import { Flex } from "@styled-system/jsx";
 import { Table, Text } from "@wow-class/ui";
 import { padWithZero, parseISODate } from "@wow-class/utils";
-import { studyInfoApi } from "apis/study/studyInfoApi";
+import { studyApi } from "apis/study/studyApi";
 import { tags } from "constants/tags";
 import Link from "next/link";
 import type { AssignmentApiResponseDto } from "types/dtos/assignmentList";
@@ -30,7 +30,7 @@ const AssignmentListItem = ({
   const studyDeadline = `종료 : ${year}년 ${month}월 ${day}일 ${padWithZero(hours)}:${padWithZero(minutes)}`;
 
   const handleCancelAssignment = async (studyDetailId: number) => {
-    const { success } = await studyInfoApi.cancelAssignment(studyDetailId);
+    const { success } = await studyApi.cancelAssignment(studyDetailId);
     if (success) {
       window.alert("휴강 처리에 성공했어요.");
       revalidateTagByName(tags.assignments);

diff --git a/apps/admin/app/studies/[studyId]/_components/assignment/CancelStudyButton.tsx b/apps/admin/app/studies/[studyId]/_components/assignment/CancelStudyButton.tsx
@@ -1,8 +1,8 @@
 "use client";
 import { Flex } from "@styled-system/jsx";
-import { studyInfoApi } from "apis/study/studyInfoApi";
+import { studyApi } from "apis/study/studyApi";
 import { useRouter } from "next/navigation";
-import type { AssignmentStatusType } from "types/entities/study";
+import type { StudyAssignmentStatusType } from "types/entities/study";
 import Button from "wowds-ui/Button";
 
 const CancelStudyButton = ({
@@ -12,11 +12,11 @@ const CancelStudyButton = ({
 }: {
   descriptionLink: string;
   studyDetailId: number;
-  assignmentStatus: AssignmentStatusType;
+  assignmentStatus: StudyAssignmentStatusType;
 }) => {
   const router = useRouter();
   const handleCancelAssignment = async (studyDetailId: number) => {
-    const { success } = await studyInfoApi.cancelAssignment(studyDetailId);
+    const { success } = await studyApi.cancelAssignment(studyDetailId);
     if (success) {
       console.log("휴강 처리에 성공했어요.");
     } else {

diff --git a/apps/admin/app/studies/[studyId]/_components/curriculum/CurriculumList.tsx b/apps/admin/app/studies/[studyId]/_components/curriculum/CurriculumList.tsx
@@ -0,0 +1,30 @@
+import { Space, Text } from "@wow-class/ui";
+import { studyApi } from "apis/study/studyApi";
+
+import CurriculumListItem from "./CurriculumListItem";
+import EmptyCurriculumList from "./EmptyCurriculumList";
+
+const CurriculumList = async ({ studyId }: { studyId: string }) => {
+  const curriculumList = await studyApi.getCurriculumList(
+    parseInt(studyId, 10)
+  );
+
+  if (curriculumList?.length === 0) {
+    return <EmptyCurriculumList />;
+  }
+
+  return (
+    <section aria-label="curriculum-list">
+      <Text typo="h2">스터디 커리큘럼</Text>
+      <Space height={24} />
+      {curriculumList?.map((curriculum) => (
+        <CurriculumListItem
+          curriculum={curriculum}
+          key={`curriculumItem-${curriculum.studyDetailId}`}
+        />
+      ))}
+    </section>
+  );
+};
+
+export default CurriculumList;
diff --git a/...]/_components/session/SessionListItem.tsx → ...ponents/curriculum/CurriculumListItem.tsx b/...]/_components/session/SessionListItem.tsx → ...ponents/curriculum/CurriculumListItem.tsx
@@ -3,18 +3,22 @@ import { Flex } from "@styled-system/jsx";
 import { Table, Text } from "@wow-class/ui";
 import { padWithZero, parseISODate } from "@wow-class/utils";
 import type { ComponentProps } from "react";
-import type { SessionApiResponseDto } from "types/dtos/sessionList";
+import type { CurriculumApiResponseDto } from "types/dtos/curriculumList";
 import type { StudyDifficultyType } from "types/entities/study";
 import getIsCurrentWeek from "utils/getIsCurrentWeek";
 import Tag from "wowds-ui/Tag";
 
-const SessionListItem = ({ session }: { session: SessionApiResponseDto }) => {
-  const { description = "", period, week, title, difficulty } = session;
+const CurriculumListItem = ({
+  curriculum,
+}: {
+  curriculum: CurriculumApiResponseDto;
+}) => {
+  const { description = "", period, week, title, difficulty } = curriculum;
   const { startDate, endDate } = period;
   const { month: startMonth, day: startDay } = parseISODate(startDate);
   const { month: endMonth, day: endDay } = parseISODate(endDate);
 
-  const sessionTimeLine = `${padWithZero(startMonth)}.${padWithZero(startDay)} - ${padWithZero(endMonth)}.${padWithZero(endDay)}`;
+  const curriculumTimeLine = `${padWithZero(startMonth)}.${padWithZero(startDay)} - ${padWithZero(endMonth)}.${padWithZero(endDay)}`;
   const thisWeekAssignment = getIsCurrentWeek(endDate);
 
   return (
@@ -45,13 +49,13 @@ const SessionListItem = ({ session }: { session: SessionApiResponseDto }) => {
         </Flex>
       </Table.Left>
       <Table.Right>
-        <Text typo="body1">{sessionTimeLine}</Text>
+        <Text typo="body1">{curriculumTimeLine}</Text>
       </Table.Right>
     </Table>
   );
 };
 
-export default SessionListItem;
+export default CurriculumListItem;
 
 const ThisWeekBarStyle = cva({
   base: {

diff --git a/.../_components/session/EmptySessionList.tsx → ...onents/curriculum/EmptyCurriculumList.tsx b/.../_components/session/EmptySessionList.tsx → ...onents/curriculum/EmptyCurriculumList.tsx
@@ -2,15 +2,15 @@ import { Flex } from "@styled-system/jsx";
 import { Space, Text } from "@wow-class/ui";
 import Image from "next/image";
 
-const EmptySessionList = () => {
+const EmptyCurriculumList = () => {
   return (
-    <section aria-label="empty-session-list" style={{ width: "100%" }}>
+    <section aria-label="empty-curriculum-list" style={{ width: "100%" }}>
       <Text typo="h2">스터디 커리큘럼</Text>
       <Space height={24} />
       <Flex direction="column" width="100%">
         <Flex alignItems="center" direction="column" gap="xs">
           <Image
-            alt="empty-session"
+            alt="empty-curriculum"
             height={50}
             src="/images/empty.svg"
             width={150}
@@ -24,4 +24,4 @@ const EmptySessionList = () => {
   );
 };
 
-export default EmptySessionList;
+export default EmptyCurriculumList;