@webiny/app-security-access-management 0.0.0-mt-2 → 0.0.0-unstable.5e7233243f

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 (74) hide show
  1. package/components/GroupAutocomplete/graphql.d.ts +1 -1
  2. package/components/GroupAutocomplete/graphql.js +14 -3
  3. package/components/GroupAutocomplete/graphql.js.map +1 -0
  4. package/components/GroupAutocomplete/index.d.ts +5 -2
  5. package/components/GroupAutocomplete/index.js +25 -10
  6. package/components/GroupAutocomplete/index.js.map +1 -0
  7. package/components/NotAuthorizedError/NotAuthorizedError.d.ts +2 -2
  8. package/components/NotAuthorizedError/NotAuthorizedError.js +39 -18
  9. package/components/NotAuthorizedError/NotAuthorizedError.js.map +1 -0
  10. package/components/NotAuthorizedError/index.js +13 -1
  11. package/components/NotAuthorizedError/index.js.map +1 -0
  12. package/index.d.ts +8 -1
  13. package/index.js +80 -4
  14. package/index.js.map +1 -0
  15. package/package.json +25 -30
  16. package/plugins/constants.js +9 -2
  17. package/plugins/constants.js.map +1 -0
  18. package/plugins/index.js +20 -8
  19. package/plugins/index.js.map +1 -0
  20. package/plugins/installation.js +47 -25
  21. package/plugins/installation.js.map +1 -0
  22. package/plugins/permissionRenderer/SecurityPermissions.d.ts +8 -5
  23. package/plugins/permissionRenderer/SecurityPermissions.js +69 -46
  24. package/plugins/permissionRenderer/SecurityPermissions.js.map +1 -0
  25. package/plugins/permissionRenderer/index.js +33 -15
  26. package/plugins/permissionRenderer/index.js.map +1 -0
  27. package/plugins/routes.js +37 -19
  28. package/plugins/routes.js.map +1 -0
  29. package/plugins/secureRouteError.js +16 -4
  30. package/plugins/secureRouteError.js.map +1 -0
  31. package/types.d.ts +15 -0
  32. package/types.js +5 -0
  33. package/types.js.map +1 -0
  34. package/ui/elements/GroupAutocompleteElement.d.ts +2 -1
  35. package/ui/elements/GroupAutocompleteElement.js +52 -23
  36. package/ui/elements/GroupAutocompleteElement.js.map +1 -0
  37. package/ui/views/ApiKeys/ApiKeyForm.d.ts +5 -3
  38. package/ui/views/ApiKeys/ApiKeyForm.js +127 -83
  39. package/ui/views/ApiKeys/ApiKeyForm.js.map +1 -0
  40. package/ui/views/ApiKeys/ApiKeys.d.ts +8 -3
  41. package/ui/views/ApiKeys/ApiKeys.js +22 -8
  42. package/ui/views/ApiKeys/ApiKeys.js.map +1 -0
  43. package/ui/views/ApiKeys/ApiKeysDataList.d.ts +5 -3
  44. package/ui/views/ApiKeys/ApiKeysDataList.js +105 -82
  45. package/ui/views/ApiKeys/ApiKeysDataList.js.map +1 -0
  46. package/ui/views/ApiKeys/graphql.d.ts +5 -5
  47. package/ui/views/ApiKeys/graphql.js +22 -7
  48. package/ui/views/ApiKeys/graphql.js.map +1 -0
  49. package/ui/views/ApiKeys/index.d.ts +1 -1
  50. package/ui/views/ApiKeys/index.js +18 -1
  51. package/ui/views/ApiKeys/index.js.map +1 -0
  52. package/ui/views/ApiKeys/utils.d.ts +2 -1
  53. package/ui/views/ApiKeys/utils.js +18 -5
  54. package/ui/views/ApiKeys/utils.js.map +1 -0
  55. package/ui/views/Groups/Groups.d.ts +8 -3
  56. package/ui/views/Groups/Groups.js +22 -8
  57. package/ui/views/Groups/Groups.js.map +1 -0
  58. package/ui/views/Groups/GroupsDataList.d.ts +5 -3
  59. package/ui/views/Groups/GroupsDataList.js +111 -87
  60. package/ui/views/Groups/GroupsDataList.js.map +1 -0
  61. package/ui/views/Groups/GroupsForm.d.ts +5 -3
  62. package/ui/views/Groups/GroupsForm.js +131 -87
  63. package/ui/views/Groups/GroupsForm.js.map +1 -0
  64. package/ui/views/Groups/graphql.d.ts +5 -5
  65. package/ui/views/Groups/graphql.js +23 -8
  66. package/ui/views/Groups/graphql.js.map +1 -0
  67. package/ui/views/Groups/index.d.ts +1 -1
  68. package/ui/views/Groups/index.js +18 -1
  69. package/ui/views/Groups/index.js.map +1 -0
  70. package/ui/views/utils.d.ts +3 -2
  71. package/ui/views/utils.js +19 -20
  72. package/ui/views/utils.js.map +1 -0
  73. package/plugins/menus.d.ts +0 -4
  74. package/plugins/menus.js +0 -61
