fix(dashboard): prevent infinite API polling loop

useCallback dependency on `symbols` state caused fetchAll to recreate
on every call (since it sets symbols), triggering useEffect to restart
the interval immediately. Use symbolsRef to break the cycle.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
21in7
2026-03-07 14:31:28 +09:00
parent 9b76313500
commit afdbacaabd

View File

@@ -267,6 +267,7 @@ export default function App() {
const [lastUpdate, setLastUpdate] = useState(null);
const [symbols, setSymbols] = useState([]);
const symbolsRef = useRef([]);
const [selectedSymbol, setSelectedSymbol] = useState(null); // null = ALL
const [stats, setStats] = useState({
@@ -283,7 +284,7 @@ export default function App() {
/* ── 데이터 폴링 ─────────────────────────────────────────── */
const fetchAll = useCallback(async () => {
const sym = selectedSymbol ? `?symbol=${selectedSymbol}` : "";
const symRequired = selectedSymbol || symbols[0] || "XRPUSDT";
const symRequired = selectedSymbol || symbolsRef.current[0] || "XRPUSDT";
const [symRes, sRes, pRes, tRes, dRes, cRes] = await Promise.all([
api("/symbols"),
@@ -294,7 +295,10 @@ export default function App() {
api(`/candles?symbol=${symRequired}&limit=96`),
]);
if (symRes?.symbols) setSymbols(symRes.symbols);
if (symRes?.symbols) {
symbolsRef.current = symRes.symbols;
setSymbols(symRes.symbols);
}
if (sRes && sRes.total_trades !== undefined) {
setStats(sRes);
setIsLive(true);
@@ -307,7 +311,7 @@ export default function App() {
if (tRes?.trades) setTrades(tRes.trades);
if (dRes?.daily) setDaily(dRes.daily);
if (cRes?.candles) setCandles(cRes.candles);
}, [selectedSymbol, symbols]);
}, [selectedSymbol]);
useEffect(() => {
fetchAll();