'use client';

import { useEffect, useRef } from 'react';
import { Product } from '@/types/woocommerce';
import { trackViewItemList } from '@/lib/tracking';

interface TrackViewItemListProps {
  products: Product[];
  listName: string;
}

export default function TrackViewItemList({ products, listName }: TrackViewItemListProps) {
  const trackedSignatureRef = useRef<string>('');

  useEffect(() => {
    if (products && products.length > 0) {
      const signature = `${listName}:${products.map((p) => p.id).slice(0, 10).join(',')}`;
      if (trackedSignatureRef.current !== signature) {
        trackedSignatureRef.current = signature;
        trackViewItemList(products, listName);
      }
    }
  }, [products, listName]);

  return null;
}