@bigbinary/neeto-webhooks-frontend 1.6.26 → 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.
package/dist/index.js CHANGED
@@ -7,20 +7,34 @@ import Container from '@bigbinary/neeto-molecules/Container';
7
7
  import Header$2 from '@bigbinary/neeto-molecules/Header';
8
8
  import PageLoader from '@bigbinary/neeto-molecules/PageLoader';
9
9
  import TableWrapper from '@bigbinary/neeto-molecules/TableWrapper';
10
- import { Typography, Tag, Tab, Pane, Button, Table, NoData, Spinner, Alert } from '@bigbinary/neetoui';
10
+ import NoData from '@bigbinary/neetoui/NoData';
11
+ import Table from '@bigbinary/neetoui/Table';
11
12
  import { useTranslation } from 'react-i18next';
12
- import { QueryClient, QueryCache, QueryClientProvider, useQuery, useQueryClient, useMutation } from 'react-query';
13
- import { ReactQueryDevtools } from 'react-query/devtools';
13
+ import { QueryClient, QueryCache, QueryClientProvider, useQuery, useQueryClient, useMutation } from '@tanstack/react-query';
14
+ import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
15
+ import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
14
16
  import axios from 'axios';
15
17
  import DateFormat from '@bigbinary/neeto-molecules/DateFormat';
18
+ import Button from '@bigbinary/neetoui/Button';
19
+ import Pane from '@bigbinary/neetoui/Pane';
20
+ import Typography from '@bigbinary/neetoui/Typography';
21
+ import Tab from '@bigbinary/neetoui/Tab';
22
+ import Tag from '@bigbinary/neetoui/Tag';
16
23
  import { t as t$1 } from 'i18next';
17
24
  import { prop, pluck, assoc } from 'ramda';
25
+ import Alert from '@bigbinary/neetoui/Alert';
26
+ import { useMutationWithInvalidation, withT } from '@bigbinary/neeto-commons-frontend/react-utils';
18
27
  import { Plus } from '@bigbinary/neeto-icons';
19
28
  import HelpPopover from '@bigbinary/neeto-molecules/HelpPopover';
20
29
  import MoreDropdown from '@bigbinary/neeto-molecules/MoreDropdown';
21
- import { Form, Textarea, Select, Input, Switch, ActionBlock } from '@bigbinary/neetoui/formik';
30
+ import Spinner from '@bigbinary/neetoui/Spinner';
31
+ import Input from '@bigbinary/neetoui/formik/Input';
32
+ import Form from '@bigbinary/neetoui/formik/Form';
33
+ import ActionBlock from '@bigbinary/neetoui/formik/ActionBlock';
34
+ import Select from '@bigbinary/neetoui/formik/Select';
35
+ import Switch from '@bigbinary/neetoui/formik/Switch';
36
+ import Textarea from '@bigbinary/neetoui/formik/Textarea';
22
37
  import * as yup from 'yup';
23
- import { withT } from '@bigbinary/neeto-commons-frontend/react-utils';
24
38
 
25
39
  var getDeliveriesPath = function getDeliveriesPath(webhooksPath) {
26
40
  return "".concat(webhooksPath, "/:webhookId/deliveries");
@@ -100,6 +114,47 @@ function _slicedToArray(arr, i) {
100
114
  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
101
115
  }
102
116
 
117
+ function _typeof$1(o) {
118
+ "@babel/helpers - typeof";
119
+
120
+ return _typeof$1 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
121
+ return typeof o;
122
+ } : function (o) {
123
+ return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
124
+ }, _typeof$1(o);
125
+ }
126
+
127
+ function _toPrimitive(input, hint) {
128
+ if (_typeof$1(input) !== "object" || input === null) return input;
129
+ var prim = input[Symbol.toPrimitive];
130
+ if (prim !== undefined) {
131
+ var res = prim.call(input, hint || "default");
132
+ if (_typeof$1(res) !== "object") return res;
133
+ throw new TypeError("@@toPrimitive must return a primitive value.");
134
+ }
135
+ return (hint === "string" ? String : Number)(input);
136
+ }
137
+
138
+ function _toPropertyKey(arg) {
139
+ var key = _toPrimitive(arg, "string");
140
+ return _typeof$1(key) === "symbol" ? key : String(key);
141
+ }
142
+
143
+ function _defineProperty(obj, key, value) {
144
+ key = _toPropertyKey(key);
145
+ if (key in obj) {
146
+ Object.defineProperty(obj, key, {
147
+ value: value,
148
+ enumerable: true,
149
+ configurable: true,
150
+ writable: true
151
+ });
152
+ } else {
153
+ obj[key] = value;
154
+ }
155
+ return obj;
156
+ }
157
+
103
158
  var queryClient = new QueryClient({
104
159
  queryCache: new QueryCache(),
105
160
  defaultOptions: {
@@ -109,15 +164,17 @@ var queryClient = new QueryClient({
109
164
  }
110
165
  });
111
166
 
112
- /* eslint-disable @bigbinary/neeto/file-name-and-export-name-standards */
167
+ 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; }
168
+ 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; }
113
169
  var withReactQuery = function withReactQuery(Component) {
114
170
  var QueryWrapper = function QueryWrapper(props) {
115
- return /*#__PURE__*/React.createElement(QueryClientProvider, {
116
- client: queryClient
117
- }, /*#__PURE__*/React.createElement(Component, props), /*#__PURE__*/React.createElement(ReactQueryDevtools, {
118
- initialIsOpen: false,
119
- position: "bottom-right"
120
- }));
171
+ return /*#__PURE__*/jsxs(QueryClientProvider, {
172
+ client: queryClient,
173
+ children: [/*#__PURE__*/jsx(Component, _objectSpread$2({}, props)), /*#__PURE__*/jsx(ReactQueryDevtools, {
174
+ initialIsOpen: false,
175
+ position: "bottom"
176
+ })]
177
+ });
121
178
  };
122
179
  return QueryWrapper;
123
180
  };
@@ -152,28 +209,35 @@ var WEBHOOK_STALE_TIME = 3200000; // 1 hour
152
209
  var POST_REDELIVERY_ON_SUCCESS_TIMEOUT = 5000; // 5 seconds
153
210
 
