- added filter for the table of calls with pagination;

src/pages/Dashboard/components/LatestBandiTableAsync/index.js

@@ -1,5 +1,6 @@
 import React, { useEffect, useState, useCallback } from 'react';
 import { __ } from '@wordpress/i18n';
+import { FilterMatchMode } from 'primereact/api';
 
 import translationStrings from '../../../../translationStringsForComponents';
 
@@ -16,6 +17,7 @@ import { Dropdown } from 'primereact/dropdown';
 import { Tag } from 'primereact/tag';
 import getBandoLabel from '../../../../helpers/getBandoLabel';
 import getBandoSeverity from '../../../../helpers/getBandoSeverity';
+import { isEmpty, pathOr } from 'ramda';
 
 const LatestBandiTableAsync = () => {
     const [localAsyncRequest, setLocalAsyncRequest] = useState(false);
@@ -29,7 +31,7 @@ const LatestBandiTableAsync = () => {
         sortOrder: null,
         filters: {
             name: { value: '', matchMode: 'contains' },
-            status: { value: '', matchMode: 'contains' }
+            status: { value: '', matchMode: 'equals' }
         }
     });
     const statuses = ['PUBLISH'];
@@ -50,6 +52,13 @@ const LatestBandiTableAsync = () => {
             globalFilters: {
                 page: lazyState.page ? lazyState.page + 1 : 1,
                 limit: lazyState.rows,
+                filters: Object.keys(lazyState.filters).reduce((acc, cur) => {
+                    const value = pathOr('', ['filters', cur, 'value'], lazyState);
+                    if (!isEmpty(value)) {
+                        acc[cur] = lazyState.filters[cur];
+                    }
+                    return acc;
+                }, {}),
                 sortBy
             },
             status: statuses
@@ -57,32 +66,36 @@ const LatestBandiTableAsync = () => {
     }, [lazyState]);
 
     const onPage = (event) => {
-        console.log('onPage', event);
+        //console.log('onPage', event);
         setLazyState(event);
     };
 
     const onSort = (event) => {
-        console.log('onSort', event);
+        //console.log('onSort', event);
+        event['first'] = 0;
+        event['page'] = 0;
         setLazyState(event);
     };
 
     const onFilter = useCallback((event) => {
-        console.log('onFilter', event);
+        //console.log('onFilter', event);
         event['first'] = 0;
+        event['page'] = 0;
         setLazyState(event);
     }, [lazyState]);
 
-    const getCallback = (data) => {
-        if (data.status === 'SUCCESS') {
-            const { body, totalRecords, currentPage, totalPages, pageSize } = data.data;
+    const getCallback = (resp) => {
+        if (resp.status === 'SUCCESS') {
+            const { body, totalRecords,
+                //currentPage, totalPages, pageSize
+            } = resp.data;
             setTotalRecordsNum(totalRecords);
-            //const newItems = body.filter(o => o.status === 'PUBLISH');
             setItems(getFormattedBandiData(body));
         }
         setLocalAsyncRequest(false);
     }
 
-    const errGetCallbacks = (data) => {
+    const errGetCallbacks = () => {
         setLocalAsyncRequest(false);
     }
 
@@ -142,22 +155,21 @@ const LatestBandiTableAsync = () => {
     };
 
     useEffect(() => {
-        console.log('lazyState', lazyState)
-        /*const paginationQuery = getPaginationQuery();
-        console.log('paginationQuery', paginationQuery)*/
+        //console.log('lazyState', lazyState)
         setLocalAsyncRequest(true);
         const paginationQuery = getPaginationQuery();
-        console.log('paginationQuery', paginationQuery)
+        //console.log('paginationQuery', paginationQuery)
+
         BandoService.getBandiPaginated(paginationQuery, getCallback, errGetCallbacks);
     }, [lazyState]);
 
-    useEffect(() => {
+    /*useEffect(() => {
         if (!localAsyncRequest) {
             setLocalAsyncRequest(true);
             const paginationQuery = getPaginationQuery();
             BandoService.getBandiPaginated(paginationQuery, getCallback, errGetCallbacks);
         }
-    }, []);
+    }, []);*/
 
     return (
         <div className="appPageSection__table">
@@ -170,7 +182,8 @@ const LatestBandiTableAsync = () => {
                 emptyMessage={translationStrings.emptyMessage}>
                 <Column field="name"
                         sortable
-                        filterField="name" filter filterMatchModeOptions={['contains']}
+                        filterField="name" filter
+                        filterMatchModeOptions={[{ label: 'Contiene', value: FilterMatchMode.CONTAINS }]}
                         header={__('Nome Bando', 'gepafin')}
                         style={{ minWidth: '8rem' }}/>
                 <Column header={__('Data Pubblicazione', 'gepafin')}
@@ -180,7 +193,8 @@ const LatestBandiTableAsync = () => {
                         style={{ minWidth: '8rem' }}
                         body={dateEndBodyTemplate}/>
                 <Column field="status"
-                        filterElement={statusFilterTemplate} filter filterMatchModeOptions={['contains']}
+                        filterElement={statusFilterTemplate} filter
+                        filterMatchModeOptions={[{ label: 'Uguale a', value: FilterMatchMode.EQUALS }]}
                         header={__('Stato', 'gepafin')}
                         style={{ minWidth: '7rem' }}
                         body={statusBodyTemplate} />