@bigbinary/neeto-webhooks-frontend 1.6.25 → 1.7.0-beta1

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 (6) hide show
  1. package/app/javascript/src/translations/en.json +2 -1
  2. package/dist/index.cjs.js +590 -447
  3. package/dist/index.cjs.js.map +1 -1
  4. package/dist/index.js +575 -447
  5. package/dist/index.js.map +1 -1
  6. package/package.json +17 -14
package/dist/index.cjs.js CHANGED
@@ -11,18 +11,33 @@ var Container = require('@bigbinary/neeto-molecules/Container');
11
11
  var Header$2 = require('@bigbinary/neeto-molecules/Header');
12
12
  var PageLoader = require('@bigbinary/neeto-molecules/PageLoader');
13
13
  var TableWrapper = require('@bigbinary/neeto-molecules/TableWrapper');
14
- var neetoui = require('@bigbinary/neetoui');
14
+ var NoData = require('@bigbinary/neetoui/NoData');
15
+ var Table = require('@bigbinary/neetoui/Table');
15
16
  var reactI18next = require('react-i18next');
16
- var reactQuery = require('react-query');
17
- var devtools = require('react-query/devtools');
17
+ var reactQuery = require('@tanstack/react-query');
18
+ var reactQueryDevtools = require('@tanstack/react-query-devtools');
19
+ var jsxRuntime = require('react/jsx-runtime');
18
20
  var axios = require('axios');
19
21
  var DateFormat = require('@bigbinary/neeto-molecules/DateFormat');
22
+ var Button = require('@bigbinary/neetoui/Button');
23
+ var Pane = require('@bigbinary/neetoui/Pane');
24
+ var Typography = require('@bigbinary/neetoui/Typography');
25
+ var Tab = require('@bigbinary/neetoui/Tab');
26
+ var Tag = require('@bigbinary/neetoui/Tag');
20
27
  var i18next = require('i18next');
21
28
  var ramda = require('ramda');
29
+ var Alert = require('@bigbinary/neetoui/Alert');
30
+ var reactUtils = require('@bigbinary/neeto-commons-frontend/react-utils');
22
31
  var neetoIcons = require('@bigbinary/neeto-icons');
23
32
  var HelpPopover = require('@bigbinary/neeto-molecules/HelpPopover');
24
33
  var MoreDropdown = require('@bigbinary/neeto-molecules/MoreDropdown');
25
- var formik = require('@bigbinary/neetoui/formik');
34
+ var Spinner = require('@bigbinary/neetoui/Spinner');
35
+ var Input = require('@bigbinary/neetoui/formik/Input');
36
+ var Form = require('@bigbinary/neetoui/formik/Form');
37
+ var ActionBlock = require('@bigbinary/neetoui/formik/ActionBlock');
38
+ var Select = require('@bigbinary/neetoui/formik/Select');
39
+ var Switch = require('@bigbinary/neetoui/formik/Switch');
40
+ var Textarea = require('@bigbinary/neetoui/formik/Textarea');
26
41
  var yup = require('yup');
27
42
 
28
43
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -50,10 +65,25 @@ var Container__default = /*#__PURE__*/_interopDefaultLegacy(Container);
50
65
  var Header__default = /*#__PURE__*/_interopDefaultLegacy(Header$2);
51
66
  var PageLoader__default = /*#__PURE__*/_interopDefaultLegacy(PageLoader);
52
67
  var TableWrapper__default = /*#__PURE__*/_interopDefaultLegacy(TableWrapper);
68
+ var NoData__default = /*#__PURE__*/_interopDefaultLegacy(NoData);
69
+ var Table__default = /*#__PURE__*/_interopDefaultLegacy(Table);
53
70
  var axios__default = /*#__PURE__*/_interopDefaultLegacy(axios);
54
71
  var DateFormat__default = /*#__PURE__*/_interopDefaultLegacy(DateFormat);
72
+ var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
73
+ var Pane__default = /*#__PURE__*/_interopDefaultLegacy(Pane);
74
+ var Typography__default = /*#__PURE__*/_interopDefaultLegacy(Typography);
75
+ var Tab__default = /*#__PURE__*/_interopDefaultLegacy(Tab);
76
+ var Tag__default = /*#__PURE__*/_interopDefaultLegacy(Tag);
77
+ var Alert__default = /*#__PURE__*/_interopDefaultLegacy(Alert);
55
78
  var HelpPopover__default = /*#__PURE__*/_interopDefaultLegacy(HelpPopover);
56
79
  var MoreDropdown__default = /*#__PURE__*/_interopDefaultLegacy(MoreDropdown);
80
+ var Spinner__default = /*#__PURE__*/_interopDefaultLegacy(Spinner);
81
+ var Input__default = /*#__PURE__*/_interopDefaultLegacy(Input);
82
+ var Form__default = /*#__PURE__*/_interopDefaultLegacy(Form);
83
+ var ActionBlock__default = /*#__PURE__*/_interopDefaultLegacy(ActionBlock);
84
+ var Select__default = /*#__PURE__*/_interopDefaultLegacy(Select);
85
+ var Switch__default = /*#__PURE__*/_interopDefaultLegacy(Switch);
86
+ var Textarea__default = /*#__PURE__*/_interopDefaultLegacy(Textarea);
57
87
  var yup__namespace = /*#__PURE__*/_interopNamespace(yup);
58
88
 
59
89
  var getDeliveriesPath = function getDeliveriesPath(webhooksPath) {
@@ -134,6 +164,47 @@ function _slicedToArray(arr, i) {
134
164
  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
135
165
  }
136
166
 
167
+ function _typeof$1(o) {
168
+ "@babel/helpers - typeof";
169
+
170
+ return _typeof$1 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
171
+ return typeof o;
172
+ } : function (o) {
173
+ return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
174
+ }, _typeof$1(o);
175
+ }
176
+
177
+ function _toPrimitive(input, hint) {
178
+ if (_typeof$1(input) !== "object" || input === null) return input;
179
+ var prim = input[Symbol.toPrimitive];
180
+ if (prim !== undefined) {
181
+ var res = prim.call(input, hint || "default");
182
+ if (_typeof$1(res) !== "object") return res;
183
+ throw new TypeError("@@toPrimitive must return a primitive value.");
184
+ }
185
+ return (hint === "string" ? String : Number)(input);
186
+ }
187
+
188
+ function _toPropertyKey(arg) {
189
+ var key = _toPrimitive(arg, "string");
190
+ return _typeof$1(key) === "symbol" ? key : String(key);
191
+ }
192
+
193
+ function _defineProperty(obj, key, value) {
194
+ key = _toPropertyKey(key);
195
+ if (key in obj) {
196
+ Object.defineProperty(obj, key, {
197
+ value: value,
198
+ enumerable: true,
199
+ configurable: true,
200
+ writable: true
201
+ });
202
+ } else {
203
+ obj[key] = value;
204
+ }
205
+ return obj;
206
+ }
207
+
137
208
  var queryClient = new reactQuery.QueryClient({
138
209
  queryCache: new reactQuery.QueryCache(),
139
210
  defaultOptions: {
@@ -143,15 +214,17 @@ var queryClient = new reactQuery.QueryClient({
143
214
  }
144
215
  });
145
216
 
146
- /* eslint-disable @bigbinary/neeto/file-name-and-export-name-standards */
217
+ 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; }
218
+ 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; }
147
219
  var withReactQuery = function withReactQuery(Component) {
148
220
  var QueryWrapper = function QueryWrapper(props) {
149
- return /*#__PURE__*/React__default["default"].createElement(reactQuery.QueryClientProvider, {
150
- client: queryClient
151
- }, /*#__PURE__*/React__default["default"].createElement(Component, props), /*#__PURE__*/React__default["default"].createElement(devtools.ReactQueryDevtools, {
152
- initialIsOpen: false,
153
- position: "bottom-right"
154
- }));
221
+ return /*#__PURE__*/jsxRuntime.jsxs(reactQuery.QueryClientProvider, {
222
+ client: queryClient,
223
+ children: [/*#__PURE__*/jsxRuntime.jsx(Component, _objectSpread$2({}, props)), /*#__PURE__*/jsxRuntime.jsx(reactQueryDevtools.ReactQueryDevtools, {
224
+ initialIsOpen: false,
225
+ position: "bottom"
226
+ })]
227
+ });
155
228
  };
156
229
  return QueryWrapper;
157
230
  };
