@deix/rossini-identity-management 0.1.0 → 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (50) hide show
  1. package/lib/app/[locale]/groups/{page.js → page.jsx} +1 -1
  2. package/lib/app/[locale]/{layout.js → layout.jsx} +4 -3
  3. package/lib/app/[locale]/users/{page.js → page.jsx} +1 -1
  4. package/lib/app/{layout.js → layout.jsx} +7 -3
  5. package/lib/components/AddItemDialog.jsx +50 -0
  6. package/lib/components/DeleteConfirmationDialog.jsx +44 -0
  7. package/lib/components/SearchField.jsx +18 -0
  8. package/lib/components/groups/CreateGroupDialog.d.ts.map +1 -1
  9. package/lib/components/groups/{CreateGroupDialog.js → CreateGroupDialog.jsx} +9 -8
  10. package/lib/components/groups/GroupDetails.d.ts.map +1 -1
  11. package/lib/components/groups/{GroupDetails.js → GroupDetails.jsx} +5 -6
  12. package/lib/components/groups/GroupForm.jsx +46 -0
  13. package/lib/components/groups/GroupTabs.d.ts.map +1 -1
  14. package/lib/components/groups/GroupTabs.jsx +33 -0
  15. package/lib/components/groups/GroupUsers.d.ts.map +1 -1
  16. package/lib/components/groups/GroupUsers.jsx +88 -0
  17. package/lib/components/groups/Groups.d.ts.map +1 -1
  18. package/lib/components/groups/{Groups.js → Groups.jsx} +45 -30
  19. package/lib/components/groups/GroupsTable.jsx +55 -0
  20. package/lib/components/users/CreateUserDialog.d.ts.map +1 -1
  21. package/lib/components/users/{CreateUserDialog.js → CreateUserDialog.jsx} +9 -8
  22. package/lib/components/users/UserCredentials.d.ts.map +1 -1
  23. package/lib/components/users/{UserCredentials.js → UserCredentials.jsx} +8 -6
  24. package/lib/components/users/UserDetails.d.ts.map +1 -1
  25. package/lib/components/users/{UserDetails.js → UserDetails.jsx} +5 -6
  26. package/lib/components/users/UserForm.jsx +75 -0
  27. package/lib/components/users/UserGroups.d.ts.map +1 -1
  28. package/lib/components/users/UserGroups.jsx +78 -0
  29. package/lib/components/users/Users.d.ts.map +1 -1
  30. package/lib/components/users/{Users.js → Users.jsx} +45 -30
  31. package/lib/components/users/UsersTable.jsx +76 -0
  32. package/lib/components/users/UsersTabs.d.ts.map +1 -1
  33. package/lib/components/users/UsersTabs.jsx +36 -0
  34. package/lib/config/{index.js → index.jsx} +3 -1
  35. package/lib/tsconfig.tsbuildinfo +1 -1
  36. package/lib/utils/hooks/useAPIClient.d.ts +10 -0
  37. package/lib/utils/hooks/useAPIClient.d.ts.map +1 -0
  38. package/lib/utils/hooks/useAPIClient.jsx +18 -0
  39. package/package.json +1 -1
  40. package/lib/components/AddItemDialog.js +0 -45
  41. package/lib/components/DeleteConfirmationDialog.js +0 -35
  42. package/lib/components/SearchField.js +0 -16
  43. package/lib/components/groups/GroupForm.js +0 -38
  44. package/lib/components/groups/GroupTabs.js +0 -29
  45. package/lib/components/groups/GroupUsers.js +0 -74
  46. package/lib/components/groups/GroupsTable.js +0 -43
  47. package/lib/components/users/UserForm.js +0 -62
  48. package/lib/components/users/UserGroups.js +0 -64
  49. package/lib/components/users/UsersTable.js +0 -62
  50. package/lib/components/users/UsersTabs.js +0 -32
