From 3e480e8fab7a1ddb32a644eff21364190ad6f0ca Mon Sep 17 00:00:00 2001 From: Jeon Jinho Date: Mon, 12 Feb 2024 11:04:29 +0900 Subject: [PATCH] deploy 0.0.5v (#193) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * A사이드 토픽 생성 API 연동 (#175) * fix: lineheight 1.4 기본값 적용 * feat: text, image icon 추가 * fix: padding 값 수정 * fix: 수정된 input theme으로 변경 * feat: 카테고리 input form 추가 * fix: 파일 로직 변경 * feat: 토픽생성 image input 컴포넌트 추가 * fix: textinput props 변경 * feat: 뒤로가기 로직을 위한 코드수정 * feat: B topic step2 추가 * feat: B topic step1 추가 * feat: B topic 페이지 추가 * feat: add delete icon * feat: add maxlength * fix: constant fix * fix: constant fix * fix: form fix * feat: add BTopicCreate Step2 page * feat: separate imageinput component * feat: add imgurl dto * feat: add topic deadline constant * fix: modal close button width, height fix * feat: 토픽생성 api 구축 * feat: 토픽생성 form 유효성 검사 추가 * chore: update gitignore * fix: update value by useWatch * fix: lint error * fix: 로고색상 변경 #169 * feat: 토픽생성 유효성 검사 및 api 연동 * feat: 토픽생성 api dto 수정 * fix: 슬라이더 , 투표완료 컴포넌트 내 로고위치 수정 * fix: topic content 글자수에 따른 size 조정 * fix: 로그인 화면 로고 B 색상 수정 * fix: 슬라이더 topic content text z index 수정 * fix: api 변경에 따라 topic content 받아오도록 수정 * fix: topiccreate dto interface 위치 조정 * feat: Aside topiccreate api 연동 * fix: 절대경로로 수정 --------- Co-authored-by: 전진호 * 토픽생성완료 후 로직 (#176) * fix: lineheight 1.4 기본값 적용 * feat: text, image icon 추가 * fix: padding 값 수정 * fix: 수정된 input theme으로 변경 * feat: 카테고리 input form 추가 * fix: 파일 로직 변경 * feat: 토픽생성 image input 컴포넌트 추가 * fix: textinput props 변경 * feat: 뒤로가기 로직을 위한 코드수정 * feat: B topic step2 추가 * feat: B topic step1 추가 * feat: B topic 페이지 추가 * feat: add delete icon * feat: add maxlength * fix: constant fix * fix: constant fix * fix: form fix * feat: add BTopicCreate Step2 page * feat: separate imageinput component * feat: add imgurl dto * feat: add topic deadline constant * fix: modal close button width, height fix * feat: 토픽생성 api 구축 * feat: 토픽생성 form 유효성 검사 추가 * chore: update gitignore * fix: update value by useWatch * fix: lint error * fix: 로고색상 변경 #169 * feat: 토픽생성 유효성 검사 및 api 연동 * feat: 토픽생성 api dto 수정 * fix: 슬라이더 , 투표완료 컴포넌트 내 로고위치 수정 * fix: topic content 글자수에 따른 size 조정 * fix: 로그인 화면 로고 B 색상 수정 * fix: 슬라이더 topic content text z index 수정 * fix: api 변경에 따라 topic content 받아오도록 수정 * fix: topiccreate dto interface 위치 조정 * feat: Aside topiccreate api 연동 * fix: 절대경로로 수정 * feat: 토픽생성 완료시 각 사이드 화면으로 이동 --------- Co-authored-by: 전진호 * fix: remove enable option (#177) * fix: api url (#178) * Update cd.yml (#180) * fix: TopicCard nullable한 필드 예외처리 추가 (#183) * fix: change topics api url * fix: make TopicResponse's field nullable * fix: optionally render nullable content * feat: make topicSide type to TOPIC_A or TOPIC_B * fix: ATopicCard's topicSide format * 글자수,띄어쓰기에 따른 ui 조정 (#184) * fix: 선택지 글자수, 띄어쓰기에 따라 ui 조정 * fix: 토픽제목 글자수, 띄어쓰기에 따라 ui조정 * A 사이드 토픽 API 연결 (#185) * fix: rename alpha to a * feat: make useTopics to infiniteQuery * feat: make bg color to navy * fix: exclude isOpen from export * feat: add date util * fix: date distance option * feat: add commentCount and createAt to topic model * feat: add side to DTO * fix: remove dummy choices * feat: add comment sheet * fix: getDateDistanceText option condition * feat: add sort to useTopics * fix: vote to topic response * feat: add createdAt and asc to sort * fix: voteTopic response type * feat: add revealed condition * feat: export TopicsRequestDTO * fix: remove unused import * feat: add rea params to set exact query data * feat: add vote to topic * feat: add desc option * fix: timer endtime 수정 * fix: dealine 계산 방식 변경 * fix: 인증 로직 구현 (#188) * fix: remove accessToken from localStorage * feat: add Auth route * fix: change login and add relogin * fix: remove error condition * feat: A topic 투표 응답 모델 수정 (#190) * feat: memoize ATopicCard * fix: add zIndex to show percentage * feat: add voteCount to Choice model * fix: remove req from useTopics * fix: useVoteTopic's onSucess handler * feat: enable scroll when height is not enough (#192) * feat: enable scroll when height is not enough * fix: move slide button inside slide * fix: slide button position --------- Co-authored-by: CHAEYOUNG SONG <77428876+chaeyoung103@users.noreply.github.com> Co-authored-by: chaeyoung103 --- .../Home/TopicCard/TopicCard.styles.tsx | 2 +- src/components/Home/TopicCard/TopicCard.tsx | 13 ++++- .../Home/TopicSwiper/TopicSwiper.tsx | 55 +++++++++++-------- 3 files changed, 44 insertions(+), 26 deletions(-) diff --git a/src/components/Home/TopicCard/TopicCard.styles.tsx b/src/components/Home/TopicCard/TopicCard.styles.tsx index 34a863f..f61656f 100644 --- a/src/components/Home/TopicCard/TopicCard.styles.tsx +++ b/src/components/Home/TopicCard/TopicCard.styles.tsx @@ -9,7 +9,7 @@ export const TopicCardContainer = styled.div` display: flex; flex-direction: column; align-items: center; - height: 100%; + margin-bottom: 100px; overflow: hidden; `; diff --git a/src/components/Home/TopicCard/TopicCard.tsx b/src/components/Home/TopicCard/TopicCard.tsx index 62b92e9..3b17cb2 100644 --- a/src/components/Home/TopicCard/TopicCard.tsx +++ b/src/components/Home/TopicCard/TopicCard.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from 'react'; +import React, { useEffect, useRef, useState } from 'react'; import { useSearchParams } from 'react-router-dom'; import { useSwiperSlide } from 'swiper/react'; @@ -44,6 +44,8 @@ const TopicCard = ({ topic }: TopicCardProps) => { ); const [latestComment, setLatestComment] = useState(); + const containerRef = useRef(null); + useEffect(() => { if (swiperSlide.isActive) { setSearchParams((searchParams) => { @@ -76,7 +78,14 @@ const TopicCard = ({ topic }: TopicCardProps) => { return ( - + 실시간 인기 토픽 diff --git a/src/components/Home/TopicSwiper/TopicSwiper.tsx b/src/components/Home/TopicSwiper/TopicSwiper.tsx index 5768593..633e0ee 100644 --- a/src/components/Home/TopicSwiper/TopicSwiper.tsx +++ b/src/components/Home/TopicSwiper/TopicSwiper.tsx @@ -40,15 +40,6 @@ const TopicSwiper = ({ children, fetchNextPage, hasNextPage }: TopicSwiperProps) return ( - { - swiperRef.current?.slidePrev(); - setNextDisabled(false); - }} - > - - {children.map((child, index) => ( - {child} + + { + swiperRef.current?.slidePrev(); + setNextDisabled(false); + }} + > + + + {child} + { + swiperRef.current?.slideNext(); + setPrevDisabled(false); + }} + > + + + ))} - { - swiperRef.current?.slideNext(); - setPrevDisabled(false); - }} - > - - ); }; +const TopicSlide = styled(SwiperSlide)` + &::-webkit-scrollbar { + display: none; + } + + -ms-overflow-style: none; /* IE and Edge */ + scrollbar-width: none; /* Firefox */ +`; + const SlideButton = styled.button<{ disabled: boolean }>` + position: absolute; + top: 63px; z-index: 100; width: 32px; height: 32px; @@ -89,14 +102,10 @@ const SlideButton = styled.button<{ disabled: boolean }>` `; const PrevButton = styled(SlideButton)` - position: absolute; - top: 110px; left: 20px; `; const NextButton = styled(SlideButton)` - position: absolute; - top: 110px; right: 20px; `;