From 5b15e896c6c43b95092630b44b224243481854b8 Mon Sep 17 00:00:00 2001
From: Mark Brocato <mark.brocato@moovweb.com>
Date: Fri, 7 Aug 2020 19:28:21 +0300
Subject: [PATCH] Fix amp search result links (#125)

* Fix hrefs on search suggestions in AMP.

* bump version
---
 package.json                       | 2 +-
 src/link/Link.js                   | 7 +++++--
 src/search/SearchSuggestionItem.js | 2 +-
 3 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index e1455edf..a9118f61 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-storefront",
-  "version": "8.15.0",
+  "version": "8.15.1",
   "description": "Build and deploy e-commerce progressive web apps (PWAs) in record time.",
   "module": "./index.js",
   "license": "Apache-2.0",
diff --git a/src/link/Link.js b/src/link/Link.js
index b096340c..0a0503e3 100644
--- a/src/link/Link.js
+++ b/src/link/Link.js
@@ -63,10 +63,13 @@ const Link = ({ as, href, prefetch, prefetchURL, pageData, onClick, children, ..
       </NextLink>
     )
   } else {
+    const child = React.Children.only(children)
+    const passHref = !child.props.href // we only passHref if the child does not have an href prop already.  This fixes a bug with AMP where NextLink overrides and escapes amp-bind syntax in hrefs.
+
+    // This way we can get a ref of Material-ui components
     return (
-      // This way we can get a ref of Material-ui components
       <RootRef rootRef={ref}>
-        <NextLink href={href} prefetch={false} as={as} passHref>
+        <NextLink href={href} prefetch={false} as={as} passHref={passHref}>
           {React.cloneElement(children, {
             onClick: handleClick,
             ...other,
diff --git a/src/search/SearchSuggestionItem.js b/src/search/SearchSuggestionItem.js
index ea3ae266..df8e8f86 100644
--- a/src/search/SearchSuggestionItem.js
+++ b/src/search/SearchSuggestionItem.js
@@ -57,7 +57,7 @@ export default function SearchSuggestionItem({
         {children ? (
           children
         ) : (
-          <a>
+          <a href={item.as}>
             <div data-ui={ui}>
               <ImageComponent
                 className={classes.thumbnail}