auto-trade/features/dashboard/hooks/use-holdings-realtime.ts

"use client";

import { useEffect, useMemo, useRef, useState } from "react";
import type { DashboardHoldingItem } from "@/features/dashboard/types/dashboard.types";
import {
  type KisRealtimeStockTick,
  parseKisRealtimeStockTick,
} from "@/features/dashboard/utils/kis-stock-realtime.utils";
import { useKisWebSocketStore } from "@/features/kis-realtime/stores/kisWebSocketStore";

const STOCK_REALTIME_TR_ID = "H0STCNT0";

/**
 * @description 보유 종목 목록에 대한 실시간 체결 데이터를 구독합니다.
 * @param holdings 보유 종목 목록
 * @returns 종목별 실시간 체결 데이터/연결 상태
 * @remarks UI 흐름: DashboardContainer -> useHoldingsRealtime -> HoldingsList/summary 실시간 반영
 * @see features/dashboard/components/DashboardContainer.tsx 보유종목 실시간 병합
 */
export function useHoldingsRealtime(holdings: DashboardHoldingItem[]) {
  const [realtimeData, setRealtimeData] = useState<
    Record<string, KisRealtimeStockTick>
  >({});
  const subscribeRef = useRef(useKisWebSocketStore.getState().subscribe);
  const connectRef = useRef(useKisWebSocketStore.getState().connect);
  const { isConnected } = useKisWebSocketStore();

  const uniqueSymbols = useMemo(
    () =>
      Array.from(new Set((holdings ?? []).map((item) => item.symbol))).sort(),
    [holdings],
  );
  const symbolKey = useMemo(() => uniqueSymbols.join(","), [uniqueSymbols]);

  useEffect(() => {
    if (uniqueSymbols.length === 0) {
      const resetTimerId = window.setTimeout(() => {
        setRealtimeData({});
      }, 0);
      return () => window.clearTimeout(resetTimerId);
    }

    connectRef.current();

    const unsubs: (() => void)[] = [];

    uniqueSymbols.forEach((symbol) => {
      const unsub = subscribeRef.current(
        STOCK_REALTIME_TR_ID,
        symbol,
        (data: string) => {
          const tick = parseKisRealtimeStockTick(data);
          if (tick) {
            setRealtimeData((prev) => {
              const prevTick = prev[tick.symbol];
              if (
                prevTick?.currentPrice === tick.currentPrice &&
                prevTick?.change === tick.change &&
                prevTick?.changeRate === tick.changeRate
              ) {
                return prev;
              }

              return {
                ...prev,
                [tick.symbol]: tick,
              };
            });
          }
        },
      );
      unsubs.push(unsub);
    });

    return () => {
      unsubs.forEach((unsub) => unsub());
    };
  }, [symbolKey, uniqueSymbols]);

  return { realtimeData, isConnected };
}