@@ -0,0 +1,10 @@
1
+ import { AxiosInstance } from 'axios';
2
+ import React from 'react';
3
+ interface APIClientProviderProps {
4
+ baseURL: string;
5
+ children: React.ReactNode;
6
+ }
7
+ export declare const APIClientProvider: ({ baseURL, children, }: APIClientProviderProps) => React.JSX.Element;
8
+ export declare const useAPIClient: () => AxiosInstance;
9
+ export {};
10
+ //# sourceMappingURL=useAPIClient.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useAPIClient.d.ts","sourceRoot":"","sources":["../../../src/utils/hooks/useAPIClient.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC7C,OAAO,KAAoC,MAAM,OAAO,CAAC;AAUzD,UAAU,sBAAsB;IAC9B,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,iBAAiB,2BAG3B,sBAAsB,sBAaxB,CAAC;AAEF,eAAO,MAAM,YAAY,qBAA+B,CAAC"}
@@ -0,0 +1,18 @@
1
+ import axios from 'axios';
2
+ import React, { createContext, useContext } from 'react';
3
+ const APIContext = createContext(axios.create({
4
+ headers: {
5
+ Accept: 'application/json',
6
+ },
7
+ }));
8
+ export const APIClientProvider = ({ baseURL, children, }) => {
9
+ return (<APIContext.Provider value={axios.create({
10
+ baseURL,
11
+ headers: {
12
+ Accept: 'application/json',
13
+ },
14
+ })}>
15
+ {children}
16
+ </APIContext.Provider>);
17
+ };
18
+ export const useAPIClient = () => useContext(APIContext);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@deix/rossini-identity-management",
3
- "version": "0.1.0",
3
+ "version": "0.1.1",
4
4
  "main": "lib/index.js",
