@bigbinary/neeto-api-keys-frontend 2.0.0 → 2.1.0

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.
package/dist/index.js CHANGED
@@ -1,733 +1,36 @@
1
- import { useRef, useState, useEffect } from 'react';
2
- import { t } from 'i18next';
3
- import { isPresent, isNotPresent, isNotEmpty } from '@bigbinary/neeto-cist';
4
- import { DEFAULT_PAGE_INDEX, DEFAULT_PAGE_SIZE, PLURAL } from '@bigbinary/neeto-commons-frontend/constants';
5
- import { useMutationWithInvalidation, withT, useDebounce, withTitle, useQueryParams } from '@bigbinary/neeto-commons-frontend/react-utils';
6
- import Header from '@bigbinary/neeto-molecules/Header';
7
- import HelpPopover from '@bigbinary/neeto-molecules/HelpPopover';
8
- import Alert from '@bigbinary/neetoui/Alert';
9
- import Button from '@bigbinary/neetoui/Button';
10
- import { useTranslation, Trans } from 'react-i18next';
11
- import { globalProps as globalProps$1 } from '@bigbinary/neeto-commons-frontend/initializers';
12
- import { useQuery } from '@tanstack/react-query';
13
- import axios from 'axios';
14
- import Pane from '@bigbinary/neetoui/Pane';
15
- import Typography from '@bigbinary/neetoui/Typography';
16
- import NeetoUIForm from '@bigbinary/neetoui/formik/Form';
17
- import Input from '@bigbinary/neetoui/formik/Input';
18
- import Checkbox from '@bigbinary/neetoui/formik/Checkbox';
19
- import ActionBlock from '@bigbinary/neetoui/formik/ActionBlock';
20
- import { Field } from 'formik';
21
- import NeetoUIDatePicker from '@bigbinary/neetoui/DatePicker';
22
- import { prop, isEmpty } from 'ramda';
23
- import dayjs from 'dayjs';
24
- import { dateFormat, getQueryParams, buildUrl } from '@bigbinary/neeto-commons-frontend/utils';
25
- import MoreDropdown from '@bigbinary/neeto-molecules/MoreDropdown';
26
- import CopyToClipboardButton from '@bigbinary/neeto-molecules/CopyToClipboardButton';
27
- import Tag from '@bigbinary/neetoui/Tag';
28
- import * as yup from 'yup';
29
- import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
30
- import PageLoader from '@bigbinary/neeto-molecules/PageLoader';
31
- import TableWrapper from '@bigbinary/neeto-molecules/TableWrapper';
32
- import NeetoUITable from '@bigbinary/neetoui/Table';
33
- import NoData from '@bigbinary/neetoui/NoData';
34
- import { useHistory } from 'react-router-dom';
35
-
36
- function _typeof(o) {
37
- "@babel/helpers - typeof";
38
-
39
- return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
40
- return typeof o;
41
- } : function (o) {
42
- return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
43
- }, _typeof(o);
44
- }
45
-
46
- function _toPrimitive(input, hint) {
47
- if (_typeof(input) !== "object" || input === null) return input;
48
- var prim = input[Symbol.toPrimitive];
49
- if (prim !== undefined) {
50
- var res = prim.call(input, hint || "default");
51
- if (_typeof(res) !== "object") return res;
52
- throw new TypeError("@@toPrimitive must return a primitive value.");
53
- }
54
- return (hint === "string" ? String : Number)(input);
55
- }
56
-
57
- function _toPropertyKey(arg) {
58
- var key = _toPrimitive(arg, "string");
59
- return _typeof(key) === "symbol" ? key : String(key);
60
- }
61
-
62
- function _defineProperty(obj, key, value) {
63
- key = _toPropertyKey(key);
64
- if (key in obj) {
65
- Object.defineProperty(obj, key, {
66
- value: value,
67
- enumerable: true,
68
- configurable: true,
69
- writable: true
70
- });
71
- } else {
72
- obj[key] = value;
73
- }
74
- return obj;
75
- }
76
-
77
- function _arrayWithHoles(arr) {
78
- if (Array.isArray(arr)) return arr;
79
- }
80
-
81
- function _iterableToArrayLimit(r, l) {
82
- var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
83
- if (null != t) {
84
- var e,
85
- n,
86
- i,
87
- u,
88
- a = [],
89
- f = !0,
90
- o = !1;
91
- try {
92
- if (i = (t = t.call(r)).next, 0 === l) {
93
- if (Object(t) !== t) return;
94
- f = !1;
95
- } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
96
- } catch (r) {
97
- o = !0, n = r;
98
- } finally {
99
- try {
100
- if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return;
101
- } finally {
102
- if (o) throw n;
103
- }
104
- }
105
- return a;
106
- }
107
- }
108
-
109
- function _arrayLikeToArray(arr, len) {
110
- if (len == null || len > arr.length) len = arr.length;
111
- for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
112
- return arr2;
113
- }
114
-
115
- function _unsupportedIterableToArray(o, minLen) {
116
- if (!o) return;
117
- if (typeof o === "string") return _arrayLikeToArray(o, minLen);
118
- var n = Object.prototype.toString.call(o).slice(8, -1);
119
- if (n === "Object" && o.constructor) n = o.constructor.name;
120
- if (n === "Map" || n === "Set") return Array.from(o);
121
- if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
122
- }
123
-
124
- function _nonIterableRest() {
125
- throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
126
- }
127
-
128
- function _slicedToArray(arr, i) {
129
- return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
130
- }
131
-
132
- var API_KEYS_BASE_URL = "/neeto_api_keys_engine/api/v1/api_keys";
133
- var HELP_DOC_URL = "https://help.".concat(globalProps$1.appName.toLowerCase(), ".com/articles/api-keys");
134
-
135
- var fetch = function fetch(params) {
136
- return axios.get(API_KEYS_BASE_URL, {
137
- params: params
138
- });
139
- };
140
- var create = function create(payload) {
141
- return axios.post(API_KEYS_BASE_URL, {
142
- apiKey: payload
143
- });
144
- };
145
- var update = function update(_ref) {
146
- var id = _ref.id,
147
- payload = _ref.payload;
148
- return axios.put("".concat(API_KEYS_BASE_URL, "/").concat(id), {
149
- apiKey: payload
150
- });
151
- };
152
- var destroy = function destroy(id) {
153
- return axios["delete"]("".concat(API_KEYS_BASE_URL, "/").concat(id));
154
- };
155
- var apiKeysApi = {
156
- fetch: fetch,
157
- create: create,
158
- update: update,
159
- destroy: destroy
160
- };
161
-
162
- var QUERY_KEYS = {
163
- API_KEYS: "api-keys"
164
- };
165
-
166
- function ownKeys$4(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
167
- function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$4(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$4(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
168
- var useFetchApiKeys = function useFetchApiKeys(_ref) {
169
- var params = _ref.params,
170
- _ref$options = _ref.options,
171
- options = _ref$options === void 0 ? {} : _ref$options;
172
- return useQuery(_objectSpread$4({
173
- queryKey: [QUERY_KEYS.API_KEYS, params],
174
- queryFn: function queryFn() {
175
- return apiKeysApi.fetch(params);
176
- }
177
- }, options));
178
- };
179
- var useCreateApiKey = function useCreateApiKey(onSuccess) {
180
- return useMutationWithInvalidation(apiKeysApi.create, {
181
- keysToInvalidate: [[QUERY_KEYS.API_KEYS]],
182
- onSuccess: onSuccess
183
- });
184
- };
185
- var useUpdateApiKey = function useUpdateApiKey(onSuccess) {
186
- return useMutationWithInvalidation(function (_ref2) {
187
- var id = _ref2.id,
188
- payload = _ref2.payload;
189
- return apiKeysApi.update({
190
- id: id,
191
- payload: payload
192
- });
193
- }, {
194
- keysToInvalidate: [[QUERY_KEYS.API_KEYS]],
195
- onSuccess: onSuccess
196
- });
197
- };
198
- var useDeleteApiKey = function useDeleteApiKey(onSuccess) {
199
- return useMutationWithInvalidation(apiKeysApi.destroy, {
200
- keysToInvalidate: [[QUERY_KEYS.API_KEYS]],
201
- onSuccess: onSuccess
202
- });
203
- };
204
-
205
- var INITIAL_VALUES = {
206
- expiresAt: null,
207
- label: "",
208
- hasNoExpiry: true
209
- };
210
- var NEXT_DAY = dayjs().add(1, "day").startOf("day");
211
- var VALIDATION_SCHEMA = yup.object({
212
- expiresAt: yup.date().when("hasNoExpiry", function (hasNoExpiry, field) {
213
- return hasNoExpiry ? field.nullable() : field.nullable().required(t("neetoApiKeys.validations.required", {
214
- entity: t("neetoApiKeys.fields.expiryDate")
215
- })).min(NEXT_DAY, t("neetoApiKeys.validations.expiry", {
216
- date: dateFormat.date(NEXT_DAY)
217
- }));
218
- }),
219
- label: yup.string().required(t("neetoApiKeys.validations.required", {
220
- entity: t("neetoApiKeys.fields.label")
221
- }))
222
- });
223
- var MENU_ITEMS = {
224
- EDIT: "edit",
225
- DELETE: "delete"
226
- };
227
-
228
- var isInPast = function isInPast(date) {
229
- return dayjs(date).isBefore(dayjs());
230
- };
231
- var partlyHideToken = function partlyHideToken(key) {
232
- return key.slice(-4).padStart(20, "*");
233
- };
234
- var formatExpiry = function formatExpiry(date) {
235
- return dayjs(date).diff(dayjs(), "day") <= 2 ? dateFormat.fromNow(date) : dateFormat.date(date);
236
- };
237
- var getMenuItems = function getMenuItems(_ref) {
238
- var onEdit = _ref.onEdit,
239
- onDelete = _ref.onDelete;
240
- return [{
241
- key: MENU_ITEMS.EDIT,
242
- label: t("neetoApiKeys.buttons.edit"),
243
- onClick: onEdit
244
- }, {
245
- key: MENU_ITEMS.DELETE,
246
- label: t("neetoApiKeys.buttons.delete"),
247
- onClick: onDelete
248
- }];
249
- };
250
- var buildColumnData = function buildColumnData(_ref2) {
251
- var handleDelete = _ref2.handleDelete,
252
- handleEdit = _ref2.handleEdit;
253
- return [{
254
- title: t("neetoApiKeys.table.headers.label"),
255
- key: "label",
256
- dataIndex: "label",
257
- width: 400,
258
- render: function render(label, apiKey) {
259
- return /*#__PURE__*/jsxs("div", {
260
- className: "flex items-center justify-between space-x-3",
261
- children: [/*#__PURE__*/jsx(Typography, {
262
- style: "body2",
263
- children: label
264
- }), /*#__PURE__*/jsx(MoreDropdown, {
265
- dropdownProps: {
266
- strategy: "fixed"
267
- },
268
- menuItems: getMenuItems({
269
- onEdit: function onEdit() {
270
- return handleEdit(apiKey);
271
- },
272
- onDelete: function onDelete() {
273
- return handleDelete(apiKey);
274
- }
275
- })
276
- })]
277
- });
278
- }
279
- }, {
280
- title: t("neetoApiKeys.table.headers.token"),
281
- key: "token",
282
- dataIndex: "token",
283
- width: 400,
284
- render: function render(token) {
285
- return /*#__PURE__*/jsxs("div", {
286
- className: "flex items-center justify-between gap-x-3",
287
- children: [/*#__PURE__*/jsx(Typography, {
288
- style: "body2",
289
- children: partlyHideToken(token)
290
- }), /*#__PURE__*/jsx(CopyToClipboardButton, {
291
- style: "text",
292
- value: token
293
- })]
294
- });
295
- }
296
- }, {
297
- title: t("neetoApiKeys.table.headers.status"),
298
- key: "status",
299
- width: 144,
300
- render: function render(_, _ref3) {
301
- var expiresAt = _ref3.expiresAt;
302
- return isPresent(expiresAt) && isInPast(expiresAt) ? /*#__PURE__*/jsx(Tag, {
303
- style: "warning",
304
- children: t("neetoApiKeys.tags.expired")
305
- }) : /*#__PURE__*/jsx(Tag, {
306
- style: "success",
307
- children: t("neetoApiKeys.tags.active")
308
- });
309
- }
310
- }, {
311
- title: t("neetoApiKeys.table.headers.expiresAt"),
312
- key: "expiresAt",
313
- dataIndex: "expiresAt",
314
- width: 200,
315
- render: function render(expiresAt) {
316
- return isPresent(expiresAt) ? formatExpiry(expiresAt) : /*#__PURE__*/jsx(Typography, {
317
- style: "body2",
318
- children: t("neetoApiKeys.common.never")
319
- });
320
- }
321
- }, {
322
- title: t("neetoApiKeys.table.headers.createdAt"),
323
- key: "createdAt",
324
- dataIndex: "createdAt",
325
- width: 200,
326
- render: function render(createdAt) {
327
- return isPresent(createdAt) ? dateFormat.dateTime(createdAt) : /*#__PURE__*/jsx(Typography, {
328
- style: "body2",
329
- children: t("neetoApiKeys.common.never")
330
- });
331
- }
332
- }];
333
- };
334
- var getStartOfTime = function getStartOfTime(time, unit) {
335
- return dayjs(time).startOf(unit);
336
- };
337
-
338
- function ownKeys$3(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
339
- function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
340
- var DatePicker = function DatePicker(_ref) {
341
- var defaultValue = _ref.defaultValue,
342
- disabledDate = _ref.disabledDate,
343
- label = _ref.label,
344
- placeholder = _ref.placeholder,
345
- name = _ref.name,
346
- _ref$disabled = _ref.disabled,
347
- disabled = _ref$disabled === void 0 ? false : _ref$disabled;
348
- return /*#__PURE__*/jsx(Field, {
349
- name: name,
350
- children: function children(_ref2) {
351
- var _globalProps;
352
- var field = _ref2.field,
353
- meta = _ref2.meta,
354
- setFieldValue = _ref2.form.setFieldValue;
355
- return /*#__PURE__*/jsx(NeetoUIDatePicker, _objectSpread$3(_objectSpread$3({
356
- disabled: disabled,
357
- disabledDate: disabledDate,
358
- label: label,
359
- placeholder: placeholder,
360
- defaultValue: defaultValue,
361
- allowClear: false,
362
- className: "w-full",
363
- error: meta.touched && meta.error,
364
- format: (_globalProps = globalProps) === null || _globalProps === void 0 || (_globalProps = _globalProps.user) === null || _globalProps === void 0 ? void 0 : _globalProps.dateFormat,
365
- getPopupContainer: prop("parentNode")
366
- }, field), {}, {
367
- onChange: function onChange(date) {
368
- setFieldValue(field.name, getStartOfTime(date, "day"));
369
- }
370
- }));
371
- }
372
- });
373
- };
374
-
375
- var Form = withT(function (_ref) {
376
- var t = _ref.t,
377
- _ref$initialValues = _ref.initialValues,
378
- initialValues = _ref$initialValues === void 0 ? INITIAL_VALUES : _ref$initialValues,
379
- isSubmitting = _ref.isSubmitting,
380
- onClose = _ref.onClose,
381
- onSubmit = _ref.onSubmit,
382
- initialFocusRef = _ref.initialFocusRef;
383
- return /*#__PURE__*/jsx(NeetoUIForm, {
384
- formikProps: {
385
- validationSchema: VALIDATION_SCHEMA,
386
- initialValues: initialValues,
387
- onSubmit: onSubmit
388
- },
389
- children: function children(_ref2) {
390
- var setFieldValue = _ref2.setFieldValue,
391
- _ref2$values = _ref2.values,
392
- _ref2$values2 = _ref2$values === void 0 ? {} : _ref2$values,
393
- hasNoExpiry = _ref2$values2.hasNoExpiry,
394
- expiresAt = _ref2$values2.expiresAt;
395
- return /*#__PURE__*/jsxs(Fragment, {
396
- children: [/*#__PURE__*/jsx(Pane.Body, {
397
- children: /*#__PURE__*/jsxs("div", {
398
- className: "w-full space-y-4",
399
- children: [/*#__PURE__*/jsx(Input, {
400
- autoFocus: true,
401
- label: t("neetoApiKeys.fields.label"),
402
- name: "label",
403
- placeholder: t("neetoApiKeys.placeholders.label"),
404
- ref: initialFocusRef
405
- }), /*#__PURE__*/jsxs("div", {
406
- className: "space-y-2",
407
- children: [!hasNoExpiry && /*#__PURE__*/jsx(DatePicker, {
408
- defaultValue: expiresAt,
409
- disabledDate: function disabledDate(date) {
410
- return date < NEXT_DAY;
411
- },
412
- label: t("neetoApiKeys.fields.expiryDate"),
413
- name: "expiresAt",
414
- placeholder: t("neetoApiKeys.placeholders.selectExpiryDate")
415
- }), /*#__PURE__*/jsx(Checkbox, {
416
- checked: hasNoExpiry,
417
- label: t("neetoApiKeys.fields.neverExpire"),
418
- name: "hasNoExpiry",
419
- onChange: function onChange() {
420
- setFieldValue("expiresAt", null);
421
- setFieldValue("hasNoExpiry", !hasNoExpiry);
422
- }
423
- })]
424
- })]
425
- })
426
- }), /*#__PURE__*/jsx(Pane.Footer, {
427
- children: /*#__PURE__*/jsx(ActionBlock, {
428
- isSubmitting: isSubmitting,
429
- cancelButtonProps: {
430
- onClick: onClose
431
- }
432
- })
433
- })]
434
- });
435
- }
436
- });
437
- });
438
-
439
- var Create = function Create(_ref) {
440
- var onClose = _ref.onClose,
441
- isOpen = _ref.isOpen;
442
- var initialFocusRef = useRef(null);
443
- var _useCreateApiKey = useCreateApiKey(onClose),
444
- createApiKey = _useCreateApiKey.mutate,
445
- isCreating = _useCreateApiKey.isPending;
446
- var _useTranslation = useTranslation(),
447
- t = _useTranslation.t;
448
- return /*#__PURE__*/jsxs(Pane, {
449
- initialFocusRef: initialFocusRef,
450
- isOpen: isOpen,
451
- onClose: onClose,
452
- children: [/*#__PURE__*/jsx(Pane.Header, {
453
- children: /*#__PURE__*/jsxs(Typography, {
454
- style: "h2",
455
- children: [t("neetoApiKeys.headers.createApiKey"), /*#__PURE__*/jsx(HelpPopover, {
456
- className: "ml-2",
457
- description: t("neetoApiKeys.tooltips.apiKeysDescription"),
458
- helpLinkProps: {
459
- href: HELP_DOC_URL
460
- },
461
- title: t("neetoApiKeys.tooltips.apiKeys")
462
- })]
463
- })
464
- }), /*#__PURE__*/jsx(Form, {
465
- initialFocusRef: initialFocusRef,
466
- onClose: onClose,
467
- isSubmitting: isCreating,
468
- onSubmit: createApiKey
469
- })]
470
- });
471
- };
472
-
473
- function ownKeys$2(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
474
- function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
475
- var Update = function Update(_ref) {
476
- var onClose = _ref.onClose,
477
- apiKey = _ref.apiKey;
478
- var initialFocusRef = useRef(null);
479
- var _useUpdateApiKey = useUpdateApiKey(onClose),
480
- updateApiKey = _useUpdateApiKey.mutate,
481
- isUpdating = _useUpdateApiKey.isPending;
482
- var _useTranslation = useTranslation(),
483
- t = _useTranslation.t;
484
- var handleUpdate = function handleUpdate(values) {
485
- updateApiKey({
486
- id: apiKey.id,
487
- payload: values
488
- });
489
- };
490
- var initialValues = _objectSpread$2(_objectSpread$2({}, apiKey), {}, {
491
- hasNoExpiry: isNotPresent(apiKey.expiresAt)
492
- });
493
- return /*#__PURE__*/jsxs(Pane, {
494
- initialFocusRef: initialFocusRef,
495
- onClose: onClose,
496
- isOpen: isNotEmpty(apiKey),
497
- children: [/*#__PURE__*/jsx(Pane.Header, {
498
- children: /*#__PURE__*/jsxs(Typography, {
499
- style: "h2",
500
- children: [t("neetoApiKeys.headers.updateApiKey"), /*#__PURE__*/jsx(HelpPopover, {
501
- className: "ml-2",
502
- description: t("neetoApiKeys.tooltips.apiKeysDescription"),
503
- helpLinkProps: {
504
- href: HELP_DOC_URL
505
- },
506
- title: t("neetoApiKeys.tooltips.apiKeys")
507
- })]
508
- })
509
- }), /*#__PURE__*/jsx(Form, {
510
- initialFocusRef: initialFocusRef,
511
- initialValues: initialValues,
512
- onClose: onClose,
513
- isSubmitting: isUpdating,
514
- onSubmit: handleUpdate
515
- })]
516
- });
517
- };
518
-
519
- var getPageFromSearchParams = function getPageFromSearchParams() {
520
- var _getQueryParams = getQueryParams(),
521
- page = _getQueryParams.page;
522
- return parseInt(page) || DEFAULT_PAGE_INDEX;
523
- };
524
- var setPageSearchParam = function setPageSearchParam(_ref) {
525
- var page = _ref.page,
526
- history = _ref.history;
527
- var searchParams = page !== DEFAULT_PAGE_INDEX && buildUrl("", {
528
- page: page
529
- });
530
- history.push({
531
- search: searchParams
532
- });
533
- };
534
-
535
- var usePagination = function usePagination(_ref) {
536
- var searchTerm = _ref.searchTerm;
537
- var _useState = useState(getPageFromSearchParams),
538
- _useState2 = _slicedToArray(_useState, 2),
539
- currentPage = _useState2[0],
540
- setCurrentPage = _useState2[1];
541
- var history = useHistory();
542
- useEffect(function () {
543
- handlePageChange(getPageFromSearchParams());
544
- }, []);
545
- useEffect(function () {
546
- if (isNotEmpty(searchTerm) && currentPage !== DEFAULT_PAGE_INDEX) {
547
- handlePageChange(DEFAULT_PAGE_INDEX);
548
- }
549
- }, [searchTerm]);
550
- var handlePageChange = function handlePageChange(page) {
551
- setCurrentPage(page);
552
- setPageSearchParam({
553
- page: page,
554
- history: history
555
- });
556
- };
557
- var onFetchSuccess = function onFetchSuccess(_ref2) {
558
- var totalCount = _ref2.totalCount,
559
- apiKeys = _ref2.apiKeys;
560
- if (totalCount !== 0 && isEmpty(apiKeys)) {
561
- handlePageChange(DEFAULT_PAGE_INDEX);
562
- }
563
- };
564
- return {
565
- currentPage: currentPage,
566
- handlePageChange: handlePageChange,
567
- onFetchSuccess: onFetchSuccess
568
- };
569
- };
570
-
571
- function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
572
- function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
573
- var Table = function Table(_ref) {
574
- var _jsx2;
575
- var handleDelete = _ref.handleDelete,
576
- handleEdit = _ref.handleEdit,
577
- searchTerm = _ref.searchTerm,
578
- setIsCreatePaneOpen = _ref.setIsCreatePaneOpen,
579
- _ref$noDataProps = _ref.noDataProps,
580
- noDataProps = _ref$noDataProps === void 0 ? {} : _ref$noDataProps;
581
- var debouncedSearchTerm = useDebounce(searchTerm);
582
- var _useTranslation = useTranslation(),
583
- t = _useTranslation.t;
584
- var _usePagination = usePagination({
585
- searchTerm: debouncedSearchTerm
586
- }),
587
- currentPage = _usePagination.currentPage,
588
- handlePageChange = _usePagination.handlePageChange,
589
- onFetchSuccess = _usePagination.onFetchSuccess;
590
- var queryParams = {
591
- searchTerm: debouncedSearchTerm,
592
- page: currentPage,
593
- pageSize: DEFAULT_PAGE_SIZE
594
- };
595
- var _useFetchApiKeys = useFetchApiKeys({
596
- params: queryParams
597
- }),
598
- data = _useFetchApiKeys.data,
599
- isLoading = _useFetchApiKeys.isLoading,
600
- isFetching = _useFetchApiKeys.isFetching;
601
- useEffect(function () {
602
- if (!data) return;
603
- onFetchSuccess(data);
604
- }, [data]);
605
- if (isLoading) return /*#__PURE__*/jsx(PageLoader, {});
606
- if (isEmpty(data === null || data === void 0 ? void 0 : data.apiKeys)) {
607
- return /*#__PURE__*/jsxs("div", {
608
- className: "flex h-full w-full items-center justify-center",
609
- children: [/*#__PURE__*/jsx(NoData, _objectSpread$1({
610
- className: "w-full",
611
- title: t("neetoApiKeys.noData.title"),
612
- helpText: /*#__PURE__*/jsx(Trans, {
613
- i18nKey: "neetoApiKeys.noData.helpText",
614
- components: {
615
- helpLink: /*#__PURE__*/jsx(Button, {
616
- href: HELP_DOC_URL,
617
- style: "link",
618
- target: "_blank"
619
- })
620
- }
621
- }),
622
- primaryButtonProps: {
623
- label: t("neetoApiKeys.buttons.addApiKey"),
624
- onClick: function onClick() {
625
- return setIsCreatePaneOpen(true);
626
- }
627
- }
628
- }, noDataProps)), ";"]
629
- });
630
- }
631
- return /*#__PURE__*/jsx(TableWrapper, {
632
- hasPagination: (data === null || data === void 0 ? void 0 : data.totalCount) > DEFAULT_PAGE_SIZE,
633
- children: /*#__PURE__*/jsx(NeetoUITable, (_jsx2 = {
634
- handlePageChange: handlePageChange
635
- }, _defineProperty(_jsx2, "handlePageChange", handlePageChange), _defineProperty(_jsx2, "fixedHeight", true), _defineProperty(_jsx2, "columnData", buildColumnData({
636
- handleDelete: handleDelete,
637
- handleEdit: handleEdit
638
- })), _defineProperty(_jsx2, "currentPageNumber", currentPage), _defineProperty(_jsx2, "defaultPageSize", DEFAULT_PAGE_SIZE), _defineProperty(_jsx2, "loading", isFetching), _defineProperty(_jsx2, "rowData", data === null || data === void 0 ? void 0 : data.apiKeys), _defineProperty(_jsx2, "totalCount", data === null || data === void 0 ? void 0 : data.totalCount), _jsx2))
639
- });
640
- };
641
-
642
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
643
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
644
- var ApiKeys = function ApiKeys(_ref) {
645
- var noDataProps = _ref.noDataProps,
646
- headerProps = _ref.headerProps;
647
- var _useState = useState({}),
648
- _useState2 = _slicedToArray(_useState, 2),
649
- apiKeyToBeDeleted = _useState2[0],
650
- setApiKeyToBeDeleted = _useState2[1];
651
- var _useState3 = useState({}),
652
- _useState4 = _slicedToArray(_useState3, 2),
653
- apiKeyToBeEdited = _useState4[0],
654
- setApiKeyToBeEdited = _useState4[1];
655
- var _useState5 = useState(false),
656
- _useState6 = _slicedToArray(_useState5, 2),
657
- isCreatePaneOpen = _useState6[0],
658
- setIsCreatePaneOpen = _useState6[1];
659
- var _useTranslation = useTranslation(),
660
- t = _useTranslation.t;
661
- var _useQueryParams = useQueryParams(),
662
- _useQueryParams$searc = _useQueryParams.searchTerm,
663
- searchTerm = _useQueryParams$searc === void 0 ? "" : _useQueryParams$searc;
664
- var _useDeleteApiKey = useDeleteApiKey(function () {
665
- return setApiKeyToBeDeleted({});
666
- }),
667
- deleteApiKey = _useDeleteApiKey.mutate,
668
- isDeleting = _useDeleteApiKey.isPending;
669
- return /*#__PURE__*/jsxs("div", {
670
- className: "flex h-full w-full flex-col",
671
- children: [/*#__PURE__*/jsx(Header, _objectSpread({
672
- actionBlock: /*#__PURE__*/jsx(Button, {
673
- label: t("neetoApiKeys.buttons.addApiKey"),
674
- onClick: function onClick() {
675
- return setIsCreatePaneOpen(true);
676
- }
677
- }),
678
- searchProps: {
679
- placeholder: t("neetoApiKeys.placeholders.search")
680
- },
681
- title: /*#__PURE__*/jsxs("div", {
682
- className: "flex items-center gap-x-2",
683
- children: [t("neetoApiKeys.common.apiKey", PLURAL), /*#__PURE__*/jsx(HelpPopover, {
684
- description: t("neetoApiKeys.tooltips.apiKeysDescription"),
685
- helpLinkProps: {
686
- href: HELP_DOC_URL
687
- },
688
- title: t("neetoApiKeys.tooltips.apiKeys")
689
- })]
690
- })
691
- }, headerProps)), /*#__PURE__*/jsx(Table, {
692
- noDataProps: noDataProps,
693
- searchTerm: searchTerm,
694
- setIsCreatePaneOpen: setIsCreatePaneOpen,
695
- handleDelete: setApiKeyToBeDeleted,
696
- handleEdit: setApiKeyToBeEdited
697
- }), /*#__PURE__*/jsx(Alert, {
698
- isOpen: isNotEmpty(apiKeyToBeDeleted),
699
- isSubmitting: isDeleting,
700
- submitButtonLabel: t("neetoApiKeys.buttons.delete"),
701
- title: t("neetoApiKeys.alert.titles.deleteApiKey"),
702
- message: /*#__PURE__*/jsx(Trans, {
703
- components: {
704
- bold: /*#__PURE__*/jsx("strong", {})
705
- },
706
- i18nKey: "neetoApiKeys.alert.descriptions.deleteApiKey",
707
- values: {
708
- name: apiKeyToBeDeleted.label
709
- }
710
- }),
711
- onClose: function onClose() {
712
- return setApiKeyToBeDeleted({});
713
- },
714
- onSubmit: function onSubmit() {
715
- return deleteApiKey(apiKeyToBeDeleted.id);
716
- }
717
- }), /*#__PURE__*/jsx(Create, {
718
- isOpen: isCreatePaneOpen,
719
- onClose: function onClose() {
720
- return setIsCreatePaneOpen(false);
721
- }
722
- }), /*#__PURE__*/jsx(Update, {
723
- apiKey: apiKeyToBeEdited,
724
- onClose: function onClose() {
725
- return setApiKeyToBeEdited({});
726
- }
727
- })]
728
- });
729
- };
730
- var index = withTitle(ApiKeys, t("neetoApiKeys.common.apiKey", PLURAL));
731
-
732
- export { index as ApiKeys };
1
+ export { default as ApiKeys } from './ApiKeys.js';
2
+ import 'react';
3
+ import 'i18next';
4
+ import '@bigbinary/neeto-cist';
5
+ import '@bigbinary/neeto-commons-frontend/constants';
6
+ import '@bigbinary/neeto-commons-frontend/react-utils';
7
+ import '@bigbinary/neeto-molecules/Header';
8
+ import '@bigbinary/neeto-molecules/HelpPopover';
9
+ import '@bigbinary/neetoui/Alert';
10
+ import '@bigbinary/neetoui/Button';
11
+ import 'react-i18next';
12
+ import '@bigbinary/neeto-commons-frontend/initializers';
13
+ import '@tanstack/react-query';
14
+ import 'axios';
15
+ import '@bigbinary/neetoui/Pane';
16
+ import '@bigbinary/neetoui/Typography';
17
+ import '@bigbinary/neetoui/formik/Form';
18
+ import '@bigbinary/neetoui/formik/Input';
19
+ import '@bigbinary/neetoui/formik/Checkbox';
20
+ import '@bigbinary/neetoui/formik/ActionBlock';
21
+ import 'formik';
22
+ import '@bigbinary/neetoui/DatePicker';
23
+ import 'ramda';
24
+ import 'dayjs';
25
+ import '@bigbinary/neeto-commons-frontend/utils';
26
+ import '@bigbinary/neeto-molecules/MoreDropdown';
27
+ import '@bigbinary/neeto-molecules/CopyToClipboardButton';
28
+ import '@bigbinary/neetoui/Tag';
29
+ import 'yup';
30
+ import 'react/jsx-runtime';
31
+ import '@bigbinary/neeto-molecules/PageLoader';
32
+ import '@bigbinary/neeto-molecules/TableWrapper';
33
+ import '@bigbinary/neetoui/Table';
34
+ import '@bigbinary/neetoui/NoData';
35
+ import 'react-router-dom';
733
36
  //# sourceMappingURL=index.js.map