@@ -1,113 +1,137 @@
1
- import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
2
- import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
3
- import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
+
5
+ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
6
+
7
+ Object.defineProperty(exports, "__esModule", {
8
+ value: true
9
+ });
10
+ exports.GroupsDataList = void 0;
11
+
12
+ var _regeneratorRuntime2 = _interopRequireDefault(require("@babel/runtime/helpers/regeneratorRuntime"));
13
+
14
+ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
15
+
16
+ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
17
+
18
+ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
19
+
20
+ var _react = _interopRequireWildcard(require("react"));
21
+
22
+ var _orderBy = _interopRequireDefault(require("lodash/orderBy"));
23
+
24
+ var _i18n = require("@webiny/app/i18n");
25
+
26
+ var _List = require("@webiny/ui/List");
27
+
28
+ var _icons = require("@webiny/ui/List/DataList/icons");
29
+
30
+ var _reactRouter = require("@webiny/react-router");
31
+
32
+ var _useSnackbar2 = require("@webiny/app-admin/hooks/useSnackbar");
33
+
34
+ var _reactHooks = require("@apollo/react-hooks");
35
+
36
+ var _useConfirmationDialog = require("@webiny/app-admin/hooks/useConfirmationDialog");
37
+
38
+ var _graphql = require("./graphql");
39
+
40
+ var _Tooltip = require("@webiny/ui/Tooltip");
41
+
42
+ var _Button = require("@webiny/ui/Button");
43
+
44
+ var _Grid = require("@webiny/ui/Grid");
45
+
46
+ var _Select = require("@webiny/ui/Select");
47
+
48
+ var _SearchUI = _interopRequireDefault(require("@webiny/app-admin/components/SearchUI"));
49
+
50
+ var _add18px = require("@webiny/app-admin/assets/icons/add-18px.svg");
51
+
52
+ var _filter24px = require("@webiny/app-admin/assets/icons/filter-24px.svg");
53
+
54
+ var _utils = require("../utils");
4
55
 
5
56
  var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
6
57
 
