loading 오류 수정

frontend/src/hooks/useMarketTicker.ts

@@ -8,6 +8,7 @@
  */
 import { useState, useEffect, useRef, useCallback } from 'react';
 import { setMarketNames } from '../utils/marketNameCache';
+import { API_BASE } from '../utils/backendApi';
 import { UPBIT_API } from '../utils/upbitApi';
 import { fetchTickersThrottled, type UpbitTickerRaw } from '../utils/upbitTickerFetch';
 import { subscribeUpbitWs } from '../utils/upbitWsBroker';
@@ -66,10 +67,17 @@ function getMarketCode(raw: UpbitTickerRaw): string {
 }
 
 async function fetchAllMarkets(): Promise<MarketInfo[]> {
-  const res = await fetch(`${UPBIT_API}/market/all?isDetails=true`);
-  if (!res.ok) throw new Error(`market/all ${res.status}`);
-  const data: UpbitMarketAll[] = await res.json();
-  const krw = data.filter(m => m.market.startsWith('KRW-'));
+  let data: UpbitMarketAll[] | null = null;
+  try {
+    const res = await fetch(`${API_BASE}/markets/all?isDetails=true`);
+    if (res.ok) data = await res.json();
+  } catch { /* backend fallback */ }
+  if (!data) {
+    const res = await fetch(`${UPBIT_API}/market/all?isDetails=true`);
+    if (!res.ok) throw new Error(`market/all ${res.status}`);
+    data = await res.json();
+  }
+  const krw = (data ?? []).filter(m => m.market.startsWith('KRW-'));
   const nameMap: Record<string, string> = {};
   krw.forEach(m => { nameMap[m.market] = m.korean_name; });
   setMarketNames(nameMap);
@@ -138,6 +146,7 @@ function subscribeTickerWs(
 
 export function useMarketTicker(opts: UseMarketTickerOptions = {}) {
   const loadFull = opts.loadFull ?? false;
+  const isMobileLite = opts.lite ?? false;
   const priorityList = mergePriorityMarkets(opts.getPriorityMarkets?.() ?? opts.priorityMarkets);
   const priorityKey = priorityList.join(',');
 
@@ -205,12 +214,21 @@ export function useMarketTicker(opts: UseMarketTickerOptions = {}) {
   const runFullTickerLoad = useCallback(async () => {
     const all = marketListRef.current;
     if (all.length === 0 || fullLoadedRef.current) return;
+
+    if (isMobileLite) {
+      await loadTickersFor([]);
+      if (!mountedRef.current) return;
+      fullLoadedRef.current = true;
+      attachWs(wsTickerMarkets(all, priorityList));
+      return;
+    }
+
     await loadTickersFor(all);
     if (!mountedRef.current) return;
     fullLoadedRef.current = true;
     attachWs(wsTickerMarkets(all, priorityList));
     startPoll(all);
-  }, [loadTickersFor, attachWs, startPoll, priorityList]);
+  }, [isMobileLite, loadTickersFor, attachWs, startPoll, priorityList]);
 
   // 1) 마켓 목록 + 우선 종목 ticker (마운트 1회)
   useEffect(() => {
@@ -238,7 +256,7 @@ export function useMarketTicker(opts: UseMarketTickerOptions = {}) {
       initDoneRef.current = true;
       attachWs(wsTickerMarkets(allMarkets, priorityList));
 
-      if (loadFull) {
+      if (loadFull && !isMobileLite) {
         setTimeout(() => { void runFullTickerLoad(); }, FULL_LOAD_DEFER_MS);
       }
     })();
@@ -252,14 +270,15 @@ export function useMarketTicker(opts: UseMarketTickerOptions = {}) {
   // eslint-disable-next-line react-hooks/exhaustive-deps -- init only
   }, []);
 
-  // 2) 마켓 패널 열림 → 전 종목 (지연·스로틀)
+  // 2) 마켓 패널 열림 → 전 종목 (모바일: 백엔드 1회, PC: 지연 후 일괄)
   useEffect(() => {
     if (!loadFull || !initDoneRef.current) return;
     if (fullLoadedRef.current) return;
 
-    const t = setTimeout(() => { void runFullTickerLoad(); }, FULL_LOAD_DEFER_MS);
+    const delay = isMobileLite ? 300 : FULL_LOAD_DEFER_MS;
+    const t = setTimeout(() => { void runFullTickerLoad(); }, delay);
     return () => clearTimeout(t);
-  }, [loadFull, runFullTickerLoad]);
+  }, [isMobileLite, loadFull, runFullTickerLoad]);
 
   // 3) 우선 종목 변경 (lite) — 전체 재시작 없이 보강
   useEffect(() => {