From 8c9dac4c6aab23366dd417f35856b42f8b628257 Mon Sep 17 00:00:00 2001 From: urjimyu <92876819+urjimyu@users.noreply.github.com> Date: Tue, 20 Feb 2024 15:09:07 +0900 Subject: [PATCH 1/8] =?UTF-8?q?fix:=20=EB=A7=81=ED=81=AC=20=EC=97=86?= =?UTF-8?q?=EC=9D=B4=20=EB=93=B1=EB=A1=9D=20=EC=8B=9C=20=EB=AA=A8=EB=8B=AC?= =?UTF-8?q?=20=EC=95=88=20=EB=9C=A8=EB=8F=84=EB=A1=9D=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../GiftAdd/AddGiftLayout/AddGiftWithoutLinkLayout.tsx | 3 ++- .../AddGiftLink/common/GiftAddBtnWrapper/GiftAddBtnWrapper.tsx | 3 ++- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/src/components/GiftAdd/AddGiftLayout/AddGiftWithoutLinkLayout.tsx b/src/components/GiftAdd/AddGiftLayout/AddGiftWithoutLinkLayout.tsx index ba6168e5..97aeeed6 100644 --- a/src/components/GiftAdd/AddGiftLayout/AddGiftWithoutLinkLayout.tsx +++ b/src/components/GiftAdd/AddGiftLayout/AddGiftWithoutLinkLayout.tsx @@ -31,6 +31,7 @@ export const AddGiftWithoutLinkLayout = ({ setLinkText, targetDate, updateAddGiftInfo, + modalStatus, addGiftInfo, }: AddGiftWithLinkLayoutProps) => { const [isActivated, setIsActivated] = useState( @@ -43,7 +44,7 @@ export const AddGiftWithoutLinkLayout = ({ const [file, setFile] = useState(null); const [, setIsImageUploaded] = useState(false); const [, setPreviewImage] = useState(null); - const [isModalOpen, setIsModalOpen] = useState(true); + const [isModalOpen, setIsModalOpen] = useState(modalStatus); const checkPriceNull = (price: number | null) => { if (price === null) { diff --git a/src/components/GiftAdd/AddGiftLink/common/GiftAddBtnWrapper/GiftAddBtnWrapper.tsx b/src/components/GiftAdd/AddGiftLink/common/GiftAddBtnWrapper/GiftAddBtnWrapper.tsx index 4b62d7da..faff07fd 100644 --- a/src/components/GiftAdd/AddGiftLink/common/GiftAddBtnWrapper/GiftAddBtnWrapper.tsx +++ b/src/components/GiftAdd/AddGiftLink/common/GiftAddBtnWrapper/GiftAddBtnWrapper.tsx @@ -4,13 +4,14 @@ import * as S from './GiftAddBtnWrapper.styled'; interface GiftAddBtnWrapperProps { setStep: React.Dispatch>; isActivated: boolean; - onClick: () => void; + onClick: VoidFunction; } const GiftAddBtnWrapper = ({ setStep, isActivated, onClick }: GiftAddBtnWrapperProps) => { const BtnText = 다음; const handleClickNoLink = () => { + setStep(3); }; From adbd6bd32b70b6495221ac8d6da4f9969acc1159 Mon Sep 17 00:00:00 2001 From: urjimyu <92876819+urjimyu@users.noreply.github.com> Date: Tue, 20 Feb 2024 15:12:18 +0900 Subject: [PATCH 2/8] =?UTF-8?q?fix:=20=EA=B8=B0=EB=B3=B8=20=EB=A7=81?= =?UTF-8?q?=ED=81=AC=20=EC=84=A4=EC=A0=95=EC=97=90=20=EC=89=BC=ED=91=9C=20?= =?UTF-8?q?=EC=98=A4=ED=83=80=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../AddGiftLink/common/GiftAddBtnWrapper/GiftAddBtnWrapper.tsx | 3 +-- src/context/AddGift/AddGiftContext.tsx | 2 +- 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/src/components/GiftAdd/AddGiftLink/common/GiftAddBtnWrapper/GiftAddBtnWrapper.tsx b/src/components/GiftAdd/AddGiftLink/common/GiftAddBtnWrapper/GiftAddBtnWrapper.tsx index faff07fd..7b2d1f47 100644 --- a/src/components/GiftAdd/AddGiftLink/common/GiftAddBtnWrapper/GiftAddBtnWrapper.tsx +++ b/src/components/GiftAdd/AddGiftLink/common/GiftAddBtnWrapper/GiftAddBtnWrapper.tsx @@ -11,13 +11,12 @@ const GiftAddBtnWrapper = ({ setStep, isActivated, onClick }: GiftAddBtnWrapperP const BtnText = 다음; const handleClickNoLink = () => { - setStep(3); }; return ( - 링크 없이 상품을 등록할게요 + 링크 없이 상품을 등록할게요 ); diff --git a/src/context/AddGift/AddGiftContext.tsx b/src/context/AddGift/AddGiftContext.tsx index 6123cf69..dd176a9c 100644 --- a/src/context/AddGift/AddGiftContext.tsx +++ b/src/context/AddGift/AddGiftContext.tsx @@ -10,7 +10,7 @@ const initialAddGiftInfo: AddGiftInfo = { name: '', cost: 0, imageUrl: '', - url: ',', + url: '', }; const AddGiftContext = createContext({ From d24965c40b1dbfbba6685e311e64834839e3d48c Mon Sep 17 00:00:00 2001 From: urjimyu <92876819+urjimyu@users.noreply.github.com> Date: Wed, 21 Feb 2024 18:59:31 +0900 Subject: [PATCH 3/8] =?UTF-8?q?refactor:=20=EC=9D=B4=EB=AF=B8=EC=A7=80=20?= =?UTF-8?q?=EB=A7=81=ED=81=AC=20=EB=B9=88=20=EA=B0=92=20=EB=93=A4=EC=96=B4?= =?UTF-8?q?=EA=B0=80=EB=8A=94=20=EC=97=90=EB=9F=AC=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx | 2 +- .../GiftAdd/AddGiftLink/common/InputUrl/InputUrl.tsx | 2 +- src/hooks/useConvertURLtoFile.tsx | 7 ++++--- 3 files changed, 6 insertions(+), 5 deletions(-) diff --git a/src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx b/src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx index 292c5953..485f3b49 100644 --- a/src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx +++ b/src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx @@ -39,7 +39,6 @@ const AddGiftFooter = ({ const onClick = async () => { const { imageUrlS3 } = await putImageUrlToS3({ fileName, file, roomId, setImageUrl }); if (isActivated) { - updateAddGiftInfo({ name: '', cost: 0, imageUrl: '', url: '' }); mutation.mutate( { roomId: roomId, @@ -50,6 +49,7 @@ const AddGiftFooter = ({ }, { onSuccess: () => { + updateAddGiftInfo({ name: '', cost: 0, imageUrl: '', url: '' }); navigate(`/add-gift/${roomId}/${targetDate}`); setStep(0); }, diff --git a/src/components/GiftAdd/AddGiftLink/common/InputUrl/InputUrl.tsx b/src/components/GiftAdd/AddGiftLink/common/InputUrl/InputUrl.tsx index 0aff855d..9c45ba02 100644 --- a/src/components/GiftAdd/AddGiftLink/common/InputUrl/InputUrl.tsx +++ b/src/components/GiftAdd/AddGiftLink/common/InputUrl/InputUrl.tsx @@ -10,8 +10,8 @@ interface InputUrlProps { const InputUrl = ({ setIsActivated, text, setText }: InputUrlProps) => { const onChange = (e: React.ChangeEvent) => { const inputValue = e.target.value; - inputValue.length > 0 ? setIsActivated(true) : setIsActivated(false); setText(inputValue); + inputValue.length > 0 ? setIsActivated(true) : setIsActivated(false); }; const handleBtnClick = () => { diff --git a/src/hooks/useConvertURLtoFile.tsx b/src/hooks/useConvertURLtoFile.tsx index 22480611..b15bb190 100644 --- a/src/hooks/useConvertURLtoFile.tsx +++ b/src/hooks/useConvertURLtoFile.tsx @@ -1,9 +1,10 @@ const useConvertURLtoFile = async (url: string) => { + console.log('들어오고 있는 url', url); const response = await fetch(url); const data = await response.blob(); - const ext = url.split('.').pop(); // url 구조에 맞게 수정할 것 - const filename = url.split('/').pop(); // url 구조에 맞게 수정할 것 - const metadata = { type: `image/${ext}` }; + const extensions = url.split('.').pop(); + const filename = url.split('/').pop(); + const metadata = { type: `image/${extensions}` }; return new File([data], filename!, metadata); }; From a3514f1c942bfc9cef5b3f9c196d5a1588eaed04 Mon Sep 17 00:00:00 2001 From: urjimyu <92876819+urjimyu@users.noreply.github.com> Date: Thu, 22 Feb 2024 15:11:06 +0900 Subject: [PATCH 4/8] =?UTF-8?q?fix:=20CORS=20=EC=97=90=EB=9F=AC=20?= =?UTF-8?q?=EB=82=98=EB=A9=B4=20=EB=B0=94=EB=A1=9C=20=EC=A7=81=EC=A0=91=20?= =?UTF-8?q?=EC=9E=85=EB=A0=A5=EC=9C=BC=EB=A1=9C=20=EC=A0=84=ED=99=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../AddGiftLayout/AddGiftWithLinkLayout.tsx | 20 ++++++--- .../common/AddGiftImg/AddGiftImg.tsx | 2 +- src/hooks/useConvertURLtoFile.tsx | 42 +++++++++++++++---- src/pages/GiftAdd/GiftAddPage.tsx | 1 + 4 files changed, 52 insertions(+), 13 deletions(-) diff --git a/src/components/GiftAdd/AddGiftLayout/AddGiftWithLinkLayout.tsx b/src/components/GiftAdd/AddGiftLayout/AddGiftWithLinkLayout.tsx index 55719ef5..ee4a3593 100644 --- a/src/components/GiftAdd/AddGiftLayout/AddGiftWithLinkLayout.tsx +++ b/src/components/GiftAdd/AddGiftLayout/AddGiftWithLinkLayout.tsx @@ -18,6 +18,7 @@ interface AddGiftWithLinkLayoutProps { openGraph: OpenGraphResponseType; targetDate: string; updateAddGiftInfo: (newInfo: Partial) => void; + setModalStatus: React.Dispatch>; addGiftInfo: AddGiftInfo; } @@ -29,6 +30,7 @@ const AddGiftWithLinkLayout = ({ openGraph, targetDate, updateAddGiftInfo, + setModalStatus, addGiftInfo, }: AddGiftWithLinkLayoutProps) => { const [isActivated, setIsActivated] = useState( @@ -52,15 +54,23 @@ const AddGiftWithLinkLayout = ({ useEffect(() => { const fetchData = async () => { + console.log('OpenGraph imageUrl', openGraph); setNameText(openGraph.title); - const convertedOgFile = await useConvertURLtoFile(openGraph.image); - setFile(convertedOgFile); - setFileName(openGraph.image); - setImageUrl(openGraph.image); + const convertResult = await useConvertURLtoFile({ + url: openGraph.image, + setStep, + setModalStatus, + updateAddGiftInfo, + }); + if (convertResult && 'convertedOgFile' in convertResult) { + setFile(convertResult.convertedOgFile); + setFileName(openGraph.image); + setImageUrl(openGraph.image); + } }; fetchData(); - }, [openGraph]); + }, [openGraph, setStep]); return ( diff --git a/src/components/GiftAdd/AddGiftLayout/common/AddGiftImg/AddGiftImg.tsx b/src/components/GiftAdd/AddGiftLayout/common/AddGiftImg/AddGiftImg.tsx index 2c81a6fc..c068818a 100644 --- a/src/components/GiftAdd/AddGiftLayout/common/AddGiftImg/AddGiftImg.tsx +++ b/src/components/GiftAdd/AddGiftLayout/common/AddGiftImg/AddGiftImg.tsx @@ -37,7 +37,7 @@ const AddGiftImg = ({ { +import { AddGiftInfo } from '../types/gift'; + +interface convertURLtoFileProps { + url: string; + setStep: React.Dispatch>; + setModalStatus: React.Dispatch>; + updateAddGiftInfo: (newInfo: Partial) => void; +} + +const useConvertURLtoFile = async ({ + url, + setStep, + setModalStatus, + updateAddGiftInfo, +}: convertURLtoFileProps) => { console.log('들어오고 있는 url', url); - const response = await fetch(url); - const data = await response.blob(); - const extensions = url.split('.').pop(); - const filename = url.split('/').pop(); - const metadata = { type: `image/${extensions}` }; - return new File([data], filename!, metadata); + try { + const response = await fetch(url); + + if (response.status === 302) { + return setStep(3); + } + + const data = await response.blob(); + // const extensions = url.split('.').pop(); + const filename = url.split('/').pop(); + const metadata = { type: `image/*` }; + const convertedOgFile = new File([data], filename!, metadata); + return { convertedOgFile }; + } catch (error) { + console.error('error?', error); + updateAddGiftInfo({ imageUrl: '' }); + setModalStatus(true); + setStep(3); + return { convertedOgFile: null }; + } }; export default useConvertURLtoFile; diff --git a/src/pages/GiftAdd/GiftAddPage.tsx b/src/pages/GiftAdd/GiftAddPage.tsx index 8afd3947..b395a49b 100644 --- a/src/pages/GiftAdd/GiftAddPage.tsx +++ b/src/pages/GiftAdd/GiftAddPage.tsx @@ -63,6 +63,7 @@ const GiftAddPage = () => { link={linkText} openGraph={openGraph} targetDate={targetDate || ''} + setModalStatus={setModalStatus} addGiftInfo={addGiftInfo} updateAddGiftInfo={updateAddGiftInfo} /> From 4152d15e00e1ce25dc34ca6207ea8c4affd4196b Mon Sep 17 00:00:00 2001 From: urjimyu <92876819+urjimyu@users.noreply.github.com> Date: Thu, 22 Feb 2024 15:51:19 +0900 Subject: [PATCH 5/8] =?UTF-8?q?refactor:=20onSuccess=20=EC=A4=91=EB=B3=B5?= =?UTF-8?q?=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../GiftAdd/AddGiftFooter/AddGiftFooter.tsx | 27 ++++++------------- src/hooks/queries/gift/usePostGift.tsx | 4 ++- 2 files changed, 11 insertions(+), 20 deletions(-) diff --git a/src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx b/src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx index 485f3b49..8c725573 100644 --- a/src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx +++ b/src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx @@ -1,4 +1,3 @@ -import { useNavigate } from 'react-router-dom'; import usePostGift from '../../../hooks/queries/gift/usePostGift'; import GiftAddNextBtn from '../AddGiftLink/common/GiftAddNextBtn/GiftAddNextBtn'; import * as S from './AddGiftFooter.styled'; @@ -32,29 +31,19 @@ const AddGiftFooter = ({ fileName, updateAddGiftInfo, }: AddGiftFooterProps) => { - const navigate = useNavigate(); - const { mutation } = usePostGift(roomId, targetDate, setStep); + const { mutation } = usePostGift(roomId, targetDate, setStep, updateAddGiftInfo); const { putImageUrlToS3 } = usePutImageUrlToS3(roomId); const onClick = async () => { const { imageUrlS3 } = await putImageUrlToS3({ fileName, file, roomId, setImageUrl }); if (isActivated) { - mutation.mutate( - { - roomId: roomId, - name: name, - cost: cost, - imageUrl: imageUrlS3, - url: link, - }, - { - onSuccess: () => { - updateAddGiftInfo({ name: '', cost: 0, imageUrl: '', url: '' }); - navigate(`/add-gift/${roomId}/${targetDate}`); - setStep(0); - }, - }, - ); + mutation.mutate({ + roomId: roomId, + name: name, + cost: cost, + imageUrl: imageUrlS3, + url: link, + }); } }; diff --git a/src/hooks/queries/gift/usePostGift.tsx b/src/hooks/queries/gift/usePostGift.tsx index 2f6094bb..32534cbe 100644 --- a/src/hooks/queries/gift/usePostGift.tsx +++ b/src/hooks/queries/gift/usePostGift.tsx @@ -1,6 +1,6 @@ import { useMutation, useQueryClient } from '@tanstack/react-query'; import { post } from '../../../apis/client'; -import { GiftPostRequestType } from '../../../types/gift'; +import { AddGiftInfo, GiftPostRequestType } from '../../../types/gift'; import { useNavigate } from 'react-router-dom'; import { MY_GIFT_QUERY_KEY } from './useGetMyGift'; @@ -12,6 +12,7 @@ export const usePostGift = ( roomId: number, targetDate: string, setStep: React.Dispatch>, + updateAddGiftInfo: (newInfo: Partial) => void, ) => { const navigate = useNavigate(); @@ -24,6 +25,7 @@ export const usePostGift = ( queryClient.invalidateQueries({ queryKey: [MY_GIFT_QUERY_KEY[0], roomId] }); navigate(`/add-gift/${roomId}/${targetDate}`); setStep(0); + updateAddGiftInfo({ name: '', cost: 0, imageUrl: '', url: '' }); }, onError: (error) => { console.log('선물 등록 에러!!', error.message); From 0408000505fdae0c7905ce78c7849dddda43a8e8 Mon Sep 17 00:00:00 2001 From: urjimyu <92876819+urjimyu@users.noreply.github.com> Date: Thu, 22 Feb 2024 17:13:01 +0900 Subject: [PATCH 6/8] =?UTF-8?q?feat:=20=EC=84=A0=EB=AC=BC=20=EB=93=B1?= =?UTF-8?q?=EB=A1=9D=20=EC=8B=9C=20=EC=A7=80=EC=97=B0=20=EC=83=9D=EA=B8=B8?= =?UTF-8?q?=20=EB=95=8C=20=EB=A1=9C=EB=94=A9=EB=B7=B0=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../GiftAdd/AddGiftFooter/AddGiftFooter.tsx | 4 ++++ .../GiftAdd/AddGiftLayout/AddGiftWithLinkLayout.tsx | 3 +++ .../AddGiftLayout/AddGiftWithoutLinkLayout.tsx | 3 +++ src/pages/GiftAdd/GiftAddPage.tsx | 12 ++++++++++-- 4 files changed, 20 insertions(+), 2 deletions(-) diff --git a/src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx b/src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx index 8c725573..a396e682 100644 --- a/src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx +++ b/src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx @@ -16,6 +16,7 @@ interface AddGiftFooterProps { setImageUrl: React.Dispatch>; updateAddGiftInfo: (newInfo: Partial) => void; fileName: string; + setIsLoading: React.Dispatch>; } const AddGiftFooter = ({ @@ -30,11 +31,13 @@ const AddGiftFooter = ({ setImageUrl, fileName, updateAddGiftInfo, + setIsLoading, }: AddGiftFooterProps) => { const { mutation } = usePostGift(roomId, targetDate, setStep, updateAddGiftInfo); const { putImageUrlToS3 } = usePutImageUrlToS3(roomId); const onClick = async () => { + setIsLoading(true); const { imageUrlS3 } = await putImageUrlToS3({ fileName, file, roomId, setImageUrl }); if (isActivated) { mutation.mutate({ @@ -45,6 +48,7 @@ const AddGiftFooter = ({ url: link, }); } + setIsLoading(false); }; return ( diff --git a/src/components/GiftAdd/AddGiftLayout/AddGiftWithLinkLayout.tsx b/src/components/GiftAdd/AddGiftLayout/AddGiftWithLinkLayout.tsx index ee4a3593..f5e16fbd 100644 --- a/src/components/GiftAdd/AddGiftLayout/AddGiftWithLinkLayout.tsx +++ b/src/components/GiftAdd/AddGiftLayout/AddGiftWithLinkLayout.tsx @@ -20,6 +20,7 @@ interface AddGiftWithLinkLayoutProps { updateAddGiftInfo: (newInfo: Partial) => void; setModalStatus: React.Dispatch>; addGiftInfo: AddGiftInfo; + setIsLoading: React.Dispatch>; } const AddGiftWithLinkLayout = ({ @@ -32,6 +33,7 @@ const AddGiftWithLinkLayout = ({ updateAddGiftInfo, setModalStatus, addGiftInfo, + setIsLoading, }: AddGiftWithLinkLayoutProps) => { const [isActivated, setIsActivated] = useState( !!addGiftInfo.name && !!addGiftInfo.cost && !!addGiftInfo.imageUrl, @@ -113,6 +115,7 @@ const AddGiftWithLinkLayout = ({ updateAddGiftInfo={updateAddGiftInfo} file={file} setImageUrl={setImageUrl} + setIsLoading={setIsLoading} /> ); diff --git a/src/components/GiftAdd/AddGiftLayout/AddGiftWithoutLinkLayout.tsx b/src/components/GiftAdd/AddGiftLayout/AddGiftWithoutLinkLayout.tsx index 97aeeed6..b3ca837e 100644 --- a/src/components/GiftAdd/AddGiftLayout/AddGiftWithoutLinkLayout.tsx +++ b/src/components/GiftAdd/AddGiftLayout/AddGiftWithoutLinkLayout.tsx @@ -20,6 +20,7 @@ interface AddGiftWithLinkLayoutProps { openGraph: OpenGraphResponseType; updateAddGiftInfo: (newInfo: Partial) => void; addGiftInfo: AddGiftInfo; + setIsLoading: React.Dispatch>; } // 직접 입력 화면 @@ -33,6 +34,7 @@ export const AddGiftWithoutLinkLayout = ({ updateAddGiftInfo, modalStatus, addGiftInfo, + setIsLoading, }: AddGiftWithLinkLayoutProps) => { const [isActivated, setIsActivated] = useState( !!addGiftInfo.name && !!addGiftInfo.cost && !!addGiftInfo.url && !!addGiftInfo.imageUrl, @@ -110,6 +112,7 @@ export const AddGiftWithoutLinkLayout = ({ updateAddGiftInfo={updateAddGiftInfo} file={file} setImageUrl={setImageUrl} + setIsLoading={setIsLoading} /> ); diff --git a/src/pages/GiftAdd/GiftAddPage.tsx b/src/pages/GiftAdd/GiftAddPage.tsx index b395a49b..d1c2cf78 100644 --- a/src/pages/GiftAdd/GiftAddPage.tsx +++ b/src/pages/GiftAdd/GiftAddPage.tsx @@ -6,9 +6,11 @@ import { OpenGraphResponseType } from '../../types/etc'; import { useParams } from 'react-router-dom'; import AddGiftWithLinkLayout from '../../components/GiftAdd/AddGiftLayout/AddGiftWithLinkLayout'; import { useAddGiftContext } from '../../context/AddGift/AddGiftContext'; +import Loading from '../Loading/Loading'; const GiftAddPage = () => { const [step, setStep] = useState(0); + const [isLoading, setIsLoading] = useState(false); // case 1 링크 입력 페이지 state들 const [itemNum, setItemNum] = useState(0); @@ -55,7 +57,9 @@ const GiftAddPage = () => { ); case 2: - return ( + return isLoading ? ( + + ) : ( { setModalStatus={setModalStatus} addGiftInfo={addGiftInfo} updateAddGiftInfo={updateAddGiftInfo} + setIsLoading={setIsLoading} /> ); case 3: - return ( + return isLoading ? ( + + ) : ( { addGiftInfo={addGiftInfo} openGraph={openGraph} updateAddGiftInfo={updateAddGiftInfo} + setIsLoading={setIsLoading} /> ); } From d103556df0564bba280f82eb60515be720404643 Mon Sep 17 00:00:00 2001 From: urjimyu <92876819+urjimyu@users.noreply.github.com> Date: Thu, 22 Feb 2024 17:41:42 +0900 Subject: [PATCH 7/8] =?UTF-8?q?fix:=20=EB=A1=9C=EB=94=A9=20=EC=99=84?= =?UTF-8?q?=EB=A3=8C=20=ED=9B=84=20=EB=B0=94=EB=A1=9C=20=EC=84=A0=EB=AC=BC?= =?UTF-8?q?=EB=93=B1=EB=A1=9D=20=ED=99=88=EC=9C=BC=EB=A1=9C=20=EC=9D=B4?= =?UTF-8?q?=EB=8F=99=EB=90=98=EB=8F=84=EB=A1=9D=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx | 3 +-- .../GiftAdd/AddGiftLayout/AddGiftWithoutLinkLayout.tsx | 2 +- src/hooks/queries/gift/usePostGift.tsx | 2 ++ 3 files changed, 4 insertions(+), 3 deletions(-) diff --git a/src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx b/src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx index a396e682..e40a3007 100644 --- a/src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx +++ b/src/components/GiftAdd/AddGiftFooter/AddGiftFooter.tsx @@ -33,7 +33,7 @@ const AddGiftFooter = ({ updateAddGiftInfo, setIsLoading, }: AddGiftFooterProps) => { - const { mutation } = usePostGift(roomId, targetDate, setStep, updateAddGiftInfo); + const { mutation } = usePostGift(roomId, targetDate, setStep, updateAddGiftInfo, setIsLoading); const { putImageUrlToS3 } = usePutImageUrlToS3(roomId); const onClick = async () => { @@ -48,7 +48,6 @@ const AddGiftFooter = ({ url: link, }); } - setIsLoading(false); }; return ( diff --git a/src/components/GiftAdd/AddGiftLayout/AddGiftWithoutLinkLayout.tsx b/src/components/GiftAdd/AddGiftLayout/AddGiftWithoutLinkLayout.tsx index b3ca837e..bced5aee 100644 --- a/src/components/GiftAdd/AddGiftLayout/AddGiftWithoutLinkLayout.tsx +++ b/src/components/GiftAdd/AddGiftLayout/AddGiftWithoutLinkLayout.tsx @@ -58,7 +58,7 @@ export const AddGiftWithoutLinkLayout = ({ // 모달 확인 클릭 버튼 const handleClickConfirmClick = () => { - setIsModalOpen(!isModalOpen); + setIsModalOpen(false); setStep(3); }; diff --git a/src/hooks/queries/gift/usePostGift.tsx b/src/hooks/queries/gift/usePostGift.tsx index 32534cbe..ffe7eaa5 100644 --- a/src/hooks/queries/gift/usePostGift.tsx +++ b/src/hooks/queries/gift/usePostGift.tsx @@ -13,6 +13,7 @@ export const usePostGift = ( targetDate: string, setStep: React.Dispatch>, updateAddGiftInfo: (newInfo: Partial) => void, + setIsLoading: React.Dispatch>, ) => { const navigate = useNavigate(); @@ -25,6 +26,7 @@ export const usePostGift = ( queryClient.invalidateQueries({ queryKey: [MY_GIFT_QUERY_KEY[0], roomId] }); navigate(`/add-gift/${roomId}/${targetDate}`); setStep(0); + setIsLoading(false); updateAddGiftInfo({ name: '', cost: 0, imageUrl: '', url: '' }); }, onError: (error) => { From 936faa67432d9ac7ba9f86c8d210d1aec93b9dc1 Mon Sep 17 00:00:00 2001 From: urjimyu <92876819+urjimyu@users.noreply.github.com> Date: Fri, 23 Feb 2024 01:12:13 +0900 Subject: [PATCH 8/8] =?UTF-8?q?fix:=20svg=20=EB=A7=89=EA=B3=A0=20=ED=95=B8?= =?UTF-8?q?=EB=93=9C=ED=8F=B0=20=EC=82=AC=EC=A7=84=20=ED=97=88=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../GiftAdd/AddGiftLayout/common/AddGiftImg/AddGiftImg.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/GiftAdd/AddGiftLayout/common/AddGiftImg/AddGiftImg.tsx b/src/components/GiftAdd/AddGiftLayout/common/AddGiftImg/AddGiftImg.tsx index c068818a..3042b7c2 100644 --- a/src/components/GiftAdd/AddGiftLayout/common/AddGiftImg/AddGiftImg.tsx +++ b/src/components/GiftAdd/AddGiftLayout/common/AddGiftImg/AddGiftImg.tsx @@ -37,7 +37,7 @@ const AddGiftImg = ({