From f1b0abc4baa38bafc47bddc976fcec71776069be Mon Sep 17 00:00:00 2001
From: kcwww <cwkim0321@gmail.com>
Date: Thu, 21 Nov 2024 20:06:11 +0900
Subject: [PATCH] fix: loading ui when router push

---
 .../make/_components/MakeSection.tsx          |  4 ++--
 .../make/_components/TitleForm.tsx            |  2 +-
 app/api/crystal/message/route.ts              | 21 +------------------
 .../components/modals/MessageSubmitModal.tsx  |  2 +-
 shared/components/ui/RouterLoading.tsx        |  0
 5 files changed, 5 insertions(+), 24 deletions(-)
 create mode 100644 shared/components/ui/RouterLoading.tsx

diff --git a/app/(protected)/make/_components/MakeSection.tsx b/app/(protected)/make/_components/MakeSection.tsx
index e6559ce..5dd575f 100644
--- a/app/(protected)/make/_components/MakeSection.tsx
+++ b/app/(protected)/make/_components/MakeSection.tsx
@@ -25,7 +25,7 @@ const MakeSection = ({ userData }: { userData: User }) => {
     if (typeof window !== 'undefined') {
       const isDecorated = sessionStorage.getItem('isDecorated');
       if (isDecorated) {
-        router.replace('/main');
+        router.replace(ROUTES.MAIN);
         return;
       }
 
@@ -33,7 +33,7 @@ const MakeSection = ({ userData }: { userData: User }) => {
       const step = stepParam ? parseInt(stepParam) : STEP.MAIN_DECORATION;
 
       if (isNaN(step) || step < STEP.MAIN_DECORATION || step > STEP.MAX) {
-        router.replace('/make?step=1');
+        router.replace(ROUTES.MAKE);
         return;
       }
 
diff --git a/app/(protected)/make/_components/TitleForm.tsx b/app/(protected)/make/_components/TitleForm.tsx
index e977f0c..8f397bf 100644
--- a/app/(protected)/make/_components/TitleForm.tsx
+++ b/app/(protected)/make/_components/TitleForm.tsx
@@ -81,7 +81,7 @@ const TitleForm = ({ userData }: { userData: User }) => {
       });
 
       if (response.ok) {
-        router.replace(ROUTES.MAIN);
+        router.push(ROUTES.MAIN);
         sessionStorage.setItem('isDecorated', 'true');
         router.refresh();
       }
diff --git a/app/api/crystal/message/route.ts b/app/api/crystal/message/route.ts
index 1254998..40c3e6f 100644
--- a/app/api/crystal/message/route.ts
+++ b/app/api/crystal/message/route.ts
@@ -79,7 +79,6 @@ type MessageReq = {
 };
 
 export const POST = async (req: NextRequest) => {
-  console.log('POST');
   const {
     user_id,
     crystal_id,
@@ -91,25 +90,11 @@ export const POST = async (req: NextRequest) => {
     is_deleted,
     is_opend,
   } = (await req.json()) as MessageReq;
-  console.log(
-    'POST',
-    user_id,
-    crystal_id,
-    decoration_id,
-    decoration_color,
-    content,
-    sender,
-    letter_color,
-    is_deleted,
-    is_opend
-  );
+
   await connectToMongoDB();
-  console.log('POST', 'connected to mongoDB');
 
   const sessionDB = await mongoose.startSession();
   sessionDB.startTransaction();
-
-  console.log('POST', 'sessionDB started');
   try {
     // MongoDB에 연결
 
@@ -131,7 +116,6 @@ export const POST = async (req: NextRequest) => {
       { session: sessionDB }
     );
 
-    console.log('POST', 'message created', message);
     if (!message) throw new Error('Failed to create message');
 
     const message_id = message[0]._id;
@@ -148,10 +132,8 @@ export const POST = async (req: NextRequest) => {
       },
       { new: true, session: sessionDB }
     );
-    console.log('POST', 'crystal updated');
     await sessionDB.commitTransaction();
 
-    console.log('POST', 'sessionDB committed');
     return NextResponse.json({
       message: 'Message created',
       message_id,
@@ -161,7 +143,6 @@ export const POST = async (req: NextRequest) => {
     console.error('Error creating message : ', error);
 
     await sessionDB.abortTransaction();
-    console.log('POST', 'sessionDB aborted');
     return NextResponse.json(
       { error: 'Failed to create message ' + error },
       { status: 500 }
diff --git a/shared/components/modals/MessageSubmitModal.tsx b/shared/components/modals/MessageSubmitModal.tsx
index 4f6f2a4..6435484 100644
--- a/shared/components/modals/MessageSubmitModal.tsx
+++ b/shared/components/modals/MessageSubmitModal.tsx
@@ -49,7 +49,7 @@ const MessageSubmitModal = () => {
       });
 
       if (response.ok) {
-        router.replace(`/visit/${data.uuid}`);
+        router.push(`/visit/${data.uuid}`);
         sessionStorage.setItem('messageIsDecorated', 'true');
         sessionStorage.setItem('visitToast', 'true');
         router.refresh();
diff --git a/shared/components/ui/RouterLoading.tsx b/shared/components/ui/RouterLoading.tsx
new file mode 100644
index 0000000..e69de29