revert: feat(infiniteHits): add previous button

This reverts commit 2c9e38d.
algolia · Apr 11, 2019 · 214c0fc · 214c0fc
1 parent cd64bcf
commit 214c0fc
Show file tree

Hide file tree

Showing 17 changed files with 27 additions and 838 deletions.
diff --git a/.storybook/MemoryRouter.ts b/.storybook/MemoryRouter.ts
diff --git a/.storybook/preview-head.html b/.storybook/preview-head.html
@@ -1,2 +1,2 @@
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/instantsearch.css@7.2.0/themes/algolia.min.css">
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/instantsearch.css@7.1.1/themes/algolia.min.css">
 <link rel="stylesheet" href="storybook.css">
diff --git a/src/components/InfiniteHits/InfiniteHits.js b/src/components/InfiniteHits/InfiniteHits.js
@@ -6,10 +6,7 @@ import Template from '../Template/Template';
 const InfiniteHits = ({
   results,
   hits,
-  hasShowPrevious,
-  showPrevious,
   showMore,
-  isFirstPage,
   isLastPage,
   cssClasses,
   templateProps,
@@ -29,21 +26,6 @@ const InfiniteHits = ({
 
   return (
     <div className={cssClasses.root}>
-      {hasShowPrevious && (
-        <Template
-          {...templateProps}
-          templateKey="showPreviousText"
-          rootTagName="button"
-          rootProps={{
-            className: cx(cssClasses.loadPrevious, {
-              [cssClasses.disabledLoadPrevious]: isFirstPage,
-            }),
-            disabled: isFirstPage,
-            onClick: showPrevious,
-          }}
-        />
-      )}
-
       <ol className={cssClasses.list}>
         {hits.map((hit, position) => (
           <Template
@@ -82,18 +64,13 @@ InfiniteHits.propTypes = {
     emptyRoot: PropTypes.string.isRequired,
     list: PropTypes.string.isRequired,
     item: PropTypes.string.isRequired,
-    loadPrevious: PropTypes.string.isRequired,
-    disabledLoadPrevious: PropTypes.string.isRequired,
     loadMore: PropTypes.string.isRequired,
     disabledLoadMore: PropTypes.string.isRequired,
   }).isRequired,
   hits: PropTypes.array.isRequired,
   results: PropTypes.object.isRequired,
-  hasShowPrevious: PropTypes.bool.isRequired,
-  showPrevious: PropTypes.func.isRequired,
-  showMore: PropTypes.func.isRequired,
+  showMore: PropTypes.func,
   templateProps: PropTypes.object.isRequired,
-  isFirstPage: PropTypes.bool.isRequired,
   isLastPage: PropTypes.bool.isRequired,
 };
 

diff --git a/src/components/InfiniteHits/__tests__/InfiniteHits-test.js b/src/components/InfiniteHits/__tests__/InfiniteHits-test.js
@@ -8,8 +8,6 @@ describe('InfiniteHits', () => {
     emptyRoot: 'emptyRoot',
     item: 'item',
     list: 'list',
-    loadPrevious: 'loadPrevious',
-    disabledLoadPrevious: 'disabledLoadPrevious',
     loadMore: 'loadMore',
     disabledLoadMore: 'disabledLoadMore',
   };
@@ -28,12 +26,8 @@ describe('InfiniteHits', () => {
       ];
 
       const props = {
-        hasShowPrevious: false,
-        showPrevious: () => {},
-        showMore: () => {},
         results: { hits },
         hits,
-        isFirstPage: true,
         isLastPage: false,
         templateProps: {
           templates: {
@@ -62,12 +56,8 @@ describe('InfiniteHits', () => {
       ];
 
       const props = {
-        hasShowPrevious: false,
-        showPrevious: () => {},
-        showMore: () => {},
         results: { hits },
         hits,
-        isFirstPage: false,
         isLastPage: true,
         templateProps: {
           templates: {
@@ -87,12 +77,8 @@ describe('InfiniteHits', () => {
       const hits = [];
 
       const props = {
-        hasShowPrevious: false,
-        showPrevious: () => {},
-        showMore: () => {},
         results: { hits },
         hits,
-        isFirstPage: true,
         isLastPage: false,
         templateProps: {
           templates: {
@@ -112,12 +98,8 @@ describe('InfiniteHits', () => {
       const hits = [];
 
       const props = {
-        hasShowPrevious: false,
-        showPrevious: () => {},
-        showMore: () => {},
         results: { hits },
         hits,
-        isFirstPage: false,
         isLastPage: true,
         templateProps: {
           templates: {
@@ -132,85 +114,5 @@ describe('InfiniteHits', () => {
 
       expect(tree).toMatchSnapshot();
     });
-
-    it('should render <InfiniteHits /> with "Show previous" button on first page', () => {
-      const hits = [
-        {
-          objectID: 'one',
-          foo: 'bar',
-        },
-        {
-          objectID: 'two',
-          foo: 'baz',
-        },
-      ];
-
-      const props = {
-        hasShowPrevious: true,
-        showPrevious: () => {},
-        showMore: () => {},
-        results: { hits },
-        hits,
-        isFirstPage: true,
-        isLastPage: false,
-        templateProps: {
-          templates: {
-            item: 'item',
-            showMoreText: 'showMoreText',
-            showPreviousText: 'showPreviousText',
-          },
-        },
-        cssClasses,
-      };
-
-      const tree = mount(<InfiniteHits {...props} />);
-
-      const previousButton = tree.find('.loadPrevious');
-
-      expect(previousButton.exists()).toEqual(true);
-      expect(previousButton.hasClass('disabledLoadPrevious')).toEqual(true);
-      expect(previousButton.props().disabled).toEqual(true);
-      expect(tree).toMatchSnapshot();
-    });
-
-    it('should render <InfiniteHits /> with "Show previous" button on last page', () => {
-      const hits = [
-        {
-          objectID: 'one',
-          foo: 'bar',
-        },
-        {
-          objectID: 'two',
-          foo: 'baz',
-        },
-      ];
-
-      const props = {
-        hasShowPrevious: true,
-        showPrevious: () => {},
-        showMore: () => {},
-        results: { hits },
-        hits,
-        isFirstPage: false,
-        isLastPage: true,
-        templateProps: {
-          templates: {
-            item: 'item',
-            showMoreText: 'showMoreText',
-            showPreviousText: 'showPreviousText',
-          },
-        },
-        cssClasses,
-      };
-
-      const tree = mount(<InfiniteHits {...props} />);
-
-      const previousButton = tree.find('.loadPrevious');
-
-      expect(previousButton.exists()).toEqual(true);
-      expect(previousButton.hasClass('disabledLoadPrevious')).toEqual(false);
-      expect(previousButton.props().disabled).toEqual(false);
-      expect(tree).toMatchSnapshot();
-    });
   });
 });
diff --git a/src/components/InfiniteHits/__tests__/__snapshots__/InfiniteHits-test.js.snap b/src/components/InfiniteHits/__tests__/__snapshots__/InfiniteHits-test.js.snap
@@ -32,7 +32,6 @@ exports[`InfiniteHits markup should render <InfiniteHits /> on first page 1`] =
       }
     }
     disabled={false}
-    onClick={[Function]}
   />
 </div>
 `;
@@ -69,101 +68,6 @@ exports[`InfiniteHits markup should render <InfiniteHits /> on last page 1`] = `
       }
     }
     disabled={true}
-    onClick={[Function]}
-  />
-</div>
-`;
-
-exports[`InfiniteHits markup should render <InfiniteHits /> with "Show previous" button on first page 1`] = `
-<div
-  className="root"
->
-  <button
-    className="loadPrevious disabledLoadPrevious"
-    dangerouslySetInnerHTML={
-      Object {
-        "__html": "showPreviousText",
-      }
-    }
-    disabled={true}
-    onClick={[Function]}
-  />
-  <ol
-    className="list"
-  >
-    <li
-      className="item"
-      dangerouslySetInnerHTML={
-        Object {
-          "__html": "item",
-        }
-      }
-    />
-    <li
-      className="item"
-      dangerouslySetInnerHTML={
-        Object {
-          "__html": "item",
-        }
-      }
-    />
-  </ol>
-  <button
-    className="loadMore"
-    dangerouslySetInnerHTML={
-      Object {
-        "__html": "showMoreText",
-      }
-    }
-    disabled={false}
-    onClick={[Function]}
-  />
-</div>
-`;
-
-exports[`InfiniteHits markup should render <InfiniteHits /> with "Show previous" button on last page 1`] = `
-<div
-  className="root"
->
-  <button
-    className="loadPrevious"
-    dangerouslySetInnerHTML={
-      Object {
-        "__html": "showPreviousText",
-      }
-    }
-    disabled={false}
-    onClick={[Function]}
-  />
-  <ol
-    className="list"
-  >
-    <li
-      className="item"
-      dangerouslySetInnerHTML={
-        Object {
-          "__html": "item",
-        }
-      }
-    />
-    <li
-      className="item"
-      dangerouslySetInnerHTML={
-        Object {
-          "__html": "item",
-        }
-      }
-    />
-  </ol>
-  <button
-    className="loadMore disabledLoadMore"
-    dangerouslySetInnerHTML={
-      Object {
-        "__html": "showMoreText",
-      }
-    }
-    disabled={true}
-    onClick={[Function]}
   />
 </div>
 `;