From 8d258bc2c9b02dda6389d5c84ed96ccf08757353 Mon Sep 17 00:00:00 2001 From: lybell-art Date: Tue, 20 Aug 2024 10:23:02 +0900 Subject: [PATCH 01/34] =?UTF-8?q?[modify]=20=EC=84=A0=EC=B0=A9=EC=88=9C=20?= =?UTF-8?q?=EC=9D=B4=EB=B2=A4=ED=8A=B8=20id=20=EA=B3=A0=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/common/constants.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/common/constants.js b/src/common/constants.js index 9a615d47..dfcbbc7c 100644 --- a/src/common/constants.js +++ b/src/common/constants.js @@ -1,4 +1,4 @@ -export const EVENT_FCFS_ID = 1; +export const EVENT_FCFS_ID = "HD_240808_001"; export const EVENT_DRAW_ID = "HD-19700101-01"; export const EVENT_ID = "the-new-ioniq5"; export const EVENT_START_DATE = new Date(2024, 8, 9); From c7baa455f40753685626941ae6d439d661a52c3f Mon Sep 17 00:00:00 2001 From: lybell-art Date: Tue, 20 Aug 2024 10:31:24 +0900 Subject: [PATCH 02/34] =?UTF-8?q?[feat]=20openModal=20=ED=95=A8=EC=88=98?= =?UTF-8?q?=EC=97=90=20=EB=8B=AB=EA=B8=B0=20=EB=8F=99=EC=9E=91=EC=9D=84=20?= =?UTF-8?q?=EC=A0=95=EC=9D=98=ED=95=A0=20=EC=88=98=20=EC=9E=88=EB=8F=84?= =?UTF-8?q?=EB=A1=9D=20Promise=ED=99=94=20(resolve=20#117)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/common/modal/openModal.js | 12 +++++++++++- src/mainPage/features/fcfs/cardGame/CardGame.jsx | 4 ++-- 2 files changed, 13 insertions(+), 3 deletions(-) diff --git a/src/common/modal/openModal.js b/src/common/modal/openModal.js index de142f1f..ed4fbef7 100644 --- a/src/common/modal/openModal.js +++ b/src/common/modal/openModal.js @@ -1,5 +1,15 @@ import { modalStore } from "./store.js"; export default function openModal(component, layer = "alert") { - modalStore.changeModal(component, layer); + modalStore.changeModal(component, layer); + return new Promise( (resolve)=>{ + function observe() + { + if(modalStore.getSnapshot(layer) !== component) { + resolve(); + clear(); + } + } + const clear = modalStore.subscribe( observe ); + } ); } diff --git a/src/mainPage/features/fcfs/cardGame/CardGame.jsx b/src/mainPage/features/fcfs/cardGame/CardGame.jsx index ea89fad8..6ce062e0 100644 --- a/src/mainPage/features/fcfs/cardGame/CardGame.jsx +++ b/src/mainPage/features/fcfs/cardGame/CardGame.jsx @@ -70,8 +70,8 @@ function CardGame({ offline }) { openModal(); break; case submitCardgameErrorHandle[401]: - return new Promise((resolve) => { - openModal( resolve(getCardAnswerOnline(index))} />); + return new Promise((resolve, reject) => { + openModal( resolve(getCardAnswerOnline(index))} />).then( reject ); }); case submitCardgameErrorHandle["offline"]: setOfflineMode(true); From aeddac32c6f1362e2fef6da4b0dbe4e22d9405db Mon Sep 17 00:00:00 2001 From: lybell-art Date: Tue, 20 Aug 2024 10:38:49 +0900 Subject: [PATCH 03/34] =?UTF-8?q?[modify]=20=EC=9D=B4=EB=B2=A4=ED=8A=B8=20?= =?UTF-8?q?=EB=93=B1=EB=A1=9D=20=EC=99=84=EB=A3=8C=20=EB=AA=A8=EB=8B=AC=20?= =?UTF-8?q?=ED=9B=84=20=ED=8E=98=EC=9D=B4=EC=A7=80=EB=A5=BC=20=EB=B0=94?= =?UTF-8?q?=EA=BE=B8=EB=8F=84=EB=A1=9D=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/adminPage/features/eventEdit/index.jsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/adminPage/features/eventEdit/index.jsx b/src/adminPage/features/eventEdit/index.jsx index e0625173..77a42b91 100644 --- a/src/adminPage/features/eventEdit/index.jsx +++ b/src/adminPage/features/eventEdit/index.jsx @@ -51,8 +51,7 @@ function EventEditor({ initialData = null } = {}) { title={`${mode === "create" ? "등록" : "수정"} 완료`} description={`이벤트가 성공적으로 ${mode === "create" ? "등록" : "수정"}되었습니다!`} />, - ); - navigate(mode === "create" ? "/events" : `/events/${state.eventId}`); + ).then( ()=>navigate(mode === "create" ? "/events" : `/events/${state.eventId}`) ); }, onError: (e) => { openModal(); From 7e0a5043951a1ee962b22bca8563677bfcb54056 Mon Sep 17 00:00:00 2001 From: lybell-art Date: Tue, 20 Aug 2024 10:51:32 +0900 Subject: [PATCH 04/34] =?UTF-8?q?[refactor]=20=EC=95=8C=EB=9F=AC=ED=8A=B8?= =?UTF-8?q?=20=EB=AA=A8=EB=8B=AC=20=EC=8A=A4=ED=83=80=EC=9D=BC=EC=9D=84=20?= =?UTF-8?q?=EA=B3=B5=ED=86=B5=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8?= =?UTF-8?q?=EB=A1=9C=20=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../comment/modals/CommentNegativeModal.jsx | 14 ++++++-------- .../shared/components/AlertModalContainer.jsx | 18 ++++++++++++++++++ 2 files changed, 24 insertions(+), 8 deletions(-) create mode 100644 src/mainPage/shared/components/AlertModalContainer.jsx diff --git a/src/mainPage/features/comment/modals/CommentNegativeModal.jsx b/src/mainPage/features/comment/modals/CommentNegativeModal.jsx index 2c759ea4..8cad6e46 100644 --- a/src/mainPage/features/comment/modals/CommentNegativeModal.jsx +++ b/src/mainPage/features/comment/modals/CommentNegativeModal.jsx @@ -1,22 +1,20 @@ import { useContext } from "react"; import { ModalCloseContext } from "@common/modal/modal.jsx"; +import AlertModalContainer from "@main/components/AlertModalContainer.jsx"; import Button from "@common/components/Button.jsx"; function CommentNegativeModal() { const close = useContext(ModalCloseContext); return ( -
-
-

해당 기대평을 등록할 수 없습니다

-

- 비속어, 혐오표현 등 타인에게 불쾌감을 줄 수 있는 표현이 포함된 기대평은 작성이 불가합니다 -

-
+ -
+ ); } diff --git a/src/mainPage/shared/components/AlertModalContainer.jsx b/src/mainPage/shared/components/AlertModalContainer.jsx new file mode 100644 index 00000000..67d41364 --- /dev/null +++ b/src/mainPage/shared/components/AlertModalContainer.jsx @@ -0,0 +1,18 @@ +function AlertModalContainer({title, description, image, children}) +{ + const containerStyle = "w-[calc(100%-1rem)] max-w-[31.25rem] h-[calc(100svh-2rem)] p-10 shadow bg-white relative flex flex-col justify-between items-center" + return
+
+

{title}

+

+ {description} +

+
+ {image &&
+ {image} +
} + {children} +
+} + +export default AlertModalContainer; \ No newline at end of file From 4f16a5a8dfe6e4e8cd368dcbc5c8f058ad17a21f Mon Sep 17 00:00:00 2001 From: lybell-art Date: Tue, 20 Aug 2024 11:08:23 +0900 Subject: [PATCH 05/34] =?UTF-8?q?[refactor]=20=EA=B3=B5=ED=86=B5=20?= =?UTF-8?q?=EC=96=91=EC=8B=9D=EC=9D=84=20=EA=B0=80=EC=A7=84=20=EB=AA=A8?= =?UTF-8?q?=EB=8B=AC=20=EC=A0=84=EB=B6=80=20=EA=B3=B5=ED=86=B5=20=EC=BB=B4?= =?UTF-8?q?=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../comment/modals/CommentNoUserModal.jsx | 30 ++++++++----------- .../comment/modals/CommentSuccessModal.jsx | 14 ++++----- .../features/fcfs/modals/FcfsInvalidModal.jsx | 15 ++++------ .../features/fcfs/modals/FcfsLoseModal.jsx | 30 ++++++++----------- .../features/fcfs/modals/FcfsWinModal.jsx | 21 +++++-------- .../shared/components/NoServerModal.jsx | 18 +++++------ 6 files changed, 54 insertions(+), 74 deletions(-) diff --git a/src/mainPage/features/comment/modals/CommentNoUserModal.jsx b/src/mainPage/features/comment/modals/CommentNoUserModal.jsx index 99a8d1fb..e9ac16ef 100644 --- a/src/mainPage/features/comment/modals/CommentNoUserModal.jsx +++ b/src/mainPage/features/comment/modals/CommentNoUserModal.jsx @@ -1,5 +1,6 @@ import { useContext } from "react"; import { ModalCloseContext } from "@common/modal/modal.jsx"; +import AlertModalContainer from "@main/components/AlertModalContainer.jsx"; import Button from "@common/components/Button.jsx"; import scrollTo from "@main/scroll/scrollTo.js"; import { INTERACTION_SECTION } from "@main/scroll/constants.js"; @@ -13,22 +14,17 @@ function CommentNoUserModal() { } return ( -
-
-

아직 기대평을 작성할 수 없습니다.

-

- 오늘의 추첨 이벤트에 참여하고 기대평을 작성하세요 -

-
-
- 추첨 이벤트 참여 바랍니다 -
+ } + >
-
+ ); } diff --git a/src/mainPage/features/comment/modals/CommentSuccessModal.jsx b/src/mainPage/features/comment/modals/CommentSuccessModal.jsx index 6fd4becc..1ca13c60 100644 --- a/src/mainPage/features/comment/modals/CommentSuccessModal.jsx +++ b/src/mainPage/features/comment/modals/CommentSuccessModal.jsx @@ -1,26 +1,26 @@ import { useContext } from "react"; import { ModalCloseContext } from "@common/modal/modal.jsx"; +import AlertModalContainer from "@main/components/AlertModalContainer.jsx"; import Button from "@common/components/Button.jsx"; function CommentSuccessModal() { const close = useContext(ModalCloseContext); return ( -
-

기대평이 등록되었습니다!

-
- 기대평 등록 완료 -
+ />} + > -
+ ); } diff --git a/src/mainPage/features/fcfs/modals/FcfsInvalidModal.jsx b/src/mainPage/features/fcfs/modals/FcfsInvalidModal.jsx index b98e1552..c490130d 100644 --- a/src/mainPage/features/fcfs/modals/FcfsInvalidModal.jsx +++ b/src/mainPage/features/fcfs/modals/FcfsInvalidModal.jsx @@ -1,23 +1,20 @@ import { useContext } from "react"; import { ModalCloseContext } from "@common/modal/modal.jsx"; +import AlertModalContainer from "@main/components/AlertModalContainer.jsx"; import Button from "@common/components/Button.jsx"; function FcfsInvalidModal() { const close = useContext(ModalCloseContext); return ( -
-
-

선착순 이벤트에 참여할 수 없습니다

-

- 아직 선착순 이벤트 진행 중이 아닙니다. 부적절한 방법으로 이벤트를 참여할 경우 향후 - 불이익이 가해질 수 있습니다. -

-
+ -
+ ); } diff --git a/src/mainPage/features/fcfs/modals/FcfsLoseModal.jsx b/src/mainPage/features/fcfs/modals/FcfsLoseModal.jsx index f48cfd63..c9cd6895 100644 --- a/src/mainPage/features/fcfs/modals/FcfsLoseModal.jsx +++ b/src/mainPage/features/fcfs/modals/FcfsLoseModal.jsx @@ -1,5 +1,6 @@ import { useContext } from "react"; import { ModalCloseContext } from "@common/modal/modal.jsx"; +import AlertModalContainer from "@main/components/AlertModalContainer.jsx"; import Button from "@common/components/Button.jsx"; import scrollTo from "@main/scroll/scrollTo.js"; import { INTERACTION_SECTION } from "@main/scroll/constants.js"; @@ -15,22 +16,17 @@ function FcfsLoseModal() { } return ( -
-
-

이번 이벤트에 당첨되지 않았어요!

-

- 다음 이벤트 일정을 확인하세요! -

-
-
- 선착순 이벤트 당첨 실패 -
+ } + >
-
+ ); } diff --git a/src/mainPage/features/fcfs/modals/FcfsWinModal.jsx b/src/mainPage/features/fcfs/modals/FcfsWinModal.jsx index 96859d69..f862a694 100644 --- a/src/mainPage/features/fcfs/modals/FcfsWinModal.jsx +++ b/src/mainPage/features/fcfs/modals/FcfsWinModal.jsx @@ -1,32 +1,27 @@ import { useContext } from "react"; import { ModalCloseContext } from "@common/modal/modal.jsx"; +import AlertModalContainer from "@main/components/AlertModalContainer.jsx"; import Button from "@common/components/Button.jsx"; function FcfsWinModal() { const close = useContext(ModalCloseContext); return ( -
-
-

선착순 이벤트에 당첨되었어요!

-

- 경품 수령은 입력하신 연락처로 개별 안내됩니다 -

-
-
- 선착순 이벤트 당첨 -
- 벤 + />} + > -
+ ); } diff --git a/src/mainPage/shared/components/NoServerModal.jsx b/src/mainPage/shared/components/NoServerModal.jsx index 4b9e62e3..88254fc9 100644 --- a/src/mainPage/shared/components/NoServerModal.jsx +++ b/src/mainPage/shared/components/NoServerModal.jsx @@ -1,25 +1,21 @@ import { useContext } from "react"; import { ModalCloseContext } from "@common/modal/modal.jsx"; +import AlertModalContainer from "@main/components/AlertModalContainer.jsx"; import Button from "@common/components/Button.jsx"; function NoServerModal() { const close = useContext(ModalCloseContext); return ( -
-
-

서버가 닫혔어요!

-

- 괜찮아요. 저희는 서버가 닫혀도 일부 동작은 가능하니까요! -

-
-
- 서버 닫힘 -
+ } + > -
+ ); } From ad5c10f8f16eca47d73dcac2ce325ed927efb21a Mon Sep 17 00:00:00 2001 From: lybell-art Date: Tue, 20 Aug 2024 11:16:20 +0900 Subject: [PATCH 06/34] =?UTF-8?q?[feat]=20=EB=A1=9C=EA=B7=B8=EC=95=84?= =?UTF-8?q?=EC=9B=83=20=EB=AA=A8=EB=8B=AC=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../shared/auth/Logout/LogoutConfirmModal.jsx | 28 +++++++++++++++++++ 1 file changed, 28 insertions(+) create mode 100644 src/mainPage/shared/auth/Logout/LogoutConfirmModal.jsx diff --git a/src/mainPage/shared/auth/Logout/LogoutConfirmModal.jsx b/src/mainPage/shared/auth/Logout/LogoutConfirmModal.jsx new file mode 100644 index 00000000..5460b93b --- /dev/null +++ b/src/mainPage/shared/auth/Logout/LogoutConfirmModal.jsx @@ -0,0 +1,28 @@ +import { useContext } from "react"; +import { ModalCloseContext } from "@common/modal/modal.jsx"; +import AlertModalContainer from "@main/components/AlertModalContainer.jsx"; +import Button from "@common/components/Button.jsx"; + +import { logout } from "@main/auth/store.js"; + +function LogoutConfirmModal({onLogout}) +{ + const close = useContext(ModalCloseContext); + function clickLogout() + { + logout(); + } + + return +
+ + +
+
+} + +export default LogoutConfirmModal; \ No newline at end of file From 0a2a71a4cb97f124a8579cde1f5b3da286d2994f Mon Sep 17 00:00:00 2001 From: lybell-art Date: Tue, 20 Aug 2024 11:19:33 +0900 Subject: [PATCH 07/34] =?UTF-8?q?[feat]=20=EB=A1=9C=EA=B7=B8=EC=95=84?= =?UTF-8?q?=EC=9B=83=20=EC=95=8C=EB=9F=AC=ED=8A=B8=20=EB=AA=A8=EB=8B=AC=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../shared/auth/Logout/LogoutAlertModal.jsx | 24 +++++++++++++++++++ 1 file changed, 24 insertions(+) create mode 100644 src/mainPage/shared/auth/Logout/LogoutAlertModal.jsx diff --git a/src/mainPage/shared/auth/Logout/LogoutAlertModal.jsx b/src/mainPage/shared/auth/Logout/LogoutAlertModal.jsx new file mode 100644 index 00000000..df8aff1b --- /dev/null +++ b/src/mainPage/shared/auth/Logout/LogoutAlertModal.jsx @@ -0,0 +1,24 @@ +import { useContext } from "react"; +import { ModalCloseContext } from "@common/modal/modal.jsx"; +import AlertModalContainer from "@main/components/AlertModalContainer.jsx"; +import Button from "@common/components/Button.jsx"; + +function LogoutAlertModal({onLogout}) +{ + const close = useContext(ModalCloseContext); + function onClick() + { + onLogout?.(); + close(); + } + + return +
+ +
+
+} + +export default LogoutAlertModal; \ No newline at end of file From 48b7c46257581937c9142bd56bcae230276c0ecf Mon Sep 17 00:00:00 2001 From: lybell-art Date: Tue, 20 Aug 2024 11:30:36 +0900 Subject: [PATCH 08/34] =?UTF-8?q?[feat]=20=EB=A1=9C=EA=B7=B8=EC=95=84?= =?UTF-8?q?=EC=9B=83=20=ED=99=95=EC=9D=B8=20=EB=AA=A8=EB=8B=AC=EC=97=90?= =?UTF-8?q?=EC=84=9C=20=ED=99=95=EC=9D=B8=EC=9D=84=20=EB=88=84=EB=A5=B4?= =?UTF-8?q?=EB=A9=B4=20=EB=A1=9C=EA=B7=B8=EC=95=84=EC=9B=83=20=EC=95=8C?= =?UTF-8?q?=EB=9F=AC=ED=8A=B8=20=EB=AA=A8=EB=8B=AC=EC=9D=B4=20=EB=9C=A8?= =?UTF-8?q?=EB=8F=84=EB=A1=9D=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/mainPage/shared/auth/Logout/LogoutAlertModal.jsx | 9 ++------- src/mainPage/shared/auth/Logout/LogoutConfirmModal.jsx | 3 +++ 2 files changed, 5 insertions(+), 7 deletions(-) diff --git a/src/mainPage/shared/auth/Logout/LogoutAlertModal.jsx b/src/mainPage/shared/auth/Logout/LogoutAlertModal.jsx index df8aff1b..258694ea 100644 --- a/src/mainPage/shared/auth/Logout/LogoutAlertModal.jsx +++ b/src/mainPage/shared/auth/Logout/LogoutAlertModal.jsx @@ -3,18 +3,13 @@ import { ModalCloseContext } from "@common/modal/modal.jsx"; import AlertModalContainer from "@main/components/AlertModalContainer.jsx"; import Button from "@common/components/Button.jsx"; -function LogoutAlertModal({onLogout}) +function LogoutAlertModal() { const close = useContext(ModalCloseContext); - function onClick() - { - onLogout?.(); - close(); - } return
-
diff --git a/src/mainPage/shared/auth/Logout/LogoutConfirmModal.jsx b/src/mainPage/shared/auth/Logout/LogoutConfirmModal.jsx index 5460b93b..d2bcb949 100644 --- a/src/mainPage/shared/auth/Logout/LogoutConfirmModal.jsx +++ b/src/mainPage/shared/auth/Logout/LogoutConfirmModal.jsx @@ -1,9 +1,11 @@ import { useContext } from "react"; import { ModalCloseContext } from "@common/modal/modal.jsx"; +import openModal from "@common/modal/openModal.js"; import AlertModalContainer from "@main/components/AlertModalContainer.jsx"; import Button from "@common/components/Button.jsx"; import { logout } from "@main/auth/store.js"; +import LogoutAlertModal from "./LogoutAlertModal.jsx"; function LogoutConfirmModal({onLogout}) { @@ -11,6 +13,7 @@ function LogoutConfirmModal({onLogout}) function clickLogout() { logout(); + openModal().then( ()=>onLogout?.() ); } return From fb7eba3363fdfe99f532eff1c16280bea471ec9b Mon Sep 17 00:00:00 2001 From: lybell-art Date: Tue, 20 Aug 2024 11:35:32 +0900 Subject: [PATCH 09/34] =?UTF-8?q?[feat]=20=EB=A1=9C=EA=B7=B8=EC=95=84?= =?UTF-8?q?=EC=9B=83=20=EA=B8=B0=EB=8A=A5=20=ED=86=B5=ED=95=A9=20(resolve?= =?UTF-8?q?=20#78)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/mainPage/features/header/AuthButtonSection.jsx | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/src/mainPage/features/header/AuthButtonSection.jsx b/src/mainPage/features/header/AuthButtonSection.jsx index 34077c81..f3b02809 100644 --- a/src/mainPage/features/header/AuthButtonSection.jsx +++ b/src/mainPage/features/header/AuthButtonSection.jsx @@ -1,6 +1,7 @@ import openModal from "@common/modal/openModal.js"; import AuthModal from "@main/auth/AuthModal.jsx"; import WelcomeModal from "@main/auth/Welcome"; +import LogoutModal from "@main/auth/Logout/LogoutConfirmModal.jsx"; import useAuthStore from "@main/auth/store.js"; function AuthButtonSection() { @@ -11,9 +12,15 @@ function AuthButtonSection() { const authModal = ( isFreshMember && openModal(welcomeModal)} /> ); + const logoutModal = ; if (isLogin) - return
{userName}님 환영합니다.
; + return ; return ( ; return ( From e5d5d7fa0a5b802275166bbfb5702aea62d44b97 Mon Sep 17 00:00:00 2001 From: lybell-art Date: Tue, 20 Aug 2024 13:50:13 +0900 Subject: [PATCH 11/34] =?UTF-8?q?[fix]=20=EB=A1=9C=EA=B7=B8=EC=95=84?= =?UTF-8?q?=EC=9B=83=20=ED=9B=84=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=EC=8B=9C=20?= =?UTF-8?q?=EB=B0=9C=EC=83=9D=ED=95=98=EB=8A=94=20=EB=8D=B0=EC=9D=B4?= =?UTF-8?q?=ED=84=B0=20=EB=B6=88=EC=9D=BC=EC=B9=98=20=EB=AC=B8=EC=A0=9C=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/common/dataFetch/getQuery.js | 24 ++++++++++--------- src/mainPage/features/fcfs/cardGame/index.jsx | 6 ++--- src/mainPage/features/header/index.jsx | 6 ++--- src/mainPage/features/interactions/mock.js | 20 ++++++++++++---- .../interactions/modal/InteractionAnswer.jsx | 9 +++---- .../features/interactions/modal/joinEvent.js | 18 ++++++++------ .../auth/AuthButton.jsx} | 16 +++++++------ .../shared/auth/Logout/LogoutConfirmModal.jsx | 3 ++- src/mainPage/shared/auth/store.js | 24 +++++++++---------- .../shared/drawEvent/DrawEventFetcher.jsx | 7 +++--- src/mainPage/shared/drawEvent/store.js | 15 ++++-------- src/mainPage/shared/realtimeEvent/store.js | 4 ++-- 12 files changed, 83 insertions(+), 69 deletions(-) rename src/mainPage/{features/header/AuthButtonSection.jsx => shared/auth/AuthButton.jsx} (70%) diff --git a/src/common/dataFetch/getQuery.js b/src/common/dataFetch/getQuery.js index ec073e85..9b75d721 100644 --- a/src/common/dataFetch/getQuery.js +++ b/src/common/dataFetch/getQuery.js @@ -103,18 +103,20 @@ export function useQuery(key, promiseFn, config = {}) { * * @return Function : 호출 시, 실제로 post 요청을 발송하는 함수를 반환합니다. */ +export async function mutate(key, promiseFn, { onSuccess, onError } = {}) { + try { + const value = await promiseFn(); + updateSubscribedQuery(key); + onSuccess?.(value); + return value; + } catch (e) { + onError?.(e); + if (onError === undefined) throw e; + } +} + export function useMutation(key, promiseFn, { onSuccess, onError } = {}) { - return async () => { - try { - const value = await promiseFn(); - updateSubscribedQuery(key); - onSuccess?.(value); - return value; - } catch (e) { - onError?.(e); - if (onError === undefined) throw e; - } - }; + return () => mutate(key, promiseFn, { onSuccess, onError }); } export function getQuerySuspense(key, promiseFn, dependencyArray = []) { diff --git a/src/mainPage/features/fcfs/cardGame/index.jsx b/src/mainPage/features/fcfs/cardGame/index.jsx index 177912c6..90094abe 100644 --- a/src/mainPage/features/fcfs/cardGame/index.jsx +++ b/src/mainPage/features/fcfs/cardGame/index.jsx @@ -13,10 +13,10 @@ function CardGameInitializer() { } function CardGamePariticipatedInitializer() { - const isLogin = useAuthStore((state) => state.isLogin); - const defferedLogin = useDeferredValue(isLogin); + const userId = useAuthStore((state) => state.userId); + const deferredUserId = useDeferredValue(userId); const getPariticipatedData = useFcfsStore((store) => store.getPariticipatedData); - getPariticipatedData(defferedLogin); + getPariticipatedData(deferredUserId); return null; } diff --git a/src/mainPage/features/header/index.jsx b/src/mainPage/features/header/index.jsx index 20f4750c..3a8af6aa 100644 --- a/src/mainPage/features/header/index.jsx +++ b/src/mainPage/features/header/index.jsx @@ -1,6 +1,6 @@ import scrollTo from "@main/scroll/scrollTo"; import { useSectionStore } from "@main/scroll/store"; -import AuthButtonSection from "./AuthButtonSection.jsx"; +import AuthButton from "@main/auth/AuthButton.jsx"; import HamburgerButton from "./Hamburger/Button.jsx"; import style from "./index.module.css"; @@ -51,7 +51,7 @@ export default function Header() { />
- +
@@ -66,7 +66,7 @@ export default function Header() { ))} - +
diff --git a/src/mainPage/features/interactions/mock.js b/src/mainPage/features/interactions/mock.js index 2d94f56c..bc66ee48 100644 --- a/src/mainPage/features/interactions/mock.js +++ b/src/mainPage/features/interactions/mock.js @@ -5,10 +5,22 @@ const eventParticipationDate = { }; const handlers = [ - http.get("/api/v1/event/draw/:eventId/participation", () => - HttpResponse.json(eventParticipationDate), - ), - http.post("/api/v1/event/draw/:eventId/participation", () => HttpResponse.json(true)), + http.get("/api/v1/event/draw/:eventId/participation", ({request}) =>{ + const token = request.headers.get("authorization"); + if (token === null) return HttpResponse.json({dates: []}); + + return HttpResponse.json(eventParticipationDate); + }), + http.post("/api/v1/event/draw/:eventId/participation", ({request}) => { + const token = request.headers.get("authorization"); + if (token === null) return HttpResponse.json(false, { status: 401 }); + + const dummyTodayStatus ="2024-09-10T12:00:00.000Z"; + if(eventParticipationDate.dates.includes(dummyTodayStatus)) return HttpResponse.json(false, { status: 409 }); + + eventParticipationDate.dates.push("2024-09-10T12:00:00.000Z"); + return HttpResponse.json(true); + }), http.post("/api/v1/url/shorten", () => HttpResponse.json({ shortUrl: "o1PiWwlZZU", diff --git a/src/mainPage/features/interactions/modal/InteractionAnswer.jsx b/src/mainPage/features/interactions/modal/InteractionAnswer.jsx index 90dd1e1b..d5d74604 100644 --- a/src/mainPage/features/interactions/modal/InteractionAnswer.jsx +++ b/src/mainPage/features/interactions/modal/InteractionAnswer.jsx @@ -5,7 +5,7 @@ import ShareButton from "./buttons/ShareButton.jsx"; import ParticipateButton from "./buttons/ParticipateButton.jsx"; import AnswerDescription from "./AnswerDescription.jsx"; -import useUserStore from "@main/auth/store.js"; +import useAuthStore from "@main/auth/store.js"; import useDrawEventStore from "@main/drawEvent/store.js"; import style from "./InteractionAnswer.module.css"; @@ -14,10 +14,7 @@ import content from "../content.json"; function getParticipantState(index) { return (state) => { if (!state.getOpenStatus(index) || state.fallbackMode) return ""; - if (state.isTodayEvent(index)) { - if (state.currentJoined) return "오늘 응모가 완료되었습니다!"; - else return ""; - } + if (state.isTodayEvent(index) && state.currentJoined) return "오늘 응모가 완료되었습니다!"; if (state.joinStatus[index]) return "이미 응모하셨습니다!"; else return "응모 기간이 지났습니다!"; }; @@ -26,7 +23,7 @@ function getParticipantState(index) { export default function InteractionAnswer({ isAnswerUp, setIsAnswerUp }) { const index = useContext(InteractionContext); - const isLogin = useUserStore((state) => state.isLogin); + const isLogin = useAuthStore((state) => state.isLogin); const isTodayEvent = useDrawEventStore((state) => state.isTodayEvent(index)); const participantState = useDrawEventStore(getParticipantState(index)); const [isAniPlaying, setIsAniPlaying] = useState(false); diff --git a/src/mainPage/features/interactions/modal/joinEvent.js b/src/mainPage/features/interactions/modal/joinEvent.js index 2ef1303a..d6b8a464 100644 --- a/src/mainPage/features/interactions/modal/joinEvent.js +++ b/src/mainPage/features/interactions/modal/joinEvent.js @@ -2,18 +2,22 @@ import { isLogined } from "@main/auth/store.js"; import drawEventStore from "@main/drawEvent/store.js"; import { fetchServer } from "@common/dataFetch/fetchServer.js"; +import { mutate } from "@common/dataFetch/getQuery.js"; import { EVENT_DRAW_ID } from "@common/constants.js"; export default function joinEvent(index) { const isLogin = isLogined(); - const { isTodayEvent, currentJoined, setCurrentJoin } = drawEventStore.getState(); + const { isTodayEvent, getJoinStatus, setCurrentJoin } = drawEventStore.getState(); const todayEvent = isTodayEvent(index); - if (!isLogin || !todayEvent || currentJoined) return; + if (!isLogin || !todayEvent || getJoinStatus(index) ) return; - fetchServer(`/api/v1/event/draw/${EVENT_DRAW_ID}/participation`, { method: "post" }) - .then(() => setCurrentJoin(true)) - .catch(() => { - alert("이벤트 참여에 실패했습니다."); - }); + mutate( + "draw-info-data", + ()=>fetchServer(`/api/v1/event/draw/${EVENT_DRAW_ID}/participation`, { method: "post" }), + { + onSuccess: ()=>setCurrentJoin(true), + onError: ()=>alert("이벤트 참여에 실패했습니다.") + } + ); } diff --git a/src/mainPage/features/header/AuthButtonSection.jsx b/src/mainPage/shared/auth/AuthButton.jsx similarity index 70% rename from src/mainPage/features/header/AuthButtonSection.jsx rename to src/mainPage/shared/auth/AuthButton.jsx index 38a1c288..52b7a85e 100644 --- a/src/mainPage/features/header/AuthButtonSection.jsx +++ b/src/mainPage/shared/auth/AuthButton.jsx @@ -1,18 +1,20 @@ import openModal from "@common/modal/openModal.js"; -import AuthModal from "@main/auth/AuthModal.jsx"; -import WelcomeModal from "@main/auth/Welcome"; -import LogoutModal from "@main/auth/Logout/LogoutConfirmModal.jsx"; -import useAuthStore from "@main/auth/store.js"; +import AuthModal from "./AuthModal.jsx"; +import WelcomeModal from "./Welcome"; +import LogoutModal from "./Logout/LogoutConfirmModal.jsx"; +import useAuthStore from "./store.js"; +import useDrawEventStore from "@main/drawEvent/store.js"; -function AuthButtonSection() { +function AuthButton() { const isLogin = useAuthStore((store) => store.isLogin); const userName = useAuthStore((store) => store.userName); + const setCurrentJoin = useDrawEventStore((store)=>store.setCurrentJoin); const welcomeModal = ; const authModal = ( isFreshMember && openModal(welcomeModal)} /> ); - const logoutModal = ; + const logoutModal = setCurrentJoin(false)} />; if (isLogin) return -
-
{opened && children}
-
); } diff --git a/src/mainPage/features/header/index.jsx b/src/mainPage/features/header/index.jsx index 3a8af6aa..1d9635fa 100644 --- a/src/mainPage/features/header/index.jsx +++ b/src/mainPage/features/header/index.jsx @@ -28,23 +28,23 @@ export default function Header() { }; } + const navItems = scrollSectionList.map((scrollSection, index) => ( +
  • + +
  • + )) + return (