-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* feat: 팀페이지에서 스터디 목록 라우팅 등록 #294 * feat: 스터디 생성 실패 시, 에러 문구 띄워주기 #294 * feat: 자신이 속한 팀이 아닐 때는 초대 코드 및 스터디/파일 생성 버튼이 안 보이도록 수정 - 전역변수로 myTeam이라는 자신이 속한 teamId를 담는 배열로 자신이 팀인지 검증했습니다. #294 * feat: 학습자료 혹은 스터디가 없을 때 생성해달라는 문구 추가 #294 * feat: 스터디 전체 보기 구현 #294 * feat: team 수정후 자동으로 다시 팀 정보 가져오도록 로직 수정 #294 * feat: 스터디 갤러리의 PageNavigator 의 pages 추가 #294 * feat: 수정된 팀 내 스터디 호출 api 반환 값에 따른 변화 #294 * feat: 팀 수정 시 바로 반영되도록 수정 #294 * refeactor: 사용하지 않는 mock data(studyCard) 삭제 #294 * feat: teamInfo 관련 querykey 수정 #294
- Loading branch information
Showing
16 changed files
with
255 additions
and
169 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,28 @@ | ||
| 'use client'; | ||
|
|
||
| import { Button, Flex, Text } from '@chakra-ui/react'; | ||
| import { useState } from 'react'; | ||
|
|
||
| import StudyModal from '@/containers/study/Modal/StudyModal'; | ||
| import StudyGallery from '@/containers/study-gallery/StudyGallery'; | ||
|
|
||
| const Page = ({ params }: { params: { teamId: number } }) => { | ||
| const [isOpenModal, setIsOpenModal] = useState(false); | ||
|
|
||
| return ( | ||
| <Flex align="center" direction="column" gap="9" w="100%" p="8"> | ||
| <Flex justify="space-between" w="100%"> | ||
| <Flex direction="row" gap="2"> | ||
| <Text textStyle="bold_2xl">스터디 갤러리</Text> | ||
| </Flex> | ||
| <Button color="white" bg="orange_dark" onClick={() => setIsOpenModal(true)} rounded="full"> | ||
| 스터디 추가 | ||
| </Button> | ||
| </Flex> | ||
| <StudyGallery teamId={params.teamId} /> | ||
| <StudyModal teamId={params.teamId} isOpen={isOpenModal} setIsModalOpen={setIsOpenModal} studyInfo={null} /> | ||
| </Flex> | ||
| ); | ||
| }; | ||
|
|
||
| export default Page; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,68 @@ | ||
| /* eslint-disable react-hooks/exhaustive-deps */ | ||
| import { Flex, Grid, useBreakpointValue } from '@chakra-ui/react'; | ||
| import { useEffect, useState } from 'react'; | ||
|
|
||
| import { getStudies } from '@/app/api/study'; | ||
| import PageNavigator from '@/components/PageNavigator'; | ||
| import StudyCard from '@/components/StudyCard'; | ||
| import SuggestionCreate from '@/containers/team/SuggestionCreate'; | ||
| import { StudyRank } from '@/types'; | ||
|
|
||
| const StudyGallery = ({ teamId }: { teamId: number }) => { | ||
| const [currentPage, setCurrentPage] = useState<number>(1); | ||
| const [studyArray, setStudyArray] = useState<StudyRank[]>([]); | ||
| const [cardIdx, setCardIdx] = useState<number>(0); | ||
|
|
||
| const [studyLength, setStudyLength] = useState<number>(0); | ||
|
|
||
| const itemsPerPage = useBreakpointValue({ base: 4, md: 8, xl: 10 })!; | ||
|
|
||
| useEffect(() => { | ||
| getStudies(teamId, currentPage - 1, itemsPerPage).then((res) => { | ||
| if (res.ok) { | ||
| setStudyArray(res.body.content); | ||
| setStudyLength(res.body.totalElements); | ||
| } | ||
| }); | ||
| setCardIdx((currentPage - 1) * itemsPerPage); | ||
| }, [currentPage, itemsPerPage]); | ||
|
|
||
| if (studyArray.length === 0) { | ||
| return <SuggestionCreate category="스터디" />; | ||
| } | ||
|
|
||
| return ( | ||
| <Flex direction="column"> | ||
| <Grid gap={{ sm: '2', md: '4', xl: '8' }} templateColumns={`repeat(${itemsPerPage / 2}, 1fr)`} w="100%"> | ||
| {studyArray | ||
| .map((study, index) => ({ | ||
| ...study.studyReferenceResponse, | ||
| rank: cardIdx + index + 1, | ||
| })) | ||
| .map((study) => ( | ||
| <StudyCard | ||
| key={study.id} | ||
| teamId={teamId} | ||
| id={study.id} | ||
| name={study.name} | ||
| description={study.description} | ||
| startDate={study.startDate} | ||
| endDate={study.endDate} | ||
| status={study.status} | ||
| cropId={study.cropId} | ||
| studyProgressRatio={study.studyProgressRatio} | ||
| rank={study.rank} | ||
| /> | ||
| ))} | ||
| </Grid> | ||
| <PageNavigator | ||
| currentPage={currentPage} | ||
| setCurrentPage={setCurrentPage} | ||
| componentLength={studyLength} | ||
| itemsPerPage={itemsPerPage} | ||
| /> | ||
| </Flex> | ||
| ); | ||
| }; | ||
|
|
||
| export default StudyGallery; |
Oops, something went wrong.