Macbook
289 lines
12 KiB
TypeScript
289 lines
12 KiB
TypeScript
/**
|
|
* useAppSettings
|
|
*
|
|
* 앱 전역 차트 기본 설정을 DB 와 동기화하는 훅.
|
|
*
|
|
* 관리 항목 (하드코딩 대체):
|
|
* - defaultSymbol : 기본 종목 (DEFAULT_STATE.symbol)
|
|
* - defaultTimeframe : 기본 타임프레임 (DEFAULT_STATE.timeframe)
|
|
* - defaultChartType : 기본 차트 타입
|
|
* - defaultTheme : 기본 테마
|
|
* - defaultLogScale : 기본 로그 스케일
|
|
* - defaultLayoutId : 기본 레이아웃 ID
|
|
* - mainChartStyle : 캔들 색상 (DEFAULT_MAIN_CHART_STYLE)
|
|
* - syncOptions : 멀티차트 동기화 옵션 (DEFAULT_SYNC)
|
|
*
|
|
* 사용 예:
|
|
* ```tsx
|
|
* const { settings, isLoaded, save } = useAppSettings();
|
|
*
|
|
* // 기본 심볼 사용
|
|
* const symbol = settings.defaultSymbol ?? 'KRW-BTC';
|
|
*
|
|
* // 테마 변경 시 DB 에 저장
|
|
* save({ defaultTheme: newTheme });
|
|
* ```
|
|
*/
|
|
|
|
import { useCallback, useEffect, useRef, useState } from 'react';
|
|
import {
|
|
loadAppSettings,
|
|
saveAppSettings,
|
|
type AppSettingsDto,
|
|
} from '../utils/backendApi';
|
|
import type { Theme, ChartType, Timeframe, MainChartStyle } from '../types';
|
|
import { resolveChartLegendOptions } from '../types/chartLegend';
|
|
import type { ChartLegendVisibility } from '../types/chartLegend';
|
|
import { DEFAULT_MAIN_CHART_STYLE } from '../utils/storage';
|
|
import { DEFAULT_SYNC, type SyncOptions } from '../utils/layoutTypes';
|
|
import {
|
|
DEFAULT_CHART_TIME_FORMAT,
|
|
normalizeChartTimeFormat,
|
|
setChartTimeFormat,
|
|
} from '../utils/chartTimeFormat';
|
|
import {
|
|
DEFAULT_TRADE_ALERT_TIME_FORMAT,
|
|
setTradeAlertTimeFormat,
|
|
} from '../utils/tradeAlertTimeFormat';
|
|
import { DEFAULT_DISPLAY_TIMEZONE, normalizeTimezone, setDisplayTimezone } from '../utils/timezone';
|
|
import {
|
|
clampVirtualTargetMax,
|
|
DEFAULT_VIRTUAL_TARGET_MAX,
|
|
} from '../utils/virtualTargetLimits';
|
|
import {
|
|
resolveTrendSearchAppSettings,
|
|
type TrendSearchAppSettings,
|
|
} from '../utils/trendSearchAppSettings';
|
|
import {
|
|
resolveChartPaneSeparatorOptions,
|
|
type ChartPaneSeparatorOptions,
|
|
} from '../types/chartPaneSeparator';
|
|
import { migrateLocalStorageToUiPreferences } from '../utils/uiPreferencesMigrate';
|
|
|
|
// 전역 캐시 — 여러 컴포넌트에서 공유하여 중복 요청 방지
|
|
let _cache: AppSettingsDto | null = null;
|
|
let _loadPromise: Promise<AppSettingsDto> | null = null;
|
|
/** invalidate 이후 완료된 로드만 캐시에 반영 */
|
|
let _loadGeneration = 0;
|
|
type AppSettingsListener = () => void;
|
|
const _listeners = new Set<AppSettingsListener>();
|
|
|
|
function notifyAppSettingsListeners() {
|
|
_listeners.forEach(fn => fn());
|
|
}
|
|
|
|
/** 훅 외부에서 최신 캐시 읽기 (추세검색 설정 병합 등) */
|
|
export function getAppSettingsCache(): AppSettingsDto {
|
|
return _cache ?? {};
|
|
}
|
|
|
|
export function subscribeAppSettings(listener: AppSettingsListener): () => void {
|
|
_listeners.add(listener);
|
|
return () => _listeners.delete(listener);
|
|
}
|
|
|
|
function ensureLoaded(): Promise<AppSettingsDto> {
|
|
if (_cache !== null) return Promise.resolve(_cache);
|
|
if (_loadPromise) return _loadPromise;
|
|
const generation = _loadGeneration;
|
|
_loadPromise = loadAppSettings().then(async data => {
|
|
if (generation !== _loadGeneration) {
|
|
_loadPromise = null;
|
|
return _cache ?? {};
|
|
}
|
|
_cache = data ?? {};
|
|
const migrated = migrateLocalStorageToUiPreferences(_cache);
|
|
if (migrated?.changed) {
|
|
try {
|
|
const saved = await saveAppSettings({ uiPreferences: migrated.uiPreferences });
|
|
if (generation === _loadGeneration) {
|
|
_cache = { ..._cache, ...saved, uiPreferences: migrated.uiPreferences };
|
|
}
|
|
} catch (e) {
|
|
console.warn('[useAppSettings] uiPreferences 마이그레이션 저장 실패:', e);
|
|
if (generation === _loadGeneration) {
|
|
_cache = { ..._cache, uiPreferences: migrated.uiPreferences };
|
|
}
|
|
}
|
|
}
|
|
_loadPromise = null;
|
|
if (generation === _loadGeneration) {
|
|
notifyAppSettingsListeners();
|
|
}
|
|
return _cache;
|
|
});
|
|
return _loadPromise;
|
|
}
|
|
|
|
export function invalidateAppSettingsCache() {
|
|
_cache = null;
|
|
_loadPromise = null;
|
|
_loadGeneration += 1;
|
|
}
|
|
|
|
/** 서버에서 app-settings 재로드 후 캐시 갱신 (모바일 ↻ 동기화 등) */
|
|
export function reloadAppSettingsCache(): Promise<AppSettingsDto> {
|
|
invalidateAppSettingsCache();
|
|
return ensureLoaded();
|
|
}
|
|
|
|
// ─────────────────────────────────────────────────────────────────────────────
|
|
|
|
/** DB 또는 fallback 기본값 접근 헬퍼 */
|
|
export function resolveAppDefaults(s: AppSettingsDto) {
|
|
return {
|
|
symbol: (s.defaultSymbol ?? 'KRW-BTC') as string,
|
|
timeframe: (s.defaultTimeframe ?? '1D') as Timeframe,
|
|
chartType: (s.defaultChartType ?? 'candlestick') as ChartType,
|
|
theme: (s.defaultTheme ?? 'dark') as Theme,
|
|
logScale: s.defaultLogScale ?? false,
|
|
layoutId: s.defaultLayoutId ?? '1',
|
|
mainChartStyle:(s.mainChartStyle as unknown as MainChartStyle | null) ?? DEFAULT_MAIN_CHART_STYLE,
|
|
syncOptions: (s.syncOptions as unknown as SyncOptions | null) ?? DEFAULT_SYNC,
|
|
btAutoPopup: s.btAutoPopup ?? true,
|
|
btShowPrice: s.btShowPrice ?? true,
|
|
chartSeriesPriceLabels: s.chartSeriesPriceLabels ?? true,
|
|
chartVolumeVisible: s.chartVolumeVisible ?? true,
|
|
chartLiveReceiveHighlight: s.chartLiveReceiveHighlight ?? true,
|
|
chartCrosshairInfoVisible: s.chartCrosshairInfoVisible ?? true,
|
|
chartLegendOptions: resolveChartLegendOptions(
|
|
s.chartLegendOptions as Partial<ChartLegendVisibility> | null | undefined,
|
|
),
|
|
chartPaneSeparator: resolveChartPaneSeparatorOptions(
|
|
s.chartPaneSeparator as Partial<ChartPaneSeparatorOptions> | null | undefined,
|
|
(s.defaultTheme ?? 'dark') as Theme,
|
|
),
|
|
tradeAlertPopup: s.tradeAlertPopup ?? true,
|
|
tradeAlertSoundEnabled: s.tradeAlertSoundEnabled ?? true,
|
|
tradeAlertSound: s.tradeAlertSound ?? 'bell',
|
|
tradeAlertPopupPosition: s.tradeAlertPopupPosition ?? 'right',
|
|
tradeAlertPopupLayout: s.tradeAlertPopupLayout ?? 'stack',
|
|
tradeAlertPopupGridCols: s.tradeAlertPopupGridCols ?? 2,
|
|
verificationIssueNotify: s.verificationIssueNotify ?? true,
|
|
liveStrategyCheck: s.liveStrategyCheck ?? false,
|
|
liveStrategyId: s.liveStrategyId ?? null,
|
|
liveExecutionType: s.liveExecutionType ?? 'CANDLE_CLOSE',
|
|
livePositionMode: s.livePositionMode ?? 'LONG_ONLY',
|
|
paperTradingEnabled: s.paperTradingEnabled ?? true,
|
|
paperInitialCapital: s.paperInitialCapital ?? 10_000_000,
|
|
paperFeeRatePct: s.paperFeeRatePct ?? 0.05,
|
|
paperSlippagePct: s.paperSlippagePct ?? 0,
|
|
paperMinOrderKrw: s.paperMinOrderKrw ?? 5000,
|
|
paperAutoTradeEnabled: s.paperAutoTradeEnabled ?? false,
|
|
paperAutoTradeBudgetPct: s.paperAutoTradeBudgetPct ?? 95,
|
|
virtualTargetMaxCount: clampVirtualTargetMax(s.virtualTargetMaxCount ?? DEFAULT_VIRTUAL_TARGET_MAX),
|
|
tradingMode: s.tradingMode ?? 'PAPER',
|
|
liveAutoTradeEnabled: s.liveAutoTradeEnabled ?? false,
|
|
hasUpbitKeys: s.hasUpbitKeys ?? false,
|
|
upbitAccessKeyMasked: s.upbitAccessKeyMasked ?? null,
|
|
chartRealtimeSource: s.chartRealtimeSource ?? 'BACKEND_STOMP',
|
|
liveAutoTradeBudgetPct: s.liveAutoTradeBudgetPct ?? 95,
|
|
fcmPushEnabled: s.fcmPushEnabled ?? false,
|
|
displayTimezone: normalizeTimezone(s.displayTimezone ?? DEFAULT_DISPLAY_TIMEZONE),
|
|
chartTimeFormat: normalizeChartTimeFormat(s.chartTimeFormat ?? DEFAULT_CHART_TIME_FORMAT),
|
|
tradeAlertTimeFormat: normalizeChartTimeFormat(s.tradeAlertTimeFormat ?? DEFAULT_TRADE_ALERT_TIME_FORMAT),
|
|
trendSearchSettings: resolveTrendSearchAppSettings(
|
|
s.trendSearchSettings as Partial<TrendSearchAppSettings> | null | undefined,
|
|
),
|
|
};
|
|
}
|
|
|
|
// ─────────────────────────────────────────────────────────────────────────────
|
|
|
|
/** sessionKey 변경 시(로그인/로그아웃) 설정을 DB에서 다시 로드 */
|
|
export function useAppSettings(sessionKey = 0) {
|
|
const [settings, setSettings] = useState<AppSettingsDto>(_cache ?? {});
|
|
const [isLoaded, setIsLoaded] = useState(_cache !== null);
|
|
const mountedRef = useRef(true);
|
|
const prevSessionKeyRef = useRef(sessionKey);
|
|
|
|
useEffect(() => {
|
|
mountedRef.current = true;
|
|
const sessionChanged = prevSessionKeyRef.current !== sessionKey;
|
|
prevSessionKeyRef.current = sessionKey;
|
|
|
|
if (sessionChanged) {
|
|
if (_cache !== null) {
|
|
setSettings(_cache);
|
|
setDisplayTimezone(normalizeTimezone(_cache.displayTimezone ?? DEFAULT_DISPLAY_TIMEZONE));
|
|
setChartTimeFormat(normalizeChartTimeFormat(_cache.chartTimeFormat ?? DEFAULT_CHART_TIME_FORMAT));
|
|
setTradeAlertTimeFormat(normalizeChartTimeFormat(_cache.tradeAlertTimeFormat ?? DEFAULT_TRADE_ALERT_TIME_FORMAT));
|
|
setIsLoaded(true);
|
|
} else {
|
|
setIsLoaded(false);
|
|
invalidateAppSettingsCache();
|
|
}
|
|
} else if (_cache !== null) {
|
|
setSettings(_cache);
|
|
setDisplayTimezone(normalizeTimezone(_cache.displayTimezone ?? DEFAULT_DISPLAY_TIMEZONE));
|
|
setChartTimeFormat(normalizeChartTimeFormat(_cache.chartTimeFormat ?? DEFAULT_CHART_TIME_FORMAT));
|
|
setTradeAlertTimeFormat(normalizeChartTimeFormat(_cache.tradeAlertTimeFormat ?? DEFAULT_TRADE_ALERT_TIME_FORMAT));
|
|
setIsLoaded(true);
|
|
} else {
|
|
setIsLoaded(false);
|
|
}
|
|
|
|
ensureLoaded().then(data => {
|
|
if (mountedRef.current) {
|
|
setSettings(data);
|
|
setDisplayTimezone(normalizeTimezone(data.displayTimezone ?? DEFAULT_DISPLAY_TIMEZONE));
|
|
setChartTimeFormat(normalizeChartTimeFormat(data.chartTimeFormat ?? DEFAULT_CHART_TIME_FORMAT));
|
|
setTradeAlertTimeFormat(normalizeChartTimeFormat(data.tradeAlertTimeFormat ?? DEFAULT_TRADE_ALERT_TIME_FORMAT));
|
|
setIsLoaded(true);
|
|
}
|
|
}).catch(err => {
|
|
console.error('[useAppSettings] load failed', err);
|
|
if (mountedRef.current) setIsLoaded(true);
|
|
});
|
|
const unsub = subscribeAppSettings(() => {
|
|
if (mountedRef.current) setSettings({ ...(getAppSettingsCache()) });
|
|
});
|
|
return () => {
|
|
mountedRef.current = false;
|
|
unsub();
|
|
};
|
|
}, [sessionKey]);
|
|
|
|
/**
|
|
* 특정 필드를 DB 에 저장하고 로컬 캐시를 업데이트.
|
|
* 낙관적 업데이트 — DB 저장 실패해도 UI 는 즉시 반영.
|
|
*/
|
|
const save = useCallback((patch: AppSettingsDto) => {
|
|
const merged = { ...(_cache ?? {}), ...patch };
|
|
_cache = merged;
|
|
notifyAppSettingsListeners();
|
|
setSettings(merged);
|
|
if (patch.displayTimezone != null) {
|
|
setDisplayTimezone(normalizeTimezone(patch.displayTimezone));
|
|
}
|
|
if (patch.chartTimeFormat != null) {
|
|
setChartTimeFormat(normalizeChartTimeFormat(patch.chartTimeFormat));
|
|
}
|
|
if (patch.tradeAlertTimeFormat != null) {
|
|
setTradeAlertTimeFormat(normalizeChartTimeFormat(patch.tradeAlertTimeFormat));
|
|
}
|
|
saveAppSettings(patch).then(updated => {
|
|
if (updated) {
|
|
_cache = { ...(_cache ?? {}), ...updated };
|
|
notifyAppSettingsListeners();
|
|
if (mountedRef.current) {
|
|
setSettings(prev => ({ ...prev, ...updated }));
|
|
}
|
|
}
|
|
}).catch(err =>
|
|
console.error('[useAppSettings] save failed', err)
|
|
);
|
|
}, []);
|
|
|
|
/** 로드된 설정의 해석된 기본값 */
|
|
const defaults = resolveAppDefaults(settings);
|
|
|
|
return { settings, defaults, isLoaded, save };
|
|
}
|
|
|
|
/** 앱 설정 캐시 기준 투자대상 최대 개수 (훅 외부·추가 API 등) */
|
|
export function getVirtualTargetMaxCount(): number {
|
|
const n = _cache?.virtualTargetMaxCount;
|
|
return clampVirtualTargetMax(n ?? DEFAULT_VIRTUAL_TARGET_MAX);
|
|
}
|