From e3be9670ec53feedda1539e71a46c603e4c9f3ce Mon Sep 17 00:00:00 2001
From: thgee <thgeee@naver.com>
Date: Thu, 15 Aug 2024 10:50:42 +0900
Subject: [PATCH 01/14] =?UTF-8?q?feat:=20[=EC=9D=91=EB=AA=A8=20=EC=99=84?=
 =?UTF-8?q?=EB=A3=8C=20=ED=8E=98=EC=9D=B4=EC=A7=80]=20=ED=8E=98=EC=9D=B4?=
 =?UTF-8?q?=EC=A7=80=20=EC=83=9D=EC=84=B1=20=EB=B0=8F=20=EB=9D=BC=EC=9A=B0?=
 =?UTF-8?q?=ED=8C=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/service/src/constants/routes.ts               | 1 +
 packages/service/src/pages/LotteryApplyFinish/index.ts | 1 +
 packages/service/src/router.tsx                        | 6 ++++++
 3 files changed, 8 insertions(+)
 create mode 100644 packages/service/src/pages/LotteryApplyFinish/index.ts

diff --git a/packages/service/src/constants/routes.ts b/packages/service/src/constants/routes.ts
index e316236d..c6efaac7 100644
--- a/packages/service/src/constants/routes.ts
+++ b/packages/service/src/constants/routes.ts
@@ -16,3 +16,4 @@ export const PARTS_COLLECTION_PAGE_ROUTE = "/parts-collection" as const;
 export const SHARE_PAGE_ROUTE = "/share/:linkKey" as const;
 export const N_QUIZ_EVENT_PAGE_WINNER_APLLY_PAGE_ROUTE =
   "/quiz-event-apply" as const;
+export const LOTTER_APPLY_FINISH_PAGE_ROUTE = "/lottery/apply-finish" as const;
diff --git a/packages/service/src/pages/LotteryApplyFinish/index.ts b/packages/service/src/pages/LotteryApplyFinish/index.ts
new file mode 100644
index 00000000..b45090c5
--- /dev/null
+++ b/packages/service/src/pages/LotteryApplyFinish/index.ts
@@ -0,0 +1 @@
+export { LotteryApplyFinish } from "./LotteryApplyFinish";
diff --git a/packages/service/src/router.tsx b/packages/service/src/router.tsx
index 58206498..0411eb79 100644
--- a/packages/service/src/router.tsx
+++ b/packages/service/src/router.tsx
@@ -16,6 +16,7 @@ import {
   PARTS_COLLECTION_PAGE_ROUTE,
   SHARE_PAGE_ROUTE,
   N_QUIZ_EVENT_PAGE_WINNER_APLLY_PAGE_ROUTE,
+  LOTTER_APPLY_FINISH_PAGE_ROUTE,
 } from "./constants/routes";
 import { RotateDemoPage } from "./Demo/pages/RotateDemoPage";
 import { AuthDemoPage } from "./Demo/pages/AuthDemoPage";
@@ -36,6 +37,7 @@ import {
   Share,
   NQuizEventWinnerApply,
 } from "./pages";
