From 73b319ea9cd471277cf0c5100e557042d70be2f0 Mon Sep 17 00:00:00 2001 From: Vitalii Kiiko Date: Mon, 23 Dec 2024 09:44:42 +0100 Subject: [PATCH 01/20] - save progress; --- .../components/AppTopbar/index.js | 19 ++++++++++++++++--- 1 file changed, 16 insertions(+), 3 deletions(-) diff --git a/src/layouts/DefaultLayout/components/AppTopbar/index.js b/src/layouts/DefaultLayout/components/AppTopbar/index.js index af1e9a8..27c3a6b 100644 --- a/src/layouts/DefaultLayout/components/AppTopbar/index.js +++ b/src/layouts/DefaultLayout/components/AppTopbar/index.js @@ -1,4 +1,4 @@ -import React, { useRef } from 'react'; +import React, { useRef, useState } from 'react'; import { __ } from '@wordpress/i18n'; // components @@ -11,9 +11,11 @@ import { InputText } from 'primereact/inputtext'; import { Badge } from 'primereact/badge'; import { Button } from 'primereact/button'; import TopBarProfileMenu from '../../../../components/TopBarProfileMenu'; +import { Sidebar } from 'primereact/sidebar'; const AppTopbar = () => { const menuLeft = useRef(null); + const [notificationsVisible, setNotificationsVisible] = useState(false); const startContent = @@ -42,8 +44,19 @@ const AppTopbar = () => { return ( - + <> + + setNotificationsVisible(false)} fullScreen> +

Sidebar

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore + et dolore magna aliqua. + Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo + consequat. +

+ + ) } -export default AppTopbar; \ No newline at end of file +export default AppTopbar; From 143a92c9a1f32561e01f1f2ce3655bd389c12336 Mon Sep 17 00:00:00 2001 From: Vitalii Kiiko Date: Mon, 23 Dec 2024 15:47:15 +0100 Subject: [PATCH 02/20] - saving progress; --- .../components/AllUsersTable/index.js | 175 ++++++++++++++++++ src/pages/UserActivity/index.js | 86 +++++++++ .../Users/components/AllUsersTable/index.js | 23 ++- src/routes.js | 7 + 4 files changed, 282 insertions(+), 9 deletions(-) create mode 100644 src/pages/UserActivity/components/AllUsersTable/index.js create mode 100644 src/pages/UserActivity/index.js diff --git a/src/pages/UserActivity/components/AllUsersTable/index.js b/src/pages/UserActivity/components/AllUsersTable/index.js new file mode 100644 index 0000000..ae45a51 --- /dev/null +++ b/src/pages/UserActivity/components/AllUsersTable/index.js @@ -0,0 +1,175 @@ +import React, { useState, useEffect } from 'react'; +import { __ } from '@wordpress/i18n'; +import { uniq } from 'ramda'; +import copy from 'copy-to-clipboard'; + +// store +import { useStore, storeSet } from '../../../../store'; + +// tools +import getBandoSeverity from '../../../../helpers/getBandoSeverity'; +import getBandoLabel from '../../../../helpers/getBandoLabel'; +import getDateFromISOstring from '../../../../helpers/getDateFromISOstring'; + +// api +import UserService from '../../../../service/user-service'; + +// components +import { FilterMatchMode, FilterOperator } from 'primereact/api'; +import { DataTable } from 'primereact/datatable'; +import { Column } from 'primereact/column'; +import { Dropdown } from 'primereact/dropdown'; +import { Button } from 'primereact/button'; +import { Calendar } from 'primereact/calendar'; +import { Tag } from 'primereact/tag'; +import ProperBandoLabel from '../../../../components/ProperBandoLabel'; +import translationStrings from '../../../../translationStringsForComponents'; +import { Link } from 'react-router-dom'; + +const AllUsersTable = () => { + const users = useStore().main.users(); + const [filters, setFilters] = useState(null); + const [loading, setLoading] = useState(false); + const [statuses, setStatuses] = useState([]); + + useEffect(() => { + if (!loading) { + setLoading(true); + UserService.getUsers(getCallback, errGetCallbacks); + } + }, []); + + const getCallback = (data) => { + if (data.status === 'SUCCESS') { + storeSet.main.users(getFormattedData(data.data)); + setStatuses(uniq(data.data.map(o => o.status))) + initFilters(); + } + setLoading(false); + } + + const errGetCallbacks = () => { + setLoading(false); + } + + const getFormattedData = (data) => { + return data + .filter(o => ['ROLE_SUPER_ADMIN', 'ROLE_PRE_INSTRUCTOR', 'ROLE_INSTRUCTOR_MANAGER'].includes(o.role.roleType)); + }; + + const clearFilter = () => { + initFilters(); + }; + + const initFilters = () => { + setFilters({ + global: { value: null, matchMode: FilterMatchMode.CONTAINS }, + email: { + operator: FilterOperator.AND, + constraints: [{ value: null, matchMode: FilterMatchMode.STARTS_WITH }] + }, + lastLogin: { + operator: FilterOperator.AND, + constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }] + } + }); + }; + + const renderHeader = () => { + return ( +
+
+ ); + }; + + const dateLastAccessBodyTemplate = (rowData) => { + return getDateFromISOstring(rowData.lastLogin); + }; + + const dateFilterTemplate = (options) => { + return 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 roleEmailTemplate = (rowData) => { + return
+ {rowData.email} + +
; + }; + + const roleBodyTemplate = (rowData) => { + return rowData.role.roleName; + }; + + const statusBodyTemplate = (rowData) => { + return ; + }; + + const statusFilterTemplate = (options) => { + return options.filterCallback(e.value, options.index)} + itemTemplate={statusItemTemplate} placeholder={__('Scegli uno', 'gepafin')} + className="p-column-filter" + showClear/>; + }; + + const statusItemTemplate = (option) => { + return ; + }; + + const actionsBodyTemplate = (rowData) => { + return + - ; - }; - - const roleBodyTemplate = (rowData) => { - return rowData.role.roleName; - }; - - const statusBodyTemplate = (rowData) => { - return ; - }; - - const statusFilterTemplate = (options) => { - return options.filterCallback(e.value, options.index)} - itemTemplate={statusItemTemplate} placeholder={__('Scegli uno', 'gepafin')} - className="p-column-filter" - showClear/>; - }; - - const statusItemTemplate = (option) => { - return ; - }; - - const actionsBodyTemplate = (rowData) => { - return -