feat: added data-element for service-link pagination (#387)

* feat: added data-element for service-link pagination * chore: updated release.md
RedTurtle · Nov 3, 2023 · 3ef75a5 · 3ef75a5
1 parent b735f20
commit 3ef75a5
Show file tree

Hide file tree

Showing 4 changed files with 33 additions and 3 deletions.
diff --git a/RELEASE.md b/RELEASE.md
@@ -43,6 +43,10 @@
 
 ## Versione 8.8.1 (03/11/2023)
 
+### Novità
+
+- Aggiunto data-element al paginatore per validatore AGID per i blocchi Elenco per i quali viene impostata l'opzione service-link.
+
 ### Fix
 
 - Nei template dei feed RSS ora viene mostrata la sorgente se presente.

diff --git a/src/components/ItaliaTheme/Pagination/Pagination.jsx b/src/components/ItaliaTheme/Pagination/Pagination.jsx
@@ -43,6 +43,9 @@ class Pagination extends Component {
     /** Total number of pages. */
     totalPages: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
       .isRequired,
+
+    /** Lighthouse ID to set Agid data-element on pager link for CT Servizio*/
+    isServiceLink: PropTypes.bool,
   };
 
   static defaultProps = {
@@ -69,8 +72,13 @@ class Pagination extends Component {
   };
 
   render() {
-    const { boundaryRange, ellipsisItem, siblingRange, totalPages } =
-      this.props;
+    const {
+      boundaryRange,
+      ellipsisItem,
+      siblingRange,
+      totalPages,
+      isServiceLink,
+    } = this.props;
     const { activePage } = this.state;
 
     const items = createPaginationItems({
@@ -96,6 +104,7 @@ class Pagination extends Component {
                   onClick={this.handleItemClick}
                   type={type}
                   ellipsisItem={ellipsisItem}
+                  isServiceLink={isServiceLink}
                 >
                   {value}
                 </PaginationItem>

diff --git a/src/components/ItaliaTheme/Pagination/PaginationItem.jsx b/src/components/ItaliaTheme/Pagination/PaginationItem.jsx
@@ -46,6 +46,9 @@ class PaginationItem extends Component {
       'nextItem',
       'lastItem',
     ]),
+
+    /** Lighthouse ID to set Agid data-element on pager link for CT Servizio*/
+    isServiceLink: PropTypes.bool,
   };
 
   handleClick = (e) => {
@@ -59,7 +62,14 @@ class PaginationItem extends Component {
   };
 
   render() {
-    const { active, type, children, intl, ellipsisItem } = this.props;
+    const {
+      active,
+      type,
+      children,
+      intl,
+      ellipsisItem,
+      isServiceLink,
+    } = this.props;
     const disabled = this.props.disabled || type === 'ellipsisItem';
     return (
       <PagerItem disabled={disabled}>
@@ -68,6 +78,7 @@ class PaginationItem extends Component {
           onClick={this.handleClick}
           onKeyDown={this.handleKeyDown}
           aria-current={active ? 'page' : null}
+          data-element={isServiceLink ? 'pager-link' : null}
         >
           {type === 'prevItem' && (
             <>

diff --git a/src/customizations/volto/components/manage/Blocks/Listing/ListingBody.jsx b/src/customizations/volto/components/manage/Blocks/Listing/ListingBody.jsx
@@ -93,6 +93,11 @@ const ListingBody = React.memo(
       // Also need to purge title from searchblock schema, it's the name of the listing template used
       const listingBodyProps =
         variation?.['@type'] !== 'search' ? data : { ...variation, title: '' };
+
+      // Need to know if data-element is "service-link"
+      // to add data-element="pager-link" to pagination links
+      const isServiceLink = data.id_lighthouse === 'service-link';
+
       return (
         <div className="public-ui">
           {loadingQuery && (
@@ -123,6 +128,7 @@ const ListingBody = React.memo(
                     activePage={currentPage}
                     totalPages={totalPages}
                     onPageChange={onPaginationChange}
+                    isServiceLink={isServiceLink}
                   />
                 </div>
               )}