@@ -186,28 +259,35 @@ var WEBHOOK_STALE_TIME = 3200000; // 1 hour
186
259
  var POST_REDELIVERY_ON_SUCCESS_TIMEOUT = 5000; // 5 seconds
187
260
 
188
261
  var useFetchDeliveries = function useFetchDeliveries(webhookId, params) {
189
- return reactQuery.useQuery([QUERY_KEYS.DELIVERY_LIST, webhookId, params], function () {
190
- return deliveriesApi.fetch(webhookId, params);
191
- }, {
262
+ return reactQuery.useQuery({
263
+ queryKey: [QUERY_KEYS.DELIVERY_LIST, webhookId, params],
264
+ queryFn: function queryFn() {
265
+ return deliveriesApi.fetch(webhookId, params);
266
+ },
192
267
  staleTime: DELIVERY_STALE_TIME
193
268
  });
194
269
  };
195
270
  var useShowDelivery = function useShowDelivery(id, webhookId) {
196
- return reactQuery.useQuery([QUERY_KEYS.DELIVERY_DETAILS, id, webhookId], function () {
197
- return deliveriesApi.show(id, webhookId);
198
- }, {
271
+ return reactQuery.useQuery({
272
+ queryKey: [QUERY_KEYS.DELIVERY_DETAILS, id, webhookId],
273
+ queryFn: function queryFn() {
274
+ return deliveriesApi.show(id, webhookId);
275
+ },
199
276
  staleTime: DELIVERY_STALE_TIME,
200
277
  enabled: !!id
201
278
  });
202
279
  };
203
280
  var useRedeliverWebhook = function useRedeliverWebhook(deliveryId, webhookSid) {
204
281
  var queryClient = reactQuery.useQueryClient();
205
- return reactQuery.useMutation(function () {
206
- return deliveriesApi.redeliver(deliveryId, webhookSid);
207
- }, {
282
+ return reactQuery.useMutation({
283
+ mutationFn: function mutationFn() {
284
+ return deliveriesApi.redeliver(deliveryId, webhookSid);
285
+ },
208
286
  onSuccess: function onSuccess() {
209
287
  setTimeout(function () {
210
- return queryClient.invalidateQueries(QUERY_KEYS.DELIVERY_LIST);
288
+ return queryClient.invalidateQueries({
289
+ queryKey: [QUERY_KEYS.DELIVERY_LIST]
290
+ });
211
291
  }, POST_REDELIVERY_ON_SUCCESS_TIMEOUT);
212
292
  }
213
293
  });
@@ -250,9 +330,9 @@ function getDefaultExportFromCjs (x) {
250
330
 
251
331
  var regeneratorRuntime$1 = {exports: {}};
252
332
 
253
- var _typeof$1 = {exports: {}};
333
+ var _typeof = {exports: {}};
254
334
 
255
- _typeof$1.exports;
335
+ _typeof.exports;
256
336
 
257
337
  (function (module) {
258
338
  function _typeof(o) {
@@ -265,9 +345,9 @@ _typeof$1.exports;
265
345
  }, module.exports.__esModule = true, module.exports["default"] = module.exports), _typeof(o);
266
346
  }
267
347
  module.exports = _typeof, module.exports.__esModule = true, module.exports["default"] = module.exports;
268
- } (_typeof$1));
348
+ } (_typeof));
269
349
 
270
- var _typeofExports = _typeof$1.exports;
350
+ var _typeofExports = _typeof.exports;
271
351
 
272
352
  regeneratorRuntime$1.exports;
273
353
 
@@ -606,10 +686,11 @@ var Snippet = function Snippet(_ref) {
606
686
  var children = _ref.children,
607
687
  _ref$dataCy = _ref.dataCy,
608
688
  dataCy = _ref$dataCy === void 0 ? "" : _ref$dataCy;
609
- return /*#__PURE__*/React__default["default"].createElement("div", {
689
+ return /*#__PURE__*/jsxRuntime.jsx("div", {
610
690
  className: "neeto-ui-rounded neeto-ui-border-gray-300 neeto-ui-bg-gray-100 my-2 whitespace-pre-wrap break-all border p-4",
611
- "data-cy": dataCy
612
- }, children);
691
+ "data-cy": dataCy,
692
+ children: children
693
+ });
613
694
  };
614
695
 
615
696
  var TransactionDetails = function TransactionDetails(_ref) {
@@ -630,57 +711,89 @@ var TransactionDetails = function TransactionDetails(_ref) {
630
711
  return "";
631
712
  }
632
713
  };
633
- return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
634
- className: "neeto-ui-bg-white sticky top-0 mb-2 flex w-full flex-col"
635
- }, /*#__PURE__*/React__default["default"].createElement("div", {
636
- className: "flex w-full flex-col space-y-2 pb-4"
637
- }, /*#__PURE__*/React__default["default"].createElement("span", {
638
- className: "flex items-center space-x-1"
639
- }, t("neetoWebhooks.delivery.identifier"), ":", /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
640
- className: "px-2 font-bold",
641
- "data-cy": "delivery-identifier",
642
- style: "body2"
643
- }, identifier)), /*#__PURE__*/React__default["default"].createElement("span", {
644
- className: "flex items-center"
645
- }, t("neetoWebhooks.common.responseStatus"), ":", /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
646
- className: "px-2 font-bold",
647
- "data-cy": "delivery-response-code",
648
- style: "body2"
649
- }, responseStatusCode), /*#__PURE__*/React__default["default"].createElement(neetoui.Tag, {
650
- style: status === "success" ? "success" : "warning"
651
- }, status))), /*#__PURE__*/React__default["default"].createElement(neetoui.Tab, null, /*#__PURE__*/React__default["default"].createElement(neetoui.Tab.Item, {
652
- active: activeHeader === DELIVERY_TAB.request,
653
- onClick: function onClick() {
654
- return setActiveHeader(DELIVERY_TAB.request);
655
- }
656
- }, t("neetoWebhooks.delivery.request")), /*#__PURE__*/React__default["default"].createElement(neetoui.Tab.Item, {
657
- active: activeHeader === DELIVERY_TAB.response,
658
- onClick: function onClick() {
659
- return setActiveHeader(DELIVERY_TAB.response);
660
- }
661
- }, t("neetoWebhooks.delivery.response")))), /*#__PURE__*/React__default["default"].createElement("div", {
662
- className: "mt-2 w-full"
663
- }, activeHeader === DELIVERY_TAB.request ? /*#__PURE__*/React__default["default"].createElement("div", {
664
- className: "space-y-4"
665
- }, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
666
- style: "h5"
667
- }, t("neetoWebhooks.delivery.header")), /*#__PURE__*/React__default["default"].createElement(Snippet, {
668
- dataCy: "delivery-request-header"
669
- }, delivery.requestHeader)), /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
670
- style: "h5"
671
- }, t("neetoWebhooks.delivery.payload")), /*#__PURE__*/React__default["default"].createElement(Snippet, {
672
- dataCy: "delivery-request-payload"
673
- }, renderPayload()))) : /*#__PURE__*/React__default["default"].createElement("div", {
674
- className: "space-y-4"
675
- }, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
676
- style: "h5"
677
- }, t("neetoWebhooks.delivery.header")), /*#__PURE__*/React__default["default"].createElement(Snippet, {
678
- dataCy: "delivery-response-header"
679
- }, delivery.responseHeader)), /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
680
- style: "h5"
681
- }, t("neetoWebhooks.delivery.body")), /*#__PURE__*/React__default["default"].createElement(Snippet, {
682
- dataCy: "delivery-response-body"
683
- }, delivery.responseBody)))));
714
+ return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
715
+ children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
716
+ className: "neeto-ui-bg-white sticky top-0 mb-2 flex w-full flex-col",
717
+ children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
718
+ className: "flex w-full flex-col space-y-2 pb-4",
719
+ children: [/*#__PURE__*/jsxRuntime.jsxs("span", {
720
+ className: "flex items-center space-x-1",
721
+ children: [t("neetoWebhooks.delivery.identifier"), ":", /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
722
+ className: "px-2 font-bold",
723
+ "data-cy": "delivery-identifier",
724
+ style: "body2",
725
+ children: identifier
726
+ })]
727
+ }), /*#__PURE__*/jsxRuntime.jsxs("span", {
728
+ className: "flex items-center",
729
+ children: [t("neetoWebhooks.common.responseStatus"), ":", /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
730
+ className: "px-2 font-bold",
731
+ "data-cy": "delivery-response-code",
732
+ style: "body2",
733
+ children: responseStatusCode
734
+ }), /*#__PURE__*/jsxRuntime.jsx(Tag__default["default"], {
735
+ style: status === "success" ? "success" : "warning",
736
+ children: status
737
+ })]
738
+ })]
739
+ }), /*#__PURE__*/jsxRuntime.jsxs(Tab__default["default"], {
740
+ children: [/*#__PURE__*/jsxRuntime.jsx(Tab__default["default"].Item, {
741
+ active: activeHeader === DELIVERY_TAB.request,
742
+ onClick: function onClick() {
743
+ return setActiveHeader(DELIVERY_TAB.request);
744
+ },
745
+ children: t("neetoWebhooks.delivery.request")
746
+ }), /*#__PURE__*/jsxRuntime.jsx(Tab__default["default"].Item, {
747
+ active: activeHeader === DELIVERY_TAB.response,
748
+ onClick: function onClick() {
749
+ return setActiveHeader(DELIVERY_TAB.response);
750
+ },
751
+ children: t("neetoWebhooks.delivery.response")
752
+ })]
753
+ })]
754
+ }), /*#__PURE__*/jsxRuntime.jsx("div", {
755
+ className: "mt-2 w-full",
756
+ children: activeHeader === DELIVERY_TAB.request ? /*#__PURE__*/jsxRuntime.jsxs("div", {
757
+ className: "space-y-4",
758
+ children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
759
+ children: [/*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
760
+ style: "h5",
761
+ children: t("neetoWebhooks.delivery.header")
762
+ }), /*#__PURE__*/jsxRuntime.jsx(Snippet, {
763
+ dataCy: "delivery-request-header",
764
+ children: delivery.requestHeader
765
+ })]
766
+ }), /*#__PURE__*/jsxRuntime.jsxs("div", {
767
+ children: [/*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
768
+ style: "h5",
769
+ children: t("neetoWebhooks.delivery.payload")
770
+ }), /*#__PURE__*/jsxRuntime.jsx(Snippet, {
771
+ dataCy: "delivery-request-payload",
772
+ children: renderPayload()
773
+ })]
774
+ })]
775
+ }) : /*#__PURE__*/jsxRuntime.jsxs("div", {
776
+ className: "space-y-4",
777
+ children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
778
+ children: [/*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
779
+ style: "h5",
780
+ children: t("neetoWebhooks.delivery.header")
781
+ }), /*#__PURE__*/jsxRuntime.jsx(Snippet, {
782
+ dataCy: "delivery-response-header",
783
+ children: delivery.responseHeader
784
+ })]
785
+ }), /*#__PURE__*/jsxRuntime.jsxs("div", {
786
+ children: [/*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
787
+ style: "h5",
788
+ children: t("neetoWebhooks.delivery.body")
789
+ }), /*#__PURE__*/jsxRuntime.jsx(Snippet, {
790
+ dataCy: "delivery-response-body",
791
+ children: delivery.responseBody
792
+ })]
793
+ })]
794
+ })
795
+ })]
796
+ });
684
797
  };
