From 8287de00dca8ac5a4591bbe730ec76a52cdc0200 Mon Sep 17 00:00:00 2001
From: Hans Lemuet <Spone@users.noreply.github.com>
Date: Mon, 9 Jul 2018 13:33:22 +0200
Subject: [PATCH] feat(infiniteHits): add showmoreButton to cssClasses (#3026)

* feat(infiniteHits): add showmoreButton to cssClasses

* feat(infiniteHits): fix snapshot to make tests pass

* feat(infiniteHits): prettify file
---
 src/components/InfiniteHits.js                           | 9 +++++++--
 .../__tests__/__snapshots__/infinite-hits-test.js.snap   | 4 ++++
 src/widgets/infinite-hits/infinite-hits.js               | 6 ++++--
 3 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/src/components/InfiniteHits.js b/src/components/InfiniteHits.js
index 07e3055d8d..25700236cd 100644
--- a/src/components/InfiniteHits.js
+++ b/src/components/InfiniteHits.js
@@ -13,9 +13,13 @@ class InfiniteHits extends Component {
       templateProps,
     } = this.props;
     const btn = this.props.isLastPage ? (
-      <button disabled>{showMoreLabel}</button>
+      <button disabled className={cssClasses.showmoreButton}>
+        {showMoreLabel}
+      </button>
     ) : (
-      <button onClick={showMore}>{showMoreLabel}</button>
+      <button onClick={showMore} className={cssClasses.showmoreButton}>
+        {showMoreLabel}
+      </button>
     );
 
     return (
@@ -39,6 +43,7 @@ InfiniteHits.propTypes = {
     allItems: PropTypes.string,
     empty: PropTypes.string,
     showmore: PropTypes.string,
+    showmoreButton: PropTypes.string,
   }),
   hits: PropTypes.array,
   results: PropTypes.object,
diff --git a/src/widgets/infinite-hits/__tests__/__snapshots__/infinite-hits-test.js.snap b/src/widgets/infinite-hits/__tests__/__snapshots__/infinite-hits-test.js.snap
index 8d2e49eb94..e44e64a2ea 100644
--- a/src/widgets/infinite-hits/__tests__/__snapshots__/infinite-hits-test.js.snap
+++ b/src/widgets/infinite-hits/__tests__/__snapshots__/infinite-hits-test.js.snap
@@ -8,6 +8,7 @@ exports[`infiniteHits() calls twice ReactDOM.render(<Hits props />, container) 1
       "item": "ais-infinite-hits--item",
       "root": "ais-infinite-hits root cx",
       "showmore": "ais-infinite-hits--showmore",
+      "showmoreButton": "ais-infinite-hits--showmoreButton",
     }
   }
   hits={
@@ -56,6 +57,7 @@ exports[`infiniteHits() calls twice ReactDOM.render(<Hits props />, container) 2
       "item": "ais-infinite-hits--item",
       "root": "ais-infinite-hits root cx",
       "showmore": "ais-infinite-hits--showmore",
+      "showmoreButton": "ais-infinite-hits--showmoreButton",
     }
   }
   hits={
@@ -104,6 +106,7 @@ exports[`infiniteHits() if it is the last page, then the props should contain is
       "item": "ais-infinite-hits--item",
       "root": "ais-infinite-hits root cx",
       "showmore": "ais-infinite-hits--showmore",
+      "showmoreButton": "ais-infinite-hits--showmoreButton",
     }
   }
   hits={
@@ -154,6 +157,7 @@ exports[`infiniteHits() if it is the last page, then the props should contain is
       "item": "ais-infinite-hits--item",
       "root": "ais-infinite-hits root cx",
       "showmore": "ais-infinite-hits--showmore",
+      "showmoreButton": "ais-infinite-hits--showmoreButton",
     }
   }
   hits={
diff --git a/src/widgets/infinite-hits/infinite-hits.js b/src/widgets/infinite-hits/infinite-hits.js
index 5612b71c3d..cb282081f6 100644
--- a/src/widgets/infinite-hits/infinite-hits.js
+++ b/src/widgets/infinite-hits/infinite-hits.js
@@ -54,7 +54,7 @@ infiniteHits({
   container,
   [ escapeHits = false ],
   [ showMoreLabel ],
-  [ cssClasses.{root,empty,item,showmore}={} ],
+  [ cssClasses.{root,empty,item,showmore,showmoreButton}={} ],
   [ templates.{empty,item} | templates.{empty} ],
   [ transformData.{empty,item} | transformData.{empty} ],
 })`;
@@ -76,7 +76,8 @@ infiniteHits({
  * @property {string|string[]} [root] CSS class to add to the wrapping element.
  * @property {string|string[]} [empty] CSS class to add to the wrapping element when no results.
  * @property {string|string[]} [item] CSS class to add to each result.
- * @property {string|string[]} [showmore] CSS class to add to the show more button.
+ * @property {string|string[]} [showmore] CSS class to add to the show more button container.
+ * @property {string|string[]} [showmoreButton] CSS class to add to the show more button.
  */
 
 /**
@@ -138,6 +139,7 @@ export default function infiniteHits({
     item: cx(bem('item'), userCssClasses.item),
     empty: cx(bem(null, 'empty'), userCssClasses.empty),
     showmore: cx(bem('showmore'), userCssClasses.showmore),
+    showmoreButton: cx(bem('showmoreButton'), userCssClasses.showmoreButton),
   };
 
   const specializedRenderer = renderer({