From 96654d6d3a10ddb79ebac1ae5b52aad11caf5eb1 Mon Sep 17 00:00:00 2001
From: pbc1017 <knsol2@naver.com>
Date: Wed, 21 Feb 2024 04:52:52 +0900
Subject: [PATCH 1/2] Refactor: show event section by isEligible value

---
 packages/web/src/atoms/event2024SpringInfo.ts |   1 +
 .../EventSection/EventSection2024Spring.tsx   | 178 +++++++++---------
 2 files changed, 94 insertions(+), 85 deletions(-)

diff --git a/packages/web/src/atoms/event2024SpringInfo.ts b/packages/web/src/atoms/event2024SpringInfo.ts
index 7c50895ce..5c263fdbc 100644
--- a/packages/web/src/atoms/event2024SpringInfo.ts
+++ b/packages/web/src/atoms/event2024SpringInfo.ts
@@ -4,6 +4,7 @@ import { atom } from "recoil";
 
 export type Event2024SpringInfoType = Nullable<{
   isAgreeOnTermsOfEvent: boolean;
+  isEligible: boolean;
   completedQuests: QuestId[];
   creditAmount: number;
   groupCreditAmount: number;
diff --git a/packages/web/src/pages/Home/EventSection/EventSection2024Spring.tsx b/packages/web/src/pages/Home/EventSection/EventSection2024Spring.tsx
index d4840a4c0..ab4182829 100644
--- a/packages/web/src/pages/Home/EventSection/EventSection2024Spring.tsx
+++ b/packages/web/src/pages/Home/EventSection/EventSection2024Spring.tsx
@@ -1,5 +1,7 @@
 import { Link } from "react-router-dom";
 
+import { useValueRecoilState } from "@/hooks/useFetchRecoilState";
+
 import AdaptiveDiv from "@/components/AdaptiveDiv";
 import CreditAmountContainer from "@/components/Event/CreditAmoutContainer";
 import EventButton from "@/components/Event/EventButton";
@@ -18,58 +20,62 @@ const EventSection2024Spring = () => {
     background: eventTheme.black,
   };
 
+  const { isEligible } = useValueRecoilState("event2024SpringInfo") || {};
+
   return (
-    <div css={styleContainer}>
-      <AdaptiveDiv type="center">
-        <div
-          css={{
-            display: "flex",
-            alignItems: "center",
-            padding: "30px 0 25px",
-            gap: "8px",
-          }}
-        >
-          <svg width={0} height={0}>
-            <linearGradient id="linearColors" x1={1} y1={0} x2={1} y2={1}>
-              <stop offset={0} stopColor={eventTheme.blue_icon_top} />
-              <stop offset={1} stopColor={eventTheme.blue_icon_bottom} />
-            </linearGradient>
-          </svg>
-          <EmojiEventsRounded
-            sx={{ fill: "url(#linearColors)" }}
-            css={{
-              width: "24px",
-              height: "24px",
-            }}
-          />
-          <div
-            css={{
-              ...eventTheme.font20,
-              background: eventTheme.blue_title,
-              backgroundClip: "text",
-              textFillColor: "transparent",
-            }}
-          >
-            새터반 택시대제전
-          </div>
-          <div
-            css={{
-              ...eventTheme.font16,
-              color: eventTheme.white,
-            }}
-          >
-            D-001
-          </div>
-        </div>
-        <div
-          css={{
-            display: "flex",
-            flexDirection: "column",
-            gap: "15px",
-            paddingBottom: "15px",
-          }}
-        >
-          {/* <div
+    <>
+      {isEligible ? (
+        <div css={styleContainer}>
+          <AdaptiveDiv type="center">
+            <div
+              css={{
+                display: "flex",
+                alignItems: "center",
+                padding: "30px 0 25px",
+                gap: "8px",
+              }}
+            >
+              <svg width={0} height={0}>
+                <linearGradient id="linearColors" x1={1} y1={0} x2={1} y2={1}>
+                  <stop offset={0} stopColor={eventTheme.blue_icon_top} />
+                  <stop offset={1} stopColor={eventTheme.blue_icon_bottom} />
+                </linearGradient>
+              </svg>
+              <EmojiEventsRounded
+                sx={{ fill: "url(#linearColors)" }}
+                css={{
+                  width: "24px",
+                  height: "24px",
+                }}
+              />
+              <div
+                css={{
+                  ...eventTheme.font20,
+                  background: eventTheme.blue_title,
+                  backgroundClip: "text",
+                  textFillColor: "transparent",
+                }}
+              >
+                새터반 택시대제전
+              </div>
+              <div
+                css={{
+                  ...eventTheme.font16,
+                  color: eventTheme.white,
+                }}
+              >
+                D-001
+              </div>
+            </div>
+            <div
+              css={{
+                display: "flex",
+                flexDirection: "column",
+                gap: "15px",
+                paddingBottom: "15px",
+              }}
+            >
+              {/* <div
             css={{
               ...eventTheme.font16,
               display: "flex",
@@ -82,41 +88,43 @@ const EventSection2024Spring = () => {
             }}
           >
             새터 00반 넙죽코인 */}
-          <CreditAmountContainer />
-          {/* </div> */}
-          <div css={{ display: "flex", gap: "15px" }}>
-            <Link
-              to="/event/2024spring"
-              css={{ width: 0, flexGrow: 1, textDecoration: "none" }}
-            >
-              <EventButton
-                title="이벤트 안내"
-                css={{ background: eventTheme.blue_button }}
-              />
-            </Link>
-            <Link
-              to="/event/2024spring-missions"
-              css={{ width: 0, flexGrow: 1, textDecoration: "none" }}
-            >
-              <EventButton
-                title="퀘스트"
-                css={{ background: eventTheme.purple_button }}
-              />
-            </Link>
-            <Link
-              to="/event/2024spring-leaderboard"
-              css={{ width: 0, flexGrow: 1, textDecoration: "none" }}
-            >
-              <EventButton
-                title="새터반 순위"
-                css={{ background: eventTheme.orange_button }}
-              />
-            </Link>
-          </div>
+              <CreditAmountContainer />
+              {/* </div> */}
+              <div css={{ display: "flex", gap: "15px" }}>
+                <Link
+                  to="/event/2024spring"
+                  css={{ width: 0, flexGrow: 1, textDecoration: "none" }}
+                >
+                  <EventButton
+                    title="이벤트 안내"
+                    css={{ background: eventTheme.blue_button }}
+                  />
+                </Link>
+                <Link
+                  to="/event/2024spring-missions"
+                  css={{ width: 0, flexGrow: 1, textDecoration: "none" }}
+                >
+                  <EventButton
+                    title="퀘스트"
+                    css={{ background: eventTheme.purple_button }}
+                  />
+                </Link>
+                <Link
+                  to="/event/2024spring-leaderboard"
+                  css={{ width: 0, flexGrow: 1, textDecoration: "none" }}
+                >
+                  <EventButton
+                    title="새터반 순위"
+                    css={{ background: eventTheme.orange_button }}
+                  />
+                </Link>
+              </div>
+            </div>
+          </AdaptiveDiv>
+          <WhiteContainerSuggestJoinEvent />
         </div>
-      </AdaptiveDiv>
-      <WhiteContainerSuggestJoinEvent />
-    </div>
+      ) : null}
+    </>
   );
 };
 