154
211
  var useFetchDeliveries = function useFetchDeliveries(webhookId, params) {
155
- return useQuery([QUERY_KEYS.DELIVERY_LIST, webhookId, params], function () {
156
- return deliveriesApi.fetch(webhookId, params);
157
- }, {
212
+ return useQuery({
213
+ queryKey: [QUERY_KEYS.DELIVERY_LIST, webhookId, params],
214
+ queryFn: function queryFn() {
215
+ return deliveriesApi.fetch(webhookId, params);
216
+ },
158
217
  staleTime: DELIVERY_STALE_TIME
159
218
  });
160
219
  };
161
220
  var useShowDelivery = function useShowDelivery(id, webhookId) {
162
- return useQuery([QUERY_KEYS.DELIVERY_DETAILS, id, webhookId], function () {
163
- return deliveriesApi.show(id, webhookId);
164
- }, {
221
+ return useQuery({
222
+ queryKey: [QUERY_KEYS.DELIVERY_DETAILS, id, webhookId],
223
+ queryFn: function queryFn() {
224
+ return deliveriesApi.show(id, webhookId);
225
+ },
165
226
  staleTime: DELIVERY_STALE_TIME,
166
227
  enabled: !!id
167
228
  });
168
229
  };
169
230
  var useRedeliverWebhook = function useRedeliverWebhook(deliveryId, webhookSid) {
170
231
  var queryClient = useQueryClient();
171
- return useMutation(function () {
172
- return deliveriesApi.redeliver(deliveryId, webhookSid);
173
- }, {
232
+ return useMutation({
233
+ mutationFn: function mutationFn() {
234
+ return deliveriesApi.redeliver(deliveryId, webhookSid);
235
+ },
174
236
  onSuccess: function onSuccess() {
175
237
  setTimeout(function () {
176
- return queryClient.invalidateQueries(QUERY_KEYS.DELIVERY_LIST);
238
+ return queryClient.invalidateQueries({
239
+ queryKey: [QUERY_KEYS.DELIVERY_LIST]
240
+ });
177
241
  }, POST_REDELIVERY_ON_SUCCESS_TIMEOUT);
178
242
  }
179
243
  });
@@ -216,9 +280,9 @@ function getDefaultExportFromCjs (x) {
216
280
 
217
281
  var regeneratorRuntime$1 = {exports: {}};
218
282
 
219
- var _typeof$1 = {exports: {}};
283
+ var _typeof = {exports: {}};
220
284
 
221
- _typeof$1.exports;
285
+ _typeof.exports;
222
286
 
223
287
  (function (module) {
224
288
  function _typeof(o) {
@@ -231,9 +295,9 @@ _typeof$1.exports;
231
295
  }, module.exports.__esModule = true, module.exports["default"] = module.exports), _typeof(o);
232
296
  }
233
297
  module.exports = _typeof, module.exports.__esModule = true, module.exports["default"] = module.exports;
234
- } (_typeof$1));
298
+ } (_typeof));
235
299
 
236
- var _typeofExports = _typeof$1.exports;
300
+ var _typeofExports = _typeof.exports;
237
301
 
238
302
  regeneratorRuntime$1.exports;
239
303
 
@@ -572,10 +636,11 @@ var Snippet = function Snippet(_ref) {
572
636
  var children = _ref.children,
573
637
  _ref$dataCy = _ref.dataCy,
574
638
  dataCy = _ref$dataCy === void 0 ? "" : _ref$dataCy;
575
- return /*#__PURE__*/React.createElement("div", {
639
+ return /*#__PURE__*/jsx("div", {
576
640
  className: "neeto-ui-rounded neeto-ui-border-gray-300 neeto-ui-bg-gray-100 my-2 whitespace-pre-wrap break-all border p-4",
577
- "data-cy": dataCy
578
- }, children);
641
+ "data-cy": dataCy,
642
+ children: children
643
+ });
579
644
  };
580
645
 
581
646
  var TransactionDetails = function TransactionDetails(_ref) {
@@ -596,57 +661,89 @@ var TransactionDetails = function TransactionDetails(_ref) {
596
661
  return "";
597
662
  }
598
663
  };
599
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
600
- className: "neeto-ui-bg-white sticky top-0 mb-2 flex w-full flex-col"
601
- }, /*#__PURE__*/React.createElement("div", {
602
- className: "flex w-full flex-col space-y-2 pb-4"
603
- }, /*#__PURE__*/React.createElement("span", {
604
- className: "flex items-center space-x-1"
605
- }, t("neetoWebhooks.delivery.identifier"), ":", /*#__PURE__*/React.createElement(Typography, {
606
- className: "px-2 font-bold",
607
- "data-cy": "delivery-identifier",
608
- style: "body2"
609
- }, identifier)), /*#__PURE__*/React.createElement("span", {
610
- className: "flex items-center"
611
- }, t("neetoWebhooks.common.responseStatus"), ":", /*#__PURE__*/React.createElement(Typography, {
612
- className: "px-2 font-bold",
613
- "data-cy": "delivery-response-code",
614
- style: "body2"
615
- }, responseStatusCode), /*#__PURE__*/React.createElement(Tag, {
616
- style: status === "success" ? "success" : "warning"
617
- }, status))), /*#__PURE__*/React.createElement(Tab, null, /*#__PURE__*/React.createElement(Tab.Item, {
618
- active: activeHeader === DELIVERY_TAB.request,
619
- onClick: function onClick() {
620
- return setActiveHeader(DELIVERY_TAB.request);
621
- }
622
- }, t("neetoWebhooks.delivery.request")), /*#__PURE__*/React.createElement(Tab.Item, {
623
- active: activeHeader === DELIVERY_TAB.response,
624
- onClick: function onClick() {
625
- return setActiveHeader(DELIVERY_TAB.response);
626
- }
627
- }, t("neetoWebhooks.delivery.response")))), /*#__PURE__*/React.createElement("div", {
628
- className: "mt-2 w-full"
629
- }, activeHeader === DELIVERY_TAB.request ? /*#__PURE__*/React.createElement("div", {
630
- className: "space-y-4"
631
- }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Typography, {
632
- style: "h5"
633
- }, t("neetoWebhooks.delivery.header")), /*#__PURE__*/React.createElement(Snippet, {
634
- dataCy: "delivery-request-header"
635
- }, delivery.requestHeader)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Typography, {
636
- style: "h5"
637
- }, t("neetoWebhooks.delivery.payload")), /*#__PURE__*/React.createElement(Snippet, {
638
- dataCy: "delivery-request-payload"
639
- }, renderPayload()))) : /*#__PURE__*/React.createElement("div", {
640
- className: "space-y-4"
641
- }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Typography, {
642
- style: "h5"
643
- }, t("neetoWebhooks.delivery.header")), /*#__PURE__*/React.createElement(Snippet, {
644
- dataCy: "delivery-response-header"
645
- }, delivery.responseHeader)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Typography, {
646
- style: "h5"
647
- }, t("neetoWebhooks.delivery.body")), /*#__PURE__*/React.createElement(Snippet, {
648
- dataCy: "delivery-response-body"
649
- }, delivery.responseBody)))));
664
+ return /*#__PURE__*/jsxs(Fragment, {
665
+ children: [/*#__PURE__*/jsxs("div", {
666
+ className: "neeto-ui-bg-white sticky top-0 mb-2 flex w-full flex-col",
667
+ children: [/*#__PURE__*/jsxs("div", {
668
+ className: "flex w-full flex-col space-y-2 pb-4",
669
+ children: [/*#__PURE__*/jsxs("span", {
670
+ className: "flex items-center space-x-1",
671
+ children: [t("neetoWebhooks.delivery.identifier"), ":", /*#__PURE__*/jsx(Typography, {
672
+ className: "px-2 font-bold",
673
+ "data-cy": "delivery-identifier",
674
+ style: "body2",
675
+ children: identifier
676
+ })]
677
+ }), /*#__PURE__*/jsxs("span", {
678
+ className: "flex items-center",
679
+ children: [t("neetoWebhooks.common.responseStatus"), ":", /*#__PURE__*/jsx(Typography, {
680
+ className: "px-2 font-bold",
681
+ "data-cy": "delivery-response-code",
682
+ style: "body2",
683
+ children: responseStatusCode
684
+ }), /*#__PURE__*/jsx(Tag, {
685
+ style: status === "success" ? "success" : "warning",
686
+ children: status
687
+ })]
688
+ })]
689
+ }), /*#__PURE__*/jsxs(Tab, {
690
+ children: [/*#__PURE__*/jsx(Tab.Item, {
691
+ active: activeHeader === DELIVERY_TAB.request,
692
+ onClick: function onClick() {
693
+ return setActiveHeader(DELIVERY_TAB.request);
694
+ },
695
+ children: t("neetoWebhooks.delivery.request")
696
+ }), /*#__PURE__*/jsx(Tab.Item, {
697
+ active: activeHeader === DELIVERY_TAB.response,
698
+ onClick: function onClick() {
699
+ return setActiveHeader(DELIVERY_TAB.response);
700
+ },
701
+ children: t("neetoWebhooks.delivery.response")
702
+ })]
703
+ })]
704
+ }), /*#__PURE__*/jsx("div", {
705
+ className: "mt-2 w-full",
706
+ children: activeHeader === DELIVERY_TAB.request ? /*#__PURE__*/jsxs("div", {
707
+ className: "space-y-4",
708
+ children: [/*#__PURE__*/jsxs("div", {
709
+ children: [/*#__PURE__*/jsx(Typography, {
710
+ style: "h5",
711
+ children: t("neetoWebhooks.delivery.header")
712
+ }), /*#__PURE__*/jsx(Snippet, {
713
+ dataCy: "delivery-request-header",
714
+ children: delivery.requestHeader
715
+ })]
716
+ }), /*#__PURE__*/jsxs("div", {
717
+ children: [/*#__PURE__*/jsx(Typography, {
718
+ style: "h5",
719
+ children: t("neetoWebhooks.delivery.payload")
720
+ }), /*#__PURE__*/jsx(Snippet, {
721
+ dataCy: "delivery-request-payload",
722
+ children: renderPayload()
723
+ })]
724
+ })]
725
+ }) : /*#__PURE__*/jsxs("div", {
726
+ className: "space-y-4",
727
+ children: [/*#__PURE__*/jsxs("div", {
728
+ children: [/*#__PURE__*/jsx(Typography, {
729
+ style: "h5",
730
+ children: t("neetoWebhooks.delivery.header")
731
+ }), /*#__PURE__*/jsx(Snippet, {
732
+ dataCy: "delivery-response-header",
733
+ children: delivery.responseHeader
734
+ })]
735
+ }), /*#__PURE__*/jsxs("div", {
736
+ children: [/*#__PURE__*/jsx(Typography, {
737
+ style: "h5",
738
+ children: t("neetoWebhooks.delivery.body")
739
+ }), /*#__PURE__*/jsx(Snippet, {
740
+ dataCy: "delivery-response-body",
741
+ children: delivery.responseBody
742
+ })]
743
+ })]
744
+ })
745
+ })]
746
+ });
650
747
  };
