@amulet-laboratories/rig-nuxt 0.3.0 → 0.4.0

package/src/runtime/components/content/ProductCardWrapper.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { computed } from 'vue'
 import { useAsyncData } from '#imports'
 import { useFathom } from '@amulet-laboratories/rig'
 import { useProducts } from '../../composables/useProducts'
@@ -14,6 +15,50 @@ const { data: product, status } = await useAsyncData(`product-${props.slug}`, ()
 
 const { trackAffiliateClick } = useFathom()
 
+interface Retailer {
+  name: string
+  url: string
+  commission_rate: string
+}
+
+const bestRetailer = computed<Retailer | null>(() => {
+  if (!product.value) return null
+
+  const candidates: Retailer[] = []
+
+  if (product.value.amazon?.url) {
+    candidates.push({
+      name: 'Amazon',
+      url: product.value.amazon.url,
+      commission_rate: product.value.amazon.commission_rate || '0%',
+    })
+  }
+
+  if (product.value.alt_retailers?.length) {
+    for (const retailer of product.value.alt_retailers) {
+      if (retailer.url) candidates.push(retailer as Retailer)
+    }
+  }
+
+  if (!candidates.length) return null
+
+  return candidates.sort((a, b) => {
+    const rateA = parseFloat(a.commission_rate) || 0
+    const rateB = parseFloat(b.commission_rate) || 0
+    return rateB - rateA
+  })[0]
+})
+
+const amazonFallback = computed<Retailer | null>(() => {
+  if (!product.value?.amazon?.url) return null
+  if (bestRetailer.value?.name === 'Amazon') return null
+  return {
+    name: 'Amazon',
+    url: product.value.amazon.url,
+    commission_rate: product.value.amazon.commission_rate || '0%',
+  }
+})
+
 function onAffiliateClick() {
   trackAffiliateClick(props.slug)
 }
@@ -66,13 +111,24 @@ function onAffiliateClick() {
     </div>
     <div data-rig-product-card-footer>
       <a
-        :href="product.amazon?.url"
+        v-if="bestRetailer"
+        :href="bestRetailer.url"
         target="_blank"
         rel="nofollow noopener sponsored"
         data-rig-product-card-link
         @click="onAffiliateClick"
       >
-        Check price on Amazon
+        Check price on {{ bestRetailer.name }}
+      </a>
+      <a
+        v-if="amazonFallback"
+        :href="amazonFallback.url"
+        target="_blank"
+        rel="nofollow noopener sponsored"
+        data-rig-product-card-link-secondary
+        @click="onAffiliateClick"
+      >
+        Also on Amazon
       </a>
     </div>
   </div>

package/src/runtime/components/layout/NetworkFooter.vue

@@ -23,7 +23,12 @@ const otherSites = computed(() => props.sites.filter((s) => s.name !== currentSi
       <p data-rig-network-footer-label>From our network</p>
       <ul data-rig-network-footer-list>
         <li v-for="site in otherSites" :key="site.name">
-          <a :href="site.url" target="_blank" rel="noopener" data-rig-network-footer-link>
+          <a
+            :href="site.url"
+            target="_blank"
+            rel="noopener noreferrer"
+            data-rig-network-footer-link
+          >
             <span data-rig-network-footer-name>{{ site.name }}</span>
             <span data-rig-network-footer-tagline>{{ site.tagline }}</span>
           </a>

package/src/runtime/composables/useArticleSeo.ts

@@ -1,3 +1,5 @@
+import { useRuntimeConfig, useRoute, useSeoMeta, useHead } from 'nuxt/app'
+
 export interface SeoMetaOptions {
   title: string
   description?: string
@@ -7,7 +9,9 @@ export interface SeoMetaOptions {
 }
 
 export const useArticleSeo = (options: SeoMetaOptions) => {
-  const { name: siteName, url: siteUrl } = useSiteConfig()
+  const config = useRuntimeConfig()
+  const siteUrl = (config.public?.siteUrl as string) || ''
+  const siteName = (config.public?.siteName as string) || ''
   const route = useRoute()
   const canonicalUrl = `${siteUrl}${route.path}`
   const ogImage = options.ogImage || `${siteUrl}/og-default.svg`

package/src/runtime/composables/useStructuredData.ts

@@ -1,3 +1,15 @@
+import { useRuntimeConfig, useRoute, useHead } from 'nuxt/app'
+
+export interface StructuredDataProduct {
+  slug: string
+  name: string
+  brand?: string
+  image_url?: string
+  rating?: number
+  price_range?: string
+  amazon?: { url?: string }
+}
+
 export interface StructuredDataPage {
   title: string
   description: string
@@ -10,14 +22,59 @@ export interface StructuredDataPage {
     width: number
     height: number
   }
+  /** One of: 'Article' | 'HowTo' | 'Review' | 'ItemList' (auto-picked if products present). */
   schema?: string
   rating?: number
   price?: string
   faq?: Array<{ question: string; answer: string }>
+  /**
+   * Affiliate products referenced by the article. When passed, emits real
+   * Product entities inside the appropriate parent schema (Review for a single
+   * primary product, ItemList for roundups). Single biggest organic-CTR
+   * multiplier for affiliate content — Google surfaces star ratings + prices
+   * in the SERP when these are present.
+   */
+  products?: StructuredDataProduct[]
+}
+
+function productSchema(p: StructuredDataProduct, siteUrl: string) {
+  const node: Record<string, unknown> = {
+    '@type': 'Product',
+    name: p.name,
+  }
+  if (p.brand) node.brand = { '@type': 'Brand', name: p.brand }
+  if (p.image_url)
+    node.image = p.image_url.startsWith('http') ? p.image_url : `${siteUrl}${p.image_url}`
+  if (p.rating) {
+    node.aggregateRating = {
+      '@type': 'AggregateRating',
+      ratingValue: p.rating,
+      bestRating: 5,
+      ratingCount: 1,
+    }
+  }
+  if (p.amazon?.url) {
+    node.offers = {
+      '@type': 'Offer',
+      url: p.amazon.url,
+      priceCurrency: 'USD',
+      ...(p.price_range ? { price: extractMinPrice(p.price_range) } : {}),
+      availability: 'https://schema.org/InStock',
+    }
+  }
+  return node
+}
+
+function extractMinPrice(range: string): string | undefined {
+  // "$169-$199" -> "169"
+  const m = range.match(/\$?(\d+(?:\.\d+)?)/)
+  return m ? m[1] : undefined
 }
 
 export const useStructuredData = (page: StructuredDataPage) => {
-  const { name: siteName, url: siteUrl } = useSiteConfig()
+  const config = useRuntimeConfig()
+  const siteUrl = (config.public?.siteUrl as string) || ''
+  const siteName = (config.public?.siteName as string) || ''
   const route = useRoute()
   const url = `${siteUrl}${route.path}`
 
@@ -54,33 +111,51 @@ export const useStructuredData = (page: StructuredDataPage) => {
     baseData.dateModified = page.updatedAt
   }
 
-  let schemaType = 'Article'
+  // Auto-pick schema: explicit > products-driven > Article default.
+  // ≥2 products on an article without explicit schema → ItemList (roundup).
+  // 1 product or explicit Review → Review.
+  let schemaType = page.schema ?? 'Article'
+  const productCount = page.products?.length ?? 0
+  if (!page.schema && productCount >= 2) schemaType = 'ItemList'
 
-  switch (page.schema) {
-    case 'Review':
-      schemaType = 'Review'
-      baseData.itemReviewed = {
-        '@type': 'Product',
-        name: page.title,
-      }
-      if (page.rating) {
+  switch (schemaType) {
+    case 'Review': {
+      baseData['@type'] = 'Review'
+      const primary = page.products?.[0]
+      baseData.itemReviewed = primary
+        ? productSchema(primary, siteUrl)
+        : { '@type': 'Product', name: page.title }
+      const rating = page.rating ?? primary?.rating
+      if (rating) {
         baseData.reviewRating = {
           '@type': 'Rating',
-          ratingValue: page.rating,
+          ratingValue: rating,
           bestRating: 5,
         }
       }
       break
-    case 'HowTo':
-      schemaType = 'HowTo'
+    }
+    case 'ItemList': {
+      baseData['@type'] = 'ItemList'
+      baseData.name = page.title
+      baseData.numberOfItems = productCount
+      baseData.itemListElement = (page.products ?? []).map((p, i) => ({
+        '@type': 'ListItem',
+        position: i + 1,
+        item: productSchema(p, siteUrl),
+      }))
+      break
+    }
+    case 'HowTo': {
+      baseData['@type'] = 'HowTo'
       baseData.name = page.title
       break
-    default:
-      schemaType = 'Article'
+    }
+    default: {
+      baseData['@type'] = 'Article'
+    }
   }
 
-  baseData['@type'] = schemaType
-
   const scripts: Array<{ type: string; innerHTML: string }> = [
     {
       type: 'application/ld+json',

package/src/runtime/plugins/fathom.client.ts

@@ -1,3 +1,5 @@
+import { defineNuxtPlugin, useRuntimeConfig, useHead } from 'nuxt/app'
+
 export default defineNuxtPlugin(() => {
   const config = useRuntimeConfig()
   const siteId = config.public.fathomSiteId as string

package/src/runtime/plugins/sentry.client.ts

@@ -1,4 +1,5 @@
 import * as Sentry from '@sentry/vue'
+import { defineNuxtPlugin, useRuntimeConfig } from 'nuxt/app'
 
 export default defineNuxtPlugin((nuxtApp) => {
   const config = useRuntimeConfig()

package/src/runtime/server/api/newsletter/subscribe.post.ts

@@ -1,4 +1,5 @@
 import { defineEventHandler, readBody, createError } from 'h3'
+import { useRuntimeConfig } from 'nitropack/runtime'
 
 export default defineEventHandler(async (event) => {
   const body = await readBody(event)

package/src/runtime/server/routes/feed.xml.ts

@@ -1,4 +1,6 @@
 import { defineEventHandler } from 'h3'
+import { useRuntimeConfig } from 'nitropack/runtime'
+import { queryCollection } from '@nuxt/content/nitro'
 
 export default defineEventHandler(async (event) => {
   const config = useRuntimeConfig()

package/src/runtime/server/routes/sitemap.xml.ts

@@ -1,6 +1,9 @@
 import { readFileSync, readdirSync, existsSync } from 'node:fs'
 import { join, resolve } from 'node:path'
 import { parse } from 'yaml'
+import { defineEventHandler } from 'h3'
+import { useRuntimeConfig } from 'nitropack/runtime'
+import { queryCollection } from '@nuxt/content/nitro'
 
 export default defineEventHandler(async (event) => {
   const config = useRuntimeConfig()

package/src/runtime/server/utils/injectAffiliateTag.ts

@@ -1,16 +1,43 @@
+import { useRuntimeConfig } from 'nitropack/runtime'
+
+const PLACEHOLDER_TAG = 'YOURTAG-20'
+let warnedMissingTag = false
+
 /**
- * Replaces placeholder affiliate tags in product Amazon URLs
- * with the real tag from environment config.
+ * Replaces the placeholder affiliate tag in a product's Amazon URL with the
+ * real per-site tag from runtime config (NUXT_AMAZON_AFFILIATE_TAG).
+ *
+ * When no tag is configured, the placeholder is STRIPPED rather than shipped:
+ * a live URL containing `tag=YOURTAG-20` earns no commission and reads as
+ * broken, so we emit a clean (un-attributed) Amazon link — and warn once in
+ * dev — instead of leaking the placeholder to readers.
  */
 export function injectAffiliateTag(product) {
-  const config = useRuntimeConfig()
-  const amazonTag = config.amazonAffiliateTag || ''
+  const amazonTag = useRuntimeConfig().amazonAffiliateTag || ''
+  const url = product.amazon?.url
+
+  if (!url || !url.includes(PLACEHOLDER_TAG)) return product
 
-  if (!amazonTag || !product.amazon) return product
+  const amazon = { ...product.amazon }
 
-  const amazon = product.amazon
-  if (amazon.url && amazon.url.includes('YOURTAG-20')) {
-    amazon.url = amazon.url.replace('YOURTAG-20', amazonTag)
+  if (amazonTag) {
+    amazon.url = url.replace(PLACEHOLDER_TAG, amazonTag)
+  } else {
+    // No NUXT_AMAZON_AFFILIATE_TAG set — never expose the literal placeholder.
+    try {
+      const cleaned = new URL(url)
+      cleaned.searchParams.delete('tag')
+      amazon.url = cleaned.toString()
+    } catch {
+      amazon.url = url.replace(PLACEHOLDER_TAG, '')
+    }
+    if (!warnedMissingTag && process.env.NODE_ENV !== 'production') {
+      warnedMissingTag = true
+      // eslint-disable-next-line no-console
+      console.warn(
+        '[injectAffiliateTag] NUXT_AMAZON_AFFILIATE_TAG is not set — Amazon links render un-attributed (no commission). Set a per-site tag before production.',
+      )
+    }
   }
 
   return { ...product, amazon }