685
798
 
686
799
  var Details = function Details(_ref) {
@@ -690,7 +803,7 @@ var Details = function Details(_ref) {
690
803
  var _useTranslation = reactI18next.useTranslation(),
691
804
  t = _useTranslation.t;
692
805
  var _useRedeliverWebhook = useRedeliverWebhook(deliveryId, webhookSid),
693
- isRedelivering = _useRedeliverWebhook.isLoading,
806
+ isRedelivering = _useRedeliverWebhook.isPending,
694
807
  redeliverWebhook = _useRedeliverWebhook.mutateAsync;
695
808
  var _useShowDelivery = useShowDelivery(deliveryId, webhookSid),
696
809
  isLoading = _useShowDelivery.isLoading,
@@ -717,43 +830,57 @@ var Details = function Details(_ref) {
717
830
  if (neetoCist.isNotPresent(delivery)) {
718
831
  return null;
719
832
  }
720
- return /*#__PURE__*/React__default["default"].createElement(neetoui.Pane, {
833
+ return /*#__PURE__*/jsxRuntime.jsx(Pane__default["default"], {
721
834
  onClose: onClose,
722
835
  isOpen: neetoCist.isPresent(deliveryId),
723
- size: "large"
724
- }, /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isLoading ? /*#__PURE__*/React__default["default"].createElement(PageLoader__default["default"], null) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(neetoui.Pane.Header, null, /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(DateFormat__default["default"].Date, {
725
- date: delivery.createdAt,
726
- tooltipProps: {
727
- disabled: true
728
- },
729
- typographyProps: {
730
- style: "h2",
731
- weight: "semibold"
732
- }
733
- }), /*#__PURE__*/React__default["default"].createElement("span", null, " \u2022 "), /*#__PURE__*/React__default["default"].createElement(DateFormat__default["default"].Time, {
734
- date: delivery.createdAt,
735
- tooltipProps: {
736
- disabled: true
737
- },
738
- typographyProps: {
739
- style: "h2",
740
- weight: "normal"
741
- }
742
- }))), /*#__PURE__*/React__default["default"].createElement(neetoui.Pane.Body, null, neetoCist.isPresent(delivery) && /*#__PURE__*/React__default["default"].createElement(TransactionDetails, {
743
- delivery: delivery
744
- })), /*#__PURE__*/React__default["default"].createElement(neetoui.Pane.Footer, {
745
- className: "gap-x-2"
746
- }, event && /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
747
- disabled: isRedelivering,
748
- label: t("neetoWebhooks.delivery.redeliver"),
749
- loading: isRedelivering,
750
- style: "primary",
751
- onClick: handleRedeliverClick
752
- }), /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
753
- label: t("neetoWebhooks.buttons.cancel"),
754
- style: "text",
755
- onClick: onClose
756
- })))));
836
+ size: "large",
837
+ children: /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
838
+ children: isLoading ? /*#__PURE__*/jsxRuntime.jsx(PageLoader__default["default"], {}) : /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
839
+ children: [/*#__PURE__*/jsxRuntime.jsx(Pane__default["default"].Header, {
840
+ children: /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
841
+ children: [/*#__PURE__*/jsxRuntime.jsx(DateFormat__default["default"].Date, {
842
+ date: delivery.createdAt,
843
+ tooltipProps: {
844
+ disabled: true
845
+ },
846
+ typographyProps: {
847
+ style: "h2",
848
+ weight: "semibold"
849
+ }
850
+ }), /*#__PURE__*/jsxRuntime.jsx("span", {
851
+ children: " \u2022 "
852
+ }), /*#__PURE__*/jsxRuntime.jsx(DateFormat__default["default"].Time, {
853
+ date: delivery.createdAt,
854
+ tooltipProps: {
855
+ disabled: true
856
+ },
857
+ typographyProps: {
858
+ style: "h2",
859
+ weight: "normal"
860
+ }
861
+ })]
862
+ })
863
+ }), /*#__PURE__*/jsxRuntime.jsx(Pane__default["default"].Body, {
864
+ children: neetoCist.isPresent(delivery) && /*#__PURE__*/jsxRuntime.jsx(TransactionDetails, {
865
+ delivery: delivery
866
+ })
867
+ }), /*#__PURE__*/jsxRuntime.jsxs(Pane__default["default"].Footer, {
868
+ className: "gap-x-2",
869
+ children: [event && /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
870
+ disabled: isRedelivering,
871
+ label: t("neetoWebhooks.delivery.redeliver"),
872
+ loading: isRedelivering,
873
+ style: "primary",
874
+ onClick: handleRedeliverClick
875
+ }), /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
876
+ label: t("neetoWebhooks.buttons.cancel"),
877
+ style: "text",
878
+ onClick: onClose
879
+ })]
880
+ })]
881
+ })
882
+ })
883
+ });
757
884
  };
758
885
 
