@thead-vantage/react 2.6.0 → 2.8.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thead-vantage/react",
-  "version": "2.6.0",
+  "version": "2.8.0",
   "description": "React components and utilities for TheAd Vantage ad platform integration",
   "main": "./src/index.ts",
   "module": "./src/index.ts",

package/src/components/AdBanner.tsx

@@ -124,7 +124,7 @@ export function AdBanner({
         rel="noopener noreferrer"
         className="block"
       >
-        {ad.type === 'image' ? (
+        {(ad.type === 'image' || ad.type === 'standard') && ad.contentUrl ? (
           <Image
             src={ad.contentUrl}
             alt={ad.name}

package/src/lib/ads.ts

@@ -183,6 +183,14 @@ export async function fetchAdBanner(params: FetchAdBannerParams): Promise<AdBann
       };
     };
 
+    // Helper to normalize ad type - "standard" should be treated as "image"
+    const normalizeAdType = (ad: Ad): Ad => {
+      if (ad.type === 'standard' && ad.contentUrl) {
+        return { ...ad, type: 'image' };
+      }
+      return ad;
+    };
+
     // Handle both single ad and array of ads
     if (data.ads && Array.isArray(data.ads) && data.ads.length > 0) {
       // If we get an array, use the first ad and ensure it's Ad type
@@ -190,10 +198,13 @@ export async function fetchAdBanner(params: FetchAdBannerParams): Promise<AdBann
       console.log('[AdBanner] Processing ads array, first ad:', JSON.stringify(firstAd, null, 2));
       
       // Check if it's already an Ad, otherwise convert from AdData
-      const ad: Ad = isAd(firstAd) 
+      let ad: Ad = isAd(firstAd) 
         ? firstAd 
         : convertToAd(firstAd as AdData);
       
+      // Normalize the type (standard -> image)
+      ad = normalizeAdType(ad);
+      
       console.log('[AdBanner] Converted ad:', JSON.stringify(ad, null, 2));
       
       return {
@@ -206,10 +217,19 @@ export async function fetchAdBanner(params: FetchAdBannerParams): Promise<AdBann
     }
 
     // Handle single ad response - convert AdData to Ad
-    // Since data.ad is typed as AdData, we always convert it
     if (data.ad) {
       console.log('[AdBanner] Processing single ad:', JSON.stringify(data.ad, null, 2));
-      const ad: Ad = convertToAd(data.ad);
+      
+      // Check if it's already in Ad format or needs conversion
+      let ad: Ad;
+      if (isAd(data.ad)) {
+        // Already in Ad format, normalize the type
+        ad = normalizeAdType(data.ad);
+      } else {
+        // Convert from AdData format
+        ad = convertToAd(data.ad);
+      }
+      
       console.log('[AdBanner] Converted ad:', JSON.stringify(ad, null, 2));
       
       return {
@@ -264,14 +284,34 @@ export async function fetchAdBanner(params: FetchAdBannerParams): Promise<AdBann
 
 /**
  * Track an ad impression (when ad is viewed)
- * In development mode, this is a no-op (handled by API route)
+ * Sends tracking directly to TheAd Vantage API (or skips in dev mode)
  */
 export async function trackImpression(adId: string): Promise<void> {
   try {
-    const response = await fetch('/api/ads', {
+    // Get the API base URL to determine where to send tracking
+    const apiBaseUrl = getApiBaseUrl();
+    
+    // Build tracking URL - remove /api/ads if present, then append /api/ads/track
+    let trackingUrl = apiBaseUrl.trim();
+    if (trackingUrl.endsWith('/api/ads')) {
+      trackingUrl = trackingUrl.replace('/api/ads', '/api/ads/track');
+    } else {
+      // Remove trailing slash if present
+      trackingUrl = trackingUrl.replace(/\/$/, '') + '/api/ads/track';
+    }
+    
+    // Check if we should skip tracking (dev mode)
+    const useDevFlags = shouldUseDevFlags();
+    if (useDevFlags) {
+      console.log(`[DEV] Impression tracking skipped for ad: ${adId}`);
+      return;
+    }
+    
+    const response = await fetch(trackingUrl, {
       method: 'POST',
       headers: {
         'Content-Type': 'application/json',
+        'Accept': 'application/json',
       },
       body: JSON.stringify({
         action: 'impression',
@@ -279,6 +319,11 @@ export async function trackImpression(adId: string): Promise<void> {
       }),
     });
     
+    if (!response.ok) {
+      console.warn(`[AdBanner] Tracking impression failed: ${response.status} ${response.statusText}`);
+      return;
+    }
+    
     const data = await response.json();
     if (data.dev_mode) {
       console.log(`[DEV] Impression tracking skipped for ad: ${adId}`);
@@ -291,14 +336,34 @@ export async function trackImpression(adId: string): Promise<void> {
 
 /**
  * Track an ad click
- * In development mode, this is a no-op (handled by API route)
+ * Sends tracking directly to TheAd Vantage API (or skips in dev mode)
  */
 export async function trackClick(adId: string): Promise<void> {
   try {
-    const response = await fetch('/api/ads', {
+    // Get the API base URL to determine where to send tracking
+    const apiBaseUrl = getApiBaseUrl();
+    
+    // Build tracking URL - remove /api/ads if present, then append /api/ads/track
+    let trackingUrl = apiBaseUrl.trim();
+    if (trackingUrl.endsWith('/api/ads')) {
+      trackingUrl = trackingUrl.replace('/api/ads', '/api/ads/track');
+    } else {
+      // Remove trailing slash if present
+      trackingUrl = trackingUrl.replace(/\/$/, '') + '/api/ads/track';
+    }
+    
+    // Check if we should skip tracking (dev mode)
+    const useDevFlags = shouldUseDevFlags();
+    if (useDevFlags) {
+      console.log(`[DEV] Click tracking skipped for ad: ${adId}`);
+      return;
+    }
+    
+    const response = await fetch(trackingUrl, {
       method: 'POST',
       headers: {
         'Content-Type': 'application/json',
+        'Accept': 'application/json',
       },
       body: JSON.stringify({
         action: 'click',
@@ -306,6 +371,11 @@ export async function trackClick(adId: string): Promise<void> {
       }),
     });
     
+    if (!response.ok) {
+      console.warn(`[AdBanner] Tracking click failed: ${response.status} ${response.statusText}`);
+      return;
+    }
+    
     const data = await response.json();
     if (data.dev_mode) {
       console.log(`[DEV] Click tracking skipped for ad: ${adId}`);

package/src/lib/thead-vantage-config.ts

@@ -31,47 +31,78 @@ function isLocalhost(): boolean {
  * 5. Production mode (default) → https://thead-vantage.com (full tracking)
  */
 export function getApiBaseUrl(explicitApiUrl?: string): string {
+  let selectedUrl: string | undefined;
+  let reason: string | undefined;
+  
   // Priority 1: Explicit API URL override (highest priority)
   if (explicitApiUrl) {
-    return explicitApiUrl;
+    selectedUrl = explicitApiUrl;
+    reason = 'explicit API URL parameter';
   }
-
   // Priority 2: Environment variable for custom API URL
   // This allows platform developers to point to their own platform
-  if (typeof window !== 'undefined') {
+  else if (typeof window !== 'undefined') {
     // Check runtime config first (for browser contexts)
     const runtimeUrl = (window as any).__THEAD_VANTAGE_API_URL__;
-    if (runtimeUrl) {
-      return runtimeUrl;
+    if (runtimeUrl && typeof runtimeUrl === 'string' && runtimeUrl.trim()) {
+      // Validate that it's not pointing to the current page's origin (would be wrong)
+      const currentOrigin = window.location.origin;
+      if (!runtimeUrl.startsWith(currentOrigin)) {
+        selectedUrl = runtimeUrl;
+        reason = 'runtime config (window.__THEAD_VANTAGE_API_URL__)';
+      } else {
+        console.warn('[TheAd Vantage] Runtime API URL points to current origin, ignoring:', runtimeUrl);
+      }
     }
   }
 
   // Check environment variable (works in both server and client)
-  const customUrl = process.env.NEXT_PUBLIC_THEAD_VANTAGE_API_URL;
-  if (customUrl) {
-    return customUrl;
+  if (!selectedUrl) {
+    const customUrl = process.env.NEXT_PUBLIC_THEAD_VANTAGE_API_URL;
+    if (customUrl && customUrl.trim()) {
+      // Validate that it's not pointing to localhost without being TheAd Vantage dev mode
+      if (customUrl.includes('localhost') && !customUrl.includes('localhost:3001')) {
+        console.warn('[TheAd Vantage] Custom API URL points to localhost (not :3001), this may be incorrect:', customUrl);
+      }
+      selectedUrl = customUrl;
+      reason = 'NEXT_PUBLIC_THEAD_VANTAGE_API_URL environment variable';
+    }
   }
 
   // Priority 3: TheAd Vantage dev mode
   // Only for TheAd Vantage developers testing locally with localhost:3001
-  const isTheadVantageDevMode = typeof window !== 'undefined'
-    ? (window as any).__THEAD_VANTAGE_DEV_MODE__ === true ||
-      process.env.NEXT_PUBLIC_THEAD_VANTAGE_DEV_MODE === 'true'
-    : process.env.NEXT_PUBLIC_THEAD_VANTAGE_DEV_MODE === 'true';
-
-  if (isTheadVantageDevMode) {
-    return 'http://localhost:3001/api/ads';
+  if (!selectedUrl) {
+    const isTheadVantageDevMode = typeof window !== 'undefined'
+      ? (window as any).__THEAD_VANTAGE_DEV_MODE__ === true ||
+        process.env.NEXT_PUBLIC_THEAD_VANTAGE_DEV_MODE === 'true'
+      : process.env.NEXT_PUBLIC_THEAD_VANTAGE_DEV_MODE === 'true';
+
+    if (isTheadVantageDevMode) {
+      selectedUrl = 'http://localhost:3001/api/ads';
+      reason = 'TheAd Vantage dev mode (NEXT_PUBLIC_THEAD_VANTAGE_DEV_MODE=true)';
+    }
   }
 
   // Priority 4: Localhost development (platform developers on localhost)
   // Use production API but will add dev flags to prevent tracking
-  if (isLocalhost()) {
-    return 'https://thead-vantage.com/api/ads';
+  if (!selectedUrl && isLocalhost()) {
+    selectedUrl = 'https://thead-vantage.com/api/ads';
+    reason = 'localhost detection (production API with dev flags)';
   }
 
   // Priority 5: Production mode (default)
   // Platform developers use this by default in production
-  return 'https://thead-vantage.com/api/ads';
+  if (!selectedUrl) {
+    selectedUrl = 'https://thead-vantage.com/api/ads';
+    reason = 'production mode (default)';
+  }
+
+  // Log which URL was selected (helpful for debugging)
+  if (typeof window !== 'undefined' && process.env.NODE_ENV === 'development') {
+    console.log(`[TheAd Vantage] API Base URL selected: ${selectedUrl} (reason: ${reason})`);
+  }
+
+  return selectedUrl;
 }
 
 /**