- added filter to users table;

- added auto reload of users table  on user added;

src/pages/Users/components/AllUsersTable/index.js

@@ -26,23 +26,25 @@ import ProperBandoLabel from '../../../../components/ProperBandoLabel';
 import translationStrings from '../../../../translationStringsForComponents';
 import { Link } from 'react-router-dom';
 
-const AllUsersTable = () => {
+const AllUsersTable = ({ updaterString = '' }) => {
     const users = useStore().main.users();
     const [filters, setFilters] = useState(null);
     const [loading, setLoading] = useState(false);
     const [statuses, setStatuses] = useState([]);
+    const [roles, setRoles] = useState([]);
 
     useEffect(() => {
         if (!loading) {
             setLoading(true);
             UserService.getUsers(getCallback, errGetCallbacks);
         }
-    }, []);
+    }, [updaterString]);
 
     const getCallback = (data) => {
         if (data.status === 'SUCCESS') {
             storeSet.main.users(getFormattedData(data.data));
-            setStatuses(uniq(data.data.map(o => o.status)))
+            setStatuses(uniq(data.data.map(o => o.status)));
+            setRoles(uniq(data.data.map(o => o.role.roleName)));
             initFilters();
         }
         setLoading(false);
@@ -56,7 +58,8 @@ const AllUsersTable = () => {
         return data
             .filter(o => [
                 'ROLE_SUPER_ADMIN', 'ROLE_PRE_INSTRUCTOR', 'ROLE_INSTRUCTOR_MANAGER', 'ROLE_CONFIDI'
-            ].includes(o.role.roleType));
+            ].includes(o.role.roleType))
+            .map(o => ({...o, roleName: o.role.roleName}));
     };
 
     const clearFilter = () => {
@@ -73,7 +76,8 @@ const AllUsersTable = () => {
             lastLogin: {
                 operator: FilterOperator.AND,
                 constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }]
-            }
+            },
+            roleName: { operator: FilterOperator.OR, constraints: [{ value: null, matchMode: FilterMatchMode.EQUALS }] },
         });
     };
 
@@ -116,6 +120,14 @@ const AllUsersTable = () => {
         return <ProperBandoLabel status={rowData.status}/>;
     };
 
+    const roleFilterTemplate = (options) => {
+        return <Dropdown value={options.value} options={roles}
+                         onChange={(e) => options.filterCallback(e.value, options.index)}
+                         placeholder={__('Scegli uno', 'gepafin')}
+                         className="p-column-filter"
+                         showClear/>;
+    };
+
     const statusFilterTemplate = (options) => {
         return <Dropdown value={options.value} options={statuses}
                          onChange={(e) => options.filterCallback(e.value, options.index)}
@@ -157,9 +169,14 @@ const AllUsersTable = () => {
                         field="email"
                         filterPlaceholder={__('Cerca per email', 'gepafin')}
                         style={{ minWidth: '10rem' }}/>
-                <Column body={roleBodyTemplate} header={__('Ruolo', 'gepafin')}
+                <Column body={roleBodyTemplate}
+                        filterField="roleName"
+                        filter
+                        filterElement={roleFilterTemplate}
+                        header={__('Ruolo', 'gepafin')}
                         style={{ minWidth: '8rem' }}/>
-                <Column field="status" header={__('Stato', 'gepafin')}
+                <Column field="status"
+                        header={__('Stato', 'gepafin')}
                         filterMenuStyle={{ width: '14rem' }}
                         style={{ width: '120px' }} body={statusBodyTemplate}
                         filterElement={statusFilterTemplate}/>