From 8cd4404e839509b9abb3c7a458846fc4e85b386f Mon Sep 17 00:00:00 2001 From: ljh0608 Date: Tue, 7 Nov 2023 11:53:26 +0900 Subject: [PATCH 01/20] =?UTF-8?q?fix:=20=EC=B2=AB=EB=A1=9C=EB=94=A9?= =?UTF-8?q?=EB=95=8C=20meetingInfo=20prefertime=EC=A7=80=EC=9B=8C=EC=A3=BC?= =?UTF-8?q?=EB=8A=94=20=EB=A1=9C=EC=A7=81=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../createMeeting/components/useFunnel/SetTimes.tsx | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/src/pages/createMeeting/components/useFunnel/SetTimes.tsx b/src/pages/createMeeting/components/useFunnel/SetTimes.tsx index d3ffcba8..5bd94bfe 100644 --- a/src/pages/createMeeting/components/useFunnel/SetTimes.tsx +++ b/src/pages/createMeeting/components/useFunnel/SetTimes.tsx @@ -17,15 +17,14 @@ function SetTimes({ meetingInfo, setMeetingInfo, setStep }: FunnelProps) { const [endDropDown, setEndDropDown] = useState(false); const getDate = (btnState: boolean, startTime: string, endTime: string) => { + console.log('getDate 함수 호출'); + if (!btnState) { - // btnState가 true인 경우 preferTimes에 객체를 추가 setMeetingInfo((prev) => ({ ...prev, preferTimes: [...prev.preferTimes, { startTime: startTime, endTime: endTime }], })); } else { - console.log(btnState); - // btnState가 false인 경우 해당 startTime과 endTime을 가진 객체를 preferTimes에서 삭제 setMeetingInfo((prev) => ({ ...prev, preferTimes: prev.preferTimes.filter( @@ -62,7 +61,6 @@ function SetTimes({ meetingInfo, setMeetingInfo, setStep }: FunnelProps) { useEffect( () => { - console.log(meetingInfo.preferTimes[0]); if ( meetingInfo.preferTimes && meetingInfo.preferTimes[0] && @@ -77,6 +75,10 @@ function SetTimes({ meetingInfo, setMeetingInfo, setStep }: FunnelProps) { }, [meetingInfo.preferTimes], ); + + useEffect(() => { + deletePreferTimes(); + }, []); return ( From f9feedd9a446596425015aef96762cd959f8101f Mon Sep 17 00:00:00 2001 From: ljh0608 Date: Tue, 7 Nov 2023 15:34:33 +0900 Subject: [PATCH 02/20] =?UTF-8?q?fix:=20meetingInfo.preferTimes=20?= =?UTF-8?q?=EC=B4=88=EA=B8=B0=EA=B0=92=2000:00=EC=9C=BC=EB=A1=9C=20?= =?UTF-8?q?=EC=84=B8=ED=8C=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/createMeeting/CreateMeeting.tsx | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/src/pages/createMeeting/CreateMeeting.tsx b/src/pages/createMeeting/CreateMeeting.tsx index 96dc4bea..0b5c4a4d 100644 --- a/src/pages/createMeeting/CreateMeeting.tsx +++ b/src/pages/createMeeting/CreateMeeting.tsx @@ -1,4 +1,4 @@ -import { useState } from 'react'; +import { useEffect, useState } from 'react'; import Header from 'components/moleculesComponents/Header'; import ReturnBodyComponent from 'pages/createMeeting/components/ReturnBodyComponent'; @@ -11,7 +11,7 @@ import { MeetingInfo } from './types/useFunnelInterface'; const initialMeetingInfo: MeetingInfo = { title: '', availableDates: [''], - preferTimes: [], + preferTimes: [{ startTime: '00:00', endTime: '00:00' }], place: '', placeDetail: '', duration: '', @@ -24,6 +24,9 @@ function CreateMeeting() { const [step, setStep] = useState(0); const [meetingInfo, setMeetingInfo] = useState(initialMeetingInfo); const currentStep = funnelStep[step]; + useEffect(() => { + console.log(meetingInfo); + }, []); return ( <> From df701494facdd400fe4d45006939f0555f6f32a1 Mon Sep 17 00:00:00 2001 From: ljh0608 Date: Tue, 7 Nov 2023 15:39:02 +0900 Subject: [PATCH 03/20] =?UTF-8?q?fix:=20=EC=84=A0=ED=98=B8=EC=8B=9C?= =?UTF-8?q?=EA=B0=84=20=EC=9E=85=EB=A0=A5=20=EC=A4=91=EB=B3=B5=20=EC=84=A0?= =?UTF-8?q?=ED=83=9D=EB=90=98=EB=8A=94=20=EC=97=90=EB=9F=AC=20=EC=88=98?= =?UTF-8?q?=EC=A0=95=20/=20=EC=A7=81=EC=A0=91=EC=9E=85=EB=A0=A5=20?= =?UTF-8?q?=EC=97=90=EB=9F=AC=20/=20=EB=B2=84=ED=8A=BC=20on/off=20?= =?UTF-8?q?=ED=8A=B8=EB=A6=AC=EA=B1=B0=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/StartDropDown.tsx | 7 +-- .../components/useFunnel/SetPlace.tsx | 3 +- .../components/useFunnel/SetTimes.tsx | 58 +++++++++++-------- 3 files changed, 38 insertions(+), 30 deletions(-) diff --git a/src/pages/createMeeting/components/StartDropDown.tsx b/src/pages/createMeeting/components/StartDropDown.tsx index a8f53217..ce8f0999 100644 --- a/src/pages/createMeeting/components/StartDropDown.tsx +++ b/src/pages/createMeeting/components/StartDropDown.tsx @@ -4,22 +4,21 @@ import Text from 'components/atomComponents/Text'; import styled from 'styled-components/macro'; import { theme } from 'styles/theme'; -import { timeList } from '../data/meetingInfoData'; import { MeetingInfo } from '../types/useFunnelInterface'; interface PropTypes { time: string; type: string; - setIsOpen: Dispatch>; + setMeetingInfo: Dispatch>; } -function StartDropDown({ time, type, setIsOpen, setMeetingInfo }: PropTypes) { +function StartDropDown({ time, type, setMeetingInfo }: PropTypes) { const getTime = (time: string) => { if (type == 'start') { setMeetingInfo((prev) => ({ ...prev, - preferTimes: [{ startTime: time, endTime: '00:00' }], + preferTimes: [{ startTime: time, endTime: prev.preferTimes[0].endTime }], })); } else if (type == 'end') { setMeetingInfo((prev) => ({ diff --git a/src/pages/createMeeting/components/useFunnel/SetPlace.tsx b/src/pages/createMeeting/components/useFunnel/SetPlace.tsx index 532ec0d4..b2b2c9b1 100644 --- a/src/pages/createMeeting/components/useFunnel/SetPlace.tsx +++ b/src/pages/createMeeting/components/useFunnel/SetPlace.tsx @@ -9,6 +9,7 @@ function SetPlace({ meetingInfo, setMeetingInfo, setStep }: FunnelProps) { const setPlaceDetail = (place: string) => { setMeetingInfo((prev) => ({ ...prev, place, placeDetail: '' })); }; + console.log(meetingInfo); return ( @@ -16,7 +17,7 @@ function SetPlace({ meetingInfo, setMeetingInfo, setStep }: FunnelProps) { return ( - - - + + + + + + + {/* + - + */} ), hostScheduleComplete: ( @@ -48,7 +60,6 @@ function SteppingBtnSection({ steppingType }: SteppingProps) { - - - - - {/* + + + - */} + ), hostScheduleComplete: ( @@ -108,30 +109,35 @@ const StyledBtnSection = styled.section` justify-content: center; border-radius: 50%; width: 100%; + `; -const BottomSheetModal = styled.div` +const BottomSheetModal = styled.div<{$isModalOpen:boolean;}>` display:flex; position:fixed; - bottom:0; + bottom:${({$isModalOpen})=>$isModalOpen?0:-27.5}rem; flex-direction:column; gap:0.8rem; - + transition: bottom 600ms cubic-bezier(0.86, 0, 0.07, 1); + z-index:1; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem; background-color: ${({ theme }) => theme.colors.grey8}; padding: 2.8rem 2rem 4rem; - width:100%; + width:100%; & button { width:100%; } + ` -const ModalOverlay = styled.div` +const ModalOverlay = styled.div<{$isModalOpen:boolean;}>` + display:${({$isModalOpen})=>($isModalOpen?'block':'none')}; position:fixed; top: 0; + /* transition: display 1s; display는 transition 불가 */ background-color: rgba(0, 0, 0, 0.50); width:100%; height:100%; From 4c509b4440a4b17ef865f95095f34b06bee7539b Mon Sep 17 00:00:00 2001 From: simeunseo Date: Tue, 7 Nov 2023 21:46:06 +0900 Subject: [PATCH 17/20] =?UTF-8?q?feat:=20=EC=B2=AB=20=EB=A0=8C=EB=8D=94?= =?UTF-8?q?=EB=A7=81=EC=8B=9C=EC=97=90=EB=A7=8C=20=EC=95=A0=EB=8B=88?= =?UTF-8?q?=EB=A9=94=EC=9D=B4=EC=85=98=EB=90=98=EB=8F=84=EB=A1=9D=20useEff?= =?UTF-8?q?ect=20=EC=82=AC=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../SteppingStone/components/SteppingBtnSection.tsx | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/src/pages/SteppingStone/components/SteppingBtnSection.tsx b/src/pages/SteppingStone/components/SteppingBtnSection.tsx index 4a172e85..eb23c866 100644 --- a/src/pages/SteppingStone/components/SteppingBtnSection.tsx +++ b/src/pages/SteppingStone/components/SteppingBtnSection.tsx @@ -1,12 +1,10 @@ -import { useEffect, useState, useTransition } from 'react'; +import { useEffect, useState } from 'react'; -import { userNameAtom } from 'atoms/atom'; import Button from 'components/atomComponents/Button'; import Text from 'components/atomComponents/Text'; import CopyToClipboard from 'react-copy-to-clipboard'; import { useParams } from 'react-router'; import { Link, useLocation } from 'react-router-dom'; -import { useRecoilValue } from 'recoil'; import styled from 'styled-components/macro'; import { theme } from 'styles/theme'; import { notify } from 'utils/toast/copyLink'; @@ -19,8 +17,11 @@ function SteppingBtnSection({ steppingType }: SteppingProps) { const location = useLocation(); const meetInfo = { ...location.state }; const { meetingId } = useParams(); - const [isModalOpen, setIsModalOpen] = useState(true); + const [isModalOpen, setIsModalOpen] = useState(false); + useEffect(()=>{ + setIsModalOpen(true); + },[]) return ( <> @@ -137,7 +138,7 @@ const ModalOverlay = styled.div<{$isModalOpen:boolean;}>` display:${({$isModalOpen})=>($isModalOpen?'block':'none')}; position:fixed; top: 0; - /* transition: display 1s; display는 transition 불가 */ + background-color: rgba(0, 0, 0, 0.50); width:100%; height:100%; From b2cf2d29f0e279b03192370419574304f46b0016 Mon Sep 17 00:00:00 2001 From: simeunseo Date: Tue, 7 Nov 2023 21:55:59 +0900 Subject: [PATCH 18/20] =?UTF-8?q?style:=20button=20=EA=B3=B5=ED=86=B5?= =?UTF-8?q?=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=EC=97=90=20quaternaryDisab?= =?UTF-8?q?led=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/atomComponents/Button.tsx | 7 +++++++ src/pages/SteppingStone/components/SteppingBtnSection.tsx | 2 +- 2 files changed, 8 insertions(+), 1 deletion(-) diff --git a/src/components/atomComponents/Button.tsx b/src/components/atomComponents/Button.tsx index d225e358..8428104a 100644 --- a/src/components/atomComponents/Button.tsx +++ b/src/components/atomComponents/Button.tsx @@ -99,6 +99,11 @@ const buttonCSS = { background-color: transparent; color: ${({ theme }) => theme.colors.grey6}; `, + quaternaryDisabled: css` + ${buttonDefaultCSS.basicCss}; + background: ${({ theme }) => theme.colors.grey7}; + color: ${({ theme }) => theme.colors.grey2}; + `, }; const ButtonWrapper = styled.button<{ $type: string }>` @@ -126,6 +131,8 @@ const ButtonWrapper = styled.button<{ $type: string }>` return buttonCSS.tertiaryDisabled; case 'halfPrimaryDisabled': return buttonCSS.halfPrimaryDisabled; + case 'quaternaryDisabled': + return buttonCSS.quaternaryDisabled; default: return ''; } diff --git a/src/pages/SteppingStone/components/SteppingBtnSection.tsx b/src/pages/SteppingStone/components/SteppingBtnSection.tsx index eb23c866..b44ede21 100644 --- a/src/pages/SteppingStone/components/SteppingBtnSection.tsx +++ b/src/pages/SteppingStone/components/SteppingBtnSection.tsx @@ -40,7 +40,7 @@ function SteppingBtnSection({ steppingType }: SteppingProps) { 링크 복사하기 - From 7222104029c12877b825ec4c3cbb7a83e7f26497 Mon Sep 17 00:00:00 2001 From: ljh0608 Date: Wed, 27 Dec 2023 13:20:16 +0900 Subject: [PATCH 19/20] issue test --- src/pages/SteppingStone/SteppingLayout.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/pages/SteppingStone/SteppingLayout.tsx b/src/pages/SteppingStone/SteppingLayout.tsx index 43ae11ec..b7f21bb4 100644 --- a/src/pages/SteppingStone/SteppingLayout.tsx +++ b/src/pages/SteppingStone/SteppingLayout.tsx @@ -63,6 +63,7 @@ function SteppingLayout({ steppingType }: SteppingProps) {
+
); From 1a2ac8846dcc2dc91d49f2eb8f201d8bac1f28a3 Mon Sep 17 00:00:00 2001 From: ljh0608 Date: Sat, 22 Jun 2024 00:08:34 +0900 Subject: [PATCH 20/20] =?UTF-8?q?fix:=20=ED=9A=8C=EC=9D=98=EC=83=9D?= =?UTF-8?q?=EC=84=B1=EC=99=84=EB=A3=8C=20=EB=AA=A8=EB=8B=AC=20=EC=82=AC?= =?UTF-8?q?=EC=9D=B4=EC=A6=88=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/SteppingStone/components/SteppingBtnSection.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/SteppingStone/components/SteppingBtnSection.tsx b/src/pages/SteppingStone/components/SteppingBtnSection.tsx index b44ede21..cb5930cb 100644 --- a/src/pages/SteppingStone/components/SteppingBtnSection.tsx +++ b/src/pages/SteppingStone/components/SteppingBtnSection.tsx @@ -126,7 +126,7 @@ const BottomSheetModal = styled.div<{$isModalOpen:boolean;}>` background-color: ${({ theme }) => theme.colors.grey8}; padding: 2.8rem 2rem 4rem; - width:100%; + width:37.5rem; & button { width:100%;