From 1a85101db3fc8315c069430d0bf569a228ab51e3 Mon Sep 17 00:00:00 2001
From: yeonddori <lsymiso@naver.com>
Date: Sun, 21 Jul 2024 23:43:37 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=ED=9B=85=EC=9D=84=20=EC=9D=B4=EC=9A=A9?=
 =?UTF-8?q?=ED=95=98=EC=97=AC=20=ED=94=84=EB=A1=9C=ED=95=84=20=EA=B0=80?=
 =?UTF-8?q?=EC=A0=B8=EC=98=A4=EB=8F=84=EB=A1=9D=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

#114
---
 src/app/newsletter/page.tsx | 26 +++++++-------------------
 1 file changed, 7 insertions(+), 19 deletions(-)

diff --git a/src/app/newsletter/page.tsx b/src/app/newsletter/page.tsx
index cd35b74..5cf44bb 100644
--- a/src/app/newsletter/page.tsx
+++ b/src/app/newsletter/page.tsx
@@ -10,20 +10,20 @@ import NewsCardHorizontal from '@/components/NewsCardHorizontal';
 import Suggestions from '@/components/Suggestion';
 import { articleCategory } from '@/constants/category';
 import color from '@/constants/color';
-import useGetUser from '@/hooks/useGetUser';
+import { useGetUserProfile } from '@/hooks/useGetUser';
+import useUpdateUserProfile from '@/hooks/useUpdateUser';
 import suggestionData from '@/mocks/suggestion';
 import { Article } from '@/types';
 
 import { getArticleAll, getPopularArticle } from '../api/newsletter';
-import { getUser } from '../api/user';
 
 const Page = () => {
   const [selectedTab, setSelectedTab] = useState(articleCategory[0]);
   const [articles, setArticles] = useState<Article[]>([]);
   const [popularArticles, setPopularArticles] = useState<Article[]>([]);
 
-  const user = useGetUser();
-  const [userName, setUserName] = useState<string | null>(null);
+  const userProfile = useGetUserProfile();
+  useUpdateUserProfile();
 
   useEffect(() => {
     getArticleAll().then((res) => {
@@ -42,18 +42,6 @@ const Page = () => {
     });
   }, []);
 
-  useEffect(() => {
-    if (user.isLogin) {
-      getUser(user.token).then((res) => {
-        if (res.status) {
-          setUserName(res.data.name);
-        } else {
-          throw res.message;
-        }
-      });
-    }
-  }, [user]);
-
   return (
     <Box>
       <GradientBox sx={{ height: '150px' }} />
@@ -93,10 +81,10 @@ const Page = () => {
         <Stack direction="row" width="25%">
           <Divider flexItem orientation="vertical" sx={{ bgcolor: color.divider, opacity: 0.2 }} />
           <Stack mt={6} pl={6} spacing={6} width="100%">
-            {userName && (
+            {userProfile && (
               <>
-                <Suggestions content={suggestionData} title={`${userName}님을 위한 추천 기사`} />
-                <Suggestions content={suggestionData} title={`${userName}님과 비슷한 유형이 관심있어요!`} />
+                <Suggestions content={suggestionData} title={`${userProfile.name}님을 위한 추천 기사`} />
+                <Suggestions content={suggestionData} title={`${userProfile.name}님과 비슷한 유형이 관심있어요!`} />
               </>
             )}
             <Suggestions content={popularArticles} title="지금 인기있는 기사" />