llm 분석기능

frontend/src/components/SettingsPage.tsx

@@ -33,7 +33,9 @@ import {
 } from '../utils/tradeAlertPopupLayout';
 import TradeAlertPopupPreview from './TradeAlertPopupPreview';
 import TrendSearchSettingsPanel from './trendSearch/TrendSearchSettingsPanel';
+import LlmSettingsPanel from './settings/LlmSettingsPanel';
 import type { TrendSearchAppSettings } from '../utils/trendSearchAppSettings';
+import type { LlmAppSettings } from '../utils/llmSettings';
 import { isTradingSettingsCategory } from '../utils/tradingAccess';
 import {
   CHART_LEGEND_SETTING_ITEMS,
@@ -176,6 +178,8 @@ interface SettingsPageProps {
   onVerificationIssueNotify?: (v: boolean) => void;
   trendSearchSettings?: TrendSearchAppSettings;
   onTrendSearchSettingsChange?: (s: TrendSearchAppSettings) => void;
+  llmSettings?: LlmAppSettings;
+  onLlmSettingsChange?: (s: LlmAppSettings) => void;
   /** 설정 화면 진입 시 선택할 카테고리 (예: 모의투자 화면에서 링크) */
   initialCategory?: SettingsCategoryId;
   /** 정식 로그인 여부 (게스트는 매매·전략 설정 탭 차단) */
@@ -277,6 +281,13 @@ const IcTrendSearch = () => (
     <circle cx="18" cy="6" r="2" fill="currentColor" stroke="none"/>
   </svg>
 );
+const IcLlm = () => (
+  <svg width="22" height="22" viewBox="0 0 22 22" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round">
+    <path d="M11 3l1.2 3.6L16 8l-3.8 1.4L11 13l-1.2-3.6L6 8l3.8-1.4L11 3z"/>
+    <path d="M17 14l.8 2.2L20 17l-2.2.8L17 20l-.8-2.2L14 17l2.2-.8L17 14z"/>
+    <rect x="3" y="15" width="6" height="4" rx="1"/>
+  </svg>
+);
 const IcBacktest = () => (
   <svg width="22" height="22" viewBox="0 0 22 22" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round">
     <polyline points="2,17 6,11 9,14 13,7 16,10 20,4"/>
@@ -304,6 +315,7 @@ const ALL_CATEGORIES: Category[] = [
   { id: 'trading',  label: '매매설정',   icon: <IcTrading />,  desc: '모의투자·가상매매 통합 설정 — 자동매매, 미체결 주문 처리, 계좌·비용 등' },
   { id: 'live',     label: '실거래',     icon: <IcLive />,     desc: '매매 운영 모드, 업비트 API 키, 실거래 자동매매' },
   { id: 'trend-search', label: '추세검색', icon: <IcTrendSearch />, desc: '상승추세 배점, 합격 점수, 결과 수, 자동갱신·투자대상 자동추가' },
+  { id: 'llm',        label: 'LLM 설정', icon: <IcLlm />,        desc: 'AI 전략 검증용 LLM 서버 주소·포트·모델·타임아웃' },
   { id: 'alert',    label: '알림 설정',  icon: <IcAlert />,    desc: '가격 알림, 신호 알림, 알림 방식 설정' },
   { id: 'network',  label: '네트워크',   icon: <IcNetwork />,  desc: 'API 서버 주소, WebSocket, 연결 상태' },
   { id: 'admin',    label: '관리자 설정', icon: <IcAdmin />,    desc: '사용자·역할·메뉴 접근 권한 관리 (관리자 비밀번호 필요)' },
@@ -2008,6 +2020,8 @@ const SettingsPage: React.FC<SettingsPageProps> = ({
   onVerificationIssueNotify,
   trendSearchSettings,
   onTrendSearchSettingsChange,
+  llmSettings,
+  onLlmSettingsChange,
   initialCategory,
   isFormalLogin = true,
   onRequireFormalLogin,
@@ -2180,6 +2194,16 @@ const SettingsPage: React.FC<SettingsPageProps> = ({
           <p className="stg-ind-unavailable">추세검색 설정을 불러올 수 없습니다.</p>
         )
       );
+      case 'llm': return (
+        llmSettings && onLlmSettingsChange ? (
+          <LlmSettingsPanel
+            settings={llmSettings}
+            onChange={onLlmSettingsChange}
+          />
+        ) : (
+          <p className="stg-ind-unavailable">LLM 설정을 불러올 수 없습니다.</p>
+        )
+      );
       case 'strategy': return (
         <StrategyPanel
           liveMarket={liveMarket}