759
886
  var buildColumns$1 = function buildColumns(_ref) {
@@ -764,17 +891,20 @@ var buildColumns$1 = function buildColumns(_ref) {
764
891
  dataIndex: "identifier",
765
892
  width: 390,
766
893
  render: function render(_, delivery) {
767
- return /*#__PURE__*/React__default["default"].createElement("div", {
768
- className: "flex items-center gap-x-3"
769
- }, /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
770
- style: "link",
771
- weight: "semibold",
772
- onClick: function onClick() {
773
- return handleDetailsClick(delivery.sid);
774
- }
775
- }, delivery.identifier), delivery.redelivery && /*#__PURE__*/React__default["default"].createElement(neetoui.Tag, {
776
- style: "info"
777
- }, i18next.t("neetoWebhooks.delivery.redelivery")));
894
+ return /*#__PURE__*/jsxRuntime.jsxs("div", {
895
+ className: "flex items-center gap-x-3",
896
+ children: [/*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
897
+ style: "link",
898
+ weight: "semibold",
899
+ onClick: function onClick() {
900
+ return handleDetailsClick(delivery.sid);
901
+ },
902
+ children: delivery.identifier
903
+ }), delivery.redelivery && /*#__PURE__*/jsxRuntime.jsx(Tag__default["default"], {
904
+ style: "info",
905
+ children: i18next.t("neetoWebhooks.delivery.redelivery")
906
+ })]
907
+ });
778
908
  }
779
909
  }, {
780
910
  title: i18next.t("neetoWebhooks.tableHeaders.createdAt"),
@@ -782,11 +912,14 @@ var buildColumns$1 = function buildColumns(_ref) {
782
912
  dataIndex: "createdAt",
783
913
  width: 280,
784
914
  render: function render(createdAt) {
785
- return /*#__PURE__*/React__default["default"].createElement("div", {
786
- className: "flex items-center justify-between space-x-1"
787
- }, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, null, /*#__PURE__*/React__default["default"].createElement(DateFormat__default["default"].DateTime, {
788
- date: createdAt
789
- })));
915
+ return /*#__PURE__*/jsxRuntime.jsx("div", {
916
+ className: "flex items-center justify-between space-x-1",
917
+ children: /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
918
+ children: /*#__PURE__*/jsxRuntime.jsx(DateFormat__default["default"].DateTime, {
919
+ date: createdAt
920
+ })
921
+ })
922
+ });
790
923
  }
791
924
  }, {
792
925
  title: i18next.t("neetoWebhooks.common.responseStatus"),
@@ -795,14 +928,17 @@ var buildColumns$1 = function buildColumns(_ref) {
795
928
  render: function render(_ref2) {
796
929
  var responseStatusCode = _ref2.responseStatusCode,
797
930
  status = _ref2.status;
798
- return /*#__PURE__*/React__default["default"].createElement("span", {
799
- className: "flex items-center"
800
- }, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
801
- className: "px-2",
802
- style: "body2"
803
- }, responseStatusCode), /*#__PURE__*/React__default["default"].createElement(neetoui.Tag, {
804
- style: status === "success" ? "success" : "warning"
805
- }, status));
931
+ return /*#__PURE__*/jsxRuntime.jsxs("span", {
932
+ className: "flex items-center",
933
+ children: [/*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
934
+ className: "px-2",
935
+ style: "body2",
936
+ children: responseStatusCode
937
+ }), /*#__PURE__*/jsxRuntime.jsx(Tag__default["default"], {
938
+ style: status === "success" ? "success" : "warning",
939
+ children: status
940
+ })]
941
+ });
806
942
  }
807
943
  }, {
808
944
  title: i18next.t("neetoWebhooks.common.event", constants.SINGULAR),
@@ -862,35 +998,38 @@ var Deliveries = function Deliveries(_ref) {
862
998
  webhookId: webhookId
863
999
  }));
864
1000
  };
865
- if (isLoading) return /*#__PURE__*/React__default["default"].createElement(PageLoader__default["default"], null);
866
- return /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
867
- className: "w-full"
868
- }, /*#__PURE__*/React__default["default"].createElement(Header__default["default"], {
869
- breadcrumbs: breadcrumbs,
870
- title: t("neetoWebhooks.delivery.title")
871
- }), neetoCist.isNotEmpty(deliveries) ? /*#__PURE__*/React__default["default"].createElement(TableWrapper__default["default"], {
872
- hasPagination: totalCount > constants.DEFAULT_PAGE_SIZE
873
- }, /*#__PURE__*/React__default["default"].createElement(neetoui.Table, {
874
- totalCount: totalCount,
875
- fixedHeight: true,
876
- columnData: buildColumns$1({
877
- handleDetailsClick: handleDetailsClick
878
- }),
879
- currentPageNumber: pageNumber,
880
- defaultPageSize: constants.DEFAULT_PAGE_SIZE,
881
- handlePageChange: setPageNumber,
882
- loading: isFetching,
883
- rowData: deliveries
884
- })) : /*#__PURE__*/React__default["default"].createElement("div", {
885
- className: "flex h-full w-full items-center justify-center"
886
- }, /*#__PURE__*/React__default["default"].createElement(neetoui.NoData, {
887
- description: t("neetoWebhooks.delivery.empty.description"),
888
- title: t("neetoWebhooks.delivery.empty.title")
889
- })), /*#__PURE__*/React__default["default"].createElement(Details, {
890
- deliveryId: deliveryId,
891
- webhookSid: webhookId,
892
- onClose: handleClose
893
- }));
1001
+ if (isLoading) return /*#__PURE__*/jsxRuntime.jsx(PageLoader__default["default"], {});
1002
+ return /*#__PURE__*/jsxRuntime.jsxs(Container__default["default"], {
1003
+ className: "w-full",
1004
+ children: [/*#__PURE__*/jsxRuntime.jsx(Header__default["default"], {
1005
+ breadcrumbs: breadcrumbs,
1006
+ title: t("neetoWebhooks.delivery.title")
1007
+ }), neetoCist.isNotEmpty(deliveries) ? /*#__PURE__*/jsxRuntime.jsx(TableWrapper__default["default"], {
1008
+ hasPagination: totalCount > constants.DEFAULT_PAGE_SIZE,
1009
+ children: /*#__PURE__*/jsxRuntime.jsx(Table__default["default"], {
1010
+ totalCount: totalCount,
1011
+ fixedHeight: true,
1012
+ columnData: buildColumns$1({
1013
+ handleDetailsClick: handleDetailsClick
1014
+ }),
1015
+ currentPageNumber: pageNumber,
1016
+ defaultPageSize: constants.DEFAULT_PAGE_SIZE,
1017
+ handlePageChange: setPageNumber,
1018
+ loading: isFetching,
1019
+ rowData: deliveries
1020
+ })
1021
+ }) : /*#__PURE__*/jsxRuntime.jsx("div", {
1022
+ className: "flex h-full w-full items-center justify-center",
1023
+ children: /*#__PURE__*/jsxRuntime.jsx(NoData__default["default"], {
1024
+ description: t("neetoWebhooks.delivery.empty.description"),
1025
+ title: t("neetoWebhooks.delivery.empty.title")
1026
+ })
1027
+ }), /*#__PURE__*/jsxRuntime.jsx(Details, {
1028
+ deliveryId: deliveryId,
1029
+ webhookSid: webhookId,
1030
+ onClose: handleClose
1031
+ })]
1032
+ });
894
1033
  };
895
1034
  var Deliveries$1 = withReactQuery(Deliveries);
896
1035
 
@@ -925,97 +1064,58 @@ var webhooksApi = {
925
1064
  };
926
1065
 