5
5
  "repository": {
6
6
  "type": "git",
@@ -1,45 +0,0 @@
1
- import React from 'react';
2
- import { Autocomplete, Button, Dialog, DialogActions, DialogContent, DialogTitle, TextField, } from '@mui/material';
3
- import { useLocale } from '@deix/rossini-core';
4
- import { useEffect, useState } from 'react';
5
- const translations = {
6
- ok: {
7
- en: 'Add',
8
- it: 'Aggiungi',
9
- },
10
- cancel: {
11
- en: 'Cancel',
12
- it: 'Annulla',
13
- },
14
- search: {
15
- en: 'Search...',
16
- it: 'Cerca...',
17
- },
18
- };
19
- const AddItemDialog = ({ title, options, open, onClose, onConfirm, }) => {
20
- const locale = useLocale();
21
- const [value, setValue] = useState(null);
22
- // Reset the value when the dialog is closed
23
- useEffect(() => {
24
- if (!open) {
25
- setValue(null);
26
- }
27
- }, [open]);
28
- return (React.createElement(Dialog, { open: open, fullWidth: true, maxWidth: 'sm', onClose: onClose },
29
- React.createElement(DialogTitle, null, title[locale]),
30
- React.createElement(DialogContent, null,
31
- React.createElement(Autocomplete
32
- // multiple
33
- , {
34
- // multiple
35
- options: options ?? [], getOptionLabel: (option) => option.label, getOptionKey: (option) => option.value, isOptionEqualToValue: (option, value) => option.value === value.value, renderInput: (params) => (React.createElement(TextField, { ...params, label: translations.search[locale], placeholder: '' })), onChange: (event, newValue) => {
36
- setValue(newValue);
37
- }, value: value })),
38
- React.createElement(DialogActions, null,
39
- React.createElement(Button, { size: 'small', variant: 'outlined', onClick: onClose }, translations.cancel[locale]),
40
- React.createElement(Button, { variant: 'contained', onClick: () => {
41
- onConfirm(value);
42
- onClose();
43
- } }, translations.ok[locale]))));
44
- };
45
- export default AddItemDialog;
@@ -1,35 +0,0 @@
1
- import React from 'react';
2
- import { Button, Dialog, DialogActions, DialogContent, DialogTitle, Typography, } from '@mui/material';
3
- import { useLocale } from '@deix/rossini-core';
4
- const translations = {
5
- title: {
6
- en: 'Delete item?',
7
- it: 'Cancellare elemento?',
8
- },
9
- message: {
10
- en: 'This is a permanent action',
11
- it: "Questa è un'azione permanente",
12
- },
13
- yes: {
14
- en: 'Yes',
15
- it: 'Si',
16
- },
17
- no: {
18
- en: 'No',
19
- it: 'No',
20
- },
21
- };
22
- const DeleteConfirmationDialog = ({ open, onClose, onConfirm, }) => {
23
- const locale = useLocale();
24
- return (React.createElement(Dialog, { open: open, fullWidth: true, maxWidth: 'sm', onClose: onClose },
25
- React.createElement(DialogTitle, null, translations.title[locale]),
26
- React.createElement(DialogContent, null,
27
- React.createElement(Typography, { variant: 'caption' }, translations.message[locale])),
28
- React.createElement(DialogActions, null,
29
- React.createElement(Button, { size: 'small', variant: 'outlined', onClick: onClose }, translations.no[locale]),
30
- React.createElement(Button, { size: 'small', variant: 'contained', onClick: () => {
31
- onConfirm();
32
- onClose();
33
- } }, translations.yes[locale]))));
34
- };
35
- export default DeleteConfirmationDialog;
@@ -1,16 +0,0 @@
1
- import React from 'react';
2
- import SearchIcon from '@mui/icons-material/Search';
3
- import { IconButton, TextField, } from '@mui/material';
4
- import { useState } from 'react';
5
- const SearchField = ({ placeholder = 'Search...', onSearch, ...props }) => {
6
- const [value, setValue] = useState('');
7
- return (React.createElement(React.Fragment, null,
8
- React.createElement(TextField, { size: 'small', placeholder: placeholder, value: value, onChange: (evt) => {
9
- setValue(evt.target.value);
10
- onSearch(evt.target.value);
11
- }, ...props, InputProps: {
12
- endAdornment: (React.createElement(IconButton, { size: 'small', onClick: () => onSearch(value) },
13
- React.createElement(SearchIcon, null))),
14
- } })));
15
- };
16
- export default SearchField;
@@ -1,38 +0,0 @@
1
- import React from 'react';
2
- import { useLocale } from '@deix/rossini-core';
3
- import { Button, Grid, TextField } from '@mui/material';
4
- import { Controller, useForm } from 'react-hook-form';
5
- import { useEffect } from 'react';
6
- import groupsTranslations from '../../lang/groups';
7
- const GroupForm = ({ group, onCancel, onSave, mode }) => {
8
- const locale = useLocale();
9
- const { control, handleSubmit, setValue } = useForm({
10
- defaultValues: {
11
- id: group?.id,
12
- name: group?.name,
13
- },
14
- });
15
- useEffect(() => {
16
- if (group) {
17
- setValue('id', group?.id);
18
- setValue('name', group?.name);
19
- }
20
- }, [group, setValue]);
21
- const onSubmit = (data) => {
22
- onSave(data);
23
- };
24
- return (React.createElement("form", { onSubmit: (event) => void handleSubmit(onSubmit)(event) },
25
- React.createElement(Grid, { container: true, spacing: 2, sx: { mt: 2, maxWidth: 'sm' }, justifyContent: 'stretch' },
26
- React.createElement(Grid, { item: true, xs: 12 },
27
- React.createElement(Controller, { name: 'name', control: control, render: ({ field }) => (React.createElement(TextField, { size: 'small', fullWidth: true, label: groupsTranslations.name[locale], sx: { flexShrink: 0 }, ...field })) })),
28
- React.createElement(Grid, { item: true, sx: {
29
- mt: 2,
30
- display: 'flex',
31
- justifyContent: 'flex-end',
32
- gap: 2,
33
- width: '100%',
34
- } },
35
- mode === 'create' && (React.createElement(Button, { variant: 'outlined', onClick: onCancel }, groupsTranslations.cancel[locale])),
36
- React.createElement(Button, { variant: 'contained', type: 'submit' }, groupsTranslations.save[locale])))));
37
- };
38
- export default GroupForm;
@@ -1,29 +0,0 @@
1
- 'use client';
2
- import React, { useState } from 'react';
3
- import { Box, Tab, Tabs } from '@mui/material';
4
- import { useLocale } from '@deix/rossini-core';
5
- import GroupDetails from './GroupDetails';
6
- import groupsTranslations from '../../lang/groups';
7
- import GroupUsers from './GroupUsers';
8
- const GroupTabs = ({ group, additionalTabs = [] }) => {
9
- const locale = useLocale();
10
- const [selectedTab, setSelectedTab] = useState('DETAILS');
11
- return (React.createElement(Box, { sx: {
12
- flexGrow: 1,
13
- maxWidth: '100%',
14
- overflowX: 'hidden',
15
- alignSelf: 'stretch',
16
- } },
17
- React.createElement(Box, { sx: { borderBottom: 1, borderColor: 'divider' } },
18
- React.createElement(Tabs, { value: selectedTab, onChange: (_evt, newValue) => {
19
- setSelectedTab(newValue);
20
- }, "aria-label": 'basic tabs example' },
21
- React.createElement(Tab, { label: groupsTranslations.details[locale], value: 'DETAILS' }),
22
- React.createElement(Tab, { label: groupsTranslations.users[locale], value: 'USERS' }),
23
- additionalTabs.map((tab, index) => (React.createElement(Tab, { label: tab.title[locale], value: `ADDITIONAL_TAB_${index}` }))))),
24
- React.createElement(Box, { sx: { p: 1 } },
25
- selectedTab === 'DETAILS' && React.createElement(GroupDetails, { group: group }),
26
- selectedTab === 'USERS' && React.createElement(GroupUsers, { group: group }),
27
- additionalTabs.map((tab, index) => selectedTab === `ADDITIONAL_TAB_${index}` && (React.createElement(tab.component, { group: group }))))));
28
- };
29
- export default GroupTabs;
@@ -1,74 +0,0 @@
1
- import React from 'react';
2
- import { Box, Button, IconButton, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, } from '@mui/material';
3
- import AddIcon from '@mui/icons-material/Add';
4
- import DeleteIcon from '@mui/icons-material/Delete';
5
- import { isStringTranslation, useAPI, useLocale } from '@deix/rossini-core';
6
- import { useConfig } from '../../config';
7
- import { useAddUserToGroup, useRemoveUserFromGroup, useUsers, } from '../../utils/hooks/users';
8
- import { useState } from 'react';
9
- import DeleteConfirmationDialog from '../DeleteConfirmationDialog';
10
- import { useQueryClient } from '@tanstack/react-query';
11
- import AddItemDialog from '../AddItemDialog';
12
- import { useGroupUsers } from '../../utils/hooks/groups';
13
- import groupsTranslations from '../../lang/groups';
14
- const groupUsersTableColumns = [
15
- {
16
- id: 'username',
17
- label: { en: 'Username', it: 'Username' },
18
- },
19
- {
20
- id: 'firstName',
21
- label: { en: 'First name', it: 'Nome' },
22
- },
23
- {
24
- id: 'lastName',
25
- label: { en: 'Last name', it: 'Cognome' },
26
- },
27
- ];
28
- const GroupUsers = ({ group }) => {
29
- const locale = useLocale();
30
- const config = useConfig();
31
- const apiClient = useAPI(config.generalProperties.apiURL);
32
- const queryClient = useQueryClient();
33
- const { data: users } = useUsers(apiClient);
34
- const { data: groupUsers } = useGroupUsers(group?.id, apiClient);
35
- const { mutate: addUserToGroup } = useAddUserToGroup(queryClient, apiClient);
36
- const { mutate: removeUserFromGroup } = useRemoveUserFromGroup(queryClient, apiClient);
37
- const [openAddUserDialog, setOpenAddUserDialog] = useState(false);
38
- const [openConfirmationDialog, setOpenConfirmationDialog] = useState(false);
39
- const [deleteId, setDeleteId] = useState();
40
- return (React.createElement(React.Fragment, null,
41
- groupUsers && groupUsers.length > 0 && (React.createElement(Box, { maxWidth: 'md' },
42
- React.createElement(TableContainer, null,
43
- React.createElement(Table, { size: 'small' },
44
- React.createElement(TableHead, null,
45
- React.createElement(TableRow, null,
46
- groupUsersTableColumns.map((col) => (React.createElement(TableCell, { key: col.id, align: col.align || 'inherit' }, isStringTranslation(col.label)
47
- ? col.label[locale]
48
- : col.label))),
49
- React.createElement(TableCell, { padding: 'none' }, ''))),
50
- React.createElement(TableBody, null, groupUsers?.map((user, rowIdx) => (React.createElement(TableRow, { key: rowIdx },
51
- React.createElement(TableCell, null, user.username),
52
- React.createElement(TableCell, null, user.firstName),
53
- React.createElement(TableCell, null, user.lastName),
54
- React.createElement(TableCell, { padding: 'none', align: 'right' },
55
- React.createElement(IconButton, { size: 'small', onClick: (evt) => {
56
- evt.stopPropagation();
57
- setOpenConfirmationDialog(true);
58
- setDeleteId(user.id);
59
- } },
60
- React.createElement(DeleteIcon, null))))))))))),
61
- React.createElement(Button, { variant: 'outlined', startIcon: React.createElement(AddIcon, null), onClick: () => setOpenAddUserDialog(true), sx: { marginTop: 2 } }, groupsTranslations.addUser[locale]),
62
- React.createElement(AddItemDialog, { open: openAddUserDialog, onClose: () => setOpenAddUserDialog(false), onConfirm: (value) => {
63
- if (value) {
64
- addUserToGroup({ userId: value?.value, groupId: group.id });
65
- }
66
- }, title: groupsTranslations.addUser, options: users?.map((user) => ({
67
- value: user.id,
68
- label: user.username || '',
69
- })) }),
70
- React.createElement(DeleteConfirmationDialog, { open: openConfirmationDialog, onClose: () => setOpenConfirmationDialog(false), onConfirm: () => deleteId
71
- ? removeUserFromGroup({ userId: deleteId, groupId: group.id })
72
- : {} })));
73
- };
74
- export default GroupUsers;
@@ -1,43 +0,0 @@
1
- import React from 'react';
2
- import { isStringTranslation, useLocale } from '@deix/rossini-core';
3
- import DeleteIcon from '@mui/icons-material/Delete';
4
- import { IconButton, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, useTheme, } from '@mui/material';
5
- import { useState } from 'react';
6
- import DeleteConfirmationDialog from '../DeleteConfirmationDialog';
7
- const groupsTableColumns = [
8
- {
9
- id: 'name',
10
- label: { en: 'Name', it: 'Nome' },
11
- },
12
- ];
13
- const GroupsTable = ({ groups = [], selectedGroup, setSelectedGroup, onDelete, }) => {
14
- const locale = useLocale();
15
- const muiTheme = useTheme();
16
- const [openConfirmationDialog, setOpenConfirmationDialog] = useState(false);
17
- const [deleteId, setDeleteId] = useState();
18
- return (React.createElement(React.Fragment, null,
19
- React.createElement(TableContainer, null,
20
- React.createElement(Table, { size: 'small' },
21
- React.createElement(TableHead, null,
22
- React.createElement(TableRow, null,
23
- groupsTableColumns.map((col) => (React.createElement(TableCell, { key: col.id, align: col.align || 'inherit' }, isStringTranslation(col.label)
24
- ? col.label[locale]
25
- : col.label))),
26
- React.createElement(TableCell, { padding: 'none' }, ''))),
27
- React.createElement(TableBody, null, groups.map((group, rowIdx) => (React.createElement(TableRow, { key: rowIdx, onClick: () => setSelectedGroup(group), sx: {
28
- cursor: 'pointer',
29
- background: selectedGroup && group.id === selectedGroup.id
30
- ? muiTheme.palette.primary.light
31
- : undefined,
32
- } },
33
- React.createElement(TableCell, null, group.name),
34
- React.createElement(TableCell, { padding: 'none', align: 'right' },
35
- React.createElement(IconButton, { size: 'small', onClick: (evt) => {
36
- evt.stopPropagation();
37
- setOpenConfirmationDialog(true);
38
- setDeleteId(group.id);
39
- } },
40
- React.createElement(DeleteIcon, null))))))))),
41
- React.createElement(DeleteConfirmationDialog, { open: openConfirmationDialog, onClose: () => setOpenConfirmationDialog(false), onConfirm: () => (deleteId ? onDelete(deleteId) : {}) })));
42
- };
43
- export default GroupsTable;
@@ -1,62 +0,0 @@
1
- import React from 'react';
2
- import { useLocale } from '@deix/rossini-core';
3
- import { Button, FormControlLabel, Grid, Switch, TextField, } from '@mui/material';
4
- import { Controller, useForm } from 'react-hook-form';
5
- import { useEffect } from 'react';
6
- import usersTranslations from '../../lang/users';
7
- const UserForm = ({ user, onSave, onCancel, mode = 'create', }) => {
8
- const locale = useLocale();
9
- const { control, handleSubmit, setValue } = useForm({
10
- defaultValues: {
11
- id: user?.id || '',
12
- username: user?.username || '',
13
- firstName: user?.firstName || '',
14
- lastName: user?.lastName || '',
15
- email: user?.email || '',
16
- emailVerified: user?.emailVerified || true,
17
- enabled: user?.enabled || true,
18
- sendEmailOnCreation: true,
19
- },
20
- });
21
- useEffect(() => {
22
- if (user) {
23
- setValue('id', user?.id);
24
- setValue('username', user?.username);
25
- setValue('firstName', user?.firstName);
26
- setValue('lastName', user?.lastName);
27
- setValue('email', user?.email);
28
- setValue('emailVerified', user?.emailVerified);
29
- setValue('enabled', user?.enabled);
30
- setValue('groups', user?.groups);
31
- // The user already exists, we don't want to send an email
32
- setValue('sendEmailOnCreation', false);
33
- }
34
- }, [user, setValue]);
35
- const onSubmit = (data) => {
36
- onSave(data);
37
- };
38
- return (React.createElement("form", { onSubmit: (event) => void handleSubmit(onSubmit)(event) },
39
- React.createElement(Grid, { container: true, spacing: 2, sx: { mt: 2, maxWidth: 'sm' }, justifyContent: 'stretch' },
40
- React.createElement(Grid, { item: true, xs: 12 },
41
- React.createElement(Controller, { name: 'username', control: control, render: ({ field }) => (React.createElement(TextField, { size: 'small', fullWidth: true, label: usersTranslations.username[locale], disabled: mode === 'modify', sx: { flexShrink: 0 }, ...field })) })),
42
- React.createElement(Grid, { item: true, xs: 12 },
43
- React.createElement(Controller, { name: 'firstName', control: control, render: ({ field }) => (React.createElement(TextField, { size: 'small', fullWidth: true, label: usersTranslations.firstName[locale], sx: { flexShrink: 0 }, ...field })) })),
44
- React.createElement(Grid, { item: true, xs: 12 },
45
- React.createElement(Controller, { name: 'lastName', control: control, render: ({ field }) => (React.createElement(TextField, { size: 'small', fullWidth: true, label: usersTranslations.lastName[locale], sx: { flexShrink: 0 }, ...field })) })),
46
- React.createElement(Grid, { item: true, xs: 12 },
47
- React.createElement(Controller, { name: 'email', control: control, render: ({ field }) => (React.createElement(TextField, { size: 'small', fullWidth: true, label: usersTranslations.email[locale], sx: { flexShrink: 0 }, ...field })) })),
48
- React.createElement(Grid, { item: true, xs: 12 },
49
- React.createElement(Controller, { name: 'enabled', control: control, render: ({ field }) => (React.createElement(FormControlLabel, { sx: { ml: 1 }, control: React.createElement(Switch, { checked: field.value, size: 'small', ...field }), label: usersTranslations.enabled[locale] })) })),
50
- mode === 'create' && (React.createElement(Grid, { item: true, xs: 12 },
51
- React.createElement(Controller, { name: 'sendEmailOnCreation', control: control, render: ({ field }) => (React.createElement(FormControlLabel, { sx: { ml: 1 }, control: React.createElement(Switch, { checked: field.value, size: 'small', ...field }), label: usersTranslations.sendResetPasswordEmail[locale] })) }))),
52
- React.createElement(Grid, { item: true, sx: {
53
- mt: 2,
54
- display: 'flex',
55
- justifyContent: 'flex-end',
56
- gap: 2,
57
- width: '100%',
58
- } },
59
- mode === 'create' && (React.createElement(Button, { variant: 'outlined', onClick: onCancel }, usersTranslations.cancel[locale])),
60
- React.createElement(Button, { variant: 'contained', type: 'submit' }, usersTranslations.save[locale])))));
61
- };
62
- export default UserForm;
@@ -1,64 +0,0 @@
1
- import React from 'react';
2
- import { Box, Button, IconButton, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, } from '@mui/material';
3
- import AddIcon from '@mui/icons-material/Add';
4
- import DeleteIcon from '@mui/icons-material/Delete';
5
- import { isStringTranslation, useAPI, useLocale } from '@deix/rossini-core';
6
- import { useConfig } from '../../config';
7
- import { useAddUserToGroup, useRemoveUserFromGroup, useUserGroups, } from '../../utils/hooks/users';
8
- import { useState } from 'react';
9
- import DeleteConfirmationDialog from '../DeleteConfirmationDialog';
10
- import { useQueryClient } from '@tanstack/react-query';
11
- import usersTranslations from '../../lang/users';
12
- import AddItemDialog from '../AddItemDialog';
13
- import { useGroups } from '../../utils/hooks/groups';
14
- const userGroupsTableColumns = [
15
- {
16
- id: 'name',
17
- label: { en: 'Group', it: 'Gruppo' },
18
- },
19
- ];
20
- const UserGroups = ({ user }) => {
21
- const locale = useLocale();
22
- const config = useConfig();
23
- const apiClient = useAPI(config.generalProperties.apiURL);
24
- const queryClient = useQueryClient();
25
- const { data: groups } = useGroups(apiClient);
26
- const { data: userGroups } = useUserGroups(user?.id, apiClient);
27
- const { mutate: addUserToGroup } = useAddUserToGroup(queryClient, apiClient);
28
- const { mutate: removeUserFromGroup } = useRemoveUserFromGroup(queryClient, apiClient);
29
- const [openAddGroupDialog, setOpenAddGroupDialog] = useState(false);
30
- const [openConfirmationDialog, setOpenConfirmationDialog] = useState(false);
31
- const [deleteId, setDeleteId] = useState();
32
- return (React.createElement(React.Fragment, null,
33
- userGroups && userGroups.length > 0 && (React.createElement(Box, { maxWidth: 'sm' },
34
- React.createElement(TableContainer, null,
35
- React.createElement(Table, { size: 'small' },
36
- React.createElement(TableHead, null,
37
- React.createElement(TableRow, null,
38
- userGroupsTableColumns.map((col) => (React.createElement(TableCell, { key: col.id, align: col.align || 'inherit' }, isStringTranslation(col.label)
39
- ? col.label[locale]
40
- : col.label))),
41
- React.createElement(TableCell, { padding: 'none' }, ''))),
42
- React.createElement(TableBody, null, userGroups?.map((group, rowIdx) => (React.createElement(TableRow, { key: rowIdx },
43
- React.createElement(TableCell, null, group.name),
44
- React.createElement(TableCell, { padding: 'none', align: 'right' },
45
- React.createElement(IconButton, { size: 'small', onClick: (evt) => {
46
- evt.stopPropagation();
47
- setOpenConfirmationDialog(true);
48
- setDeleteId(group.id);
49
- } },
50
- React.createElement(DeleteIcon, null))))))))))),
51
- React.createElement(Button, { variant: 'outlined', startIcon: React.createElement(AddIcon, null), onClick: () => setOpenAddGroupDialog(true), sx: { marginTop: 2 } }, usersTranslations.addGroup[locale]),
52
- React.createElement(AddItemDialog, { open: openAddGroupDialog, onClose: () => setOpenAddGroupDialog(false), onConfirm: (value) => {
53
- if (value) {
54
- addUserToGroup({ userId: user.id, groupId: value?.value });
55
- }
56
- }, title: usersTranslations.addGroup, options: groups?.map((group) => ({
57
- value: group.id,
58
- label: group.name,
59
- })) }),
60
- React.createElement(DeleteConfirmationDialog, { open: openConfirmationDialog, onClose: () => setOpenConfirmationDialog(false), onConfirm: () => deleteId
61
- ? removeUserFromGroup({ userId: user.id, groupId: deleteId })
62
- : {} })));
63
- };
64
- export default UserGroups;
@@ -1,62 +0,0 @@
1
- import React from 'react';
2
- import { isStringTranslation, useLocale } from '@deix/rossini-core';
3
- import CheckIcon from '@mui/icons-material/Check';
4
- import CloseIcon from '@mui/icons-material/Close';
5
- import DeleteIcon from '@mui/icons-material/Delete';
6
- import { IconButton, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, useTheme, } from '@mui/material';
7
- import { useState } from 'react';
8
- import DeleteConfirmationDialog from '../DeleteConfirmationDialog';
9
- const usersTableColumns = [
10
- {
11
- id: 'firstName',
12
- label: { en: 'First Name', it: 'Nome' },
13
- },
14
- {
15
- id: 'lastName',
16
- label: { en: 'Last Name', it: 'Cognome' },
17
- },
18
- {
19
- id: 'username',
20
- label: { en: 'Username', it: 'Username' },
21
- },
22
- { id: 'email', label: 'Email' },
23
- {
24
- id: 'enabled',
25
- label: { en: 'Enabled', it: 'Utente Abilitato' },
26
- },
27
- ];
28
- const UsersTable = ({ users = [], selectedUser, setSelectedUser, onDelete, }) => {
29
- const locale = useLocale();
30
- const muiTheme = useTheme();
31
- const [openConfirmationDialog, setOpenConfirmationDialog] = useState(false);
32
- const [deleteId, setDeleteId] = useState();
33
- return (React.createElement(React.Fragment, null,
34
- React.createElement(TableContainer, null,
35
- React.createElement(Table, { size: 'small' },
36
- React.createElement(TableHead, null,
37
- React.createElement(TableRow, null,
38
- usersTableColumns.map((col) => (React.createElement(TableCell, { key: col.id, align: col.align || 'inherit' }, isStringTranslation(col.label)
39
- ? col.label[locale]
40
- : col.label))),
41
- React.createElement(TableCell, { padding: 'none' }, ''))),
42
- React.createElement(TableBody, null, users.map((user, rowIdx) => (React.createElement(TableRow, { key: rowIdx, onClick: () => setSelectedUser(user), sx: {
43
- cursor: 'pointer',
44
- background: selectedUser && user.id === selectedUser.id
45
- ? muiTheme.palette.primary.light
46
- : undefined,
47
- } },
48
- React.createElement(TableCell, null, user.firstName),
49
- React.createElement(TableCell, null, user.lastName),
50
- React.createElement(TableCell, null, user.username),
51
- React.createElement(TableCell, null, user.email),
52
- React.createElement(TableCell, null, user.enabled ? React.createElement(CheckIcon, null) : React.createElement(CloseIcon, null)),
53
- React.createElement(TableCell, { padding: 'none', align: 'right' },
54
- React.createElement(IconButton, { size: 'small', onClick: (evt) => {
55
- evt.stopPropagation();
56
- setOpenConfirmationDialog(true);
57
- setDeleteId(user.id);
58
- } },
59
- React.createElement(DeleteIcon, null))))))))),
60
- React.createElement(DeleteConfirmationDialog, { open: openConfirmationDialog, onClose: () => setOpenConfirmationDialog(false), onConfirm: () => (deleteId ? onDelete(deleteId) : {}) })));
61
- };
62
- export default UsersTable;
@@ -1,32 +0,0 @@
1
- 'use client';
2
- import React, { useState } from 'react';
3
- import { Box, Tab, Tabs } from '@mui/material';
4
- import { useLocale } from '@deix/rossini-core';
5
- import usersTranslations from '../../lang/users';
6
- import UserDetails from './UserDetails';
7
- import UserGroups from './UserGroups';
8
- import UserCredentials from './UserCredentials';
9
- const UserTabs = ({ user, additionalTabs = [] }) => {
10
- const locale = useLocale();
11
- const [selectedTab, setSelectedTab] = useState('DETAILS');
12
- return (React.createElement(Box, { sx: {
13
- flexGrow: 1,
14
- maxWidth: '100%',
15
- overflowX: 'hidden',
16
- alignSelf: 'stretch',
17
- } },
18
- React.createElement(Box, { sx: { borderBottom: 1, borderColor: 'divider' } },
19
- React.createElement(Tabs, { value: selectedTab, onChange: (_evt, newValue) => {
20
- setSelectedTab(newValue);
21
- }, "aria-label": 'basic tabs example' },
22
- React.createElement(Tab, { label: usersTranslations.details[locale], value: 'DETAILS' }),
23
- React.createElement(Tab, { label: usersTranslations.userGroups[locale], value: 'USER_GROUPS' }),
24
- React.createElement(Tab, { label: usersTranslations.credentials[locale], value: 'CREDENTIALS' }),
25
- additionalTabs.map((tab, index) => (React.createElement(Tab, { label: tab.title[locale], value: `ADDITIONAL_TAB_${index}` }))))),
26
- React.createElement(Box, { sx: { p: 1 } },
27
- selectedTab === 'DETAILS' && React.createElement(UserDetails, { user: user }),
28
- selectedTab === 'USER_GROUPS' && React.createElement(UserGroups, { user: user }),
29
- selectedTab === 'CREDENTIALS' && React.createElement(UserCredentials, { user: user }),
30
- additionalTabs.map((tab, index) => selectedTab === `ADDITIONAL_TAB_${index}` && (React.createElement(tab.component, { user: user }))))));
31
- };
32
- export default UserTabs;