7
- import _regeneratorRuntime from "@babel/runtime/regenerator";
8
- import React, { useCallback, useMemo, useState } from "react";
9
- import orderBy from "lodash/orderBy";
10
- import { i18n } from "@webiny/app/i18n";
11
- import { DataList, ScrollList, ListItem, ListItemText, ListItemTextSecondary, ListItemMeta, ListActions, DataListModalOverlayAction, DataListModalOverlay } from "@webiny/ui/List";
12
- import { DeleteIcon } from "@webiny/ui/List/DataList/icons";
13
- import { useRouter } from "@webiny/react-router";
14
- import { useSnackbar } from "@webiny/app-admin/hooks/useSnackbar";
15
- import { useQuery, useMutation } from "@apollo/react-hooks";
16
- import { useConfirmationDialog } from "@webiny/app-admin/hooks/useConfirmationDialog";
17
- import { LIST_GROUPS, DELETE_GROUP } from "./graphql";
18
- import { Tooltip } from "@webiny/ui/Tooltip";
19
- import { ButtonIcon, ButtonSecondary } from "@webiny/ui/Button";
20
- import { Cell, Grid } from "@webiny/ui/Grid";
21
- import { Select } from "@webiny/ui/Select";
22
- import SearchUI from "@webiny/app-admin/components/SearchUI";
23
- import { ReactComponent as AddIcon } from "@svgr/webpack!@webiny/app-admin/assets/icons/add-18px.svg";
24
- import { ReactComponent as FilterIcon } from "@svgr/webpack!@webiny/app-admin/assets/icons/filter-24px.svg";
25
- import { deserializeSorters, serializeSorters } from "../utils";
26
- var t = i18n.ns("app-security/admin/groups/data-list");
58
+ var t = _i18n.i18n.ns("app-security/admin/groups/data-list");
59
+
27
60
  var SORTERS = [{
28
- label: t(_templateObject || (_templateObject = _taggedTemplateLiteral(["Newest to oldest"]))),
29
- sorters: {
30
- createdOn: "desc"
31
- }
61
+ label: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Newest to oldest"]))),
62
+ sorter: "createdOn_DESC"
32
63
  }, {
33
- label: t(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["Oldest to newest"]))),
34
- sorters: {
35
- createdOn: "asc"
36
- }
64
+ label: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Oldest to newest"]))),
65
+ sorter: "createdOn_ASC"
37
66
  }, {
38
- label: t(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["Name A-Z"]))),
39
- sorters: {
40
- name: "asc"
41
- }
67
+ label: t(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["Name A-Z"]))),
68
+ sorter: "name_ASC"
42
69
  }, {
43
- label: t(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["Name Z-A"]))),
44
- sorters: {
45
- name: "desc"
46
- }
70
+ label: t(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["Name Z-A"]))),
71
+ sorter: "name_DESC"
47
72
  }];
48
73
 