651
748
 
652
749
  var Details = function Details(_ref) {
@@ -656,7 +753,7 @@ var Details = function Details(_ref) {
656
753
  var _useTranslation = useTranslation(),
657
754
  t = _useTranslation.t;
658
755
  var _useRedeliverWebhook = useRedeliverWebhook(deliveryId, webhookSid),
659
- isRedelivering = _useRedeliverWebhook.isLoading,
756
+ isRedelivering = _useRedeliverWebhook.isPending,
660
757
  redeliverWebhook = _useRedeliverWebhook.mutateAsync;
661
758
  var _useShowDelivery = useShowDelivery(deliveryId, webhookSid),
662
759
  isLoading = _useShowDelivery.isLoading,
@@ -683,43 +780,57 @@ var Details = function Details(_ref) {
683
780
  if (isNotPresent(delivery)) {
684
781
  return null;
685
782
  }
686
- return /*#__PURE__*/React.createElement(Pane, {
783
+ return /*#__PURE__*/jsx(Pane, {
687
784
  onClose: onClose,
688
785
  isOpen: isPresent(deliveryId),
689
- size: "large"
690
- }, /*#__PURE__*/React.createElement(React.Fragment, null, isLoading ? /*#__PURE__*/React.createElement(PageLoader, null) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Pane.Header, null, /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DateFormat.Date, {
691
- date: delivery.createdAt,
692
- tooltipProps: {
693
- disabled: true
694
- },
695
- typographyProps: {
696
- style: "h2",
697
- weight: "semibold"
698
- }
699
- }), /*#__PURE__*/React.createElement("span", null, " \u2022 "), /*#__PURE__*/React.createElement(DateFormat.Time, {
700
- date: delivery.createdAt,
701
- tooltipProps: {
702
- disabled: true
703
- },
704
- typographyProps: {
705
- style: "h2",
706
- weight: "normal"
707
- }
708
- }))), /*#__PURE__*/React.createElement(Pane.Body, null, isPresent(delivery) && /*#__PURE__*/React.createElement(TransactionDetails, {
709
- delivery: delivery
710
- })), /*#__PURE__*/React.createElement(Pane.Footer, {
711
- className: "gap-x-2"
712
- }, event && /*#__PURE__*/React.createElement(Button, {
713
- disabled: isRedelivering,
714
- label: t("neetoWebhooks.delivery.redeliver"),
715
- loading: isRedelivering,
716
- style: "primary",
717
- onClick: handleRedeliverClick
718
- }), /*#__PURE__*/React.createElement(Button, {
719
- label: t("neetoWebhooks.buttons.cancel"),
720
- style: "text",
721
- onClick: onClose
722
- })))));
786
+ size: "large",
787
+ children: /*#__PURE__*/jsx(Fragment, {
788
+ children: isLoading ? /*#__PURE__*/jsx(PageLoader, {}) : /*#__PURE__*/jsxs(Fragment, {
789
+ children: [/*#__PURE__*/jsx(Pane.Header, {
790
+ children: /*#__PURE__*/jsxs(Fragment, {
791
+ children: [/*#__PURE__*/jsx(DateFormat.Date, {
792
+ date: delivery.createdAt,
793
+ tooltipProps: {
794
+ disabled: true
795
+ },
796
+ typographyProps: {
797
+ style: "h2",
798
+ weight: "semibold"
799
+ }
800
+ }), /*#__PURE__*/jsx("span", {
801
+ children: " \u2022 "
802
+ }), /*#__PURE__*/jsx(DateFormat.Time, {
803
+ date: delivery.createdAt,
804
+ tooltipProps: {
805
+ disabled: true
806
+ },
807
+ typographyProps: {
808
+ style: "h2",
809
+ weight: "normal"
810
+ }
811
+ })]
812
+ })
813
+ }), /*#__PURE__*/jsx(Pane.Body, {
814
+ children: isPresent(delivery) && /*#__PURE__*/jsx(TransactionDetails, {
815
+ delivery: delivery
816
+ })
817
+ }), /*#__PURE__*/jsxs(Pane.Footer, {
818
+ className: "gap-x-2",
819
+ children: [event && /*#__PURE__*/jsx(Button, {
820
+ disabled: isRedelivering,
821
+ label: t("neetoWebhooks.delivery.redeliver"),
822
+ loading: isRedelivering,
823
+ style: "primary",
824
+ onClick: handleRedeliverClick
825
+ }), /*#__PURE__*/jsx(Button, {
826
+ label: t("neetoWebhooks.buttons.cancel"),
827
+ style: "text",
828
+ onClick: onClose
829
+ })]
830
+ })]
831
+ })
832
+ })
833
+ });
723
834
  };
724
835
 
