import { useEffect } from 'react';
import { useAuthStore } from '@common/store/authStore';
import { API_BASE_URL } from '@common/services/api';

/**
 * 서브탭 진입 시 감사 로그를 기록하는 훅.
 * App.tsx의 탭 레벨 TAB_VIEW와 함께, 서브탭 레벨 SUBTAB_VIEW를 기록한다.
 *
 * N-depth 지원: 콜론 구분 경로 (예: 'aerial:media', 'admin:users', 'a:b:c:d')
 *
 * @param featureId - 콜론 구분 리소스 경로
 */
export function useFeatureTracking(featureId: string) {
  const isAuthenticated = useAuthStore((s) => s.isAuthenticated);

  useEffect(() => {
    if (!isAuthenticated || !featureId) return;
    const blob = new Blob([JSON.stringify({ action: 'SUBTAB_VIEW', detail: featureId })], {
      type: 'text/plain',
    });
    navigator.sendBeacon(`${API_BASE_URL}/audit/log`, blob);
  }, [featureId, isAuthenticated]);
}