From f4e3ccbf722c649fc74b7084433de011847725cf Mon Sep 17 00:00:00 2001
From: static <kmc7468@naver.com>
Date: Fri, 23 Feb 2024 01:53:57 +0900
Subject: [PATCH 2/2] Remove: unnecessary comments in
 EventSection2024Spring.tsx

---
 .../Home/EventSection/EventSection2024Spring.tsx   | 14 --------------
 1 file changed, 14 deletions(-)

diff --git a/packages/web/src/pages/Home/EventSection/EventSection2024Spring.tsx b/packages/web/src/pages/Home/EventSection/EventSection2024Spring.tsx
index ab4182829..acf3dd7d9 100644
--- a/packages/web/src/pages/Home/EventSection/EventSection2024Spring.tsx
+++ b/packages/web/src/pages/Home/EventSection/EventSection2024Spring.tsx
@@ -75,21 +75,7 @@ const EventSection2024Spring = () => {
                 paddingBottom: "15px",
               }}
             >
-              {/* <div
-            css={{
-              ...eventTheme.font16,
-              display: "flex",
-              padding: "14px 16px",
-              justifyContent: "space-between",
-              alignItems: "center",
-              borderRadius: "12px",
-              border: "1px solid #FFF",
-              color: eventTheme.white,
-            }}
-          >
-            새터 00반 넙죽코인 */}
               <CreditAmountContainer />
-              {/* </div> */}
               <div css={{ display: "flex", gap: "15px" }}>
                 <Link
                   to="/event/2024spring"