From 11d98e23e32bfbede5c9fb0d5e4ab0c2e8c7f367 Mon Sep 17 00:00:00 2001
From: YEONGJAE LEE <71895560+lee0jae330@users.noreply.github.com>
Date: Fri, 6 Dec 2024 10:41:37 +0900
Subject: [PATCH] =?UTF-8?q?[hotfix]=20=EB=A9=94=ED=83=80=20=ED=83=9C?=
 =?UTF-8?q?=EA=B7=B8=20=EC=9D=B8=EC=8B=9D=EB=90=98=EC=A7=80=20=EC=95=8A?=
 =?UTF-8?q?=EB=8A=94=20=EB=AC=B8=EC=A0=9C=20=ED=95=B4=EA=B2=B0=20(#245)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* 🚨 !HOTFIX!: 툴박스 카테고리가 선택안되는 문제 해결

* 🚨 !HOTFIX!: meta 태그를 인식하지 못하는 문제 해결
---
 apps/client/src/app/App.tsx                   | 43 +++++++++++++++----
 apps/client/src/pages/HomePage/HomePage.tsx   |  8 ----
 apps/client/src/pages/NotFound/NotFound.tsx   |  8 ----
 .../src/pages/Workspacepage/WorkspacePage.tsx |  8 ----
 4 files changed, 34 insertions(+), 33 deletions(-)

diff --git a/apps/client/src/app/App.tsx b/apps/client/src/app/App.tsx
index 82f9738f..6be0a6f9 100644
--- a/apps/client/src/app/App.tsx
+++ b/apps/client/src/app/App.tsx
@@ -3,6 +3,7 @@ import { ToasterWithMax } from '@/shared/ui';
 import { ErrorPage } from '@/pages/ErrorPage/ErrorPage';
 import { lazy, Suspense } from 'react';
 import { Loading } from '@/shared/ui';
+import { Helmet } from 'react-helmet-async';
 
 // lazy 로딩
 const HomePage = lazy(() =>
@@ -23,27 +24,51 @@ const router = createBrowserRouter([
   {
     path: '/',
     element: (
-      <Suspense fallback={<Loading />}>
-        <HomePage />
-      </Suspense>
+      <>
+        <Helmet>
+          <title>BooLock - 홈</title>
+          <meta
+            name="description"
+            content="코딩 입문자들이 HTML과 CSS를 블록으로 배우는 BooLock의 메인 페이지입니다."
+          />
+        </Helmet>
+        <Suspense fallback={<Loading />}>
+          <HomePage />
+        </Suspense>
+      </>
     ),
     errorElement: <ErrorPage />,
   },
   {
     path: '/workspace/:workspaceId',
     element: (
-      <Suspense fallback={<Loading />}>
-        <WorkspacePage />
-      </Suspense>
+      <>
+        <Helmet>
+          <title>BooLock - 작업 공간</title>
+          <meta name="description" content={`워크스페이스에서 HTML과 CSS를 연습해보세요.`} />
+        </Helmet>
+        <Suspense fallback={<Loading />}>
+          <WorkspacePage />
+        </Suspense>
+      </>
     ),
     errorElement: <ErrorPage />,
   },
   {
     path: '*',
     element: (
-      <Suspense fallback={<Loading />}>
-        <NotFound />
-      </Suspense>
+      <>
+        <Helmet>
+          <title>BooLock - 페이지를 찾을 수 없음</title>
+          <meta
+            name="description"
+            content="요청한 페이지를 찾을 수 없습니다. 다른 페이지를 확인해 주세요."
+          />
+        </Helmet>
+        <Suspense fallback={<Loading />}>
+          <NotFound />
+        </Suspense>
+      </>
     ),
   },
 ]);
diff --git a/apps/client/src/pages/HomePage/HomePage.tsx b/apps/client/src/pages/HomePage/HomePage.tsx
index bd30a879..abe0c37e 100644
--- a/apps/client/src/pages/HomePage/HomePage.tsx
+++ b/apps/client/src/pages/HomePage/HomePage.tsx
@@ -1,7 +1,6 @@
 import { Banner, HomeHeader, WorkspaceContainer, WorkspaceModal } from '@/widgets';
 import { useClassBlockStore, useLoadingStore, useWorkspaceStore } from '@/shared/store';
 
-import { Helmet } from 'react-helmet-async';
 import { Loading } from '@/shared/ui';
 import { useEffect } from 'react';
 
@@ -23,13 +22,6 @@ export const HomePage = () => {
 
   return (
     <>
-      <Helmet>
-        <title>BooLock - 홈</title>
-        <meta
-          name="description"
-          content="코딩 입문자들이 HTML과 CSS를 블록으로 배우는 BooLock의 메인 페이지입니다."
-        />
-      </Helmet>
       {isPending && <Loading />}
       <div className="flex h-full w-full flex-col items-center">
         <HomeHeader />
diff --git a/apps/client/src/pages/NotFound/NotFound.tsx b/apps/client/src/pages/NotFound/NotFound.tsx
index 0336149e..32fc50a5 100644
--- a/apps/client/src/pages/NotFound/NotFound.tsx
+++ b/apps/client/src/pages/NotFound/NotFound.tsx
@@ -1,4 +1,3 @@
-import { Helmet } from 'react-helmet-async';
 import { ErrorContent } from '@/shared/ui/error/ErrorContent';
 
 // TODO: 메세지 상수화 shared/utils/constants.ts 안에 관리
@@ -10,13 +9,6 @@ import { ErrorContent } from '@/shared/ui/error/ErrorContent';
 export const NotFound = () => {
   return (
     <>
-      <Helmet>
-        <title>BooLock - 페이지를 찾을 수 없음</title>
-        <meta
-          name="description"
-          content="요청한 페이지를 찾을 수 없습니다. 다른 페이지를 확인해 주세요."
-        />
-      </Helmet>
       <ErrorContent description={`유효한 페이지가 아닙니다! \n다른 페이지에서 만나요!`} />
     </>
   );
diff --git a/apps/client/src/pages/Workspacepage/WorkspacePage.tsx b/apps/client/src/pages/Workspacepage/WorkspacePage.tsx
index a58093b5..32f7bb12 100644
--- a/apps/client/src/pages/Workspacepage/WorkspacePage.tsx
+++ b/apps/client/src/pages/Workspacepage/WorkspacePage.tsx
@@ -1,6 +1,5 @@
 import { ImageTagModal, CoachMark, WorkspaceContent, WorkspacePageHeader } from '@/widgets';
 import { useGetWorkspace, usePreventLeaveWorkspacePage } from '@/shared/hooks';
-import { Helmet } from 'react-helmet-async';
 import { Loading } from '@/shared/ui';
 import { NotFound } from '@/pages/NotFound/NotFound';
 import { useParams } from 'react-router-dom';
@@ -43,13 +42,6 @@ export const WorkspacePage = () => {
 
   return (
     <>
-      <Helmet>
-        <title>BooLock - 작업 공간</title>
-        <meta
-          name="description"
-          content={`작업 공간 ID: ${workspaceId}에서 HTML과 CSS를 연습해보세요.`}
-        />
-      </Helmet>
       <div className="flex h-screen flex-col">
         {isPending && <Loading />}
         {isCoachMarkOpen && <CoachMark />}