725
836
  var buildColumns$1 = function buildColumns(_ref) {
@@ -730,17 +841,20 @@ var buildColumns$1 = function buildColumns(_ref) {
730
841
  dataIndex: "identifier",
731
842
  width: 390,
732
843
  render: function render(_, delivery) {
733
- return /*#__PURE__*/React.createElement("div", {
734
- className: "flex items-center gap-x-3"
735
- }, /*#__PURE__*/React.createElement(Button, {
736
- style: "link",
737
- weight: "semibold",
738
- onClick: function onClick() {
739
- return handleDetailsClick(delivery.sid);
740
- }
741
- }, delivery.identifier), delivery.redelivery && /*#__PURE__*/React.createElement(Tag, {
742
- style: "info"
743
- }, t$1("neetoWebhooks.delivery.redelivery")));
844
+ return /*#__PURE__*/jsxs("div", {
845
+ className: "flex items-center gap-x-3",
846
+ children: [/*#__PURE__*/jsx(Button, {
847
+ style: "link",
848
+ weight: "semibold",
849
+ onClick: function onClick() {
850
+ return handleDetailsClick(delivery.sid);
851
+ },
852
+ children: delivery.identifier
853
+ }), delivery.redelivery && /*#__PURE__*/jsx(Tag, {
854
+ style: "info",
855
+ children: t$1("neetoWebhooks.delivery.redelivery")
856
+ })]
857
+ });
744
858
  }
745
859
  }, {
746
860
  title: t$1("neetoWebhooks.tableHeaders.createdAt"),
@@ -748,11 +862,14 @@ var buildColumns$1 = function buildColumns(_ref) {
748
862
  dataIndex: "createdAt",
749
863
  width: 280,
750
864
  render: function render(createdAt) {
751
- return /*#__PURE__*/React.createElement("div", {
752
- className: "flex items-center justify-between space-x-1"
753
- }, /*#__PURE__*/React.createElement(Typography, null, /*#__PURE__*/React.createElement(DateFormat.DateTime, {
754
- date: createdAt
755
- })));
865
+ return /*#__PURE__*/jsx("div", {
866
+ className: "flex items-center justify-between space-x-1",
867
+ children: /*#__PURE__*/jsx(Typography, {
868
+ children: /*#__PURE__*/jsx(DateFormat.DateTime, {
869
+ date: createdAt
870
+ })
871
+ })
872
+ });
756
873
  }
757
874
  }, {
758
875
  title: t$1("neetoWebhooks.common.responseStatus"),
@@ -761,14 +878,17 @@ var buildColumns$1 = function buildColumns(_ref) {
761
878
  render: function render(_ref2) {
762
879
  var responseStatusCode = _ref2.responseStatusCode,
763
880
  status = _ref2.status;
764
- return /*#__PURE__*/React.createElement("span", {
765
- className: "flex items-center"
766
- }, /*#__PURE__*/React.createElement(Typography, {
767
- className: "px-2",
768
- style: "body2"
769
- }, responseStatusCode), /*#__PURE__*/React.createElement(Tag, {
770
- style: status === "success" ? "success" : "warning"
771
- }, status));
881
+ return /*#__PURE__*/jsxs("span", {
882
+ className: "flex items-center",
883
+ children: [/*#__PURE__*/jsx(Typography, {
884
+ className: "px-2",
885
+ style: "body2",
886
+ children: responseStatusCode
887
+ }), /*#__PURE__*/jsx(Tag, {
888
+ style: status === "success" ? "success" : "warning",
889
+ children: status
890
+ })]
891
+ });
772
892
  }
773
893
  }, {
774
894
  title: t$1("neetoWebhooks.common.event", SINGULAR),
@@ -828,35 +948,38 @@ var Deliveries = function Deliveries(_ref) {
828
948
  webhookId: webhookId
829
949
  }));
830
950
  };
831
- if (isLoading) return /*#__PURE__*/React.createElement(PageLoader, null);
832
- return /*#__PURE__*/React.createElement(Container, {
833
- className: "w-full"
834
- }, /*#__PURE__*/React.createElement(Header$2, {
835
- breadcrumbs: breadcrumbs,
836
- title: t("neetoWebhooks.delivery.title")
837
- }), isNotEmpty(deliveries) ? /*#__PURE__*/React.createElement(TableWrapper, {
838
- hasPagination: totalCount > DEFAULT_PAGE_SIZE
839
- }, /*#__PURE__*/React.createElement(Table, {
840
- totalCount: totalCount,
841
- fixedHeight: true,
842
- columnData: buildColumns$1({
843
- handleDetailsClick: handleDetailsClick
844
- }),
845
- currentPageNumber: pageNumber,
846
- defaultPageSize: DEFAULT_PAGE_SIZE,
847
- handlePageChange: setPageNumber,
848
- loading: isFetching,
849
- rowData: deliveries
850
- })) : /*#__PURE__*/React.createElement("div", {
851
- className: "flex h-full w-full items-center justify-center"
852
- }, /*#__PURE__*/React.createElement(NoData, {
853
- description: t("neetoWebhooks.delivery.empty.description"),
854
- title: t("neetoWebhooks.delivery.empty.title")
855
- })), /*#__PURE__*/React.createElement(Details, {
856
- deliveryId: deliveryId,
857
- webhookSid: webhookId,
858
- onClose: handleClose
859
- }));
951
+ if (isLoading) return /*#__PURE__*/jsx(PageLoader, {});
952
+ return /*#__PURE__*/jsxs(Container, {
953
+ className: "w-full",
954
+ children: [/*#__PURE__*/jsx(Header$2, {
955
+ breadcrumbs: breadcrumbs,
956
+ title: t("neetoWebhooks.delivery.title")
957
+ }), isNotEmpty(deliveries) ? /*#__PURE__*/jsx(TableWrapper, {
958
+ hasPagination: totalCount > DEFAULT_PAGE_SIZE,
959
+ children: /*#__PURE__*/jsx(Table, {
960
+ totalCount: totalCount,
961
+ fixedHeight: true,
962
+ columnData: buildColumns$1({
963
+ handleDetailsClick: handleDetailsClick
964
+ }),
965
+ currentPageNumber: pageNumber,
966
+ defaultPageSize: DEFAULT_PAGE_SIZE,
967
+ handlePageChange: setPageNumber,
968
+ loading: isFetching,
969
+ rowData: deliveries
970
+ })
971
+ }) : /*#__PURE__*/jsx("div", {
972
+ className: "flex h-full w-full items-center justify-center",
973
+ children: /*#__PURE__*/jsx(NoData, {
974
+ description: t("neetoWebhooks.delivery.empty.description"),
975
+ title: t("neetoWebhooks.delivery.empty.title")
976
+ })
977
+ }), /*#__PURE__*/jsx(Details, {
978
+ deliveryId: deliveryId,
979
+ webhookSid: webhookId,
980
+ onClose: handleClose
981
+ })]
982
+ });
860
983
  };
861
984
  var Deliveries$1 = withReactQuery(Deliveries);
862
985
 
@@ -891,52 +1014,51 @@ var webhooksApi = {
891
1014
  };
892
1015
 
