상품 디테일 Summary 파트 스타일작업

New-Syatte · Feb 16, 2024 · 5a13689 · 5a13689
1 parent b9e38c5
commit 5a13689
Show file tree

Hide file tree

Showing 12 changed files with 265 additions and 255 deletions.
diff --git a/src/app/(brand)/modern-masters/page.tsx b/src/app/(brand)/modern-masters/page.tsx
@@ -1,8 +1,7 @@
-'use client'
+"use client";
 
 /* eslint-disable @next/next/no-img-element */
 import Image from "next/image";
-import RouteComplete from "@/utils/RouteComplete";
 import { GrNext, GrPrevious } from "react-icons/gr";
 import logo from "public/brand/modernmasters-img/modernmasters-logo.png";
 import YouTubeVideo from "@/components/youTubeVideo/YouTubeVideo";
@@ -51,7 +50,7 @@ const Modernmasters = () => {
   };
 
   return (
-    <RouteComplete>
+    <>
       {/* 최상단 배너 영역 */}
       <div className="flex w-full flex-col bg-[#F6F6F6] h-[890px]">
         <div className="flex flex-col my-auto">
@@ -92,13 +91,22 @@ const Modernmasters = () => {
       {/* 제품 소개 */}
       <div className="flex w-full h-[960px] p-[140px] relative overflow-hidden">
         <div className="flex w-[400px] absolute top-6 left-[-200px]">
-          <img src={"brand/modernmasters-img/silver_brush.png"} alt={"상단붓"} />
+          <img
+            src={"brand/modernmasters-img/silver_brush.png"}
+            alt={"상단붓"}
+          />
         </div>
         <div className="flex w-[600px] absolute bottom-0 right-[-300px]">
-          <img src={"brand/modernmasters-img/silver_brush.png"} alt={"하단붓"} />
+          <img
+            src={"brand/modernmasters-img/silver_brush.png"}
+            alt={"하단붓"}
+          />
         </div>
         <div className="flex w-[500px] absolute top-20 right-0 translate-x-1/4 transform rotate-[-15deg]">
-          <img src={"brand/modernmasters-img/modernmasters-paint-lg.png"} alt={"페인트통"} />
+          <img
+            src={"brand/modernmasters-img/modernmasters-paint-lg.png"}
+            alt={"페인트통"}
+          />
         </div>
         <div className="flex w-full my-auto px-auto z-10">
           <div className="flex flex-col">
@@ -127,7 +135,7 @@ const Modernmasters = () => {
         </div>
         <div className="flex w-full justify-center my-auto z-10">
           <div className="flex rounded-lg overflow-hidden mt-[100px]">
-            <YouTubeVideo urlId={'qj5TKQbbRYg'} />
+            <YouTubeVideo urlId={"qj5TKQbbRYg"} />
           </div>
         </div>
       </div>
@@ -145,7 +153,12 @@ const Modernmasters = () => {
         <div className="flex justify-center gap-3">
           {brandList.map((data, index) => (
             <>
-              <div className="flex w-[190px] border-[#000000] border-[1px]" onClick={()=>{setActiveBrandIndex(index)}}>
+              <div
+                className="flex w-[190px] border-[#000000] border-[1px]"
+                onClick={() => {
+                  setActiveBrandIndex(index);
+                }}
+              >
                 <img src={data.img} alt={`브랜드${index + 1}`} />
               </div>
             </>
@@ -164,16 +177,26 @@ const Modernmasters = () => {
           {MODERN_MASTERS_ARTWORK_TEXT}
         </div>
         <div className="flex w-full">
-          <img src={"brand/modernmasters-img/modernmasters-artwork.png"} alt={`페인팅 작품`} className="flex w-full"/>
+          <img
+            src={"brand/modernmasters-img/modernmasters-artwork.png"}
+            alt={`페인팅 작품`}
+            className="flex w-full"
+          />
         </div>
       </div>
       {/* 공식 스토어 */}
       <div className="flex flex-col h-full w-full justify-center mt-[150px] mb-[240px] relative overflow-hidden">
         <div className="flex w-[500px] absolute bottom-0 right-[-200px] transform rotate-[-15deg]">
-          <img src={"brand/modernmasters-img/modernmasters-store_right.png"} alt={"페인트통2"} />
+          <img
+            src={"brand/modernmasters-img/modernmasters-store_right.png"}
+            alt={"페인트통2"}
+          />
         </div>
         <div className="flex w-[380px] absolute top-0 left-[-160px] transform rotate-[15deg]">
-          <img src={"brand/modernmasters-img/modernmasters-store_left.png"} alt={"페인트통3"} />
+          <img
+            src={"brand/modernmasters-img/modernmasters-store_left.png"}
+            alt={"페인트통3"}
+          />
         </div>
         <div className="flex justify-center mb-[50px]">
           <SubTitleBox engValue={"STORE"} korValue={"공식 스토어"} />
@@ -187,7 +210,7 @@ const Modernmasters = () => {
           </div>
         </div>
       </div>
-    </RouteComplete>
+    </>
   );
 };
 

diff --git a/src/app/(cart)/cart/page.tsx b/src/app/(cart)/cart/page.tsx
@@ -2,7 +2,6 @@ import CartClient from "@/app/(cart)/cart/CartClient";
 import { authOptions } from "@/app/api/auth/[...nextauth]/route";
 import { getServerSession } from "next-auth";
 import { redirect } from "next/navigation";
-import RouteComplete from "@/utils/RouteComplete";
 
 export default async function CartPage() {
   const session = await getServerSession(authOptions);
@@ -12,8 +11,8 @@ export default async function CartPage() {
   }
 
   return (
-    <RouteComplete>
+    <>
       <CartClient />
-    </RouteComplete>
+    </>
   );
 }
diff --git a/src/app/(checkout)/checkout/CheckoutClient.tsx b/src/app/(checkout)/checkout/CheckoutClient.tsx
@@ -19,7 +19,7 @@ import {
   selectBillingAddress,
   selectShippingAddress,
 } from "@/redux/slice/checkoutSlice";
-import useNextRouter from "@/hooks/useNextRouter";
+import { useRouter } from "next/navigation";
 import dayjs from "dayjs";
 import { saveCart } from "@/services/sanity/cart";
 import { IOrder } from "@/type";
@@ -29,7 +29,7 @@ export default function CheckoutClient() {
   const userEmail = session?.user?.email;
 
   const dispatch = useDispatch();
-  const router = useNextRouter();
+  const router = useRouter();
   const cartItems = useSelector(selectCartItems);
   const shippingAddress = useSelector(selectShippingAddress);
   const billingAddress = useSelector(selectBillingAddress);

diff --git a/src/app/(checkout)/checkout/page.tsx b/src/app/(checkout)/checkout/page.tsx
@@ -2,7 +2,6 @@ import { getServerSession } from "next-auth";
 import { redirect } from "next/navigation";
 import { authOptions } from "@/app/api/auth/[...nextauth]/route";
 import CheckoutClient from "@/app/(checkout)/checkout/CheckoutClient";
-import RouteComplete from "@/utils/RouteComplete";
 
 export default async function Checkout() {
   const session = await getServerSession(authOptions); // 서버에서 session 정보 호출
@@ -11,8 +10,8 @@ export default async function Checkout() {
     redirect("/signin");
   }
   return (
-    <RouteComplete>
+    <>
       <CheckoutClient />
-    </RouteComplete>
+    </>
   );
 }
diff --git a/src/app/(home)/greetings/page.tsx b/src/app/(home)/greetings/page.tsx
@@ -1,4 +1,3 @@
-import RouteComplete from "@/utils/RouteComplete";
 import GreetingClient from "./GreetingClient";
 
 import topLeft from "@/assets/greetings/topLeft.svg";
@@ -8,39 +7,37 @@ import Image from "next/image";
 
 const About = () => {
   return (
-    <RouteComplete>
-      <div className="relative w-full">
-        <Image
-          src={topLeft}
-          alt="triangle"
-          width={756}
-          height={656}
-          className="absolute top-0 left-0 z-0"
-        />
-        <div
-          className="absolute top-0 left-0 z-20 w-full h-full bg-cover"
-          style={{ backgroundImage: `url(${topLeft})` }}
-        />
-        <div className="absolute -top-10 left-40 z-10 font-crimson text-[221px] tracking-[44px] text-white font-light opacity-70">
-          SYATT
-        </div>
-        <GreetingClient />
-        <Image
-          src={bottomRight}
-          alt="triangle"
-          width={756}
-          height={656}
-          className="absolute bottom-0 right-0 z-0"
-        />
-        <div
-          className="absolute bottom-0 right-0 z-20 w-full h-full bg-cover"
-          style={{ backgroundImage: `url(${bottomRight})` }}
-        />
-        <div className="absolute -bottom-10 right-40 z-10 font-crimson text-[221px] tracking-[44px] text-white font-light opacity-70">
-          SYATT
-        </div>
+    <div className="relative w-full">
+      <Image
+        src={topLeft}
+        alt="triangle"
+        width={756}
+        height={656}
+        className="absolute top-0 left-0 z-0"
+      />
+      <div
+        className="absolute top-0 left-0 z-20 w-full h-full bg-cover"
+        style={{ backgroundImage: `url(${topLeft})` }}
+      />
+      <div className="absolute -top-10 left-40 z-10 font-crimson text-[221px] tracking-[44px] text-white font-light opacity-70">
+        SYATT
       </div>
-    </RouteComplete>
+      <GreetingClient />
+      <Image
+        src={bottomRight}
+        alt="triangle"
+        width={756}
+        height={656}
+        className="absolute bottom-0 right-0 z-0"
+      />
+      <div
+        className="absolute bottom-0 right-0 z-20 w-full h-full bg-cover"
+        style={{ backgroundImage: `url(${bottomRight})` }}
+      />
+      <div className="absolute -bottom-10 right-40 z-10 font-crimson text-[221px] tracking-[44px] text-white font-light opacity-70">
+        SYATT
+      </div>
+    </div>
   );
 };
 

diff --git a/src/app/(product)/product-details/[id]/ProductContent.tsx b/src/app/(product)/product-details/[id]/ProductContent.tsx