927
1066
  var useFetchWebhooks = function useFetchWebhooks(params) {
928
- return reactQuery.useQuery([QUERY_KEYS.WEBHOOK_LIST, params], function () {
929
- return webhooksApi.fetch(params);
930
- }, {
1067
+ return reactQuery.useQuery({
1068
+ queryKey: [QUERY_KEYS.WEBHOOK_LIST, params],
1069
+ queryFn: function queryFn() {
1070
+ return webhooksApi.fetch(params);
1071
+ },
931
1072
  staleTime: WEBHOOK_STALE_TIME
932
1073
  });
933
1074
  };
934
1075
  var useCreateWebhook = function useCreateWebhook(options) {
935
- var queryClient = reactQuery.useQueryClient();
936
- return reactQuery.useMutation(webhooksApi.create, {
1076
+ return reactUtils.useMutationWithInvalidation(webhooksApi.create, {
1077
+ keysToInvalidate: [QUERY_KEYS.WEBHOOK_LIST],
937
1078
  onSuccess: function onSuccess() {
938
1079
  var _options$onSuccess;
939
- queryClient.invalidateQueries(QUERY_KEYS.WEBHOOK_LIST);
940
1080
  options === null || options === void 0 || (_options$onSuccess = options.onSuccess) === null || _options$onSuccess === void 0 || _options$onSuccess.call(options);
941
1081
  }
942
1082
  });
943
1083
  };
944
1084
  var useShowWebhook = function useShowWebhook(id) {
945
- return reactQuery.useQuery([QUERY_KEYS.WEBHOOK_DETAILS, id], function () {
946
- return webhooksApi.show(id);
947
- }, {
1085
+ return reactQuery.useQuery({
1086
+ queryKey: [QUERY_KEYS.WEBHOOK_DETAILS, id],
1087
+ queryFn: function queryFn() {
1088
+ return webhooksApi.show(id);
1089
+ },
948
1090
  enabled: !!id,
949
1091
  staleTime: WEBHOOK_STALE_TIME
950
1092
  });
951
1093
  };
952
1094
  var useUpdateWebhook = function useUpdateWebhook(id, options) {
953
- var queryClient = reactQuery.useQueryClient();
954
- return reactQuery.useMutation(function (_ref) {
1095
+ return reactUtils.useMutationWithInvalidation(function (_ref) {
955
1096
  var id = _ref.id,
956
1097
  payload = _ref.payload;
957
1098
  return webhooksApi.update(id, payload);
958
1099
  }, {
1100
+ keysToInvalidate: [[QUERY_KEYS.WEBHOOK_LIST], [QUERY_KEYS.WEBHOOK_DETAILS, id], [QUERY_KEYS.DELIVERY_LIST, id]],
959
1101
  onSuccess: function onSuccess() {
960
1102
  var _options$onSuccess2;
961
- queryClient.invalidateQueries(QUERY_KEYS.WEBHOOK_LIST);
962
- queryClient.invalidateQueries([QUERY_KEYS.WEBHOOK_DETAILS, id]);
963
- queryClient.invalidateQueries([QUERY_KEYS.DELIVERY_LIST, id]);
964
1103
  options === null || options === void 0 || (_options$onSuccess2 = options.onSuccess) === null || _options$onSuccess2 === void 0 || _options$onSuccess2.call(options);
965
1104
  }
966
1105
  });
967
1106
  };
968
1107
  var useDestroyWebhook = function useDestroyWebhook(options) {
969
- var queryClient = reactQuery.useQueryClient();
970
- return reactQuery.useMutation(webhooksApi.destroy, {
1108
+ return reactUtils.useMutationWithInvalidation(webhooksApi.destroy, {
1109
+ keysToInvalidate: [QUERY_KEYS.WEBHOOK_LIST],
971
1110
  onSuccess: function onSuccess() {
972
1111
  var _options$onSuccess3;
973
- queryClient.invalidateQueries(QUERY_KEYS.WEBHOOK_LIST);
974
1112
  options === null || options === void 0 || (_options$onSuccess3 = options.onSuccess) === null || _options$onSuccess3 === void 0 || _options$onSuccess3.call(options);
975
1113
  }
976
1114
  });
977
1115
  };
978
1116
 
979
- function _typeof(o) {
980
- "@babel/helpers - typeof";
981
-
982
- return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
983
- return typeof o;
984
- } : function (o) {
985
- return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
986
- }, _typeof(o);
987
- }
988
-
989
- function _toPrimitive(input, hint) {
990
- if (_typeof(input) !== "object" || input === null) return input;
991
- var prim = input[Symbol.toPrimitive];
992
- if (prim !== undefined) {
993
- var res = prim.call(input, hint || "default");
994
- if (_typeof(res) !== "object") return res;
995
- throw new TypeError("@@toPrimitive must return a primitive value.");
996
- }
997
- return (hint === "string" ? String : Number)(input);
998
- }
999
-
1000
- function _toPropertyKey(arg) {
1001
- var key = _toPrimitive(arg, "string");
1002
- return _typeof(key) === "symbol" ? key : String(key);
1003
- }
1004
-
1005
- function _defineProperty(obj, key, value) {
1006
- key = _toPropertyKey(key);
1007
- if (key in obj) {
1008
- Object.defineProperty(obj, key, {
1009
- value: value,
1010
- enumerable: true,
1011
- configurable: true,
1012
- writable: true
1013
- });
1014
- } else {
1015
- obj[key] = value;
1016
- }
1017
- return obj;
1018
- }
1117
+ var WEBHOOK_HELP_URL = "https://neetocalhelp.neetokb.com/p/a-4bb6c2a2";
1118
+ var WEBHOOK_SECRETS_HELP_URL = "https://neetocalhelp.neetokb.com/p/a-80de90bd";
1019
1119
 
1020
1120
  var baseUrl = "/webhooks/events/all";
1021
1121
  var all = function all() {
@@ -1026,14 +1126,13 @@ var eventsApi = {
1026
1126
  };
1027
1127
 
1028
1128
  var useFetchEvents = function useFetchEvents() {
1029
- return reactQuery.useQuery([QUERY_KEYS.EVENTS_LIST], eventsApi.all, {
1129
+ return reactQuery.useQuery({
1130
+ queryKey: [QUERY_KEYS.EVENTS_LIST],
1131
+ queryFn: eventsApi.all,
1030
1132
  staleTime: WEBHOOK_STALE_TIME
1031
1133
  });
1032
1134
  };
1033
1135
 
1034
- var WEBHOOK_HELP_URL = "https://neetocalhelp.neetokb.com/p/a-4bb6c2a2";
1035
- var WEBHOOK_SECRETS_HELP_URL = "https://neetocalhelp.neetokb.com/p/a-80de90bd";
1036
-
1037
1136
  // Unique ID creation requires a high quality random # generator. In the browser we therefore
1038
1137
  // require the crypto API and do not support built-in fallback to lower quality random number
1039
1138
  // generators (like Math.random()).
@@ -1168,26 +1267,28 @@ var buildColumns = function buildColumns(_ref6) {
1168
1267
  dataIndex: "endpoint",
1169
1268
  width: 830,
1170
1269
  render: function render(endpoint, webhook) {
1171
- return /*#__PURE__*/React__default["default"].createElement("div", {
1172
- className: "flex items-center justify-between space-x-3"
1173
- }, /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
1174
- style: "link",
1175
- to: utils.buildUrl(deliveriesPath, {
1176
- webhookId: webhook.sid
1177
- })
1178
- }, endpoint), /*#__PURE__*/React__default["default"].createElement(MoreDropdown__default["default"], {
1179
- dropdownProps: {
1180
- strategy: "fixed"
1181
- },
1182
- menuItems: getMenuItems({
1183
- onEdit: function onEdit() {
1184
- return handleEdit(webhook.id);
1270
+ return /*#__PURE__*/jsxRuntime.jsxs("div", {
1271
+ className: "flex items-center justify-between space-x-3",
1272
+ children: [/*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
1273
+ style: "link",
1274
+ to: utils.buildUrl(deliveriesPath, {
1275
+ webhookId: webhook.sid
1276
+ }),
1277
+ children: endpoint
1278
+ }), /*#__PURE__*/jsxRuntime.jsx(MoreDropdown__default["default"], {
1279
+ dropdownProps: {
1280
+ strategy: "fixed"
1185
1281
  },
1186
- onDelete: function onDelete() {
1187
- return handleDelete(webhook.id);
1188
- }
1189
- })
1190
- }));
1282
+ menuItems: getMenuItems({
1283
+ onEdit: function onEdit() {
1284
+ return handleEdit(webhook.id);
1285
+ },
1286
+ onDelete: function onDelete() {
1287
+ return handleDelete(webhook.id);
1288
+ }
1289
+ })
1290
+ })]
1291
+ });
1191
1292
  }
1192
1293
  }, {
1193
1294
  title: i18next.t("neetoWebhooks.webhook.active"),
@@ -1286,128 +1387,154 @@ var AddWebhookPane = function AddWebhookPane(_ref) {
1286
1387
  setIsSecretInputFieldVisible(true);
1287
1388
  }
1288
1389
  }, [webhook]);
1289
- return /*#__PURE__*/React__default["default"].createElement(neetoui.Pane, {
1390
+ return /*#__PURE__*/jsxRuntime.jsxs(Pane__default["default"], {
1290
1391
  isOpen: isOpen,
1291
1392
  onClose: onClose,
1292
- initialFocusRef: endpointRef
1293
- }, /*#__PURE__*/React__default["default"].createElement(neetoui.Pane.Header, {
1294
- className: "flex items-center gap-x-2"
1295
- }, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
1296
- "data-cy": "add-new-webhook-pane-header",
1297
- style: "h2",
1298
- weight: "semibold"
1299
- }, editingWebhookId ? t("neetoWebhooks.webhook.edit") : t("neetoWebhooks.webhook.add")), /*#__PURE__*/React__default["default"].createElement(HelpPopover__default["default"], {
1300
- description: t("neetoWebhooks.webhook.helpDescription"),
1301
- helpLinkProps: {
1302
- href: WEBHOOK_HELP_URL
1303
- },
1304
- title: t("neetoWebhooks.webhook.title")
1305
- })), /*#__PURE__*/React__default["default"].createElement(formik.Form, {
1306
- formikProps: {
1307
- enableReinitialize: true,
1308
- validationSchema: getValidationSchema(webhooks),
1309
- initialValues: initialValues,
1310
- onSubmit: function onSubmit(values) {
1311
- return handleSubmit(getValidationSchema().cast(values));
1312
- }
1313
- }
1314
- }, function (_ref2) {
1315
- var setFieldValue = _ref2.setFieldValue;
1316
- return isLoading ? /*#__PURE__*/React__default["default"].createElement("div", {
1317
- className: "flex items-center justify-center"
1318
- }, /*#__PURE__*/React__default["default"].createElement(neetoui.Spinner, null)) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(neetoui.Pane.Body, null, /*#__PURE__*/React__default["default"].createElement("div", {
1319
- className: "w-full space-y-4"
1320
- }, /*#__PURE__*/React__default["default"].createElement(formik.Textarea, {
1321
- required: true,
1322
- "data-cy": "endpoint-input-field",
1323
- label: t("neetoWebhooks.webhook.endpoint"),
1324
- name: "endpoint",
1325
- placeholder: t("neetoWebhooks.webhook.endpointPlaceholder"),
1326
- ref: endpointRef,
1327
- rows: 1
1328
- }), !isLoading && /*#__PURE__*/React__default["default"].createElement(formik.Select, {
1329
- isMulti: true,
1330
- required: true,
1331
- getOptionLabel: ramda.prop("label"),
1332
- getOptionValue: ramda.prop("identifier"),
1333
- label: t("neetoWebhooks.common.event", constants.PLURAL),
1334
- name: "events",
1335
- options: events,
1336
- placeholder: t("neetoWebhooks.webhook.eventPlaceholder")
1337
- }), isSecretInputFieldVisible && /*#__PURE__*/React__default["default"].createElement("div", {
1338
- className: "flex items-center justify-between space-x-3"
1339
- }, /*#__PURE__*/React__default["default"].createElement(formik.Input, {
1340
- "data-cy": "secret-key-input-field",
1341
- name: "secret",
1342
- label: /*#__PURE__*/React__default["default"].createElement("span", {
1343
- className: "flex items-center gap-x-2"
1344
- }, t("neetoWebhooks.webhook.secret"), /*#__PURE__*/React__default["default"].createElement(HelpPopover__default["default"], {
1393
+ initialFocusRef: endpointRef,
1394
+ children: [/*#__PURE__*/jsxRuntime.jsxs(Pane__default["default"].Header, {
1395
+ className: "flex items-center gap-x-2",
1396
+ children: [/*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
1397
+ "data-cy": "add-new-webhook-pane-header",
1398
+ style: "h2",
1399
+ weight: "semibold",
1400
+ children: editingWebhookId ? t("neetoWebhooks.webhook.edit") : t("neetoWebhooks.webhook.add")
1401
+ }), /*#__PURE__*/jsxRuntime.jsx(HelpPopover__default["default"], {
1402
+ description: t("neetoWebhooks.webhook.helpDescription"),
1345
1403
  helpLinkProps: {
1346
- href: WEBHOOK_SECRETS_HELP_URL
1404
+ href: WEBHOOK_HELP_URL
1347
1405
  },
1348
- description: t("neetoWebhooks.webhook.secretkeyHelpDescription"),
1349
- title: t("neetoWebhooks.webhook.secretkeyHelpTitle")
1350
- })),
1351
- placeholder: t("neetoWebhooks.webhook.secretPlaceholder")
1352
- }), /*#__PURE__*/React__default["default"].createElement("div", {
1353
- className: "mt-6"
1354
- }, /*#__PURE__*/React__default["default"].createElement(MoreDropdown__default["default"], {
1355
- menuItems: [{
1356
- key: "regenerate-secret",
1357
- label: t("neetoWebhooks.buttons.regenerate"),
1358
- "data-cy": "regenerate-secret",
1359
- onClick: function onClick() {
1360
- return handleRegenerate(setFieldValue);
1361
- }
1362
- }, {
1363
- key: "delete-secret",
1364
- label: t("neetoWebhooks.buttons.delete"),
1365
- "data-cy": "delete-secret",
1366
- onClick: function onClick() {
1367
- return handleDelete(setFieldValue);
1406
+ title: t("neetoWebhooks.webhook.title")
1407
+ })]
1408
+ }), /*#__PURE__*/jsxRuntime.jsx(Form__default["default"], {
1409
+ formikProps: {
1410
+ enableReinitialize: true,
1411
+ validationSchema: getValidationSchema(webhooks),
1412
+ initialValues: initialValues,
1413
+ onSubmit: function onSubmit(values) {
1414
+ return handleSubmit(getValidationSchema().cast(values));
1368
1415
  }
1369
- }]
1370
- }))), /*#__PURE__*/React__default["default"].createElement(formik.Switch, {
1371
- label: t("neetoWebhooks.webhook.active"),
1372
- name: "isActive"
1373
- }), !isSecretInputFieldVisible && /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
1374
- "data-cy": "add-secret-key",
1375
- icon: neetoIcons.Plus,
1376
- label: t("neetoWebhooks.buttons.addSecretKey"),
1377
- style: "text",
1378
- onClick: function onClick() {
1379
- return handleClick(setFieldValue);
1380
- }
1381
- }))), /*#__PURE__*/React__default["default"].createElement(neetoui.Pane.Footer, null, /*#__PURE__*/React__default["default"].createElement(formik.ActionBlock, {
1382
- cancelButtonProps: {
1383
- onClick: onClose
1416
+ },
1417
+ children: function children(_ref2) {
1418
+ var setFieldValue = _ref2.setFieldValue;
1419
+ return isLoading ? /*#__PURE__*/jsxRuntime.jsx("div", {
1420
+ className: "flex items-center justify-center",
1421
+ children: /*#__PURE__*/jsxRuntime.jsx(Spinner__default["default"], {})
1422
+ }) : /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
1423
+ children: [/*#__PURE__*/jsxRuntime.jsx(Pane__default["default"].Body, {
1424
+ children: /*#__PURE__*/jsxRuntime.jsxs("div", {
1425
+ className: "w-full space-y-4",
1426
+ children: [/*#__PURE__*/jsxRuntime.jsx(Textarea__default["default"], {
1427
+ required: true,
1428
+ "data-cy": "endpoint-input-field",
1429
+ label: t("neetoWebhooks.webhook.endpoint"),
1430
+ name: "endpoint",
1431
+ placeholder: t("neetoWebhooks.webhook.endpointPlaceholder"),
1432
+ ref: endpointRef,
1433
+ rows: 1
1434
+ }), !isLoading && /*#__PURE__*/jsxRuntime.jsx(Select__default["default"], {
1435
+ isMulti: true,
1436
+ required: true,
1437
+ getOptionLabel: ramda.prop("label"),
1438
+ getOptionValue: ramda.prop("identifier"),
1439
+ label: t("neetoWebhooks.common.event", constants.PLURAL),
1440
+ name: "events",
1441
+ options: events,
1442
+ placeholder: t("neetoWebhooks.webhook.eventPlaceholder")
1443
+ }), isSecretInputFieldVisible && /*#__PURE__*/jsxRuntime.jsxs("div", {
1444
+ className: "flex items-center justify-between space-x-3",
1445
+ children: [/*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
1446
+ "data-cy": "secret-key-input-field",
1447
+ name: "secret",
1448
+ label: /*#__PURE__*/jsxRuntime.jsxs("span", {
1449
+ className: "flex items-center gap-x-2",
1450
+ children: [t("neetoWebhooks.webhook.secret"), /*#__PURE__*/jsxRuntime.jsx(HelpPopover__default["default"], {
1451
+ helpLinkProps: {
1452
+ href: WEBHOOK_SECRETS_HELP_URL
1453
+ },
1454
+ description: t("neetoWebhooks.webhook.secretkeyHelpDescription"),
1455
+ title: t("neetoWebhooks.webhook.secretkeyHelpTitle")
1456
+ })]
1457
+ }),
1458
+ placeholder: t("neetoWebhooks.webhook.secretPlaceholder")
1459
+ }), /*#__PURE__*/jsxRuntime.jsx("div", {
1460
+ className: "mt-6",
1461
+ children: /*#__PURE__*/jsxRuntime.jsx(MoreDropdown__default["default"], {
1462
+ menuItems: [{
1463
+ key: "regenerate-secret",
1464
+ label: t("neetoWebhooks.buttons.regenerate"),
1465
+ "data-cy": "regenerate-secret",
1466
+ onClick: function onClick() {
1467
+ return handleRegenerate(setFieldValue);
1468
+ }
1469
+ }, {
1470
+ key: "delete-secret",
1471
+ label: t("neetoWebhooks.buttons.delete"),
1472
+ "data-cy": "delete-secret",
1473
+ onClick: function onClick() {
1474
+ return handleDelete(setFieldValue);
1475
+ }
1476
+ }]
1477
+ })
1478
+ })]
1479
+ }), /*#__PURE__*/jsxRuntime.jsx(Switch__default["default"], {
1480
+ label: t("neetoWebhooks.webhook.active"),
1481
+ name: "isActive"
1482
+ }), !isSecretInputFieldVisible && /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
1483
+ "data-cy": "add-secret-key",
1484
+ icon: neetoIcons.Plus,
1485
+ label: t("neetoWebhooks.buttons.addSecretKey"),
1486
+ style: "text",
1487
+ onClick: function onClick() {
1488
+ return handleClick(setFieldValue);
1489
+ }
1490
+ })]
1491
+ })
1492
+ }), /*#__PURE__*/jsxRuntime.jsx(Pane__default["default"].Footer, {
1493
+ children: /*#__PURE__*/jsxRuntime.jsx(ActionBlock__default["default"], {
1494
+ cancelButtonProps: {
1495
+ onClick: onClose
1496
+ }
1497
+ })
1498
+ })]
1499
+ });
1384
1500
  }
1385
- })));
1386
- }));
1501
+ })]
1502
+ });
1387
1503
  };