893
1016
  var useFetchWebhooks = function useFetchWebhooks(params) {
894
- return useQuery([QUERY_KEYS.WEBHOOK_LIST, params], function () {
895
- return webhooksApi.fetch(params);
896
- }, {
1017
+ return useQuery({
1018
+ queryKey: [QUERY_KEYS.WEBHOOK_LIST, params],
1019
+ queryFn: function queryFn() {
1020
+ return webhooksApi.fetch(params);
1021
+ },
897
1022
  staleTime: WEBHOOK_STALE_TIME
898
1023
  });
899
1024
  };
900
1025
  var useCreateWebhook = function useCreateWebhook(options) {
901
- var queryClient = useQueryClient();
902
- return useMutation(webhooksApi.create, {
1026
+ return useMutationWithInvalidation(webhooksApi.create, {
1027
+ keysToInvalidate: [QUERY_KEYS.WEBHOOK_LIST],
903
1028
  onSuccess: function onSuccess() {
904
1029
  var _options$onSuccess;
905
- queryClient.invalidateQueries(QUERY_KEYS.WEBHOOK_LIST);
906
1030
  options === null || options === void 0 || (_options$onSuccess = options.onSuccess) === null || _options$onSuccess === void 0 || _options$onSuccess.call(options);
907
1031
  }
908
1032
  });
909
1033
  };
910
1034
  var useShowWebhook = function useShowWebhook(id) {
911
- return useQuery([QUERY_KEYS.WEBHOOK_DETAILS, id], function () {
912
- return webhooksApi.show(id);
913
- }, {
1035
+ return useQuery({
1036
+ queryKey: [QUERY_KEYS.WEBHOOK_DETAILS, id],
1037
+ queryFn: function queryFn() {
1038
+ return webhooksApi.show(id);
1039
+ },
914
1040
  enabled: !!id,
915
1041
  staleTime: WEBHOOK_STALE_TIME
916
1042
  });
917
1043
  };
918
1044
  var useUpdateWebhook = function useUpdateWebhook(id, options) {
919
- var queryClient = useQueryClient();
920
- return useMutation(function (_ref) {
1045
+ return useMutationWithInvalidation(function (_ref) {
921
1046
  var id = _ref.id,
922
1047
  payload = _ref.payload;
923
1048
  return webhooksApi.update(id, payload);
924
1049
  }, {
1050
+ keysToInvalidate: [[QUERY_KEYS.WEBHOOK_LIST], [QUERY_KEYS.WEBHOOK_DETAILS, id], [QUERY_KEYS.DELIVERY_LIST, id]],
925
1051
  onSuccess: function onSuccess() {
926
1052
  var _options$onSuccess2;
927
- queryClient.invalidateQueries(QUERY_KEYS.WEBHOOK_LIST);
928
- queryClient.invalidateQueries([QUERY_KEYS.WEBHOOK_DETAILS, id]);
929
- queryClient.invalidateQueries([QUERY_KEYS.DELIVERY_LIST, id]);
930
1053
  options === null || options === void 0 || (_options$onSuccess2 = options.onSuccess) === null || _options$onSuccess2 === void 0 || _options$onSuccess2.call(options);
931
1054
  }
932
1055
  });
933
1056
  };
934
1057
  var useDestroyWebhook = function useDestroyWebhook(options) {
935
- var queryClient = useQueryClient();
936
- return useMutation(webhooksApi.destroy, {
1058
+ return useMutationWithInvalidation(webhooksApi.destroy, {
1059
+ keysToInvalidate: [QUERY_KEYS.WEBHOOK_LIST],
937
1060
  onSuccess: function onSuccess() {
938
1061
  var _options$onSuccess3;
939
- queryClient.invalidateQueries(QUERY_KEYS.WEBHOOK_LIST);
940
1062
  options === null || options === void 0 || (_options$onSuccess3 = options.onSuccess) === null || _options$onSuccess3 === void 0 || _options$onSuccess3.call(options);
941
1063
  }
942
1064
  });
@@ -945,47 +1067,6 @@ var useDestroyWebhook = function useDestroyWebhook(options) {
945
1067
  var WEBHOOK_HELP_URL = "https://neetocalhelp.neetokb.com/p/a-4bb6c2a2";
946
1068
  var WEBHOOK_SECRETS_HELP_URL = "https://neetocalhelp.neetokb.com/p/a-80de90bd";
947
1069
 
948
- function _typeof(o) {
949
- "@babel/helpers - typeof";
950
-
951
- return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
952
- return typeof o;
953
- } : function (o) {
954
- return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
955
- }, _typeof(o);
956
- }
957
-
958
- function _toPrimitive(input, hint) {
959
- if (_typeof(input) !== "object" || input === null) return input;
960
- var prim = input[Symbol.toPrimitive];
961
- if (prim !== undefined) {
962
- var res = prim.call(input, hint || "default");
963
- if (_typeof(res) !== "object") return res;
964
- throw new TypeError("@@toPrimitive must return a primitive value.");
965
- }
966
- return (hint === "string" ? String : Number)(input);
967
- }
968
-
969
- function _toPropertyKey(arg) {
970
- var key = _toPrimitive(arg, "string");
971
- return _typeof(key) === "symbol" ? key : String(key);
972
- }
973
-
974
- function _defineProperty(obj, key, value) {
975
- key = _toPropertyKey(key);
976
- if (key in obj) {
977
- Object.defineProperty(obj, key, {
978
- value: value,
979
- enumerable: true,
980
- configurable: true,
981
- writable: true
982
- });
983
- } else {
984
- obj[key] = value;
985
- }
986
- return obj;
987
- }
988
-
989
1070
  var baseUrl = "/webhooks/events/all";
990
1071
  var all = function all() {
991
1072
  return axios.get(baseUrl);
@@ -995,7 +1076,9 @@ var eventsApi = {
995
1076
  };
996
1077
 
997
1078
  var useFetchEvents = function useFetchEvents() {
998
- return useQuery([QUERY_KEYS.EVENTS_LIST], eventsApi.all, {
1079
+ return useQuery({
1080
+ queryKey: [QUERY_KEYS.EVENTS_LIST],
1081
+ queryFn: eventsApi.all,
999
1082
  staleTime: WEBHOOK_STALE_TIME
1000
1083
  });
1001
1084
  };
@@ -1134,26 +1217,28 @@ var buildColumns = function buildColumns(_ref6) {
1134
1217
  dataIndex: "endpoint",
1135
1218
  width: 830,
1136
1219
  render: function render(endpoint, webhook) {
1137
- return /*#__PURE__*/React.createElement("div", {
1138
- className: "flex items-center justify-between space-x-3"
1139
- }, /*#__PURE__*/React.createElement(Button, {
1140
- style: "link",
1141
- to: buildUrl(deliveriesPath, {
1142
- webhookId: webhook.sid
1143
- })
1144
- }, endpoint), /*#__PURE__*/React.createElement(MoreDropdown, {
1145
- dropdownProps: {
1146
- strategy: "fixed"
1147
- },
1148
- menuItems: getMenuItems({
1149
- onEdit: function onEdit() {
1150
- return handleEdit(webhook.id);
1220
+ return /*#__PURE__*/jsxs("div", {
1221
+ className: "flex items-center justify-between space-x-3",
1222
+ children: [/*#__PURE__*/jsx(Button, {
1223
+ style: "link",
1224
+ to: buildUrl(deliveriesPath, {
1225
+ webhookId: webhook.sid
1226
+ }),
1227
+ children: endpoint
1228
+ }), /*#__PURE__*/jsx(MoreDropdown, {
1229
+ dropdownProps: {
1230
+ strategy: "fixed"
1151
1231
  },
1152
- onDelete: function onDelete() {
1153
- return handleDelete(webhook.id);
1154
- }
1155
- })
1156
- }));
1232
+ menuItems: getMenuItems({
1233
+ onEdit: function onEdit() {
1234
+ return handleEdit(webhook.id);
1235
+ },
1236
+ onDelete: function onDelete() {
1237
+ return handleDelete(webhook.id);
1238
+ }
1239
+ })
1240
+ })]
1241
+ });
1157
1242
  }
1158
1243
  }, {
1159
1244
  title: t$1("neetoWebhooks.webhook.active"),
@@ -1252,134 +1337,153 @@ var AddWebhookPane = function AddWebhookPane(_ref) {
1252
1337
  setIsSecretInputFieldVisible(true);
1253
1338
  }
1254
1339
  }, [webhook]);
1255
- return /*#__PURE__*/React.createElement(Pane, {
1340
+ return /*#__PURE__*/jsxs(Pane, {
1256
1341
  isOpen: isOpen,
1257
1342
  onClose: onClose,
1258
- initialFocusRef: endpointRef
1259
- }, /*#__PURE__*/React.createElement(Pane.Header, {
1260
- className: "flex items-center gap-x-2"
1261
- }, /*#__PURE__*/React.createElement(Typography, {
1262
- "data-cy": "add-new-webhook-pane-header",
1263
- style: "h2",
1264
- weight: "semibold"
1265
- }, editingWebhookId ? t("neetoWebhooks.webhook.edit") : t("neetoWebhooks.webhook.add")), /*#__PURE__*/React.createElement(HelpPopover, {
1266
- description: t("neetoWebhooks.webhook.helpDescription"),
1267
- helpLinkProps: {
1268
- href: WEBHOOK_HELP_URL
1269
- },
1270
- title: t("neetoWebhooks.webhook.title")
1271
- })), /*#__PURE__*/React.createElement(Form, {
1272
- formikProps: {
1273
- enableReinitialize: true,
1274
- validationSchema: getValidationSchema(webhooks),
1275
- initialValues: initialValues,
1276
- onSubmit: function onSubmit(values) {
1277
- return handleSubmit(getValidationSchema().cast(values));
1278
- }
1279
- }
1280
- }, function (_ref2) {
1281
- var setFieldValue = _ref2.setFieldValue;
1282
- return isLoading ? /*#__PURE__*/React.createElement("div", {
1283
- className: "flex items-center justify-center"
1284
- }, /*#__PURE__*/React.createElement(Spinner, null)) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Pane.Body, null, /*#__PURE__*/React.createElement("div", {
1285
- className: "w-full space-y-4"
1286
- }, /*#__PURE__*/React.createElement(Textarea, {
1287
- required: true,
1288
- "data-cy": "endpoint-input-field",
1289
- label: t("neetoWebhooks.webhook.endpoint"),
1290
- name: "endpoint",
1291
- placeholder: t("neetoWebhooks.webhook.endpointPlaceholder"),
1292
- ref: endpointRef,
1293
- rows: 1
1294
- }), !isLoading && /*#__PURE__*/React.createElement(Select, {
1295
- isMulti: true,
1296
- required: true,
1297
- getOptionLabel: prop("label"),
1298
- getOptionValue: prop("identifier"),
1299
- label: t("neetoWebhooks.common.event", PLURAL),
1300
- name: "events",
1301
- options: events,
1302
- placeholder: t("neetoWebhooks.webhook.eventPlaceholder")
1303
- }), isSecretInputFieldVisible && /*#__PURE__*/React.createElement("div", {
1304
- className: "flex items-center justify-between space-x-3"
1305
- }, /*#__PURE__*/React.createElement(Input, {
1306
- "data-cy": "secret-key-input-field",
1307
- name: "secret",
1308
- label: /*#__PURE__*/React.createElement("span", {
1309
- className: "flex items-center gap-x-2"
1310
- }, t("neetoWebhooks.webhook.secret"), /*#__PURE__*/React.createElement(HelpPopover, {
1343
+ initialFocusRef: endpointRef,
1344
+ children: [/*#__PURE__*/jsxs(Pane.Header, {
1345
+ className: "flex items-center gap-x-2",
1346
+ children: [/*#__PURE__*/jsx(Typography, {
1347
+ "data-cy": "add-new-webhook-pane-header",
1348
+ style: "h2",
1349
+ weight: "semibold",
1350
+ children: editingWebhookId ? t("neetoWebhooks.webhook.edit") : t("neetoWebhooks.webhook.add")
1351
+ }), /*#__PURE__*/jsx(HelpPopover, {
1352
+ description: t("neetoWebhooks.webhook.helpDescription"),
1311
1353
  helpLinkProps: {
1312
- href: WEBHOOK_SECRETS_HELP_URL
1354
+ href: WEBHOOK_HELP_URL
1313
1355
  },
1314
- description: t("neetoWebhooks.webhook.secretkeyHelpDescription"),
1315
- title: t("neetoWebhooks.webhook.secretkeyHelpTitle")
1316
- })),
1317
- placeholder: t("neetoWebhooks.webhook.secretPlaceholder")
1318
- }), /*#__PURE__*/React.createElement("div", {
1319
- className: "mt-6"
1320
- }, /*#__PURE__*/React.createElement(MoreDropdown, {
1321
- menuItems: [{
1322
- key: "regenerate-secret",
1323
- label: t("neetoWebhooks.buttons.regenerate"),
1324
- "data-cy": "regenerate-secret",
1325
- onClick: function onClick() {
1326
- return handleRegenerate(setFieldValue);
1327
- }
1328
- }, {
1329
- key: "delete-secret",
1330
- label: t("neetoWebhooks.buttons.delete"),
1331
- "data-cy": "delete-secret",
1332
- onClick: function onClick() {
1333
- return handleDelete(setFieldValue);
1356
+ title: t("neetoWebhooks.webhook.title")
1357
+ })]
1358
+ }), /*#__PURE__*/jsx(Form, {
1359
+ formikProps: {
1360
+ enableReinitialize: true,
1361
+ validationSchema: getValidationSchema(webhooks),
1362
+ initialValues: initialValues,
1363
+ onSubmit: function onSubmit(values) {
1364
+ return handleSubmit(getValidationSchema().cast(values));
1334
1365
  }
1335
- }]
1336
- }))), /*#__PURE__*/React.createElement(Switch, {
1337
- label: t("neetoWebhooks.webhook.active"),
1338
- name: "isActive"
1339
- }), !isSecretInputFieldVisible && /*#__PURE__*/React.createElement(Button, {
1340
- "data-cy": "add-secret-key",
1341
- icon: Plus,
1342
- label: t("neetoWebhooks.buttons.addSecretKey"),
1343
- style: "text",
1344
- onClick: function onClick() {
1345
- return handleClick(setFieldValue);
1346
- }
1347
- }))), /*#__PURE__*/React.createElement(Pane.Footer, null, /*#__PURE__*/React.createElement(ActionBlock, {
1348
- cancelButtonProps: {
1349
- onClick: onClose
1366
+ },
1367
+ children: function children(_ref2) {
1368
+ var setFieldValue = _ref2.setFieldValue;
1369
+ return isLoading ? /*#__PURE__*/jsx("div", {
1370
+ className: "flex items-center justify-center",
1371
+ children: /*#__PURE__*/jsx(Spinner, {})
1372
+ }) : /*#__PURE__*/jsxs(Fragment, {
1373
+ children: [/*#__PURE__*/jsx(Pane.Body, {
1374
+ children: /*#__PURE__*/jsxs("div", {
1375
+ className: "w-full space-y-4",
1376
+ children: [/*#__PURE__*/jsx(Textarea, {
1377
+ required: true,
1378
+ "data-cy": "endpoint-input-field",
1379
+ label: t("neetoWebhooks.webhook.endpoint"),
1380
+ name: "endpoint",
1381
+ placeholder: t("neetoWebhooks.webhook.endpointPlaceholder"),
1382
+ ref: endpointRef,
1383
+ rows: 1
1384
+ }), !isLoading && /*#__PURE__*/jsx(Select, {
1385
+ isMulti: true,
1386
+ required: true,
1387
+ getOptionLabel: prop("label"),
1388
+ getOptionValue: prop("identifier"),
1389
+ label: t("neetoWebhooks.common.event", PLURAL),
1390
+ name: "events",
1391
+ options: events,
1392
+ placeholder: t("neetoWebhooks.webhook.eventPlaceholder")
1393
+ }), isSecretInputFieldVisible && /*#__PURE__*/jsxs("div", {
1394
+ className: "flex items-center justify-between space-x-3",
1395
+ children: [/*#__PURE__*/jsx(Input, {
1396
+ "data-cy": "secret-key-input-field",
1397
+ name: "secret",
1398
+ label: /*#__PURE__*/jsxs("span", {
1399
+ className: "flex items-center gap-x-2",
1400
+ children: [t("neetoWebhooks.webhook.secret"), /*#__PURE__*/jsx(HelpPopover, {
1401
+ helpLinkProps: {
1402
+ href: WEBHOOK_SECRETS_HELP_URL
1403
+ },
1404
+ description: t("neetoWebhooks.webhook.secretkeyHelpDescription"),
1405
+ title: t("neetoWebhooks.webhook.secretkeyHelpTitle")
1406
+ })]
1407
+ }),
1408
+ placeholder: t("neetoWebhooks.webhook.secretPlaceholder")
1409
+ }), /*#__PURE__*/jsx("div", {
1410
+ className: "mt-6",
1411
+ children: /*#__PURE__*/jsx(MoreDropdown, {
1412
+ menuItems: [{
1413
+ key: "regenerate-secret",
1414
+ label: t("neetoWebhooks.buttons.regenerate"),
1415
+ "data-cy": "regenerate-secret",
1416
+ onClick: function onClick() {
1417
+ return handleRegenerate(setFieldValue);
1418
+ }
1419
+ }, {
1420
+ key: "delete-secret",
1421
+ label: t("neetoWebhooks.buttons.delete"),
1422
+ "data-cy": "delete-secret",
1423
+ onClick: function onClick() {
1424
+ return handleDelete(setFieldValue);
1425
+ }
1426
+ }]
1427
+ })
1428
+ })]
1429
+ }), /*#__PURE__*/jsx(Switch, {
1430
+ label: t("neetoWebhooks.webhook.active"),
1431
+ name: "isActive"
1432
+ }), !isSecretInputFieldVisible && /*#__PURE__*/jsx(Button, {
1433
+ "data-cy": "add-secret-key",
1434
+ icon: Plus,
1435
+ label: t("neetoWebhooks.buttons.addSecretKey"),
1436
+ style: "text",
1437
+ onClick: function onClick() {
1438
+ return handleClick(setFieldValue);
1439
+ }
1440
+ })]
1441
+ })
1442
+ }), /*#__PURE__*/jsx(Pane.Footer, {
1443
+ children: /*#__PURE__*/jsx(ActionBlock, {
1444
+ cancelButtonProps: {
1445
+ onClick: onClose
1446
+ }
1447
+ })
1448
+ })]
1449
+ });
1350
1450
  }
1351
- })));
1352
- }));
1451
+ })]
1452
+ });
1353
1453
  };
1354
1454
 
1355
1455
  var Header = withT(function (_ref) {
1356
1456
  var t = _ref.t,
1357
1457
  breadcrumbs = _ref.breadcrumbs,
1358
1458
  setIsAddWebhookPaneOpen = _ref.setIsAddWebhookPaneOpen;
1359
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Header$2, {
1360
- breadcrumbs: breadcrumbs,
1361
- actionBlock: /*#__PURE__*/React.createElement(Button, {
1362
- "data-cy": "add-new-webhook-button",
1363
- label: t("neetoWebhooks.webhook.add"),
1364
- onClick: function onClick() {
1365
- return setIsAddWebhookPaneOpen(true);
1366
- }
1367
- }),
1368
- title: /*#__PURE__*/React.createElement("div", {
1369
- className: "flex items-center gap-x-2"
1370
- }, t("neetoWebhooks.webhook.title"), /*#__PURE__*/React.createElement(HelpPopover, {
1371
- description: t("neetoWebhooks.webhook.helpDescription"),
1372
- helpLinkProps: {
1373
- href: WEBHOOK_HELP_URL
1374
- },
1375
- title: t("neetoWebhooks.webhook.title")
1376
- }))
1377
- }), /*#__PURE__*/React.createElement(Typography, {
1378
- className: "mb-3",
1379
- "data-cy": "webhook-description-header",
1380
- style: "h5",
1381
- weight: "normal"
1382
- }, t("neetoWebhooks.webhook.description")));
1459
+ return /*#__PURE__*/jsxs(Fragment, {
1460
+ children: [/*#__PURE__*/jsx(Header$2, {
1461
+ breadcrumbs: breadcrumbs,
1462
+ actionBlock: /*#__PURE__*/jsx(Button, {
1463
+ "data-cy": "add-new-webhook-button",
1464
+ label: t("neetoWebhooks.webhook.add"),
1465
+ onClick: function onClick() {
1466
+ return setIsAddWebhookPaneOpen(true);
1467
+ }
1468
+ }),
1469
+ title: /*#__PURE__*/jsxs("div", {
1470
+ className: "flex items-center gap-x-2",
1471
+ children: [t("neetoWebhooks.webhook.title"), /*#__PURE__*/jsx(HelpPopover, {
1472
+ description: t("neetoWebhooks.webhook.helpDescription"),
1473
+ helpLinkProps: {
1474
+ href: WEBHOOK_HELP_URL
1475
+ },
1476
+ title: t("neetoWebhooks.webhook.title")
1477
+ })]
1478
+ })
1479
+ }), /*#__PURE__*/jsx(Typography, {
1480
+ className: "mb-3",
1481
+ "data-cy": "webhook-description-header",
1482
+ style: "h5",
1483
+ weight: "normal",
1484
+ children: t("neetoWebhooks.webhook.description")
1485
+ })]
1486
+ });
1383
1487
  });
1384
1488
  var Header$1 = /*#__PURE__*/React.memo(Header);
1385
1489
 
@@ -1431,7 +1535,7 @@ var Webhooks = function Webhooks(_ref) {
1431
1535
  onDelete === null || onDelete === void 0 || onDelete();
1432
1536
  }
1433
1537
  }),
1434
- isDeleting = _useDestroyWebhook.isLoading,
1538
+ isDeleting = _useDestroyWebhook.isPending,
1435
1539
  destroyWebhook = _useDestroyWebhook.mutate;
1436
1540
  var handlePaneClose = function handlePaneClose() {
1437
1541
  setEditingWebhookId(null);
@@ -1446,71 +1550,75 @@ var Webhooks = function Webhooks(_ref) {
1446
1550
  setIsDeleteAlertOpen(true);
1447
1551
  }, []);
1448
1552
  if (isLoading) {
1449
- return /*#__PURE__*/React.createElement(PageLoader, null);
1553
+ return /*#__PURE__*/jsx(PageLoader, {});
1450
1554
  }
1451
- return /*#__PURE__*/React.createElement(Container, {
1452
- className: "w-full"
1453
- }, /*#__PURE__*/React.createElement(Header$1, {
1454
- breadcrumbs: breadcrumbs,
1455
- setIsAddWebhookPaneOpen: setIsAddWebhookPaneOpen
1456
- }), isNotEmpty(webhooks) ? /*#__PURE__*/React.createElement(TableWrapper, {
1457
- hasPagination: totalCount > DEFAULT_PAGE_SIZE
1458
- }, /*#__PURE__*/React.createElement(Table, {
1459
- totalCount: totalCount,
1460
- fixedHeight: true,
1461
- currentPageNumber: pageNumber,
1462
- defaultPageSize: DEFAULT_PAGE_SIZE,
1463
- handlePageChange: setPageNumber,
1464
- loading: isFetching,
1465
- rowData: webhooks,
1466
- columnData: buildColumns({
1467
- handleDelete: handleDelete,
1468
- handleEdit: handleEdit,
1469
- deliveriesPath: deliveriesPath
1470
- })
1471
- })) : /*#__PURE__*/React.createElement("div", {
1472
- className: "flex h-full w-full items-center justify-center"
1473
- }, /*#__PURE__*/React.createElement(NoData, {
1474
- title: t("neetoWebhooks.webhook.empty"),
1475
- helpText: /*#__PURE__*/React.createElement("a", {
1476
- className: "neeto-ui-text-primary-800 hover:neeto-ui-text-primary-800 visited:neeto-ui-text-primary-600 font-medium",
1477
- href: WEBHOOK_HELP_URL,
1478
- rel: "noreferrer",
1479
- target: "_blank"
1480
- }, t("neetoWebhooks.webhook.emptyHelpText")),
1481
- primaryButtonProps: {
1482
- label: t("neetoWebhooks.webhook.add"),
1483
- onClick: function onClick() {
1484
- return setIsAddWebhookPaneOpen(true);
1555
+ return /*#__PURE__*/jsxs(Container, {
1556
+ className: "w-full",
1557
+ children: [/*#__PURE__*/jsx(Header$1, {
1558
+ breadcrumbs: breadcrumbs,
1559
+ setIsAddWebhookPaneOpen: setIsAddWebhookPaneOpen
1560
+ }), isNotEmpty(webhooks) ? /*#__PURE__*/jsx(TableWrapper, {
1561
+ hasPagination: totalCount > DEFAULT_PAGE_SIZE,
1562
+ children: /*#__PURE__*/jsx(Table, {
1563
+ totalCount: totalCount,
1564
+ fixedHeight: true,
1565
+ currentPageNumber: pageNumber,
1566
+ defaultPageSize: DEFAULT_PAGE_SIZE,
1567
+ handlePageChange: setPageNumber,
1568
+ loading: isFetching,
1569
+ rowData: webhooks,
1570
+ columnData: buildColumns({
1571
+ handleDelete: handleDelete,
1572
+ handleEdit: handleEdit,
1573
+ deliveriesPath: deliveriesPath
1574
+ })
1575
+ })
1576
+ }) : /*#__PURE__*/jsx("div", {
1577
+ className: "flex h-full w-full items-center justify-center",
1578
+ children: /*#__PURE__*/jsx(NoData, {
1579
+ title: t("neetoWebhooks.webhook.empty"),
1580
+ helpText: /*#__PURE__*/jsx("a", {
1581
+ className: "neeto-ui-text-primary-800 hover:neeto-ui-text-primary-800 visited:neeto-ui-text-primary-600 font-medium",
1582
+ href: WEBHOOK_HELP_URL,
1583
+ rel: "noreferrer",
1584
+ target: "_blank",
1585
+ children: t("neetoWebhooks.webhook.emptyHelpText")
1586
+ }),
1587
+ primaryButtonProps: {
1588
+ label: t("neetoWebhooks.webhook.add"),
1589
+ onClick: function onClick() {
1590
+ return setIsAddWebhookPaneOpen(true);
1591
+ }
1592
+ }
1593
+ })
1594
+ }), /*#__PURE__*/jsx(AddWebhookPane, {
1595
+ editingWebhookId: editingWebhookId,
1596
+ entityId: entityId,
1597
+ entityType: entityType,
1598
+ onCreate: onCreate,
1599
+ webhooks: webhooks,
1600
+ isOpen: isAddWebhookPaneOpen,
1601
+ onClose: handlePaneClose
1602
+ }), /*#__PURE__*/jsx(Alert, {
1603
+ isOpen: isDeleteAlertOpen,
1604
+ isSubmitting: isDeleting,
1605
+ submitButtonLabel: t("neetoWebhooks.buttons.delete"),
1606
+ message: t("neetoWebhooks.alert.delete.message", {
1607
+ entity: t("neetoWebhooks.entity.webhook")
1608
+ }),
1609
+ title: t("neetoWebhooks.alert.delete.title", {
1610
+ entity: t("neetoWebhooks.entity.webhook")
1611
+ }),
1612
+ onClose: function onClose() {
1613
+ return setIsDeleteAlertOpen(false);
1614
+ },
1615
+ onSubmit: function onSubmit() {
1616
+ return destroyWebhook(deletingWebhookId, {
1617
+ entityId: entityId
1618
+ });
1485
1619
  }
1486
- }
1487
- })), /*#__PURE__*/React.createElement(AddWebhookPane, {
1488
- editingWebhookId: editingWebhookId,
1489
- entityId: entityId,
1490
- entityType: entityType,
1491
- onCreate: onCreate,
1492
- webhooks: webhooks,
1493
- isOpen: isAddWebhookPaneOpen,
1494
- onClose: handlePaneClose
1495
- }), /*#__PURE__*/React.createElement(Alert, {
1496
- isOpen: isDeleteAlertOpen,
1497
- isSubmitting: isDeleting,
1498
- submitButtonLabel: t("neetoWebhooks.buttons.delete"),
1499
- message: t("neetoWebhooks.alert.delete.message", {
1500
- entity: t("neetoWebhooks.entity.webhook")
1501
- }),
1502
- title: t("neetoWebhooks.alert.delete.title", {
1503
- entity: t("neetoWebhooks.entity.webhook")
1504
- }),
1505
- onClose: function onClose() {
1506
- return setIsDeleteAlertOpen(false);
1507
- },
1508
- onSubmit: function onSubmit() {
1509
- return destroyWebhook(deletingWebhookId, {
1510
- entityId: entityId
1511
- });
1512
- }
1513
- }));
1620
+ })]
1621
+ });
1514
1622
  };
1515
1623
  var Webhooks$1 = withReactQuery(Webhooks);
1516
1624
 
@@ -1526,37 +1634,39 @@ var NeetoWebhooks = function NeetoWebhooks(_ref) {
1526
1634
  webhooksUrl = _useRouteMatch.url;
1527
1635
  var deliveriesPath = getDeliveriesPath(webhooksUrl);
1528
1636
  var deliveryDetailsPath = getDeliveryDetailsPath(deliveriesPath);
1529
- return /*#__PURE__*/React.createElement(Switch$1, null, /*#__PURE__*/React.createElement(Route, {
1530
- exact: true,
1531
- path: webhooksPath,
1532
- component: function component() {
1533
- return /*#__PURE__*/React.createElement(Webhooks$1, {
1534
- breadcrumbs: breadcrumbs,
1535
- deliveriesPath: deliveriesPath,
1536
- entityId: entityId,
1537
- entityType: entityType,
1538
- onCreate: onCreate,
1539
- onDelete: onDelete
1540
- });
1541
- }
1542
- }), /*#__PURE__*/React.createElement(Route, {
1543
- exact: true,
1544
- path: deliveryDetailsPath,
1545
- render: function render() {
1546
- return /*#__PURE__*/React.createElement(Deliveries$1, {
1547
- breadcrumbs: breadcrumbs,
1548
- webhooksUrl: webhooksUrl
1549
- });
1550
- }
1551
- }), /*#__PURE__*/React.createElement(Route, {
1552
- component: function component() {
1553
- return /*#__PURE__*/React.createElement(Deliveries$1, {
1554
- breadcrumbs: breadcrumbs,
1555
- webhooksUrl: webhooksUrl
1556
- });
1557
- },
1558
- path: deliveriesPath
1559
- }));
1637
+ return /*#__PURE__*/jsxs(Switch$1, {
1638
+ children: [/*#__PURE__*/jsx(Route, {
1639
+ exact: true,
1640
+ path: webhooksPath,
1641
+ component: function component() {
1642
+ return /*#__PURE__*/jsx(Webhooks$1, {
1643
+ breadcrumbs: breadcrumbs,
1644
+ deliveriesPath: deliveriesPath,
1645
+ entityId: entityId,
1646
+ entityType: entityType,
1647
+ onCreate: onCreate,
1648
+ onDelete: onDelete
1649
+ });
1650
+ }
1651
+ }), /*#__PURE__*/jsx(Route, {
1652
+ exact: true,
1653
+ path: deliveryDetailsPath,
1654
+ render: function render() {
1655
+ return /*#__PURE__*/jsx(Deliveries$1, {
1656
+ breadcrumbs: breadcrumbs,
1657
+ webhooksUrl: webhooksUrl
1658
+ });
1659
+ }
1660
+ }), /*#__PURE__*/jsx(Route, {
1661
+ component: function component() {
1662
+ return /*#__PURE__*/jsx(Deliveries$1, {
1663
+ breadcrumbs: breadcrumbs,
1664
+ webhooksUrl: webhooksUrl
1665
+ });
1666
+ },
1667
+ path: deliveriesPath
1668
+ })]
1669
+ });
1560
1670
  };
1561
1671
 
1562
1672
  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}}