Fix amp search result links (#125)

* Fix hrefs on search suggestions in AMP. * bump version
storefront-foundation · Aug 7, 2020 · 5b15e89 · 5b15e89
1 parent 0db349a
commit 5b15e89
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 4 deletions.
diff --git 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
@@ -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
@@ -57,7 +57,7 @@ export default function SearchSuggestionItem({
         {children ? (
           children
         ) : (
-          <a>
+          <a href={item.as}>
             <div data-ui={ui}>
               <ImageComponent
                 className={classes.thumbnail}