1388
1504
 
1389
- var Header = function Header(_ref) {
1390
- var breadcrumbs = _ref.breadcrumbs,
1505
+ var Header = reactUtils.withT(function (_ref) {
1506
+ var t = _ref.t,
1507
+ breadcrumbs = _ref.breadcrumbs,
1391
1508
  setIsAddWebhookPaneOpen = _ref.setIsAddWebhookPaneOpen;
1392
- var _useTranslation = reactI18next.useTranslation(),
1393
- t = _useTranslation.t;
1394
- return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Header__default["default"], {
1395
- breadcrumbs: breadcrumbs,
1396
- title: t("neetoWebhooks.webhook.title"),
1397
- actionBlock: /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
1398
- "data-cy": "add-new-webhook-button",
1399
- label: t("neetoWebhooks.webhook.add"),
1400
- onClick: function onClick() {
1401
- return setIsAddWebhookPaneOpen(true);
1402
- }
1403
- })
1404
- }), /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
1405
- className: "mb-3",
1406
- "data-cy": "webhook-description-header",
1407
- style: "h5",
1408
- weight: "normal"
1409
- }, t("neetoWebhooks.webhook.description")));
1410
- };
1509
+ return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
1510
+ children: [/*#__PURE__*/jsxRuntime.jsx(Header__default["default"], {
1511
+ breadcrumbs: breadcrumbs,
1512
+ actionBlock: /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
1513
+ "data-cy": "add-new-webhook-button",
1514
+ label: t("neetoWebhooks.webhook.add"),
1515
+ onClick: function onClick() {
1516
+ return setIsAddWebhookPaneOpen(true);
1517
+ }
1518
+ }),
1519
+ title: /*#__PURE__*/jsxRuntime.jsxs("div", {
1520
+ className: "flex items-center gap-x-2",
1521
+ children: [t("neetoWebhooks.webhook.title"), /*#__PURE__*/jsxRuntime.jsx(HelpPopover__default["default"], {
1522
+ description: t("neetoWebhooks.webhook.helpDescription"),
1523
+ helpLinkProps: {
1524
+ href: WEBHOOK_HELP_URL
1525
+ },
1526
+ title: t("neetoWebhooks.webhook.title")
1527
+ })]
1528
+ })
1529
+ }), /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
1530
+ className: "mb-3",
1531
+ "data-cy": "webhook-description-header",
1532
+ style: "h5",
1533
+ weight: "normal",
1534
+ children: t("neetoWebhooks.webhook.description")
1535
+ })]
1536
+ });
1537
+ });
1411
1538
  var Header$1 = /*#__PURE__*/React__default["default"].memo(Header);
