Ask for name and email before sending visitors to Amazon or Apple Books (switchable in admin → Books); v2.29.0

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

src/components/ResourcesHub.tsx

@@ -2,6 +2,7 @@ import { useEffect, useState } from 'react'
 import type { ReactNode } from 'react'
 import { Link } from 'react-router-dom'
 import type { SiteContent } from '../content'
+import { StoreLink } from './StoreLink'
 
 type TabKey = 'downloads' | 'books' | 'recommended'
 
@@ -35,6 +36,8 @@ function ClampedText({ text, className, lines = 3, threshold = 150 }: { text: st
 
 export function ResourcesHub({ content, downloadPath, fallback }: Props) {
   const links = content.customLinks ?? []
+  // Ask for name and email before sending visitors to Amazon / Apple Books (on unless switched off in the admin)
+  const gated = content.gateStoreLinks !== false
   const resources = links.filter(l => l.placement === 'resources')
   const books = links.filter(l => l.placement === 'books')
   const recommended = links.filter(l => l.placement === 'recommended')
@@ -174,14 +177,26 @@ export function ResourcesHub({ content, downloadPath, fallback }: Props) {
                     {book.description && <ClampedText text={book.description} className="res-desc" lines={3} />}
                     <div className="res-book-actions">
                       {(book.amazonUrl || book.url) && (
-                        <a href={book.amazonUrl || book.url} target="_blank" rel="noopener noreferrer" className="btn-primary res-btn">
+                        <StoreLink
+                          source={`book:${book.id}`}
+                          store="amazon"
+                          href={book.amazonUrl || book.url}
+                          gated={gated}
+                          className="btn-primary res-btn"
+                        >
                           {book.amazonUrl ? (book.amazonLabel || 'View on Amazon') : (book.amazonLabel || 'Learn More')}
-                        </a>
+                        </StoreLink>
                       )}
                       {book.appleBooksUrl && (
-                        <a href={book.appleBooksUrl} target="_blank" rel="noopener noreferrer" className="btn-secondary res-btn">
+                        <StoreLink
+                          source={`book:${book.id}`}
+                          store="apple"
+                          href={book.appleBooksUrl}
+                          gated={gated}
+                          className="btn-secondary res-btn"
+                        >
                           {book.appleBooksLabel || 'Apple Books'}
-                        </a>
+                        </StoreLink>
                       )}
                     </div>
                   </div>