From 3dae98a19e14691b1491e04b63eb17dc3422a08d Mon Sep 17 00:00:00 2001
From: Vitalii Kiiko <mr.psiho@gmail.com>
Date: Mon, 21 Oct 2024 11:14:29 +0200
Subject: [PATCH] - re done login con uuid; - re done reset password con uuid;
 - re done user management con uuid;

---
 .env                                          |   2 +-
 environments/dev/dev.env                      |   2 +-
 environments/prod/prod.env                    |   2 +-
 src/helpers/getBandoLabel.js                  |   3 +
 src/helpers/getBandoSeverity.js               |   3 +
 .../components/AppSidebar/index.js            |   3 +-
 src/pages/LoginAdmin/index.js                 |  11 +-
 src/pages/ResetPassword/index.js              |  25 +++-
 .../Users/components/AllUsersTable/index.js   | 108 +++++++++---------
 src/pages/Users/index.js                      |  76 +++++++++---
 src/service/user-service.js                   |   8 ++
 11 files changed, 163 insertions(+), 80 deletions(-)

diff --git a/.env b/.env
index 10d2a9b..0b1a428 100644
--- a/.env
+++ b/.env
@@ -3,4 +3,4 @@ REACT_APP_API_EXECUTION_ADDRESS=https://api-dev-gepafin.memento.credit/v1
 REACT_APP_API_ADDRESS=https://api-dev-gepafin.memento.credit
 REACT_APP_LOGO_FILENAME=gepafin-logo.svg
 REACT_APP_FAVICON_FILENAME=gepafin-favicon.ico
-REACT_APP_HUB_ID=1
\ No newline at end of file
+REACT_APP_HUB_ID=p4lk3bcx1RStqTaIVVbXs
\ No newline at end of file
diff --git a/environments/dev/dev.env b/environments/dev/dev.env
index 10d2a9b..0b1a428 100644
--- a/environments/dev/dev.env
+++ b/environments/dev/dev.env
@@ -3,4 +3,4 @@ REACT_APP_API_EXECUTION_ADDRESS=https://api-dev-gepafin.memento.credit/v1
 REACT_APP_API_ADDRESS=https://api-dev-gepafin.memento.credit
 REACT_APP_LOGO_FILENAME=gepafin-logo.svg
 REACT_APP_FAVICON_FILENAME=gepafin-favicon.ico
-REACT_APP_HUB_ID=1
\ No newline at end of file
+REACT_APP_HUB_ID=p4lk3bcx1RStqTaIVVbXs
\ No newline at end of file
diff --git a/environments/prod/prod.env b/environments/prod/prod.env
index 53e9db7..6e25d7d 100644
--- a/environments/prod/prod.env
+++ b/environments/prod/prod.env
@@ -3,4 +3,4 @@ REACT_APP_API_EXECUTION_ADDRESS=https://bandi-api.gepafin.it/v1
 REACT_APP_API_ADDRESS=https://bandi-api.gepafin.it
 REACT_APP_LOGO_FILENAME=gepafin-logo.svg
 REACT_APP_FAVICON_FILENAME=gepafin-favicon.ico