1412
1539
 
1413
1540
  var Webhooks = function Webhooks(_ref) {
@@ -1458,7 +1585,7 @@ var Webhooks = function Webhooks(_ref) {
1458
1585
  onDelete === null || onDelete === void 0 || onDelete();
1459
1586
  }
1460
1587
  }),
1461
- isDeleting = _useDestroyWebhook.isLoading,
1588
+ isDeleting = _useDestroyWebhook.isPending,
1462
1589
  destroyWebhook = _useDestroyWebhook.mutate;
1463
1590
  var handlePaneClose = function handlePaneClose() {
1464
1591
  setEditingWebhookId(null);
@@ -1473,61 +1600,75 @@ var Webhooks = function Webhooks(_ref) {
1473
1600
  setIsDeleteAlertOpen(true);
1474
1601
  }, []);
1475
1602
  if (isLoading) {
1476
- return /*#__PURE__*/React__default["default"].createElement(PageLoader__default["default"], null);
1603
+ return /*#__PURE__*/jsxRuntime.jsx(PageLoader__default["default"], {});
1477
1604
  }
1478
- return /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
1479
- className: "w-full"
1480
- }, /*#__PURE__*/React__default["default"].createElement(Header$1, {
1481
- breadcrumbs: breadcrumbs,
1482
- setIsAddWebhookPaneOpen: setIsAddWebhookPaneOpen
1483
- }), neetoCist.isNotEmpty(webhooks) ? /*#__PURE__*/React__default["default"].createElement(TableWrapper__default["default"], {
1484
- hasPagination: totalCount > constants.DEFAULT_PAGE_SIZE
1485
- }, /*#__PURE__*/React__default["default"].createElement(neetoui.Table, {
1486
- totalCount: totalCount,
1487
- fixedHeight: true,
1488
- currentPageNumber: pageNumber,
1489
- defaultPageSize: constants.DEFAULT_PAGE_SIZE,
1490
- handlePageChange: function handlePageChange(page) {
1491
- return setPageNumber(page);
1492
- },
1493
- loading: isFetching,
1494
- rowData: webhooks,
1495
- columnData: buildColumns({
1496
- handleDelete: handleDelete,
1497
- handleEdit: handleEdit,
1498
- deliveriesPath: deliveriesPath
1499
- })
1500
- })) : /*#__PURE__*/React__default["default"].createElement("div", {
1501
- className: "flex h-full w-full items-center justify-center"
1502
- }, /*#__PURE__*/React__default["default"].createElement(neetoui.NoData, {
1503
- title: t("neetoWebhooks.webhook.empty")
1504
- })), /*#__PURE__*/React__default["default"].createElement(AddWebhookPane, {
1505
- editingWebhookId: editingWebhookId,
1506
- entityId: entityId,
1507
- entityType: entityType,
1508
- onCreate: onCreate,
1509
- webhooks: webhooks,
1510
- isOpen: isAddWebhookPaneOpen,
1511
- onClose: handlePaneClose
1512
- }), /*#__PURE__*/React__default["default"].createElement(neetoui.Alert, {
1513
- isOpen: isDeleteAlertOpen,
1514
- isSubmitting: isDeleting,
1515
- submitButtonLabel: t("neetoWebhooks.buttons.delete"),
1516
- message: t("neetoWebhooks.alert.delete.message", {
1517
- entity: t("neetoWebhooks.entity.webhook")
1518
- }),
1519
- title: t("neetoWebhooks.alert.delete.title", {
1520
- entity: t("neetoWebhooks.entity.webhook")
1521
- }),
1522
- onClose: function onClose() {
1523
- return setIsDeleteAlertOpen(false);
1524
- },
1525
- onSubmit: function onSubmit() {
1526
- return destroyWebhook(deletingWebhookId, {
1527
- entityId: entityId
1528
- });
1529
- }
1530
- }));
1605
+ return /*#__PURE__*/jsxRuntime.jsxs(Container__default["default"], {
1606
+ className: "w-full",
1607
+ children: [/*#__PURE__*/jsxRuntime.jsx(Header$1, {
1608
+ breadcrumbs: breadcrumbs,
1609
+ setIsAddWebhookPaneOpen: setIsAddWebhookPaneOpen
1610
+ }), neetoCist.isNotEmpty(webhooks) ? /*#__PURE__*/jsxRuntime.jsx(TableWrapper__default["default"], {
1611
+ hasPagination: totalCount > constants.DEFAULT_PAGE_SIZE,
1612
+ children: /*#__PURE__*/jsxRuntime.jsx(Table__default["default"], {
1613
+ totalCount: totalCount,
1614
+ fixedHeight: true,
1615
+ currentPageNumber: pageNumber,
1616
+ defaultPageSize: constants.DEFAULT_PAGE_SIZE,
1617
+ handlePageChange: setPageNumber,
1618
+ loading: isFetching,
1619
+ rowData: webhooks,
1620
+ columnData: buildColumns({
1621
+ handleDelete: handleDelete,
1622
+ handleEdit: handleEdit,
1623
+ deliveriesPath: deliveriesPath
1624
+ })
1625
+ })
1626
+ }) : /*#__PURE__*/jsxRuntime.jsx("div", {
1627
+ className: "flex h-full w-full items-center justify-center",
1628
+ children: /*#__PURE__*/jsxRuntime.jsx(NoData__default["default"], {
1629
+ title: t("neetoWebhooks.webhook.empty"),
1630
+ helpText: /*#__PURE__*/jsxRuntime.jsx("a", {
1631
+ className: "neeto-ui-text-primary-800 hover:neeto-ui-text-primary-800 visited:neeto-ui-text-primary-600 font-medium",
1632
+ href: WEBHOOK_HELP_URL,
1633
+ rel: "noreferrer",
1634
+ target: "_blank",
1635
+ children: t("neetoWebhooks.webhook.emptyHelpText")
1636
+ }),
1637
+ primaryButtonProps: {
1638
+ label: t("neetoWebhooks.webhook.add"),
1639
+ onClick: function onClick() {
1640
+ return setIsAddWebhookPaneOpen(true);
1641
+ }
1642
+ }
1643
+ })
1644
+ }), /*#__PURE__*/jsxRuntime.jsx(AddWebhookPane, {
1645
+ editingWebhookId: editingWebhookId,
1646
+ entityId: entityId,
1647
+ entityType: entityType,
1648
+ onCreate: onCreate,
1649
+ webhooks: webhooks,
1650
+ isOpen: isAddWebhookPaneOpen,
1651
+ onClose: handlePaneClose
1652
+ }), /*#__PURE__*/jsxRuntime.jsx(Alert__default["default"], {
1653
+ isOpen: isDeleteAlertOpen,
1654
+ isSubmitting: isDeleting,
1655
+ submitButtonLabel: t("neetoWebhooks.buttons.delete"),
1656
+ message: t("neetoWebhooks.alert.delete.message", {
1657
+ entity: t("neetoWebhooks.entity.webhook")
1658
+ }),
1659
+ title: t("neetoWebhooks.alert.delete.title", {
1660
+ entity: t("neetoWebhooks.entity.webhook")
1661
+ }),
1662
+ onClose: function onClose() {
1663
+ return setIsDeleteAlertOpen(false);
1664
+ },
1665
+ onSubmit: function onSubmit() {
1666
+ return destroyWebhook(deletingWebhookId, {
1667
+ entityId: entityId
1668
+ });
1669
+ }
1670
+ })]
1671
+ });
1531
1672
  };