49
74
  var GroupsDataList = function GroupsDataList() {
50
- var _useState = useState(""),
51
- _useState2 = _slicedToArray(_useState, 2),
75
+ var _useState = (0, _react.useState)(""),
76
+ _useState2 = (0, _slicedToArray2.default)(_useState, 2),
52
77
  filter = _useState2[0],
53
78
  setFilter = _useState2[1];
54
79
 
55
- var _useState3 = useState(serializeSorters(SORTERS[0].sorters)),
56
- _useState4 = _slicedToArray(_useState3, 2),
80
+ var _useState3 = (0, _react.useState)(SORTERS[0].sorter),
81
+ _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
57
82
  sort = _useState4[0],
58
83
  setSort = _useState4[1];
59
84
 
60
- var _useRouter = useRouter(),
85
+ var _useRouter = (0, _reactRouter.useRouter)(),
61
86
  history = _useRouter.history,
62
87
  location = _useRouter.location;
63
88
 
64
- var _useSnackbar = useSnackbar(),
89
+ var _useSnackbar = (0, _useSnackbar2.useSnackbar)(),
65
90
  showSnackbar = _useSnackbar.showSnackbar;
66
91
 
67
- var _useConfirmationDialo = useConfirmationDialog({
92
+ var _useConfirmationDialo = (0, _useConfirmationDialog.useConfirmationDialog)({
68
93
  dataTestId: "default-data-list.delete-dialog"
69
94
  }),
70
95
  showConfirmation = _useConfirmationDialo.showConfirmation;
71
96
 
72
- var _useQuery = useQuery(LIST_GROUPS),
97
+ var _useQuery = (0, _reactHooks.useQuery)(_graphql.LIST_GROUPS),
73
98
  listResponse = _useQuery.data,
74
99
  listLoading = _useQuery.loading;
75
100
 
76
- var _useMutation = useMutation(DELETE_GROUP, {
101
+ var _useMutation = (0, _reactHooks.useMutation)(_graphql.DELETE_GROUP, {
77
102
  refetchQueries: [{
78
- query: LIST_GROUPS
103
+ query: _graphql.LIST_GROUPS
79
104
  }]
80
105
  }),
81
- _useMutation2 = _slicedToArray(_useMutation, 2),
106
+ _useMutation2 = (0, _slicedToArray2.default)(_useMutation, 2),
82
107
  deleteIt = _useMutation2[0],
83
108
  deleteLoading = _useMutation2[1].loading;
84
109
 
85
110
  var data = listLoading && !listResponse ? [] : listResponse.security.groups.data;
86
111
  var id = new URLSearchParams(location.search).get("id");
87
- var filterGroup = useCallback(function (_ref) {
112
+ var filterGroup = (0, _react.useCallback)(function (_ref) {
88
113
  var name = _ref.name,
89
114
  slug = _ref.slug,
90
115
  description = _ref.description;
91
116
  return name.toLowerCase().includes(filter) || slug.toLowerCase().includes(filter) || description && description.toLowerCase().includes(filter);
92
117
  }, [filter]);
93
- var sortGroups = useCallback(function (groups) {
118
+ var sortGroups = (0, _react.useCallback)(function (groups) {
94
119
  if (!sort) {
95
120
  return groups;
96
121
  }
97
122
 
98
- var _Object$entries = Object.entries(deserializeSorters(sort)),
99
- _Object$entries2 = _slicedToArray(_Object$entries, 1),
100
- _Object$entries2$ = _slicedToArray(_Object$entries2[0], 2),
101
- key = _Object$entries2$[0],
102
- value = _Object$entries2$[1];
123
+ var _deserializeSorters = (0, _utils.deserializeSorters)(sort),
124
+ _deserializeSorters2 = (0, _slicedToArray2.default)(_deserializeSorters, 2),
125
+ key = _deserializeSorters2[0],
126
+ sortBy = _deserializeSorters2[1];
103
127
 
104
- return orderBy(groups, [key], [value]);
128
+ return (0, _orderBy.default)(groups, [key], [sortBy]);
105
129
  }, [sort]);
106
- var deleteItem = useCallback(function (item) {
107
- showConfirmation( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
130
+ var deleteItem = (0, _react.useCallback)(function (item) {
131
+ showConfirmation( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee() {
108
132
  var _yield$deleteIt, data, error;
109
133
 
110
- return _regeneratorRuntime.wrap(function _callee$(_context) {
134
+ return (0, _regeneratorRuntime2.default)().wrap(function _callee$(_context) {
111
135
  while (1) {
112
136
  switch (_context.prev = _context.next) {
113
137
  case 0:
@@ -129,7 +153,7 @@ var GroupsDataList = function GroupsDataList() {
129
153
  return _context.abrupt("return", showSnackbar(error.message));
130
154
 
131
155
  case 7:
132
- showSnackbar(t(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["Group \"{slug}\" deleted."])))({
156
+ showSnackbar(t(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["Group \"{slug}\" deleted."])))({
133
157
  slug: item.slug
134
158
  }));
135
159
 
@@ -145,71 +169,71 @@ var GroupsDataList = function GroupsDataList() {
145
169
  }, _callee);
146
170
  })));
147
171
  }, [id]);
148
- var groupsDataListModalOverlay = useMemo(function () {
149
- return /*#__PURE__*/React.createElement(DataListModalOverlay, null, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Cell, {
172
+ var groupsDataListModalOverlay = (0, _react.useMemo)(function () {
173
+ return /*#__PURE__*/_react.default.createElement(_List.DataListModalOverlay, null, /*#__PURE__*/_react.default.createElement(_Grid.Grid, null, /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
150
174
  span: 12
151
- }, /*#__PURE__*/React.createElement(Select, {
175
+ }, /*#__PURE__*/_react.default.createElement(_Select.Select, {
152
176
  value: sort,
153
177
  onChange: setSort,
154
- label: t(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["Sort by"])))
178
+ label: t(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["Sort by"])))
155
179
  }, SORTERS.map(function (_ref3) {
156
180
  var label = _ref3.label,
157
- sorters = _ref3.sorters;
158
- return /*#__PURE__*/React.createElement("option", {
181
+ sorter = _ref3.sorter;
182
+ return /*#__PURE__*/_react.default.createElement("option", {
159
183
  key: label,
160
- value: serializeSorters(sorters)
184
+ value: sorter
161
185
  }, label);
162
186
  })))));
163
187
  }, [sort]);
164
188
  var filteredData = filter === "" ? data : data.filter(filterGroup);
165
189
  var groupList = sortGroups(filteredData);
166
- return /*#__PURE__*/React.createElement(DataList, {
167
- title: t(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["Groups"]))),
168
- actions: /*#__PURE__*/React.createElement(ButtonSecondary, {
190
+ return /*#__PURE__*/_react.default.createElement(_List.DataList, {
191
+ title: t(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["Groups"]))),
192
+ actions: /*#__PURE__*/_react.default.createElement(_Button.ButtonSecondary, {
169
193
  "data-testid": "new-record-button",
170
194
  onClick: function onClick() {
171
195
  return history.push("/access-management/groups?new=true");
172
196
  }
173
- }, /*#__PURE__*/React.createElement(ButtonIcon, {
174
- icon: /*#__PURE__*/React.createElement(AddIcon, null)
175
- }), " ", t(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["New Group"])))),
197
+ }, /*#__PURE__*/_react.default.createElement(_Button.ButtonIcon, {
198
+ icon: /*#__PURE__*/_react.default.createElement(_add18px.ReactComponent, null)
199
+ }), " ", t(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["New Group"])))),
176
200
  data: groupList,
177
201
  loading: listLoading || deleteLoading,
178
- search: /*#__PURE__*/React.createElement(SearchUI, {
202
+ search: /*#__PURE__*/_react.default.createElement(_SearchUI.default, {
179
203
  value: filter,
180
204
  onChange: setFilter,
181
- inputPlaceholder: t(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["Search Groups"])))
205
+ inputPlaceholder: t(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["Search Groups"])))
182
206
  }),
183
207
  modalOverlay: groupsDataListModalOverlay,
184
- modalOverlayAction: /*#__PURE__*/React.createElement(DataListModalOverlayAction, {
185
- icon: /*#__PURE__*/React.createElement(FilterIcon, null),
208
+ modalOverlayAction: /*#__PURE__*/_react.default.createElement(_List.DataListModalOverlayAction, {
209
+ icon: /*#__PURE__*/_react.default.createElement(_filter24px.ReactComponent, null),
186
210
  "data-testid": "default-data-list.filter"
187
211
  })
188
212
  }, function (_ref4) {
189
213
  var data = _ref4.data;
190
- return /*#__PURE__*/React.createElement(ScrollList, {
214
+ return /*#__PURE__*/_react.default.createElement(_List.ScrollList, {
191
215
  "data-testid": "default-data-list"
192
216
  }, data.map(function (item) {
193
- return /*#__PURE__*/React.createElement(ListItem, {
217
+ return /*#__PURE__*/_react.default.createElement(_List.ListItem, {
194
218
  key: item.id,
195
219
  selected: item.id === id
196
- }, /*#__PURE__*/React.createElement(ListItemText, {
220
+ }, /*#__PURE__*/_react.default.createElement(_List.ListItemText, {
197
221
  onClick: function onClick() {
198
222
  return history.push("/access-management/groups?id=".concat(item.id));
199
223
  }
200
- }, item.name, /*#__PURE__*/React.createElement(ListItemTextSecondary, null, item.description)), /*#__PURE__*/React.createElement(ListItemMeta, null, /*#__PURE__*/React.createElement(ListActions, null, item.slug !== "full-access" ? /*#__PURE__*/React.createElement(DeleteIcon, {
224
+ }, item.name, /*#__PURE__*/_react.default.createElement(_List.ListItemTextSecondary, null, item.description)), /*#__PURE__*/_react.default.createElement(_List.ListItemMeta, null, /*#__PURE__*/_react.default.createElement(_List.ListActions, null, !item.system ? /*#__PURE__*/_react.default.createElement(_icons.DeleteIcon, {
201
225
  onClick: function onClick() {
202
226
  return deleteItem(item);
203
227
  },
204
228
  "data-testid": "default-data-list.delete"
205
- }) : /*#__PURE__*/React.createElement(Tooltip, {
229
+ }) : /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
206
230
  placement: "bottom",
207
- content: /*#__PURE__*/React.createElement("span", null, t(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["You can't delete this group."]))))
208
- }, /*#__PURE__*/React.createElement(DeleteIcon, {
231
+ content: /*#__PURE__*/_react.default.createElement("span", null, t(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["You can't delete this group."]))))
232
+ }, /*#__PURE__*/_react.default.createElement(_icons.DeleteIcon, {
209
233
  disabled: true
210
234
  })))));
211
235
  }));
212
236
  });
213
237
  };
214
238
 
215
- export default GroupsDataList;
239
+ exports.GroupsDataList = GroupsDataList;
@@ -0,0 +1 @@
1
+ {"version":3,"names":["t","i18n","ns","SORTERS","label","sorter","GroupsDataList","useState","filter","setFilter","sort","setSort","useRouter","history","location","useSnackbar","showSnackbar","useConfirmationDialog","dataTestId","showConfirmation","useQuery","LIST_GROUPS","listResponse","data","listLoading","loading","useMutation","DELETE_GROUP","refetchQueries","query","deleteIt","deleteLoading","security","groups","id","URLSearchParams","search","get","filterGroup","useCallback","name","slug","description","toLowerCase","includes","sortGroups","deserializeSorters","key","sortBy","orderBy","deleteItem","item","variables","error","deleteGroup","message","push","groupsDataListModalOverlay","useMemo","map","filteredData","groupList","system"],"sources":["GroupsDataList.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState } from \"react\";\nimport orderBy from \"lodash/orderBy\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport {\n DataList,\n ScrollList,\n ListItem,\n ListItemText,\n ListItemTextSecondary,\n ListItemMeta,\n ListActions,\n DataListModalOverlayAction,\n DataListModalOverlay\n} from \"@webiny/ui/List\";\nimport { DeleteIcon } from \"@webiny/ui/List/DataList/icons\";\nimport { useRouter } from \"@webiny/react-router\";\nimport { useSnackbar } from \"@webiny/app-admin/hooks/useSnackbar\";\nimport { useQuery, useMutation } from \"@apollo/react-hooks\";\nimport { useConfirmationDialog } from \"@webiny/app-admin/hooks/useConfirmationDialog\";\nimport { LIST_GROUPS, DELETE_GROUP } from \"./graphql\";\nimport { Tooltip } from \"@webiny/ui/Tooltip\";\nimport { ButtonIcon, ButtonSecondary } from \"@webiny/ui/Button\";\nimport { Cell, Grid } from \"@webiny/ui/Grid\";\nimport { Select } from \"@webiny/ui/Select\";\nimport SearchUI from \"@webiny/app-admin/components/SearchUI\";\nimport { ReactComponent as AddIcon } from \"@webiny/app-admin/assets/icons/add-18px.svg\";\nimport { ReactComponent as FilterIcon } from \"@webiny/app-admin/assets/icons/filter-24px.svg\";\nimport { deserializeSorters } from \"../utils\";\nimport { Group } from \"~/types\";\n\nconst t = i18n.ns(\"app-security/admin/groups/data-list\");\n\nconst SORTERS = [\n {\n label: t`Newest to oldest`,\n sorter: \"createdOn_DESC\"\n },\n {\n label: t`Oldest to newest`,\n sorter: \"createdOn_ASC\"\n },\n {\n label: t`Name A-Z`,\n sorter: \"name_ASC\"\n },\n {\n label: t`Name Z-A`,\n sorter: \"name_DESC\"\n }\n];\n\nexport interface GroupsDataListProps {\n // TODO @ts-refactor delete and go up the tree and sort it out\n [key: string]: any;\n}\nexport const GroupsDataList: React.FC<GroupsDataListProps> = () => {\n const [filter, setFilter] = useState(\"\");\n const [sort, setSort] = useState(SORTERS[0].sorter);\n const { history, location } = useRouter();\n const { showSnackbar } = useSnackbar();\n const { showConfirmation } = useConfirmationDialog({\n dataTestId: \"default-data-list.delete-dialog\"\n });\n\n const { data: listResponse, loading: listLoading } = useQuery(LIST_GROUPS);\n\n const [deleteIt, { loading: deleteLoading }] = useMutation(DELETE_GROUP, {\n refetchQueries: [{ query: LIST_GROUPS }]\n });\n\n const data = listLoading && !listResponse ? [] : listResponse.security.groups.data;\n const id = new URLSearchParams(location.search).get(\"id\");\n\n const filterGroup = useCallback(\n ({ name, slug, description }) => {\n return (\n name.toLowerCase().includes(filter) ||\n slug.toLowerCase().includes(filter) ||\n (description && description.toLowerCase().includes(filter))\n );\n },\n [filter]\n );\n\n const sortGroups = useCallback(\n groups => {\n if (!sort) {\n return groups;\n }\n const [key, sortBy] = deserializeSorters(sort);\n return orderBy(groups, [key], [sortBy]);\n },\n [sort]\n );\n\n const deleteItem = useCallback(\n item => {\n showConfirmation(async () => {\n const { data } = await deleteIt({\n variables: item\n });\n\n const { error } = data.security.deleteGroup;\n if (error) {\n return showSnackbar(error.message);\n }\n\n showSnackbar(t`Group \"{slug}\" deleted.`({ slug: item.slug }));\n\n if (id === item.id) {\n history.push(`/access-management/groups`);\n }\n });\n },\n [id]\n );\n\n const groupsDataListModalOverlay = useMemo(\n () => (\n <DataListModalOverlay>\n <Grid>\n <Cell span={12}>\n <Select value={sort} onChange={setSort} label={t`Sort by`}>\n {SORTERS.map(({ label, sorter }) => {\n return (\n <option key={label} value={sorter}>\n {label}\n </option>\n );\n })}\n </Select>\n </Cell>\n </Grid>\n </DataListModalOverlay>\n ),\n [sort]\n );\n\n const filteredData = filter === \"\" ? data : data.filter(filterGroup);\n const groupList = sortGroups(filteredData);\n\n return (\n <DataList\n title={t`Groups`}\n actions={\n <ButtonSecondary\n data-testid=\"new-record-button\"\n onClick={() => history.push(\"/access-management/groups?new=true\")}\n >\n <ButtonIcon icon={<AddIcon />} /> {t`New Group`}\n </ButtonSecondary>\n }\n data={groupList}\n loading={listLoading || deleteLoading}\n search={\n <SearchUI value={filter} onChange={setFilter} inputPlaceholder={t`Search Groups`} />\n }\n modalOverlay={groupsDataListModalOverlay}\n modalOverlayAction={\n <DataListModalOverlayAction\n icon={<FilterIcon />}\n data-testid={\"default-data-list.filter\"}\n />\n }\n >\n {({ data }: { data: Group[] }) => (\n <ScrollList data-testid=\"default-data-list\">\n {data.map(item => (\n <ListItem key={item.id} selected={item.id === id}>\n <ListItemText\n onClick={() =>\n history.push(`/access-management/groups?id=${item.id}`)\n }\n >\n {item.name}\n <ListItemTextSecondary>{item.description}</ListItemTextSecondary>\n </ListItemText>\n\n <ListItemMeta>\n <ListActions>\n {!item.system ? (\n <DeleteIcon\n onClick={() => deleteItem(item)}\n data-testid={\"default-data-list.delete\"}\n />\n ) : (\n <Tooltip\n placement={\"bottom\"}\n content={<span>{t`You can't delete this group.`}</span>}\n >\n <DeleteIcon disabled />\n </Tooltip>\n )}\n </ListActions>\n </ListItemMeta>\n </ListItem>\n ))}\n </ScrollList>\n )}\n </DataList>\n );\n};\n"],"mappings":"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"}
@@ -1,3 +1,5 @@
1
- /// <reference types="react" />
2
- declare const GroupForm: () => JSX.Element;
3
- export default GroupForm;
1
+ import React from "react";
2
+ export interface GroupsFormProps {
3
+ [key: string]: any;
4
+ }
5
+ export declare const GroupsForm: React.FC<GroupsFormProps>;