@blaze-cms/react-page-builder 0.128.0-admin-updates.5 → 0.128.0-admin-updates.8

package/src/components/SearchFilter/components/Select.js

@@ -1,7 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import Select from '@blaze-react/select';
-import { withTitle } from '../../../HOC';
 import { DEFAULT_OPTION } from '../constants';
 
 const SelectFilter = ({
@@ -12,7 +11,8 @@ const SelectFilter = ({
   filterValues,
   shouldSearch,
   displayLabelAsPlaceholder,
-  displayFilterCount
+  displayFilterCount,
+  elementTitle
 }) => {
   const filterValue = filterValues[prop] || '';
   const disabledOptions = [];
@@ -35,20 +35,23 @@ const SelectFilter = ({
   }
 
   return (
-    <Select
-      label={labelToUse}
-      value={filterValue}
-      id={prop}
-      data-testid={`filter-${prop}`}
-      options={options}
-      defaultTextValue={defaultTextValue}
-      onChange={({ value }) => {
-        let valueToUse = value;
-        if (value === defaultTextValue) valueToUse = '';
-        updateFilterValues({ [prop]: valueToUse }, shouldSearch);
-      }}
-      disabled={disabledOptions}
-    />
+    <>
+      {elementTitle && <div className="heading heading--section">{elementTitle}</div>}
+      <Select
+        label={labelToUse}
+        value={filterValue}
+        id={prop}
+        data-testid={`filter-${prop}`}
+        options={options}
+        defaultTextValue={defaultTextValue}
+        onChange={({ value }) => {
+          let valueToUse = value;
+          if (value === defaultTextValue) valueToUse = '';
+          updateFilterValues({ [prop]: valueToUse }, shouldSearch);
+        }}
+        disabled={disabledOptions}
+      />
+    </>
   );
 };
 
@@ -59,6 +62,8 @@ SelectFilter.propTypes = {
   updateFilterValues: PropTypes.func.isRequired,
   shouldSearch: PropTypes.bool,
   label: PropTypes.string,
+  elementTitle: PropTypes.string,
+
   displayLabelAsPlaceholder: PropTypes.bool,
   displayFilterCount: PropTypes.bool
 };
@@ -67,8 +72,9 @@ SelectFilter.defaultProps = {
   filterValues: {},
   shouldSearch: false,
   label: '',
+  elementTitle: '',
   displayLabelAsPlaceholder: false,
   displayFilterCount: false
 };
 
-export default withTitle(SelectFilter);
+export default SelectFilter;

package/src/components/SearchFilter/components/TextSearch.js

@@ -2,45 +2,49 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import Input from '@blaze-react/input';
 import { MdSearch } from 'react-icons/md';
-import { withTitle } from '../../../HOC';
 import { SEARCH_TERM } from '../constants';
 
-const TextSearch = ({ label, searchValue, updateFilterValues }) => (
-  <div className="search">
-    <div className="search__wrapper">
-      <div className="form-field form-field--input form-field--search">
-        <Input
-          id={SEARCH_TERM}
-          value={searchValue}
-          placeholder={label || 'Search'}
-          onChange={({ value: eValue }) => {
-            updateFilterValues({ [SEARCH_TERM]: eValue }, false);
-          }}
-        />
+const TextSearch = ({ label, searchValue, updateFilterValues, elementTitle }) => (
+  <>
+    {elementTitle && <div className="heading heading--section">{elementTitle}</div>}
+    <div className="search">
+      <div className="search__wrapper">
+        <div className="form-field form-field--input form-field--search">
+          <Input
+            id={SEARCH_TERM}
+            value={searchValue}
+            placeholder={label || 'Search'}
+            onChange={({ value: eValue }) => {
+              updateFilterValues({ [SEARCH_TERM]: eValue }, false);
+            }}
+          />
+        </div>
+        <button
+          type="button"
+          className="icon-button icon-button--search"
+          onClick={e => {
+            e.preventDefault();
+            updateFilterValues({ [SEARCH_TERM]: searchValue }, true);
+          }}>
+          <i>
+            <MdSearch />
+          </i>
+        </button>
       </div>
-      <button
-        type="button"
-        className="icon-button icon-button--search"
-        onClick={e => {
-          e.preventDefault();
-          updateFilterValues({ [SEARCH_TERM]: searchValue }, true);
-        }}>
-        <i>
-          <MdSearch />
-        </i>
-      </button>
     </div>
-  </div>
+  </>
 );
 
 TextSearch.propTypes = {
   searchValue: PropTypes.string.isRequired,
   updateFilterValues: PropTypes.func.isRequired,
+  elementTitle: PropTypes.string,
   label: PropTypes.string
 };
 
 TextSearch.defaultProps = {
+  elementTitle: '',
   label: ''
 };
 
-export default withTitle(TextSearch);
+export default TextSearch;

package/tests/unit/src/components/Card/__snapshots__/Card.test.js.snap

@@ -30,7 +30,7 @@ exports[`Card component should not render alternative headline if alternativePre
         >
           category-name
         </a>
-        <h2
+        <div
           class="card__title card__title--portrait "
         >
           <a
@@ -38,7 +38,7 @@ exports[`Card component should not render alternative headline if alternativePre
           >
             mock name
           </a>
-        </h2>
+        </div>
         <div
           class="card__details card__details--portrait"
         >
@@ -99,7 +99,7 @@ exports[`Card component should not render alternative headline if displayCategor
       <div
         class="card__content card__content--portrait"
       >
-        <h2
+        <div
           class="card__title card__title--portrait "
         >
           <a
@@ -107,7 +107,7 @@ exports[`Card component should not render alternative headline if displayCategor
           >
             mock name
           </a>
-        </h2>
+        </div>
         <div
           class="card__details card__details--portrait"
         >
@@ -174,7 +174,7 @@ exports[`Card component should not render preHeader if alternativeHeadline is no
         >
           category-name
         </a>
-        <h2
+        <div
           class="card__title card__title--portrait "
         >
           <a
@@ -182,7 +182,7 @@ exports[`Card component should not render preHeader if alternativeHeadline is no
           >
             mock name
           </a>
-        </h2>
+        </div>
         <div
           class="card__details card__details--portrait"
         >
@@ -248,7 +248,7 @@ exports[`Card component should render customPreheader and alternativeHeadline in
         >
           Pre header
         </div>
-        <h2
+        <div
           class="card__title card__title--portrait "
         >
           <a
@@ -256,7 +256,7 @@ exports[`Card component should render customPreheader and alternativeHeadline in
           >
             Alternative headline
           </a>
-        </h2>
+        </div>
         <div
           class="card__details card__details--portrait"
         >
@@ -323,7 +323,7 @@ exports[`Card component should render without throwing an error and match snapsh
         >
           category-name
         </a>
-        <h2
+        <div
           class="card__title card__title--portrait "
         >
           <a
@@ -331,7 +331,7 @@ exports[`Card component should render without throwing an error and match snapsh
           >
             mock name
           </a>
-        </h2>
+        </div>
         <div
           class="card__details card__details--portrait"
         >

package/tests/unit/src/components/Card/__snapshots__/CardContainer.test.js.snap

@@ -36,7 +36,7 @@ exports[`CardsContainer component should render with carousel if option is enabl
             >
               page
             </div>
-            <h2
+            <div
               class="card__title card__title--portrait "
             >
               <a
@@ -44,7 +44,7 @@ exports[`CardsContainer component should render with carousel if option is enabl
               >
                 Swan 78
               </a>
-            </h2>
+            </div>
           </div>
           <div
             class="card__child-content"
@@ -73,7 +73,7 @@ exports[`CardsContainer component should render with carousel if option is enabl
             >
               page
             </div>
-            <h2
+            <div
               class="card__title card__title--portrait "
             >
               <a
@@ -81,7 +81,7 @@ exports[`CardsContainer component should render with carousel if option is enabl
               >
                 Swan 98
               </a>
-            </h2>
+            </div>
           </div>
           <div
             class="card__child-content"
@@ -123,7 +123,7 @@ exports[`CardsContainer component should render without throwing error and match
           >
             page
           </div>
-          <h2
+          <div
             class="card__title card__title--portrait "
           >
             <a
@@ -131,7 +131,7 @@ exports[`CardsContainer component should render without throwing error and match
             >
               Swan 78
             </a>
-          </h2>
+          </div>
         </div>
         <div
           class="card__child-content"
@@ -160,7 +160,7 @@ exports[`CardsContainer component should render without throwing error and match
           >
             page
           </div>
-          <h2
+          <div
             class="card__title card__title--portrait "
           >
             <a
@@ -168,7 +168,7 @@ exports[`CardsContainer component should render without throwing error and match
             >
               Swan 98
             </a>
-          </h2>
+          </div>
         </div>
         <div
           class="card__child-content"

package/tests/unit/src/components/DataSummary/DataSummaryTypes/__snapshots__/ItemDetailsSummary.test.js.snap

@@ -13,12 +13,22 @@ exports[`ItemDetailsSummary component should render without throwing an error an
     <span
       class=""
     >
-      something
+      <span
+        class="item-details-summary-label"
+      >
+        first
+      </span>
+       something
     </span>
     <span
       class=""
     >
-      other thing
+      <span
+        class="item-details-summary-label"
+      >
+        second
+      </span>
+       other thing
     </span>
   </div>
 </DocumentFragment>
@@ -37,12 +47,22 @@ exports[`ItemDetailsSummary component should render without throwing an error if
     <span
       class=""
     >
-      something
+      <span
+        class="item-details-summary-label"
+      >
+        first
+      </span>
+       something
     </span>
     <span
       class=""
     >
-      other thing
+      <span
+        class="item-details-summary-label"
+      >
+        second
+      </span>
+       other thing
     </span>
   </div>
 </DocumentFragment>

package/tests/unit/src/components/List/components/Cards/__snapshots__/CardsRender.test.js.snap

@@ -25,11 +25,11 @@ exports[`CardsRender component should render based on listData received 1`] = `
             <div
               class="card__content card__content--portrait"
             >
-              <h2
+              <div
                 class="card__title card__title--portrait "
               >
                 item 1
-              </h2>
+              </div>
             </div>
           </div>
         </div>
@@ -46,11 +46,11 @@ exports[`CardsRender component should render based on listData received 1`] = `
             <div
               class="card__content card__content--portrait"
             >
-              <h2
+              <div
                 class="card__title card__title--portrait "
               >
                 item 1
-              </h2>
+              </div>
             </div>
           </div>
         </div>
@@ -67,11 +67,11 @@ exports[`CardsRender component should render based on listData received 1`] = `
             <div
               class="card__content card__content--portrait"
             >
-              <h2
+              <div
                 class="card__title card__title--portrait "
               >
                 item 1
-              </h2>
+              </div>
             </div>
           </div>
         </div>
@@ -100,11 +100,11 @@ exports[`CardsRender component should render without wrapper, when requested 1`]
         <div
           class="card__content card__content--portrait"
         >
-          <h2
+          <div
             class="card__title card__title--portrait "
           >
             item 1
-          </h2>
+          </div>
         </div>
       </div>
     </div>
@@ -121,11 +121,11 @@ exports[`CardsRender component should render without wrapper, when requested 1`]
         <div
           class="card__content card__content--portrait"
         >
-          <h2
+          <div
             class="card__title card__title--portrait "
           >
             item 1
-          </h2>
+          </div>
         </div>
       </div>
     </div>
@@ -142,11 +142,11 @@ exports[`CardsRender component should render without wrapper, when requested 1`]
         <div
           class="card__content card__content--portrait"
         >
-          <h2
+          <div
             class="card__title card__title--portrait "
           >
             item 1
-          </h2>
+          </div>
         </div>
       </div>
     </div>

package/tests/unit/src/components/List/components/helpers/check-if-should-render-banner.test.js

@@ -1,44 +1,75 @@
-import checkIfShouldRenderBanner from '../../../../../../../src/components/List/components/helpers/check-if-should-render-banner';
+import { checkIfShouldRenderBanner } from '../../../../../../../src/components/List/components/helpers/check-if-should-render-banner';
 
-describe('checkIfShouldRenderBanner helper function', () => {
-  const noBanner = checkIfShouldRenderBanner(1, {
-    interval: 2,
-    repeat: false,
-    hasBanner: false
-  });
-  const noInterval = checkIfShouldRenderBanner(1, {
-    interval: 2,
-    repeat: false,
-    hasBanner: false
-  });
-  const positionMatch = checkIfShouldRenderBanner(1, {
-    interval: 2,
-    repeat: false,
-    hasBanner: true
-  });
-
-  const repeatOffMatch = checkIfShouldRenderBanner(3, {
-    interval: 2,
-    repeat: false,
-    hasBanner: true
-  });
-  const repeatOnMatch = checkIfShouldRenderBanner(3, {
-    interval: 2,
-    repeat: true,
-    hasBanner: true
-  });
+const BANNER_MOCK = {
+  repeatEvery: 3,
+  startingPoint: 5,
+  maxRepetitions: 2
+};
 
+describe('checkIfShouldRenderBanner helper function', () => {
   it('should return false if no interval or hasBanner is false', () => {
+    const noBanner = checkIfShouldRenderBanner(1, {
+      interval: 2,
+      repeat: false,
+      hasBanner: false
+    });
+    const noInterval = checkIfShouldRenderBanner(1, {
+      interval: 2,
+      repeat: false,
+      hasBanner: false
+    });
     expect(noBanner).toBe(false);
     expect(noInterval).toBe(false);
   });
   it('should return true if interval matches position', () => {
+    const positionMatch = checkIfShouldRenderBanner(1, {
+      interval: 2,
+      repeat: false,
+      hasBanner: true
+    });
     expect(positionMatch).toBe(true);
   });
   it('should return false if repeat is false and position repeat mtaches', () => {
+    const repeatOffMatch = checkIfShouldRenderBanner(3, {
+      interval: 2,
+      repeat: false,
+      hasBanner: true
+    });
     expect(repeatOffMatch).toBe(false);
   });
   it('should return true if repeat is true and position repeat mtaches', () => {
+    const repeatOnMatch = checkIfShouldRenderBanner(3, {
+      interval: 2,
+      repeat: true,
+      hasBanner: true
+    });
     expect(repeatOnMatch).toBe(true);
   });
+
+  it('should return false if no banner is present', () => {
+    const noBanner = checkIfShouldRenderBanner(1);
+    expect(noBanner).toBe(false);
+  });
+
+  it('should return false if index is lower than startingPoint', () => {
+    const lowIndex = checkIfShouldRenderBanner(3, BANNER_MOCK);
+    expect(lowIndex).toBe(false);
+  });
+
+  it('should return true if index matches startingPoint', () => {
+    const startingPointMatch = checkIfShouldRenderBanner(4, BANNER_MOCK);
+    expect(startingPointMatch).toBe(true);
+  });
+
+  it('should return true if repeat point matches and max repetitions hasnt been reached', () => {
+    const repetitionMatch = checkIfShouldRenderBanner(7, BANNER_MOCK);
+    const finalRepetitionMatch = checkIfShouldRenderBanner(10, BANNER_MOCK);
+    expect(repetitionMatch).toBe(true);
+    expect(finalRepetitionMatch).toBe(false);
+  });
+
+  it('should return false if repeat point matches and max repetitions has been reached', () => {
+    const maxRepetitionReached = checkIfShouldRenderBanner(13, BANNER_MOCK);
+    expect(maxRepetitionReached).toBe(false);
+  });
 });