1532
1673
  var Webhooks$1 = withReactQuery(Webhooks);
1533
1674
 
@@ -1543,37 +1684,39 @@ var NeetoWebhooks = function NeetoWebhooks(_ref) {
1543
1684
  webhooksUrl = _useRouteMatch.url;
1544
1685
  var deliveriesPath = getDeliveriesPath(webhooksUrl);
1545
1686
  var deliveryDetailsPath = getDeliveryDetailsPath(deliveriesPath);
1546
- return /*#__PURE__*/React__default["default"].createElement(reactRouterDom.Switch, null, /*#__PURE__*/React__default["default"].createElement(reactRouterDom.Route, {
1547
- exact: true,
1548
- path: webhooksPath,
1549
- component: function component() {
1550
- return /*#__PURE__*/React__default["default"].createElement(Webhooks$1, {
1551
- breadcrumbs: breadcrumbs,
1552
- deliveriesPath: deliveriesPath,
1553
- entityId: entityId,
1554
- entityType: entityType,
1555
- onCreate: onCreate,
1556
- onDelete: onDelete
1557
- });
1558
- }
1559
- }), /*#__PURE__*/React__default["default"].createElement(reactRouterDom.Route, {
1560
- exact: true,
1561
- path: deliveryDetailsPath,
1562
- render: function render() {
1563
- return /*#__PURE__*/React__default["default"].createElement(Deliveries$1, {
1564
- breadcrumbs: breadcrumbs,
1565
- webhooksUrl: webhooksUrl
1566
- });
1567
- }
1568
- }), /*#__PURE__*/React__default["default"].createElement(reactRouterDom.Route, {
1569
- component: function component() {
1570
- return /*#__PURE__*/React__default["default"].createElement(Deliveries$1, {
1571
- breadcrumbs: breadcrumbs,
1572
- webhooksUrl: webhooksUrl
1573
- });
1574
- },
1575
- path: deliveriesPath
1576
- }));
1687
+ return /*#__PURE__*/jsxRuntime.jsxs(reactRouterDom.Switch, {
1688
+ children: [/*#__PURE__*/jsxRuntime.jsx(reactRouterDom.Route, {
1689
+ exact: true,
1690
+ path: webhooksPath,
1691
+ component: function component() {
1692
+ return /*#__PURE__*/jsxRuntime.jsx(Webhooks$1, {
1693
+ breadcrumbs: breadcrumbs,
1694
+ deliveriesPath: deliveriesPath,
1695
+ entityId: entityId,
1696
+ entityType: entityType,
1697
+ onCreate: onCreate,
1698
+ onDelete: onDelete
1699
+ });
1700
+ }
1701
+ }), /*#__PURE__*/jsxRuntime.jsx(reactRouterDom.Route, {
1702
+ exact: true,
1703
+ path: deliveryDetailsPath,
1704
+ render: function render() {
1705
+ return /*#__PURE__*/jsxRuntime.jsx(Deliveries$1, {
1706
+ breadcrumbs: breadcrumbs,
1707
+ webhooksUrl: webhooksUrl
1708
+ });
1709
+ }
1710
+ }), /*#__PURE__*/jsxRuntime.jsx(reactRouterDom.Route, {
1711
+ component: function component() {
1712
+ return /*#__PURE__*/jsxRuntime.jsx(Deliveries$1, {
1713
+ breadcrumbs: breadcrumbs,
1714
+ webhooksUrl: webhooksUrl
1715
+ });
1716
+ },
1717
+ path: deliveriesPath
1718
+ })]
1719
+ });
1577
1720
  };
1578
1721
 
1579
1722
  var e=[],t=[];function n(n,r){if(n&&"undefined"!=typeof document){var a,s=!0===r.prepend?"prepend":"append",d=!0===r.singleTag,i="string"==typeof r.container?document.querySelector(r.container):document.getElementsByTagName("head")[0];if(d){var u=e.indexOf(i);-1===u&&(u=e.push(i)-1,t[u]={}),a=t[u]&&t[u][s]?t[u][s]:t[u][s]=c();}else a=c();65279===n.charCodeAt(0)&&(n=n.substring(1)),a.styleSheet?a.styleSheet.cssText+=n:a.appendChild(document.createTextNode(n));}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),r.attributes)for(var t=Object.keys(r.attributes),n=0;n<t.length;n++)e.setAttribute(t[n],r.attributes[t[n]]);var a="prepend"===s?"afterbegin":"beforeend";return i.insertAdjacentElement(a,e),e}}