-REACT_APP_HUB_ID=1
\ No newline at end of file
+REACT_APP_HUB_ID=p4lk3bcx1RStqTaIVVbXs
\ No newline at end of file
diff --git a/src/helpers/getBandoLabel.js b/src/helpers/getBandoLabel.js
index 55c0c08..d0b76cd 100644
--- a/src/helpers/getBandoLabel.js
+++ b/src/helpers/getBandoLabel.js
@@ -5,6 +5,9 @@ const getBandoLabel = (status) => {
         case 'SUBMIT':
             return __('Inviato', 'gepafin');
 
+        case 'ACTIVE':
+            return __('Attivo', 'gepafin');
+
         case 'PUBLISH':
             return __('Pubblicato', 'gepafin');
 
diff --git a/src/helpers/getBandoSeverity.js b/src/helpers/getBandoSeverity.js
index 89263be..45340b3 100644
--- a/src/helpers/getBandoSeverity.js
+++ b/src/helpers/getBandoSeverity.js
@@ -5,6 +5,9 @@ const getBandoSeverity = (status) => {
         case 'SUBMIT':
             return 'success';
 
+        case 'ACTIVE':
+            return 'success';
+
         case 'PUBLISH':
             return 'success';
 
diff --git a/src/layouts/DefaultLayout/components/AppSidebar/index.js b/src/layouts/DefaultLayout/components/AppSidebar/index.js
index 61a4484..2f36be7 100644
--- a/src/layouts/DefaultLayout/components/AppSidebar/index.js
+++ b/src/layouts/DefaultLayout/components/AppSidebar/index.js
@@ -45,8 +45,7 @@ const AppSidebar = () => {
             icon: 'pi pi-users',
             href: '/utenti',
             id: 5,
-            enable: false
-            //enable: intersection(permissions, ['VIEW_USERS', 'MANAGE_USERS']).length
+            enable: intersection(permissions, ['VIEW_USERS', 'MANAGE_USERS']).length
         },
         {
             label: __('Configurazione', 'gepafin'),
diff --git a/src/pages/LoginAdmin/index.js b/src/pages/LoginAdmin/index.js
index 8f76524..0fb1e3d 100644
--- a/src/pages/LoginAdmin/index.js
+++ b/src/pages/LoginAdmin/index.js
@@ -17,6 +17,8 @@ import LogoIcon from '../../icons/LogoIcon';
 import { Button } from 'primereact/button';
 import { Messages } from 'primereact/messages';
 
+const APP_HUB_ID = process.env.REACT_APP_HUB_ID;
+
 const LoginAdmin = () => {
     const navigate = useNavigate();
     const token = useStore().main.token();
@@ -28,11 +30,16 @@ const LoginAdmin = () => {
         formState: { errors },
     } = useForm({ mode: 'onChange' });
 
+    const gotToResetPassword = () => {
+        navigate('/reset-password');
+    }
+
     const onSubmit = (formData) => {
         errorMsgs.current.clear();
         setLoading(true);
         const request = {
             ...formData,
+            hubUuid: APP_HUB_ID,
             rememberMe: true
         }
 
@@ -64,10 +71,6 @@ const LoginAdmin = () => {
         setLoading(false);
     }
 
-    const gotToResetPassword = () => {
-        navigate('/reset-password');
-    }
-
     useEffect(() => {
         if (!isEmpty(token)) {
             setLoading(true);
diff --git a/src/pages/ResetPassword/index.js b/src/pages/ResetPassword/index.js
index def5e03..7052b41 100644
--- a/src/pages/ResetPassword/index.js
+++ b/src/pages/ResetPassword/index.js
@@ -3,6 +3,7 @@ import { __, sprintf } from '@wordpress/i18n';
 import { useForm } from 'react-hook-form';
 import { classNames } from 'primereact/utils';
 import { isEmpty } from 'ramda';
+import { useNavigate } from 'react-router-dom';
 
 // tools
 import AuthenticationService from '../../service/authentication-service';
@@ -16,7 +17,10 @@ import LogoIcon from '../../icons/LogoIcon';
 import { Button } from 'primereact/button';
 import { Messages } from 'primereact/messages';
 
+const APP_HUB_ID = process.env.REACT_APP_HUB_ID;
+
 const ResetPassword = () => {
+    const navigate = useNavigate();
     const token = useStore().main.token();
     const [loading, setLoading] = useState(false);
     const [resetPassToken, setResetPassToken] = useState('');
@@ -30,14 +34,23 @@ const ResetPassword = () => {
         setValue
     } = useForm({ mode: 'onChange' });
 
+    const gotToLoginAdmin = () => {
+        navigate('/loginadmin');
+    }
+
     const onSubmit = (formData) => {
         errorMsgs.current.clear();
         setLoading(true);
         const request = {
-            ...formData
+            ...formData,
+            hubUuid: APP_HUB_ID
         }
 
-        AuthenticationService.forgotPassword(request, getCallback, errCallback);
+        if (request.token && !isEmpty(request.token)) {
+            AuthenticationService.resetPassword(request, getCallback, errCallback);
+        } else {
+            AuthenticationService.forgotPassword(request, getCallback, errCallback);
+        }
     };
 
     const getCallback = (data) => {
@@ -59,7 +72,7 @@ const ResetPassword = () => {
         errorMsgs.current.show([
             {
                 sticky: true, severity: 'error', summary: '',
-                detail: sprintf(__('%s', 'gepafin'), err),
+                detail: sprintf(__('%s', 'gepafin'), err.message),
                 closable: true
             }
         ]);
@@ -104,7 +117,7 @@ const ResetPassword = () => {
                         ? <input
                             type="hidden"
                             name="token"
-                            {...register('test', {
+                            {...register('token', {
                                 required: true
                             })}
                         /> : null}
@@ -144,6 +157,10 @@ const ResetPassword = () => {
                     <Button
                         label={__('Invia', 'gepafin')}
                         disabled={loading}/>
+
+                    <Button
+                        label={__('Accedi', 'gepafin')}
+                        link onClick={gotToLoginAdmin}/>
                 </form>
             </div>
         </div>
diff --git a/src/pages/Users/components/AllUsersTable/index.js b/src/pages/Users/components/AllUsersTable/index.js
index b0972df..0269fa3 100644
--- a/src/pages/Users/components/AllUsersTable/index.js
+++ b/src/pages/Users/components/AllUsersTable/index.js
@@ -1,4 +1,4 @@
-import React, { useState, useEffect} from 'react';
+import React, { useState, useEffect } from 'react';
 import { __ } from '@wordpress/i18n';
 import { is, uniq } from 'ramda';
 
@@ -26,6 +26,7 @@ import { Calendar } from 'primereact/calendar';
 import { Tag } from 'primereact/tag';
 import ProperBandoLabel from '../../../../components/ProperBandoLabel';
 import { Link } from 'react-router-dom';
+import UserService from '../../../../service/user-service';
 
 
 const AllUsersTable = () => {
@@ -36,48 +37,27 @@ const AllUsersTable = () => {
     const [statuses, setStatuses] = useState([]);
 
     useEffect(() => {
-        storeSet.main.setAsyncRequest();
-        const sample = [
-            {
-                id: 11,
-                name: 'Mario Rossi',
-                email: 'mario.rossi@example.com',
-                role: 'Beneficiario',
-                status: 'active',
-                last_access: '2024-08-01 10:30'
-            },
-            {
-                id: 12,
-                name: 'Mario Rossi2',
-                email: 'mario.rossi@example.com',
-                role: 'Beneficiario',
-                status: 'active',
-                last_access: '2024-08-01 10:30'
-            }
-        ];
-        setItems(sample);
-        //BandoService.getBandi(getCallback, errGetCallbacks);
+        setLoading(true);
+        UserService.getUsers(getCallback, errGetCallbacks);
     }, []);
 
-    /*const getCallback = (data) => {
+    const getCallback = (data) => {
         if (data.status === 'SUCCESS') {
-            setItems(getFormattedBandiData(data.data));
+            setItems(getFormattedData(data.data));
             setStatuses(uniq(data.data.map(o => o.status)))
             initFilters();
         }
-        storeSet.main.unsetAsyncRequest();
+        setLoading(false);
     }
 
     const errGetCallbacks = (data) => {
-        console.log('errGetCallbacks', data)
+        setLoading(false);
         storeSet.main.unsetAsyncRequest();
-    }*/
+    }
 
     const getFormattedData = (data) => {
-        return data.map((d) => {
-            d.last_access = is(String, d.last_access) ? new Date(d.last_access) : (d.last_access ? d.last_access : '');
-            return d;
-        });
+        return data
+            .filter(o => ['ROLE_SUPER_ADMIN', 'ROLE_PRE_INSTRUCTOR'].includes(o.role.roleType));
     };
 
     const clearFilter = () => {
@@ -97,8 +77,14 @@ const AllUsersTable = () => {
     const initFilters = () => {
         setFilters({
             global: { value: null, matchMode: FilterMatchMode.CONTAINS },
-            name: { operator: FilterOperator.AND, constraints: [{ value: null, matchMode: FilterMatchMode.STARTS_WITH }] },
-            last_access: { operator: FilterOperator.AND, constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }] },
+            name: {
+                operator: FilterOperator.AND,
+                constraints: [{ value: null, matchMode: FilterMatchMode.STARTS_WITH }]
+            },
+            lastLogin: {
+                operator: FilterOperator.AND,
+                constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }]
+            },
             status: { operator: FilterOperator.OR, constraints: [{ value: null, matchMode: FilterMatchMode.EQUALS }] },
         });
         setGlobalFilterValue('');
@@ -107,21 +93,32 @@ const AllUsersTable = () => {
     const renderHeader = () => {
         return (
             <div className="appTableHeader">
-                <Button type="button" icon="pi pi-filter-slash" label={__('Pulisci', 'gepafin')} outlined onClick={clearFilter} />
+                <Button type="button" icon="pi pi-filter-slash" label={__('Pulisci', 'gepafin')} outlined
+                        onClick={clearFilter}/>
                 <IconField iconPosition="left">
-                    <InputIcon className="pi pi-search" />
-                    <InputText value={globalFilterValue} onChange={onGlobalFilterChange} placeholder={__('Cerca', 'gepafin')} />
+                    <InputIcon className="pi pi-search"/>
+                    <InputText value={globalFilterValue} onChange={onGlobalFilterChange}
+                               placeholder={__('Cerca', 'gepafin')}/>
                 </IconField>
             </div>
         );
     };
 
     const dateLastAccessBodyTemplate = (rowData) => {
-        return getDateFromISOstring(rowData.last_access);
+        return getDateFromISOstring(rowData.lastLogin);
     };
 
     const dateFilterTemplate = (options) => {
-        return <Calendar value={options.value} onChange={(e) => options.filterCallback(e.value, options.index)} dateFormat="mm/dd/yy" placeholder="mm/dd/yyyy" mask="99/99/9999" />;
+        return <Calendar value={options.value} onChange={(e) => options.filterCallback(e.value, options.index)}
+                         dateFormat="mm/dd/yy" placeholder="mm/dd/yyyy" mask="99/99/9999"/>;
+    };
+
+    const nameBodyTemplate = (rowData) => {
+        return `${rowData.firstName} ${rowData.lastName}`;
+    };
+
+    const roleBodyTemplate = (rowData) => {
+        return rowData.role.roleName;
     };
 
     const statusBodyTemplate = (rowData) => {
@@ -129,22 +126,26 @@ const AllUsersTable = () => {
     };
 
     const statusFilterTemplate = (options) => {
-        return <Dropdown value={options.value} options={statuses} onChange={(e) => options.filterCallback(e.value, options.index)} itemTemplate={statusItemTemplate} placeholder="Select One" className="p-column-filter" showClear />;
+        return <Dropdown value={options.value} options={statuses}
+                         onChange={(e) => options.filterCallback(e.value, options.index)}
+                         itemTemplate={statusItemTemplate} placeholder={__('Scegli uno', 'gepafin')} className="p-column-filter"
+                         showClear/>;
     };
 
     const statusItemTemplate = (option) => {
-        return <Tag value={getBandoLabel(option)} severity={getBandoSeverity(option)} />;
+        return <Tag value={getBandoLabel(option)} severity={getBandoSeverity(option)}/>;
     };
 
     const actionsBodyTemplate = (rowData) => {
-        return <Link to={`/utenti/${rowData.id}`}>
-            <Button severity="info" label={__('Modifica', 'gepafin')} icon="pi pi-pencil" size="small" iconPos="right" />
-        </Link>
+        /*return <Link to={`/utenti/${rowData.id}`}>
+            <Button severity="info" label={__('Modifica', 'gepafin')} icon="pi pi-pencil" size="small" iconPos="right"/>
+        </Link>*/
+        return null;
     }
 
     const header = renderHeader();
 
-    return(
+    return (
         <div className="appPageSection__table">
             <DataTable value={items} paginator showGridlines rows={10} loading={loading} dataKey="id"
                        filters={filters}
@@ -152,16 +153,21 @@ const AllUsersTable = () => {
                        header={header}
                        emptyMessage={__('Nessun dato disponibile', 'gepafin')}
                        onFilter={(e) => setFilters(e.filters)}>
-                <Column field="name" header={__('Nome utente', 'gepafin')} filter filterPlaceholder="Search by name"
+                <Column body={nameBodyTemplate}
+                        header={__('Nome utente', 'gepafin')}
+                        filter filterPlaceholder={__('Cerca per nome', 'gepafin')}
                         style={{ minWidth: '12rem' }}/>
-                <Column field="email" header={__('Email', 'gepafin')} filter filterPlaceholder="Search by email"
+                <Column field="email" header={__('Email', 'gepafin')}
+                        filter filterPlaceholder={__('Cerca per email', 'gepafin')}
                         style={{ minWidth: '12rem' }}/>
-                <Column field="role" header={__('Ruolo', 'gepafin')}
+                <Column body={roleBodyTemplate} header={__('Ruolo', 'gepafin')}
                         style={{ minWidth: '12rem' }}/>
-                <Column field="status" header={__('Stato', 'gepafin')} filterMenuStyle={{ width: '14rem' }}
-                        style={{ width: '120px' }} body={statusBodyTemplate} filter
-                        filterElement={statusFilterTemplate}/>
-                <Column header={__('Ultimo accesso', 'gepafin')} filterField="last_access" dataType="date"
+                <Column field="status" header={__('Stato', 'gepafin')}
+                        filterMenuStyle={{ width: '14rem' }}
+                        style={{ width: '120px' }} body={statusBodyTemplate}
+                        filter filterElement={statusFilterTemplate}/>
+                <Column header={__('Ultimo accesso', 'gepafin')}
+                        filterField="lastLogin" dataType="date"
                         style={{ minWidth: '10rem' }}
                         body={dateLastAccessBodyTemplate} filter filterElement={dateFilterTemplate}/>
                 <Column header={__('Azioni', 'gepafin')}
diff --git a/src/pages/Users/index.js b/src/pages/Users/index.js
index 4bd7509..d4235d0 100644
--- a/src/pages/Users/index.js
+++ b/src/pages/Users/index.js
@@ -1,6 +1,16 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, useRef } from 'react';
 import { __ } from '@wordpress/i18n';
 import { isEmpty, isNil } from 'ramda';
+import { klona } from 'klona';
+
+// store
+import { storeSet } from '../../store';
+
+// service
+import UserService from '../../service/user-service';
+
+// tools
+import set404FromErrorResponse from '../../helpers/set404FromErrorResponse';
 
 // components
 import AllUsersTable from './components/AllUsersTable';
@@ -8,13 +18,13 @@ import { Button } from 'primereact/button';
 import { InputText } from 'primereact/inputtext';
 import { Dropdown } from 'primereact/dropdown';
 import { Dialog } from 'primereact/dialog';
-import UserService from '../../service/user-service';
-import set404FromErrorResponse from '../../helpers/set404FromErrorResponse';
-import { storeSet } from '../../store';
-import { klona } from 'klona';
 import { classNames } from 'primereact/utils';
+import { Toast } from 'primereact/toast';
+
+const APP_HUB_ID = process.env.REACT_APP_HUB_ID;
 
 const Users = () => {
+    const [loading, setLoading] = useState(false);
     const [isVisibleEditDialog, setIsVisibleEditDialog] = useState(false);
     const [newUserData, setNewUserData] = useState({
         firstName: '',
@@ -24,6 +34,7 @@ const Users = () => {
         role: ''
     });
     const [roles, setRoles] = useState([]);
+    const toast = useRef(null);
 
     const onCreateNewUser = () => {
         setIsVisibleEditDialog(true);
@@ -45,7 +56,32 @@ const Users = () => {
     }
 
     const saveEditDialog = () => {
+        setLoading(true);
+        const body = {
+            ...newUserData,
+            hubUuid: APP_HUB_ID
+        }
 
+        UserService.createUser(body, createUserCallback, errCreateUserCallback);
+    }
+
+    const createUserCallback = (data) => {
+        if (data.status === 'SUCCESS') {
+
+        }
+        setLoading(false);
+    }
+
+    const errCreateUserCallback = (data) => {
+        setLoading(false);
+        if (toast.current) {
+            toast.current.show({
+                severity: 'error',
+                summary: '',
+                detail: data.message
+            });
+        }
+        set404FromErrorResponse(data);
     }
 
     const onChangeEditItem = (value, key) => {
@@ -59,17 +95,19 @@ const Users = () => {
             <Button type="button" label={__('Anulla', 'gepafin')} onClick={hideEditDialog} outlined/>
             <Button
                 type="button"
-                disabled={isEmpty(newUserData)}
+                disabled={isEmpty(newUserData) || loading}
                 label={__('Salva', 'gepafin')} onClick={saveEditDialog}/>
         </div>
     }
 
     const getRolesCallback = (data) => {
         if (data.status === 'SUCCESS') {
-            const roles = data.data.map(o => ({
-                name: o.roleName,
-                value: o.id
-            }));
+            const roles = data.data
+                .filter(o => ['ROLE_SUPER_ADMIN', 'ROLE_PRE_INSTRUCTOR'].includes(o.roleType))
+                .map(o => ({
+                    name: o.roleName,
+                    value: o.id
+                }));
             setRoles(roles)
         }
         storeSet.main.unsetAsyncRequest();
@@ -86,13 +124,14 @@ const Users = () => {
         }
     }, [isVisibleEditDialog]);
 
-    return(
+    return (
         <div className="appPage">
             <div className="appPage__pageHeader">
                 <h1>{__('Gestione utenti', 'gepafin')}</h1>
             </div>
 
             <div className="appPage__spacer"></div>
+            <Toast ref={toast} />
 
             <div className="appPageSection">
                 <div className="appPageSection__actions">
@@ -113,13 +152,15 @@ const Users = () => {
                     <div className="appPage__spacer"></div>
                     <div className="appForm__cols">
                         <div className="appForm__field">
-                            <label className={classNames({ 'p-error': isEmpty(newUserData.firstName) || isNil(newUserData.firstName) })}>{__('Nome', 'gepafin')}*</label>
+                            <label
+                                className={classNames({ 'p-error': isEmpty(newUserData.firstName) || isNil(newUserData.firstName) })}>{__('Nome', 'gepafin')}*</label>
                             <InputText value={newUserData.firstName}
                                        invalid={isEmpty(newUserData.firstName) || isNil(newUserData.firstName)}
                                        onChange={(e) => onChangeEditItem(e.target.value, 'firstName')}/>
                         </div>
                         <div className="appForm__field">
-                            <label className={classNames({ 'p-error': isEmpty(newUserData.lastName) || isNil(newUserData.lastName) })}>{__('Cognome', 'gepafin')}*</label>
+                            <label
+                                className={classNames({ 'p-error': isEmpty(newUserData.lastName) || isNil(newUserData.lastName) })}>{__('Cognome', 'gepafin')}*</label>
                             <InputText value={newUserData.lastName}
                                        invalid={isEmpty(newUserData.lastName) || isNil(newUserData.lastName)}
                                        onChange={(e) => onChangeEditItem(e.target.value, 'lastName')}/>
@@ -127,20 +168,23 @@ const Users = () => {
                     </div>
                     <div className="appForm__cols">
                         <div className="appForm__field">
-                            <label className={classNames({ 'p-error': isEmpty(newUserData.email) || isNil(newUserData.email) })}>{__('Email', 'gepafin')}*</label>
+                            <label
+                                className={classNames({ 'p-error': isEmpty(newUserData.email) || isNil(newUserData.email) })}>{__('Email', 'gepafin')}*</label>
                             <InputText value={newUserData.email}
                                        invalid={isEmpty(newUserData.email) || isNil(newUserData.email)}
                                        onChange={(e) => onChangeEditItem(e.target.value, 'email')}/>
                         </div>
                         <div className="appForm__field">
-                            <label className={classNames({ 'p-error': isEmpty(newUserData.phoneNumber) || isNil(newUserData.phoneNumber) })}>{__('Telefono', 'gepafin')}</label>
+                            <label
+                                className={classNames({ 'p-error': isEmpty(newUserData.phoneNumber) || isNil(newUserData.phoneNumber) })}>{__('Telefono', 'gepafin')}</label>
                             <InputText value={newUserData.phoneNumber}
                                        invalid={isEmpty(newUserData.phoneNumber) || isNil(newUserData.phoneNumber)}
                                        onChange={(e) => onChangeEditItem(e.target.value, 'phoneNumber')}/>
                         </div>
                     </div>
                     <div className="appForm__field">
-                        <label className={classNames({ 'p-error': isEmpty(newUserData.role) || isNil(newUserData.role) })}>{__('Ruolo', 'gepafin')}</label>
+                        <label
+                            className={classNames({ 'p-error': isEmpty(newUserData.role) || isNil(newUserData.role) })}>{__('Ruolo', 'gepafin')}</label>
                         <Dropdown
                             value={newUserData.role}
                             invalid={isEmpty(newUserData.role) || isNil(newUserData.role)}
diff --git a/src/service/user-service.js b/src/service/user-service.js
index c2c5f3b..8bf6f43 100644
--- a/src/service/user-service.js
+++ b/src/service/user-service.js
@@ -4,10 +4,18 @@ const API_BASE_URL = process.env.REACT_APP_API_EXECUTION_ADDRESS;
 
 export default class UserService {
 
+    static getUsers = (callback, errCallback, queryParams) => {
+        NetworkService.get(`${API_BASE_URL}/user`, callback, errCallback, queryParams);
+    };
+
     static updateUser = (id, body, callback, errCallback) => {
         NetworkService.put(`${API_BASE_URL}/user/${id}`, body, callback, errCallback);
     };
 
+    static createUser = (body, callback, errCallback) => {
+        NetworkService.post(`${API_BASE_URL}/user`, body, callback, errCallback);
+    };
+
     static getRoles = (callback, errCallback) => {
         NetworkService.get(`${API_BASE_URL}/role`, callback, errCallback);
     };