FLEX-373 개인정보수정 및 프로필 이미지 구현

package.json

@@ -17,7 +17,9 @@
   "dependencies": {
     "@datadog/browser-rum": "^5.30.1",
     "@tanstack/react-query": "^5.60.6",
+    "@toast-ui/chart": "^4.6.1",
     "@toast-ui/editor": "^3.2.2",
+    "@toast-ui/editor-plugin-chart": "^3.0.1",
     "@toast-ui/editor-plugin-color-syntax": "^3.1.0",
     "@toast-ui/react-editor": "^3.2.3",
     "apexcharts": "^4.1.0",

src/app/components/analyze/AnalyzeContainer.tsx

@@ -106,15 +106,15 @@ const AnalyzeContainer = () => {
             </div>
             <div className="pl-10 leading-9 tracking-wide">
               <p>
-                <span className="font-bold">위험도 :</span>{' '}
+                <span className="font-bold">1. 위험도 :</span>{' '}
                 {analysisData.investmentStyle.riskLevel}
               </p>
               <p>
-                <span className="font-bold">거래 패턴 :</span>{' '}
+                <span className="font-bold">2. 거래 패턴 :</span>{' '}
                 {analysisData.investmentStyle.tradingPattern}
               </p>
               <p>
-                <span className="font-bold">분석 :</span>{' '}
+                <span className="font-bold">3. 분석 :</span>{' '}
                 {analysisData.investmentStyle.analysis}
               </p>
             </div>
@@ -136,15 +136,15 @@ const AnalyzeContainer = () => {
             </div>
             <div className="pl-10 leading-9 tracking-wide">
               <p>
-                <span className="font-bold">추천 전략 :</span>{' '}
+                <span className="font-bold">1. 추천 전략 :</span>{' '}
                 {analysisData.investmentStrategy.recommendation}
               </p>
               <p>
-                <span className="font-bold">리스크 관리 :</span>{' '}
+                <span className="font-bold">2. 리스크 관리 :</span>{' '}
                 {analysisData.investmentStrategy.riskManagement}
               </p>
               <p>
-                <span className="font-bold">분석 :</span>{' '}
+                <span className="font-bold">3. 분석 :</span>{' '}
                 {analysisData.investmentStrategy.analysis}
               </p>
             </div>

src/app/components/blog/main/all/BlogPost.tsx

@@ -54,7 +54,7 @@ const BlogPost = ({ post }: BlogPostProps) => {
         <div className="flex justify-between items-center text-xs h-6">
           <div className="flex items-center text-sm gap-x-2 text-black-0">
             <Image
-              src="/images/complete1.png"
+              src={post.profileImageUrl || '/images/profile.png'}
               alt={post.title}
               width={20}
               height={20}

src/app/components/blog/post/markdown/MyEditor.tsx

@@ -2,8 +2,10 @@
 
 import { TOOLBAR_ITEMS } from '@/app/constants/blog';
 import colorSyntax from '@toast-ui/editor-plugin-color-syntax';
+import chart from '@toast-ui/editor-plugin-chart';
 import '@toast-ui/editor-plugin-color-syntax/dist/toastui-editor-plugin-color-syntax.css';
 import '@toast-ui/editor/dist/toastui-editor.css';
+import '@toast-ui/chart/dist/toastui-chart.min.css'; // Chart 스타일
 import { Editor } from '@toast-ui/react-editor';
 import { useRef } from 'react';
 import 'tui-color-picker/dist/tui-color-picker.css';

src/app/components/common/ProfileDropdown.tsx

@@ -33,10 +33,11 @@ const ProfileDropdown = () => {
             onMouseLeave={() => setIsHover(false)}
           >
             <Image
-              src="/images/complete1.png"
+              src={user.result.profileImageUrl || '/images/profile.png'}
               alt="profile"
               width={20}
               height={20}
+              className="rounded-full"
             />
             <Link className="text-sm font-medium" href="/">
               {user?.result.nickname}

src/app/components/main/right/MainMyInfo.tsx

@@ -45,10 +45,11 @@ const MainMyInfo = ({
         <div className="w-full flex-col-center gap-y-5">
           <div className="flex gap-x-5 px-2 w-full">
             <Image
-              src="/images/complete2.png"
+              src={user.result.profileImageUrl || '/images/profile.png'}
               width={54}
               height={54}
               alt="profile"
+              className="rounded-full"
             />
             <div className="flex w-full justify-between">
               <div className="flex flex-col gap-y-1">