+import { LotteryApplyFinish } from "./pages/LotteryApplyFinish";
 
 export const router = createBrowserRouter([
   {
@@ -53,6 +55,10 @@ export const router = createBrowserRouter([
         path: N_QUIZ_EVENT_PAGE_WINNER_APLLY_PAGE_ROUTE,
         element: <NQuizEventWinnerApply />,
       },
+      {
+        path: LOTTER_APPLY_FINISH_PAGE_ROUTE,
+        element: <LotteryApplyFinish />,
+      },
     ],
   },
   {

From 46743d62b2eff31b195ae92e5fa353b7c31c4fb0 Mon Sep 17 00:00:00 2001
From: thgee <thgeee@naver.com>
Date: Thu, 15 Aug 2024 10:51:11 +0900
Subject: [PATCH 02/14] =?UTF-8?q?feat:=20[=EC=9D=91=EB=AA=A8=20=EC=99=84?=
 =?UTF-8?q?=EB=A3=8C=20=ED=8E=98=EC=9D=B4=EC=A7=80]=20HTML=20=EC=9E=91?=
 =?UTF-8?q?=EC=84=B1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../LotteryApplyFinish/LotteryApplyFinish.tsx | 70 +++++++++++++++++++
 1 file changed, 70 insertions(+)
 create mode 100644 packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx

diff --git a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
new file mode 100644
index 00000000..d85160e5
--- /dev/null
+++ b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
@@ -0,0 +1,70 @@
+import { useNavigate } from "react-router-dom";
+import * as style from "./LotteryApplyFinish.css";
+import { Button, ButtonVariant } from "@service/common/components/Button";
+import { ClipBoardButton } from "@service/common/components/ClipBoardButton";
+import { theme } from "@watermelon-clap/core/src/theme";
+import { Space } from "@service/common/styles/Space";
+import { css } from "@emotion/react";
+import { MAIN_PAGE_ROUTE } from "@service/constants/routes";
+
+export const LotteryApplyFinish = () => {
+  const navigator = useNavigate();
+  return (
+    <div css={style.mainBg}>
+      <section>
+        <h1 css={style.pageTitle}>응모완료</h1>
+        <span>이벤트에 응모되었습니다.</span>
+      </section>
+
+      <section
+        css={css`
+          margin: 0 auto;
+        `}
+      >
+        <div>
+          <span>내 컬렉션 URL</span>
+          <span>
+            링크를 통해 친구가 이벤트를 참여하면 추가 뽑기권을 드려요!
+          </span>
+
+          <div css={[theme.flex.center, theme.gap.gap12]}>
+            <div css={style.shareLinkBox}>공유링크</div>
+            <ClipBoardButton />
+          </div>
+        </div>
+
+        <Space size={100} />
+
+        <div>
+          <span css={theme.font.pcB28}>
+            새롭게 출시된 아반떼 N에 대한 기대평을 남겨주세요 🥳
+          </span>
+          <span css={theme.font.preM18}>
+            남겨주신 기대평은 홈화면에 노출될 수 있습니다! 최대 50자까지 작성할
+            수 있어요.
+          </span>
+
+          <div css={[theme.flex.center, theme.gap.gap12]}>
+            <textarea
+              placeholder="여기에 기대평을 작성해주세요"
+              css={style.expectationInput}
+            />
+            <Button variant={ButtonVariant.LONG} css={style.applyBtn}>
+              제출하기
+            </Button>
+          </div>
+        </div>
+      </section>
+
+      <Space size={100} />
+
+      <Button
+        variant={ButtonVariant.LONG}
+        css={style.btn}
+        onClick={() => navigator(MAIN_PAGE_ROUTE)}
+      >
+        홈으로 가기
+      </Button>
+    </div>
+  );
+};

From ba944f6dd2b3f2d340872799277ec3df7b8e2d6b Mon Sep 17 00:00:00 2001
From: thgee <thgeee@naver.com>
Date: Thu, 15 Aug 2024 11:21:34 +0900
Subject: [PATCH 03/14] =?UTF-8?q?feat:=20[=EC=9D=91=EB=AA=A8=20=EC=99=84?=
 =?UTF-8?q?=EB=A3=8C=20=ED=8E=98=EC=9D=B4=EC=A7=80]=20PC=20=EB=94=94?=
 =?UTF-8?q?=EC=9E=90=EC=9D=B8=20=EA=B5=AC=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../LotteryApplyFinish.css.ts                 | 69 +++++++++++++++++++
 .../LotteryApplyFinish/LotteryApplyFinish.tsx | 47 +++++++++----
 2 files changed, 103 insertions(+), 13 deletions(-)
 create mode 100644 packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.css.ts

diff --git a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.css.ts b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.css.ts
new file mode 100644
index 00000000..bfaeba39
--- /dev/null
+++ b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.css.ts
@@ -0,0 +1,69 @@
+import { css } from "@emotion/react";
+import { mobile } from "@service/common/responsive/responsive";
+import { theme } from "@watermelon-clap/core/src/theme";
+
+export const mainBg = css`
+  background-image: url("/images/common/main-bg.webp");
+  background-size: cover;
+  padding-bottom: 200px;
+
+  color: white;
+`;
+
+export const pageTitle = css`
+  text-align: center;
+  ${theme.font.pcpB}
+  font-size : calc(50px + 2vw);
+  padding-top: 120px;
+  color: ${theme.color.white};
+
+  ${mobile(css`
+    font-size: calc(20px + 2vw);
+    padding: 100px 0 50px 0;
+  `)}
+`;
+export const applyBtn = css`
+  padding: 50px 50px;
+  height: 100px;
+
+  width: fit-content;
+`;
+
+export const btn = css`
+  margin: 0 auto;
+  background-color: ${theme.color.gray100};
+  color: black;
+  ${theme.font.preB}
+  font-size : 24px;
+
+  &:hover {
+    background-color: ${theme.color.gray200};
+  }
+  ${mobile(css`
+    width: fit-content;
+    padding: 10px 20px;
+  `)}
+`;
+
+export const shareLinkBox = css`
+  background-color: ${theme.color.gray100};
+  color: ${theme.color.gray300};
+  ${theme.font.preM14}
+  border-radius: 10px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  padding: 16px 18px;
+
+  width: 400px;
+`;
+
+export const expectationInput = css`
+  padding: 18px;
+  height: 100px;
+  resize: none;
+  width: 600px;
+  border-radius: 14px;
+  background-color: ${theme.color.gray100};
+  outline: none;
+`;
diff --git a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
index d85160e5..7c5c3f1c 100644
--- a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
+++ b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
@@ -11,31 +11,52 @@ export const LotteryApplyFinish = () => {
   const navigator = useNavigate();
   return (
     <div css={style.mainBg}>
-      <section>
-        <h1 css={style.pageTitle}>응모완료</h1>
-        <span>이벤트에 응모되었습니다.</span>
-      </section>
+      <h1 css={style.pageTitle}>응모완료</h1>
+
+      <Space size={100} />
 
       <section
-        css={css`
-          margin: 0 auto;
-        `}
+        css={[
+          theme.flex.column,
+          css`
+            margin: 0 auto;
+            width: 70%;
+            max-width: 1000px;
+            justify-content: start;
+            align-items: start;
+          `,
+        ]}
       >
-        <div>
-          <span>내 컬렉션 URL</span>
+        <div
+          css={[
+            theme.flex.column,
+            css`
+              align-items: start;
+              gap: 14px;
+            `,
+          ]}
+        >
+          <span css={theme.font.pcB28}>내 컬렉션 URL</span>
           <span>
             링크를 통해 친구가 이벤트를 참여하면 추가 뽑기권을 드려요!
           </span>
-
           <div css={[theme.flex.center, theme.gap.gap12]}>
             <div css={style.shareLinkBox}>공유링크</div>
             <ClipBoardButton />
           </div>
         </div>
 
-        <Space size={100} />
+        <Space size={40} />
 
-        <div>
+        <div
+          css={[
+            theme.flex.column,
+            css`
+              align-items: start;
+              gap: 14px;
+            `,
+          ]}
+        >
           <span css={theme.font.pcB28}>
             새롭게 출시된 아반떼 N에 대한 기대평을 남겨주세요 🥳
           </span>
@@ -44,7 +65,7 @@ export const LotteryApplyFinish = () => {
             수 있어요.
           </span>
 
-          <div css={[theme.flex.center, theme.gap.gap12]}>
+          <div css={[theme.flex.center, theme.gap.gap16]}>
             <textarea
               placeholder="여기에 기대평을 작성해주세요"
               css={style.expectationInput}

From 43c62d6c6fb5099e9811e75f4a0161c61ce4c458 Mon Sep 17 00:00:00 2001
From: thgee <thgeee@naver.com>
Date: Thu, 15 Aug 2024 11:41:54 +0900
Subject: [PATCH 04/14] =?UTF-8?q?feat:=20=ED=81=B4=EB=A6=BD=EB=B3=B4?=
 =?UTF-8?q?=EB=93=9C=20=EB=B3=B5=EC=82=AC=20=EA=B8=B0=EB=8A=A5=20=EA=B5=AC?=
 =?UTF-8?q?=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ClipBoardButton/ClipBoardButton.tsx       | 86 +++++++++++--------
 1 file changed, 48 insertions(+), 38 deletions(-)

diff --git a/packages/service/src/common/components/ClipBoardButton/ClipBoardButton.tsx b/packages/service/src/common/components/ClipBoardButton/ClipBoardButton.tsx
index d66e9bf0..10a9995b 100644
--- a/packages/service/src/common/components/ClipBoardButton/ClipBoardButton.tsx
+++ b/packages/service/src/common/components/ClipBoardButton/ClipBoardButton.tsx
@@ -8,51 +8,61 @@ import {
 } from "./ClipBoardButton.css";
 import { ReactComponent as ClipBoardIcon } from "public/icons/clipboard.svg";
 
-const ClipBoardButton = () => {
+interface IClipBoardButton {
+  copyRef: React.MutableRefObject<null>;
+}
+const ClipBoardButton = ({ copyRef }: IClipBoardButton) => {
   const [isCliped, setIsCliped] = useState<boolean>(false);
   const initialText = "클립보드에 복사";
   const changeText = "복사되었습니다!";
 
+  const handleCopy = () => {
+    const textToCopy = copyRef?.current?.textContent;
+    navigator.clipboard.writeText(textToCopy);
+  };
+
   return (
-    <AnimatePresence mode="wait">
-      {isCliped ? (
-        <motion.button
-          css={clipButtonSuccessStyle}
-          onClick={() => setIsCliped(false)}
-          initial={{ opacity: 0 }}
-          animate={{ opacity: 1 }}
-          exit={{ opacity: 0 }}
-        >
-          <motion.span
-            css={clipButtonSuccessContentStyle}
-            key="action"
-            initial={{ y: -50 }}
-            animate={{ y: 0 }}
+    <div onClick={handleCopy}>
+      <AnimatePresence mode="wait">
+        {isCliped ? (
+          <motion.button
+            css={clipButtonSuccessStyle}
+            onClick={() => setIsCliped(false)}
+            initial={{ opacity: 0 }}
+            animate={{ opacity: 1 }}
+            exit={{ opacity: 0 }}
           >
-            <ClipBoardIcon />
-            {changeText}
-          </motion.span>
-        </motion.button>
-      ) : (
-        <motion.button
-          css={clipButtonStyle}
-          onClick={() => setIsCliped(true)}
-          initial={{ opacity: 0 }}
-          animate={{ opacity: 1 }}
-          exit={{ opacity: 0 }}
-        >
-          <motion.span
-            css={clipButtonContentStyle}
-            key="reaction"
-            initial={{ x: 0 }}
-            exit={{ x: 50, transition: { duration: 0.1 } }}
+            <motion.span
+              css={clipButtonSuccessContentStyle}
+              key="action"
+              initial={{ y: -50 }}
+              animate={{ y: 0 }}
+            >
+              <ClipBoardIcon />
+              {changeText}
+            </motion.span>
+          </motion.button>
+        ) : (
+          <motion.button
+            css={clipButtonStyle}
+            onClick={() => setIsCliped(true)}
+            initial={{ opacity: 0 }}
+            animate={{ opacity: 1 }}
+            exit={{ opacity: 0 }}
           >
-            <ClipBoardIcon />
-            {initialText}
-          </motion.span>
-        </motion.button>
-      )}
-    </AnimatePresence>
+            <motion.span
+              css={clipButtonContentStyle}
+              key="reaction"
+              initial={{ x: 0 }}
+              exit={{ x: 50, transition: { duration: 0.1 } }}
+            >
+              <ClipBoardIcon />
+              {initialText}
+            </motion.span>
+          </motion.button>
+        )}
+      </AnimatePresence>
+    </div>
   );
 };
 

From 49c23eca3add0ed7564d961eb1c5e6cabe76322d Mon Sep 17 00:00:00 2001
From: thgee <thgeee@naver.com>
Date: Thu, 15 Aug 2024 11:51:17 +0900
Subject: [PATCH 05/14] =?UTF-8?q?feat:=20=EB=82=B4=20=EA=B3=B5=EC=9C=A0?=
 =?UTF-8?q?=EB=A7=81=ED=81=AC=20=EB=B0=9B=EC=95=84=EC=98=A4=EA=B8=B0=20API?=
 =?UTF-8?q?=20=EB=A9=94=EC=86=8C=EB=93=9C=20=EC=83=9D=EC=84=B1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/service/src/apis/link/apiGetMyShareLink.ts | 13 +++++++++++++
 1 file changed, 13 insertions(+)
 create mode 100644 packages/service/src/apis/link/apiGetMyShareLink.ts

diff --git a/packages/service/src/apis/link/apiGetMyShareLink.ts b/packages/service/src/apis/link/apiGetMyShareLink.ts
new file mode 100644
index 00000000..db4a65db
--- /dev/null
+++ b/packages/service/src/apis/link/apiGetMyShareLink.ts
@@ -0,0 +1,13 @@
+import { customFetch, getAccessToken } from "@watermelon-clap/core/src/utils";
+
+interface IApiGetMyShareLink {
+  link: string;
+}
+
+export const apiGetMyShareLink = (): Promise<IApiGetMyShareLink> => {
+  return customFetch(`${import.meta.env.VITE_BACK_BASE_URL}/link`, {
+    headers: {
+      Authorization: `Bearer ${getAccessToken()}`,
+    },
+  }).then((res) => res.json());
+};

From 9b66638a665b7c09e817995e55ddd18a98653753 Mon Sep 17 00:00:00 2001
From: thgee <thgeee@naver.com>
Date: Thu, 15 Aug 2024 11:51:44 +0900
Subject: [PATCH 06/14] =?UTF-8?q?feat:=20[=EC=9D=91=EB=AA=A8=20=EC=99=84?=
 =?UTF-8?q?=EB=A3=8C=20=ED=8E=98=EC=9D=B4=EC=A7=80]=20=EA=B3=B5=EC=9C=A0?=
 =?UTF-8?q?=EB=A7=81=ED=81=AC=20=EB=B0=9B=EC=95=84=EC=84=9C=20=ED=99=94?=
 =?UTF-8?q?=EB=A9=B4=EC=97=90=20=EB=A0=8C=EB=8D=94=EB=A7=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../LotteryApplyFinish/LotteryApplyFinish.tsx | 21 +++++++++++++++----
 1 file changed, 17 insertions(+), 4 deletions(-)

diff --git a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
index 7c5c3f1c..a2c108b2 100644
--- a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
+++ b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
@@ -6,9 +6,20 @@ import { theme } from "@watermelon-clap/core/src/theme";
 import { Space } from "@service/common/styles/Space";
 import { css } from "@emotion/react";
 import { MAIN_PAGE_ROUTE } from "@service/constants/routes";
+import { useEffect, useRef, useState } from "react";
+import { apiGetMyShareLink } from "@service/apis/link/apiGetMyShareLink";
 
 export const LotteryApplyFinish = () => {
-  const navigator = useNavigate();
+  const navigate = useNavigate();
+  const shareLinkRef = useRef(null);
+  const [shareLink, setShareLink] = useState<string>();
+
+  useEffect(() => {
+    apiGetMyShareLink().then(({ link }) => {
+      setShareLink(link);
+    });
+  }, []);
+
   return (
     <div css={style.mainBg}>
       <h1 css={style.pageTitle}>응모완료</h1>
@@ -41,8 +52,10 @@ export const LotteryApplyFinish = () => {
             링크를 통해 친구가 이벤트를 참여하면 추가 뽑기권을 드려요!
           </span>
           <div css={[theme.flex.center, theme.gap.gap12]}>
-            <div css={style.shareLinkBox}>공유링크</div>
-            <ClipBoardButton />
+            <div css={style.shareLinkBox} ref={shareLinkRef}>
+              {shareLink}
+            </div>
+            <ClipBoardButton copyRef={shareLinkRef} />
           </div>
         </div>
 
@@ -82,7 +95,7 @@ export const LotteryApplyFinish = () => {
       <Button
         variant={ButtonVariant.LONG}
         css={style.btn}
-        onClick={() => navigator(MAIN_PAGE_ROUTE)}
+        onClick={() => navigate(MAIN_PAGE_ROUTE)}
       >
         홈으로 가기
       </Button>

From 6556a174f802bf3d61d95d38630cd9e37ac47646 Mon Sep 17 00:00:00 2001
From: thgee <thgeee@naver.com>
Date: Thu, 15 Aug 2024 12:26:44 +0900
Subject: [PATCH 07/14] =?UTF-8?q?feat:=20[=EC=9D=91=EB=AA=A8=20=EC=99=84?=
 =?UTF-8?q?=EB=A3=8C=20=ED=8E=98=EC=9D=B4=EC=A7=80]=20=EA=B8=B0=EB=8C=80?=
 =?UTF-8?q?=ED=8F=89=20=EC=A0=9C=EC=B6=9C=ED=95=98=EA=B8=B0=20=EB=B2=84?=
 =?UTF-8?q?=ED=8A=BC=20=ED=99=9C=EC=84=B1=ED=99=94/=EB=B9=84=ED=99=9C?=
 =?UTF-8?q?=EC=84=B1=ED=99=94=20=EB=A1=9C=EC=A7=81=20=EA=B5=AC=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../LotteryApplyFinish.css.ts                 | 11 ++++++-
 .../LotteryApplyFinish/LotteryApplyFinish.tsx | 33 ++++++++++++++++---
 2 files changed, 39 insertions(+), 5 deletions(-)

diff --git a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.css.ts b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.css.ts
index bfaeba39..fe0ff8ef 100644
--- a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.css.ts
+++ b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.css.ts
@@ -22,9 +22,18 @@ export const pageTitle = css`
     padding: 100px 0 50px 0;
   `)}
 `;
-export const applyBtn = css`
+export const applyBtn = (isExpectationNull: boolean) => css`
   padding: 50px 50px;
   height: 100px;
+  background-color: ${isExpectationNull
+    ? theme.color.gray400
+    : theme.color.eventBlue};
+  color: ${isExpectationNull ? theme.color.gray300 : theme.color.white};
+  cursor: ${isExpectationNull ? "default" : "pointer"};
+
+  &:active {
+    background-color: ${isExpectationNull && theme.color.gray400};
+  }
 
   width: fit-content;
 `;
diff --git a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
index a2c108b2..54ba8632 100644
--- a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
+++ b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
@@ -6,13 +6,15 @@ import { theme } from "@watermelon-clap/core/src/theme";
 import { Space } from "@service/common/styles/Space";
 import { css } from "@emotion/react";
 import { MAIN_PAGE_ROUTE } from "@service/constants/routes";
-import { useEffect, useRef, useState } from "react";
+import { ChangeEvent, useEffect, useRef, useState } from "react";
 import { apiGetMyShareLink } from "@service/apis/link/apiGetMyShareLink";
 
 export const LotteryApplyFinish = () => {
   const navigate = useNavigate();
   const shareLinkRef = useRef(null);
   const [shareLink, setShareLink] = useState<string>();
+  const [expectation, setExpectation] = useState("");
+  const [isExpectationNull, setIsExpectationNull] = useState(true);
 
   useEffect(() => {
     apiGetMyShareLink().then(({ link }) => {
@@ -20,6 +22,19 @@ export const LotteryApplyFinish = () => {
     });
   }, []);
 
+  const handleChange = (event: ChangeEvent<HTMLTextAreaElement>) => {
+    const text = event.currentTarget.value;
+    setIsExpectationNull(!text.length ? true : false);
+    setExpectation(text);
+  };
+  console.log(isExpectationNull);
+
+  const handleSubmit = async () => {
+    if (!expectation) {
+      return;
+    }
+  };
+
   return (
     <div css={style.mainBg}>
       <h1 css={style.pageTitle}>응모완료</h1>
@@ -78,15 +93,25 @@ export const LotteryApplyFinish = () => {
             수 있어요.
           </span>
 
-          <div css={[theme.flex.center, theme.gap.gap16]}>
+          <form
+            onSubmit={handleSubmit}
+            css={[theme.flex.center, theme.gap.gap16]}
+          >
             <textarea
               placeholder="여기에 기대평을 작성해주세요"
               css={style.expectationInput}
+              value={expectation}
+              onChange={handleChange}
             />
-            <Button variant={ButtonVariant.LONG} css={style.applyBtn}>
+            <Button
+              type="submit"
+              variant={ButtonVariant.LONG}
+              css={style.applyBtn(isExpectationNull)}
+              disabled={isExpectationNull}
+            >
               제출하기
             </Button>
-          </div>
+          </form>
         </div>
       </section>
 

From 8d8e0431380cc9317cfc199402d2d2f1af500c30 Mon Sep 17 00:00:00 2001
From: thgee <thgeee@naver.com>
Date: Thu, 15 Aug 2024 14:23:37 +0900
Subject: [PATCH 08/14] =?UTF-8?q?feat:=20[=EC=9D=91=EB=AA=A8=20=EC=99=84?=
 =?UTF-8?q?=EB=A3=8C=20=ED=8E=98=EC=9D=B4=EC=A7=80]=20=EA=B8=B0=EB=8C=80?=
 =?UTF-8?q?=ED=8F=89=20=EC=A0=9C=EC=B6=9C=20=EA=B8=B0=EB=8A=A5=20=EA=B5=AC?=
 =?UTF-8?q?=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../apis/expectation/apiPostExpectation.ts    | 17 ++++++++++
 .../LotteryApplyFinish/LotteryApplyFinish.tsx | 32 +++++++++++++++++--
 2 files changed, 47 insertions(+), 2 deletions(-)
 create mode 100644 packages/service/src/apis/expectation/apiPostExpectation.ts

diff --git a/packages/service/src/apis/expectation/apiPostExpectation.ts b/packages/service/src/apis/expectation/apiPostExpectation.ts
new file mode 100644
index 00000000..6737e18d
--- /dev/null
+++ b/packages/service/src/apis/expectation/apiPostExpectation.ts
@@ -0,0 +1,17 @@
+import { customFetch, getAccessToken } from "@watermelon-clap/core/src/utils";
+
+export const apiPostExpectation = (expectation: string) =>
+  customFetch(
+    `
+    ${import.meta.env.VITE_BACK_BASE_URL}/expectations
+    `,
+    {
+      method: "POST",
+      body: JSON.stringify({
+        expectation: expectation,
+      }),
+      headers: {
+        Authorization: `Bearer ${getAccessToken()}`,
+      },
+    },
+  );
diff --git a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
index 54ba8632..009c620e 100644
--- a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
+++ b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
@@ -8,6 +8,8 @@ import { css } from "@emotion/react";
 import { MAIN_PAGE_ROUTE } from "@service/constants/routes";
 import { ChangeEvent, useEffect, useRef, useState } from "react";
 import { apiGetMyShareLink } from "@service/apis/link/apiGetMyShareLink";
+import { apiPostExpectation } from "@service/apis/expectation/apiPostExpectation";
+import { useModal } from "@watermelon-clap/core/src/hooks";
 
 export const LotteryApplyFinish = () => {
   const navigate = useNavigate();
@@ -15,6 +17,9 @@ export const LotteryApplyFinish = () => {
   const [shareLink, setShareLink] = useState<string>();
   const [expectation, setExpectation] = useState("");
   const [isExpectationNull, setIsExpectationNull] = useState(true);
+  const [isPostExpectation, setIsPostExpectation] = useState(false);
+
+  const { openModal } = useModal();
 
   useEffect(() => {
     apiGetMyShareLink().then(({ link }) => {
@@ -25,14 +30,36 @@ export const LotteryApplyFinish = () => {
   const handleChange = (event: ChangeEvent<HTMLTextAreaElement>) => {
     const text = event.currentTarget.value;
     setIsExpectationNull(!text.length ? true : false);
+    if (text.length >= 50) {
+      alert("기대평은 50자 이내 작성 가능합니다.");
+      return;
+    }
     setExpectation(text);
   };
-  console.log(isExpectationNull);
 
-  const handleSubmit = async () => {
+  const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
+    event.preventDefault();
     if (!expectation) {
       return;
     }
+
+    apiPostExpectation(expectation)
+      .then(() => {
+        openModal({
+          type: "alert",
+          props: {
+            content: "기대평을 성공적으로 등록하였습니다",
+          },
+        });
+        setIsPostExpectation(true);
+        setIsExpectationNull(true);
+      })
+      .catch(() =>
+        openModal({
+          type: "alert",
+          props: { content: "기대평 등록에 실패했습니다" },
+        }),
+      );
   };
 
   return (
@@ -102,6 +129,7 @@ export const LotteryApplyFinish = () => {
               css={style.expectationInput}
               value={expectation}
               onChange={handleChange}
+              disabled={isPostExpectation && true}
             />
             <Button
               type="submit"

From f6c4837b7004d954f7f433861f20beb99b6549c0 Mon Sep 17 00:00:00 2001
From: thgee <thgeee@naver.com>
Date: Thu, 15 Aug 2024 14:25:02 +0900
Subject: [PATCH 09/14] =?UTF-8?q?feat:=20[=EC=9D=91=EB=AA=A8=20=EC=99=84?=
 =?UTF-8?q?=EB=A3=8C=20=ED=8E=98=EC=9D=B4=EC=A7=80]=20=EA=B8=B0=EB=8C=80?=
 =?UTF-8?q?=ED=8F=89=2050=EC=9E=90=20=EC=9D=B4=EC=83=81=20=EC=9E=85?=
 =?UTF-8?q?=EB=A0=A5=20=EC=8B=9C=20=EA=B2=BD=EA=B3=A0=20=EB=AA=A8=EB=8B=AC?=
 =?UTF-8?q?=20=EB=9D=84=EC=9A=B0=EA=B8=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx      | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
index 009c620e..eddcb713 100644
--- a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
+++ b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
@@ -31,7 +31,10 @@ export const LotteryApplyFinish = () => {
     const text = event.currentTarget.value;
     setIsExpectationNull(!text.length ? true : false);
     if (text.length >= 50) {
-      alert("기대평은 50자 이내 작성 가능합니다.");
+      openModal({
+        type: "alert",
+        props: { content: "기대평은 50자 이내 작성 가능합니다" },
+      });
       return;
     }
     setExpectation(text);

From 1a981848258cd28555ba7a9002f968c501b500cf Mon Sep 17 00:00:00 2001
From: thgee <thgeee@naver.com>
Date: Thu, 15 Aug 2024 15:01:06 +0900
Subject: [PATCH 10/14] =?UTF-8?q?feat:=20[=EC=9D=91=EB=AA=A8=20=EC=99=84?=
 =?UTF-8?q?=EB=A3=8C=20=ED=8E=98=EC=9D=B4=EC=A7=80]=20=EB=AA=A8=EB=B0=94?=
 =?UTF-8?q?=EC=9D=BC=EB=B7=B0=20=EA=B5=AC=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/service/src/index.tsx                |  2 +-
 .../LotteryApplyFinish.css.ts                 | 23 +++++++++++--
 .../LotteryApplyFinish/LotteryApplyFinish.tsx | 34 +++++++++++++++----
 3 files changed, 50 insertions(+), 9 deletions(-)

diff --git a/packages/service/src/index.tsx b/packages/service/src/index.tsx
index c4442152..caa10eed 100644
--- a/packages/service/src/index.tsx
+++ b/packages/service/src/index.tsx
@@ -23,6 +23,6 @@ ReactDOM.createRoot(document.getElementById("root")!).render(
       <RouterProvider router={router} />
       <ModalContainer />
     </ModalProvider>
-    <ReactQueryDevtools initialIsOpen={false} />s
+    <ReactQueryDevtools initialIsOpen={false} />
   </QueryClientProvider>,
 );
diff --git a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.css.ts b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.css.ts
index fe0ff8ef..6e6c26ac 100644
--- a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.css.ts
+++ b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.css.ts
@@ -8,6 +8,10 @@ export const mainBg = css`
   padding-bottom: 200px;
 
   color: white;
+
+  ${mobile(css`
+    padding-bottom: 100px;
+  `)}
 `;
 
 export const pageTitle = css`
@@ -38,6 +42,13 @@ export const applyBtn = (isExpectationNull: boolean) => css`
   width: fit-content;
 `;
 
+export const sectionTitle = css`
+  ${theme.font.pcB28};
+  ${mobile(css`
+    font-size: 24px;
+  `)}
+`;
+
 export const btn = css`
   margin: 0 auto;
   background-color: ${theme.color.gray100};
@@ -49,8 +60,8 @@ export const btn = css`
     background-color: ${theme.color.gray200};
   }
   ${mobile(css`
-    width: fit-content;
     padding: 10px 20px;
+    width: 200px;
   `)}
 `;
 
@@ -63,8 +74,12 @@ export const shareLinkBox = css`
   overflow: hidden;
   text-overflow: ellipsis;
   padding: 16px 18px;
-
   width: 400px;
+
+  ${mobile(css`
+    width: 100%;
+    padding: 10px;
+  `)}
 `;
 
 export const expectationInput = css`
@@ -75,4 +90,8 @@ export const expectationInput = css`
   border-radius: 14px;
   background-color: ${theme.color.gray100};
   outline: none;
+
+  ${mobile(css`
+    width: 100%;
+  `)}
 `;
diff --git a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
index eddcb713..b8843beb 100644
--- a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
+++ b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
@@ -10,6 +10,8 @@ import { ChangeEvent, useEffect, useRef, useState } from "react";
 import { apiGetMyShareLink } from "@service/apis/link/apiGetMyShareLink";
 import { apiPostExpectation } from "@service/apis/expectation/apiPostExpectation";
 import { useModal } from "@watermelon-clap/core/src/hooks";
+import { mobile } from "@service/common/responsive/responsive";
+import { useMobile } from "@service/common/hooks/useMobile";
 
 export const LotteryApplyFinish = () => {
   const navigate = useNavigate();
@@ -65,11 +67,13 @@ export const LotteryApplyFinish = () => {
       );
   };
 
+  const isMobile = useMobile();
+
   return (
     <div css={style.mainBg}>
       <h1 css={style.pageTitle}>응모완료</h1>
 
-      <Space size={100} />
+      <Space size={isMobile ? 40 : 100} />
 
       <section
         css={[
@@ -89,14 +93,25 @@ export const LotteryApplyFinish = () => {
             css`
               align-items: start;
               gap: 14px;
+              width: 100%;
             `,
           ]}
         >
-          <span css={theme.font.pcB28}>내 컬렉션 URL</span>
+          <span css={style.sectionTitle}>내 컬렉션 URL</span>
           <span>
             링크를 통해 친구가 이벤트를 참여하면 추가 뽑기권을 드려요!
           </span>
-          <div css={[theme.flex.center, theme.gap.gap12]}>
+          <div
+            css={[
+              theme.flex.center,
+              theme.gap.gap12,
+              mobile(css`
+                flex-direction: column;
+                width: 100%;
+                align-items: start;
+              `),
+            ]}
+          >
             <div css={style.shareLinkBox} ref={shareLinkRef}>
               {shareLink}
             </div>
@@ -111,11 +126,11 @@ export const LotteryApplyFinish = () => {
             theme.flex.column,
             css`
               align-items: start;
-              gap: 14px;
+              gap: 24px;
             `,
           ]}
         >
-          <span css={theme.font.pcB28}>
+          <span css={style.sectionTitle}>
             새롭게 출시된 아반떼 N에 대한 기대평을 남겨주세요 🥳
           </span>
           <span css={theme.font.preM18}>
@@ -125,7 +140,14 @@ export const LotteryApplyFinish = () => {
 
           <form
             onSubmit={handleSubmit}
-            css={[theme.flex.center, theme.gap.gap16]}
+            css={[
+              theme.flex.center,
+              theme.gap.gap16,
+              mobile(css`
+                flex-direction: column;
+                width: 100%;
+              `),
+            ]}
           >
             <textarea
               placeholder="여기에 기대평을 작성해주세요"

From 3a9955aa8c75cc8ff04aeed0ed78c53dc2e939c3 Mon Sep 17 00:00:00 2001
From: thgee <thgeee@naver.com>
Date: Thu, 15 Aug 2024 15:21:31 +0900
Subject: [PATCH 11/14] =?UTF-8?q?chore:=20=EB=A9=94=EC=9D=B8=ED=8E=98?=
 =?UTF-8?q?=EC=9D=B4=EC=A7=80=20=ED=83=80=EC=9D=B4=EB=A8=B8=20=ED=8F=B0?=
 =?UTF-8?q?=ED=8A=B8=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../service/src/components/main/EventPeriod/Timer/Timer.css.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/service/src/components/main/EventPeriod/Timer/Timer.css.ts b/packages/service/src/components/main/EventPeriod/Timer/Timer.css.ts
index 6b44a8d5..1173c272 100644
--- a/packages/service/src/components/main/EventPeriod/Timer/Timer.css.ts
+++ b/packages/service/src/components/main/EventPeriod/Timer/Timer.css.ts
@@ -15,7 +15,7 @@ export const staticCardStyles = (position: "upper" | "lower") => css`
 `;
 
 export const textStyles = (translateY?: string, title?: string) => css`
-  font-family: "PyeongChang Peace";
+  ${theme.font.pcpL}
   font-size: calc(20px + 3vw);
   -webkit-text-stroke-width: 2px;
   font-weight: normal;
@@ -96,6 +96,7 @@ export const rendererWrap2 = css`
   align-items: center;
   gap: calc(10px + 2vw);
   justify-content: center;
+
   ${mobile(css`
     gap: 0.3rem;
   `)};

From ecac66645337da1b07c6cfd363923aaf0ea1e4bb Mon Sep 17 00:00:00 2001
From: thgee <thgeee@naver.com>
Date: Thu, 15 Aug 2024 15:55:13 +0900
Subject: [PATCH 12/14] =?UTF-8?q?feat:=20[=EC=9D=91=EB=AA=A8=20=EC=99=84?=
 =?UTF-8?q?=EB=A3=8C=20=ED=8E=98=EC=9D=B4=EC=A7=80]=20=EC=9D=B4=EB=AF=B8?=
 =?UTF-8?q?=20=EC=9D=91=EB=AA=A8=ED=96=88=EB=8D=98=20=EC=9C=A0=EC=A0=80?=
 =?UTF-8?q?=EB=8A=94=20=EA=B8=B0=EB=8C=80=ED=8F=89=20=EC=9E=85=EB=A0=A5?=
 =?UTF-8?q?=EC=B0=BD=20=EB=9C=A8=EC=A7=80=20=EC=95=8A=EA=B2=8C=20=ED=95=98?=
 =?UTF-8?q?=EA=B8=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/apis/lottery/apiGetLotteryStatus.ts   | 13 +++
 .../LotteryApplyFinish/LotteryApplyFinish.tsx | 89 ++++++++++---------
 .../service/src/pages/PartsPick/PartsPick.tsx | 14 ++-
 3 files changed, 72 insertions(+), 44 deletions(-)
 create mode 100644 packages/service/src/apis/lottery/apiGetLotteryStatus.ts

diff --git a/packages/service/src/apis/lottery/apiGetLotteryStatus.ts b/packages/service/src/apis/lottery/apiGetLotteryStatus.ts
new file mode 100644
index 00000000..5d444996
--- /dev/null
+++ b/packages/service/src/apis/lottery/apiGetLotteryStatus.ts
@@ -0,0 +1,13 @@
+import { customFetch } from "@watermelon-clap/core/src/utils";
+
+interface IApiGetLotteryStatus {
+  rank: number;
+  miniature: boolean;
+  applied: boolean;
+}
+
+export const apiGetLotteryStatus = (): Promise<IApiGetLotteryStatus> => {
+  return customFetch(
+    `${import.meta.env.VITE_BACK_BASE_URL}/event/lotteries/rank`,
+  ).then((res) => res.json());
+};
diff --git a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
index b8843beb..bf08a84d 100644
--- a/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
+++ b/packages/service/src/pages/LotteryApplyFinish/LotteryApplyFinish.tsx
@@ -1,4 +1,4 @@
-import { useNavigate } from "react-router-dom";
+import { useLocation, useNavigate } from "react-router-dom";
 import * as style from "./LotteryApplyFinish.css";
 import { Button, ButtonVariant } from "@service/common/components/Button";
 import { ClipBoardButton } from "@service/common/components/ClipBoardButton";
@@ -22,6 +22,9 @@ export const LotteryApplyFinish = () => {
   const [isPostExpectation, setIsPostExpectation] = useState(false);
 
   const { openModal } = useModal();
+  const {
+    state: { isApplied },
+  } = useLocation();
 
   useEffect(() => {
     apiGetMyShareLink().then(({ link }) => {
@@ -121,51 +124,53 @@ export const LotteryApplyFinish = () => {
 
         <Space size={40} />
 
-        <div
-          css={[
-            theme.flex.column,
-            css`
-              align-items: start;
-              gap: 24px;
-            `,
-          ]}
-        >
-          <span css={style.sectionTitle}>
-            새롭게 출시된 아반떼 N에 대한 기대평을 남겨주세요 🥳
-          </span>
-          <span css={theme.font.preM18}>
-            남겨주신 기대평은 홈화면에 노출될 수 있습니다! 최대 50자까지 작성할
-            수 있어요.
-          </span>
-
-          <form
-            onSubmit={handleSubmit}
+        {isApplied || (
+          <div
             css={[
-              theme.flex.center,
-              theme.gap.gap16,
-              mobile(css`
-                flex-direction: column;
-                width: 100%;
-              `),
+              theme.flex.column,
+              css`
+                align-items: start;
+                gap: 24px;
+              `,
             ]}
           >
-            <textarea
-              placeholder="여기에 기대평을 작성해주세요"
-              css={style.expectationInput}
-              value={expectation}
-              onChange={handleChange}
-              disabled={isPostExpectation && true}
-            />
-            <Button
-              type="submit"
-              variant={ButtonVariant.LONG}
-              css={style.applyBtn(isExpectationNull)}
-              disabled={isExpectationNull}
+            <span css={style.sectionTitle}>
+              새롭게 출시된 아반떼 N에 대한 기대평을 남겨주세요 🥳
+            </span>
+            <span css={theme.font.preM18}>
+              남겨주신 기대평은 홈화면에 노출될 수 있습니다! 최대 50자까지
+              작성할 수 있어요.
+            </span>
+
+            <form
+              onSubmit={handleSubmit}
+              css={[
+                theme.flex.center,
+                theme.gap.gap16,
+                mobile(css`
+                  flex-direction: column;
+                  width: 100%;
+                `),
+              ]}
             >
-              제출하기
-            </Button>
-          </form>
-        </div>
+              <textarea
+                placeholder="여기에 기대평을 작성해주세요"
+                css={style.expectationInput}
+                value={expectation}
+                onChange={handleChange}
+                disabled={isPostExpectation && true}
+              />
+              <Button
+                type="submit"
+                variant={ButtonVariant.LONG}
+                css={style.applyBtn(isExpectationNull)}
+                disabled={isExpectationNull}
+              >
+                제출하기
+              </Button>
+            </form>
+          </div>
+        )}
       </section>
 
       <Space size={100} />
diff --git a/packages/service/src/pages/PartsPick/PartsPick.tsx b/packages/service/src/pages/PartsPick/PartsPick.tsx
index dc8572d6..4cbb4974 100644
--- a/packages/service/src/pages/PartsPick/PartsPick.tsx
+++ b/packages/service/src/pages/PartsPick/PartsPick.tsx
@@ -10,8 +10,10 @@ import { useEffect, useRef, useState } from "react";
 import { useModal } from "@watermelon-clap/core/src/hooks";
 import { useAuth } from "@watermelon-clap/core/src/hooks";
 import { useMobile } from "@service/common/hooks/useMobile";
-import { useLocation } from "react-router-dom";
+import { useLocation, useNavigate } from "react-router-dom";
 import { apiGetPartsRemain } from "@service/apis/partsEvent";
+import { LOTTER_APPLY_FINISH_PAGE_ROUTE } from "@service/constants/routes";
+import { apiGetLotteryStatus } from "@service/apis/lottery/apiGetLotteryStatus";
 
 export const PartsPick = () => {
   const { openModal } = useModal();
@@ -22,6 +24,8 @@ export const PartsPick = () => {
     useLocation()?.state?.remainChance,
   );
   const { getIsLogin, login } = useAuth();
+  const navigate = useNavigate();
+  const isApplied = useRef(false);
 
   const minusRemainChance = () => {
     if (remainChance < 1) return;
@@ -64,6 +68,8 @@ export const PartsPick = () => {
     if (!getIsLogin()) {
       login().then(handleSetRemianChance);
     }
+
+    apiGetLotteryStatus().then(({ applied }) => (isApplied.current = applied));
   }, []);
 
   return (
@@ -82,7 +88,11 @@ export const PartsPick = () => {
             <Button
               variant={ButtonVariant.LONG}
               css={partsPickButtonStyle}
-              onClick={() => {}}
+              onClick={() => {
+                navigate(LOTTER_APPLY_FINISH_PAGE_ROUTE, {
+                  state: { isApplied: isApplied.current },
+                });
+              }}
             >
               URL 공유하고 아반떼 N 받으러 가기
             </Button>

From 47da9cc05402a84046d118f7e7e7efb307bd743d Mon Sep 17 00:00:00 2001
From: thgee <thgeee@naver.com>
Date: Thu, 15 Aug 2024 16:28:48 +0900
Subject: [PATCH 13/14] =?UTF-8?q?fix:=20=EA=B8=B0=EB=8C=80=ED=8F=89=20?=
 =?UTF-8?q?=EC=83=9D=EC=84=B1=20API=20=EC=98=A4=EB=A5=98=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/service/src/apis/expectation/apiPostExpectation.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/service/src/apis/expectation/apiPostExpectation.ts b/packages/service/src/apis/expectation/apiPostExpectation.ts
index 6737e18d..8ec18d77 100644
--- a/packages/service/src/apis/expectation/apiPostExpectation.ts
+++ b/packages/service/src/apis/expectation/apiPostExpectation.ts
@@ -11,6 +11,7 @@ export const apiPostExpectation = (expectation: string) =>
         expectation: expectation,
       }),
       headers: {
+        "Content-Type": "application/json",
         Authorization: `Bearer ${getAccessToken()}`,
       },
     },

From 984abf96737fddcfb269c4e1326fa9aca8aa9501 Mon Sep 17 00:00:00 2001
From: thgee <thgeee@naver.com>
Date: Thu, 15 Aug 2024 16:37:27 +0900
Subject: [PATCH 14/14] =?UTF-8?q?build:=20=EB=B9=8C=EB=93=9C=20=EC=98=A4?=
 =?UTF-8?q?=EB=A5=98=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../service/src/Demo/pages/ButtonDemoPage.tsx     |  3 ---
 .../src/apis/lottery/apiGetLotteryStatus.ts       | 15 +++++++++------
 .../ClipBoardButton/ClipBoardButton.tsx           |  4 ++--
 3 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/packages/service/src/Demo/pages/ButtonDemoPage.tsx b/packages/service/src/Demo/pages/ButtonDemoPage.tsx
index 4071930c..f15ea452 100644
--- a/packages/service/src/Demo/pages/ButtonDemoPage.tsx
+++ b/packages/service/src/Demo/pages/ButtonDemoPage.tsx
@@ -1,7 +1,6 @@
 import { Button, ButtonVariant } from "@service/common/components/Button";
 import { theme } from "@watermelon-clap/core/src/theme";
 import { css } from "@emotion/react";
-import { ClipBoardButton } from "@service/common/components/ClipBoardButton";
 import { CheckBox } from "@service/common/components/CheckBox";
 import { useState } from "react";
 import { ReactComponent as ClipBoardIcon } from "public/icons/clipboard.svg";
@@ -67,8 +66,6 @@ const ButtonDemoPage = () => {
           button
         </Button>
 
-        <ClipBoardButton />
-
         <CheckBox
           isChecked={isChecked1}
           setIsChecked={setIsChecked1}
diff --git a/packages/service/src/apis/lottery/apiGetLotteryStatus.ts b/packages/service/src/apis/lottery/apiGetLotteryStatus.ts
index 5d444996..f1ec9eca 100644
--- a/packages/service/src/apis/lottery/apiGetLotteryStatus.ts
+++ b/packages/service/src/apis/lottery/apiGetLotteryStatus.ts
@@ -1,4 +1,4 @@
-import { customFetch } from "@watermelon-clap/core/src/utils";
+import { customFetch, getAccessToken } from "@watermelon-clap/core/src/utils";
 
 interface IApiGetLotteryStatus {
   rank: number;
@@ -6,8 +6,11 @@ interface IApiGetLotteryStatus {
   applied: boolean;
 }
 
-export const apiGetLotteryStatus = (): Promise<IApiGetLotteryStatus> => {
-  return customFetch(
-    `${import.meta.env.VITE_BACK_BASE_URL}/event/lotteries/rank`,
-  ).then((res) => res.json());
-};
+export const apiGetLotteryStatus = (): Promise<IApiGetLotteryStatus> =>
+  customFetch(`${import.meta.env.VITE_BACK_BASE_URL}/event/lotteries/rank`, {
+    headers: {
+      Authorization: `Bearer ${getAccessToken()}`,
+    },
+  }).then((res) => {
+    return res.json();
+  });
diff --git a/packages/service/src/common/components/ClipBoardButton/ClipBoardButton.tsx b/packages/service/src/common/components/ClipBoardButton/ClipBoardButton.tsx
index 10a9995b..5a0b35b0 100644
--- a/packages/service/src/common/components/ClipBoardButton/ClipBoardButton.tsx
+++ b/packages/service/src/common/components/ClipBoardButton/ClipBoardButton.tsx
@@ -9,7 +9,7 @@ import {
 import { ReactComponent as ClipBoardIcon } from "public/icons/clipboard.svg";
 
 interface IClipBoardButton {
-  copyRef: React.MutableRefObject<null>;
+  copyRef: any;
 }
 const ClipBoardButton = ({ copyRef }: IClipBoardButton) => {
   const [isCliped, setIsCliped] = useState<boolean>(false);
@@ -18,7 +18,7 @@ const ClipBoardButton = ({ copyRef }: IClipBoardButton) => {
 
   const handleCopy = () => {
     const textToCopy = copyRef?.current?.textContent;
-    navigator.clipboard.writeText(textToCopy);
+    navigator.clipboard.writeText(textToCopy as string);
   };
 
   return (