Add prefetch attribute "viewport" on internal links

buildheadless · Dec 3, 2023 · 6f25047 · 6f25047
1 parent eb58057
commit 6f25047
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 3 deletions.
diff --git a/templates/hydrogen-theme/app/components/CollectionCard.tsx b/templates/hydrogen-theme/app/components/CollectionCard.tsx
@@ -10,7 +10,7 @@ export function CollectionCard(props: {
 
   return (
     <div className="overflow-hidden rounded-lg border">
-      <Link to={`/collections/${collection.handle}`}>
+      <Link prefetch="viewport" to={`/collections/${collection.handle}`}>
         {collection.image && (
           <Image aspectRatio="16/9" sizes="33vw" data={collection.image} />
         )}

diff --git a/templates/hydrogen-theme/app/components/ProductCard.tsx b/templates/hydrogen-theme/app/components/ProductCard.tsx
@@ -12,7 +12,7 @@ export function ProductCard(props: {
 
   return (
     <div className="overflow-hidden rounded-lg border">
-      <Link to={`/products/${product.handle}`}>
+      <Link prefetch="viewport" to={`/products/${product.handle}`}>
         {firstVariant.image && (
           <Image aspectRatio="16/9" sizes="33vw" data={firstVariant.image} />
         )}

diff --git a/templates/hydrogen-theme/app/components/sanity/link/SanityInternalLink.tsx b/templates/hydrogen-theme/app/components/sanity/link/SanityInternalLink.tsx
@@ -45,7 +45,7 @@ export function SanityInternalLink(props: {
 
   // Todo: add Navlink support
   return (
-    <Link prefetch="intent" to={url} className={className}>
+    <Link prefetch="viewport" to={url} className={className}>
       {children ? children : name}
     </Link>
   );