보조지표 기준값 변경시 전략편집기 연동

frontend/src/components/SettingsPage.tsx

@@ -9,7 +9,9 @@ import {
   type LiveStrategySettingsDto,
 } from '../utils/backendApi';
 import { BacktestSettingsPanel } from './BacktestSettingsPanel';
-import IndicatorMainDefaultsPanel from './IndicatorMainDefaultsPanel';
+import IndicatorMainDefaultsPanel, {
+  type IndicatorSaveUiState,
+} from './IndicatorMainDefaultsPanel';
 import type { IndicatorConfig } from '../types';
 import type { PlotDef, HLineDef } from '../utils/indicatorRegistry';
 import type { IchimokuCloudColors } from '../utils/ichimokuConfig';
@@ -90,6 +92,10 @@ interface SettingsPageProps {
     hlines?: HLineDef[],
     cloudColors?: IchimokuCloudColors,
   ) => void;
+  /** 설정 화면 — 보조지표 기본값 일괄 DB 저장 */
+  saveAllIndicatorDefaults?: (configs: Record<string, IndicatorConfig>) => Promise<void>;
+  /** 보조지표 DB 캐시 갱신 revision */
+  indicatorSettingsRevision?: number;
   /** 설정 화면에서 차트 on/off 연동 */
   chartIndicators?:     IndicatorConfig[];
   onAddIndicatorToChart?:    (type: string, config?: IndicatorConfig) => void;
@@ -1395,6 +1401,8 @@ const SettingsPage: React.FC<SettingsPageProps> = ({
   saveIndicatorParams,
   getIndicatorVisual,
   saveIndicatorVisual,
+  saveAllIndicatorDefaults,
+  indicatorSettingsRevision = 0,
   chartIndicators = [],
   onAddIndicatorToChart,
   onRemoveIndicatorFromChart,
@@ -1455,6 +1463,7 @@ const SettingsPage: React.FC<SettingsPageProps> = ({
 }) => {
   const categories = filterCategories(menuPermissions);
   const [active, setActive] = useState<CategoryId>('general');
+  const [indicatorSaveUi, setIndicatorSaveUi] = useState<IndicatorSaveUiState | null>(null);
 
   useEffect(() => {
     if (categories.length === 0) return;
@@ -1463,6 +1472,10 @@ const SettingsPage: React.FC<SettingsPageProps> = ({
     }
   }, [categories, active]);
 
+  useEffect(() => {
+    if (active !== 'indicators') setIndicatorSaveUi(null);
+  }, [active]);
+
   const activeCat = categories.find(c => c.id === active) ?? categories[0];
 
   if (!activeCat) {
@@ -1494,6 +1507,7 @@ const SettingsPage: React.FC<SettingsPageProps> = ({
       case 'indicators':
         if (
           !getIndicatorParams || !saveIndicatorParams || !getIndicatorVisual || !saveIndicatorVisual
+          || !saveAllIndicatorDefaults
           || !onAddIndicatorToChart || !onRemoveIndicatorFromChart
         ) {
           return (
@@ -1509,6 +1523,9 @@ const SettingsPage: React.FC<SettingsPageProps> = ({
             saveParams={saveIndicatorParams}
             getVisualConfig={getIndicatorVisual}
             saveVisual={saveIndicatorVisual}
+            saveAllDefaults={saveAllIndicatorDefaults}
+            onSaveUiState={setIndicatorSaveUi}
+            settingsRevision={indicatorSettingsRevision}
           />
         );
       case 'backtest': return (
@@ -1631,10 +1648,31 @@ const SettingsPage: React.FC<SettingsPageProps> = ({
         {/* 헤더 */}
         <div className="stg-content-header">
           <div className="stg-content-icon">{activeCat.icon}</div>
-          <div>
+          <div className="stg-content-header-text">
             <h2 className="stg-content-title">{activeCat.label}</h2>
             <p className="stg-content-desc">{activeCat.desc}</p>
           </div>
+          {active === 'indicators' && indicatorSaveUi && (
+            <div className="stg-content-header-actions">
+              {indicatorSaveUi.saveMessage && (
+                <span
+                  className={`stg-ind-save-msg stg-ind-save-msg--inline${
+                    indicatorSaveUi.saveMessage.includes('실패') ? ' stg-ind-save-msg--err' : ''
+                  }`}
+                >
+                  {indicatorSaveUi.saveMessage}
+                </span>
+              )}
+              <button
+                type="button"
+                className="stg-btn-save"
+                disabled={!indicatorSaveUi.dirty || indicatorSaveUi.saving}
+                onClick={() => void indicatorSaveUi.save()}
+              >
+                {indicatorSaveUi.saving ? '저장 중…' : '저장'}
+              </button>
+            </div>
+          )}
         </div>
 
         {/* 설정 패널 */}
@@ -1649,11 +1687,6 @@ const SettingsPage: React.FC<SettingsPageProps> = ({
             <button className="stg-btn-save">저장</button>
           </div>
         )}
-        {active === 'indicators' && (
-          <div className="stg-footer stg-footer--hint">
-            <span className="stg-footer-hint">보조지표 기본값은 항목을 수정할 때마다 자동으로 저장됩니다.</span>
-          </div>
-        )}
       </main>
     </div>
   );