@bigbinary/neeto-webhooks-frontend 2.2.4 → 2.2.6

package/README.md

@@ -47,7 +47,7 @@ The engine is used to manage webhooks across neeto products.
 4. Run the following command to copy the migrations from the engine to the host
    application:
    ```zsh
-   bundle exec rails neeto_webhooks_engine:install:migrations
+   rails g neeto_webhooks_engine:install
    ```
 5. Add the migrations to the database:
    ```zsh
@@ -74,6 +74,9 @@ The engine is used to manage webhooks across neeto products.
        cancel: "Booking cancellation"
    ```
 
+8. Add the permission `neeto_webhooks_engine.manage_webhooks` to your
+   `permissions.yml` file.
+
 ### Usage
 
 You can learn more about the setup and usage here:

package/dist/NeetoWebhooks.js

@@ -3,9 +3,9 @@ import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import { isPresent, removeBy, isNotEmpty, removeById, findBy } from '@bigbinary/neeto-cist';
 import { DEFAULT_STALE_TIME, SINGULAR, DEFAULT_PAGE_SIZE, DEFAULT_PAGE_INDEX, PLURAL } from '@bigbinary/neeto-commons-frontend/constants';
 import { useQueryParams, useMutationWithInvalidation, withT } from '@bigbinary/neeto-commons-frontend/react-utils';
+import { buildUrl } from '@bigbinary/neeto-commons-frontend/utils';
 import Container from '@bigbinary/neeto-molecules/Container';
 import Header$2 from '@bigbinary/neeto-molecules/Header';
-import HelpPopover from '@bigbinary/neeto-molecules/HelpPopover';
 import TableWrapper from '@bigbinary/neeto-molecules/TableWrapper';
 import NoData from '@bigbinary/neetoui/NoData';
 import Spinner from '@bigbinary/neetoui/Spinner';
@@ -28,10 +28,10 @@ import Typography from '@bigbinary/neetoui/Typography';
 import Tab from '@bigbinary/neetoui/Tab';
 import Tag from '@bigbinary/neetoui/Tag';
 import { t as t$1 } from 'i18next';
-import { buildUrl } from '@bigbinary/neeto-commons-frontend/utils';
 import { prop, pluck, assoc } from 'ramda';
 import Alert from '@bigbinary/neetoui/Alert';
 import Plus from '@bigbinary/neeto-icons/Plus';
+import HelpPopover from '@bigbinary/neeto-molecules/HelpPopover';
 import MoreDropdown from '@bigbinary/neeto-molecules/MoreDropdown';
 import Input from '@bigbinary/neetoui/formik/Input';
 import Form from '@bigbinary/neetoui/formik/Form';
@@ -58,13 +58,13 @@ var queryClient = new QueryClient({
   }
 });
 
-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; }
-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; }
+function ownKeys$3(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var withReactQuery = function withReactQuery(Component) {
   var QueryWrapper = function QueryWrapper(props) {
     return /*#__PURE__*/jsxs(QueryClientProvider, {
       client: queryClient,
-      children: [/*#__PURE__*/jsx(Component, _objectSpread$2({}, props)), /*#__PURE__*/jsx(ReactQueryDevtools, {
+      children: [/*#__PURE__*/jsx(Component, _objectSpread$3({}, props)), /*#__PURE__*/jsx(ReactQueryDevtools, {
         initialIsOpen: false,
         position: "bottom"
       })]
@@ -359,7 +359,8 @@ var Details = function Details(_ref) {
 };
 
 var buildColumns$1 = function buildColumns(_ref) {
-  var deliveryDetailsPath = _ref.deliveryDetailsPath;
+  var deliveryDetailsPath = _ref.deliveryDetailsPath,
+    page = _ref.page;
   return [{
     title: t$1("neetoWebhooks.delivery.deliveryId"),
     key: "identifier",
@@ -371,7 +372,8 @@ var buildColumns$1 = function buildColumns(_ref) {
         children: [/*#__PURE__*/jsx(Button, {
           style: "link",
           to: buildUrl(deliveryDetailsPath, {
-            deliveryId: delivery.sid
+            deliveryId: delivery.sid,
+            page: page
           }),
           weight: "semibold",
           children: delivery.identifier
@@ -438,6 +440,7 @@ var Deliveries = function Deliveries(_ref) {
   var _useQueryParams = useQueryParams(),
     _useQueryParams$page = _useQueryParams.page,
     page = _useQueryParams$page === void 0 ? DEFAULT_PAGE_INDEX : _useQueryParams$page;
+  var deliveriesPath = getDeliveriesPath(webhooksUrl);
   var deliveryDetailsPath = getDeliveryDetailsPath(deliveriesUrl);
   var _useFetchDeliveries = useFetchDeliveries(webhookId, {
       page: page,
@@ -471,23 +474,22 @@ var Deliveries = function Deliveries(_ref) {
     className: "w-full",
     children: [/*#__PURE__*/jsx(Header$2, {
       breadcrumbs: breadcrumbs,
-      title: /*#__PURE__*/jsxs("div", {
-        className: "flex items-center gap-x-2",
-        children: [t("neetoWebhooks.delivery.title"), /*#__PURE__*/jsx(HelpPopover, {
-          description: t("neetoWebhooks.delivery.helpDescription"),
-          helpLinkProps: {
-            href: HELP_LINK_URLS.deliveries
-          },
-          title: t("neetoWebhooks.delivery.title")
-        })]
-      })
+      title: t("neetoWebhooks.delivery.title"),
+      titleHelpPopoverProps: {
+        title: t("neetoWebhooks.delivery.title"),
+        description: t("neetoWebhooks.delivery.helpDescription"),
+        helpLinkProps: {
+          href: HELP_LINK_URLS.deliveries
+        }
+      }
     }), isNotEmpty(deliveries) ? /*#__PURE__*/jsx(TableWrapper, {
       hasPagination: totalCount > DEFAULT_PAGE_SIZE,
       children: /*#__PURE__*/jsx(Table, {
         totalCount: totalCount,
         fixedHeight: true,
         columnData: buildColumns$1({
-          deliveryDetailsPath: deliveryDetailsPath
+          deliveryDetailsPath: deliveryDetailsPath,
+          page: page
         }),
         currentPageNumber: page,
         defaultPageSize: DEFAULT_PAGE_SIZE,
@@ -504,7 +506,10 @@ var Deliveries = function Deliveries(_ref) {
       deliveryId: deliveryId,
       webhookSid: webhookId,
       onClose: function onClose() {
-        return history.goBack();
+        return history.replace(buildUrl(deliveriesPath, {
+          webhookId: webhookId,
+          page: page
+        }));
       }
     })]
   });
@@ -555,7 +560,7 @@ var useCreateWebhook = function useCreateWebhook(options) {
     keysToInvalidate: [[QUERY_KEYS.WEBHOOK_LIST]],
     onSuccess: function onSuccess() {
       var _options$onSuccess;
-      options === null || options === void 0 ? void 0 : (_options$onSuccess = options.onSuccess) === null || _options$onSuccess === void 0 ? void 0 : _options$onSuccess.call(options);
+      options === null || options === void 0 || (_options$onSuccess = options.onSuccess) === null || _options$onSuccess === void 0 || _options$onSuccess.call(options);
     }
   });
 };
@@ -578,7 +583,7 @@ var useUpdateWebhook = function useUpdateWebhook(id, options) {
     keysToInvalidate: [[QUERY_KEYS.WEBHOOK_LIST], [QUERY_KEYS.WEBHOOK_DETAILS, id], [QUERY_KEYS.DELIVERY_LIST, id]],
     onSuccess: function onSuccess() {
       var _options$onSuccess2;
-      options === null || options === void 0 ? void 0 : (_options$onSuccess2 = options.onSuccess) === null || _options$onSuccess2 === void 0 ? void 0 : _options$onSuccess2.call(options);
+      options === null || options === void 0 || (_options$onSuccess2 = options.onSuccess) === null || _options$onSuccess2 === void 0 || _options$onSuccess2.call(options);
     }
   });
 };
@@ -587,7 +592,7 @@ var useDestroyWebhook = function useDestroyWebhook(options) {
     keysToInvalidate: [[QUERY_KEYS.WEBHOOK_LIST]],
     onSuccess: function onSuccess() {
       var _options$onSuccess3;
-      options === null || options === void 0 ? void 0 : (_options$onSuccess3 = options.onSuccess) === null || _options$onSuccess3 === void 0 ? void 0 : _options$onSuccess3.call(options);
+      options === null || options === void 0 || (_options$onSuccess3 = options.onSuccess) === null || _options$onSuccess3 === void 0 || _options$onSuccess3.call(options);
     }
   });
 };
@@ -677,8 +682,8 @@ var MENU_ITEMS = {
   DELETE: "delete"
 };
 
-function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+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; }
+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; }
 var getMenuItems = function getMenuItems(_ref) {
   var onEdit = _ref.onEdit,
     onDelete = _ref.onDelete;
@@ -712,7 +717,7 @@ var buildPayload = function buildPayload(_ref2) {
       identifier: identifier
     };
   });
-  if (!isEditing) return _objectSpread$1(_objectSpread$1({}, values), {}, {
+  if (!isEditing) return _objectSpread$2(_objectSpread$2({}, values), {}, {
     eventsAttributes: events
   });
   var deletable = ((_initialValues$events = initialValues.events) !== null && _initialValues$events !== void 0 ? _initialValues$events : []).filter(function (_ref4) {
@@ -727,7 +732,7 @@ var buildPayload = function buildPayload(_ref2) {
       identifier: identifier
     }, initialValues.events);
   });
-  return _objectSpread$1(_objectSpread$1({}, values), {}, {
+  return _objectSpread$2(_objectSpread$2({}, values), {}, {
     eventsAttributes: [].concat(_toConsumableArray(creatable), _toConsumableArray(deletable))
   });
 };
@@ -792,8 +797,8 @@ var generateRandomSecret = function generateRandomSecret() {
   return v4().replace(/-/g, "");
 };
 
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var AddWebhookPane = function AddWebhookPane(_ref) {
   var editingWebhookId = _ref.editingWebhookId,
     entityId = _ref.entityId,
@@ -811,7 +816,7 @@ var AddWebhookPane = function AddWebhookPane(_ref) {
   var _useCreateWebhook = useCreateWebhook({
       onSuccess: function onSuccess() {
         onClose();
-        onCreate === null || onCreate === void 0 ? void 0 : onCreate();
+        onCreate === null || onCreate === void 0 || onCreate();
       }
     }),
     createWebhook = _useCreateWebhook.mutate;
@@ -844,7 +849,7 @@ var AddWebhookPane = function AddWebhookPane(_ref) {
       id: editingWebhookId,
       payload: payload,
       entityId: entityId
-    }) : createWebhook(_objectSpread(_objectSpread({}, payload), {}, {
+    }) : createWebhook(_objectSpread$1(_objectSpread$1({}, payload), {}, {
       entityId: entityId,
       entityType: entityType
     }));
@@ -995,10 +1000,13 @@ var AddWebhookPane = function AddWebhookPane(_ref) {
   });
 };
 
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Header = withT(function (_ref) {
   var t = _ref.t,
     breadcrumbs = _ref.breadcrumbs,
     title = _ref.title,
+    titleHelpPopoverProps = _ref.titleHelpPopoverProps,
     setIsAddWebhookPaneOpen = _ref.setIsAddWebhookPaneOpen,
     headerSize = _ref.headerSize,
     webhooks = _ref.webhooks;
@@ -1006,6 +1014,7 @@ var Header = withT(function (_ref) {
     children: [/*#__PURE__*/jsx(Header$2, {
       breadcrumbs: breadcrumbs,
       size: headerSize,
+      title: title || t("neetoWebhooks.webhook.title"),
       actionBlock: /*#__PURE__*/jsx(Button, {
         "data-cy": "add-new-webhook-button",
         label: t("neetoWebhooks.webhook.add"),
@@ -1013,16 +1022,13 @@ var Header = withT(function (_ref) {
           return setIsAddWebhookPaneOpen(true);
         }
       }),
-      title: title || /*#__PURE__*/jsxs("div", {
-        className: "flex items-center gap-x-2",
-        children: [t("neetoWebhooks.webhook.title"), /*#__PURE__*/jsx(HelpPopover, {
-          description: t("neetoWebhooks.webhook.helpDescription"),
-          helpLinkProps: {
-            href: HELP_LINK_URLS.webhook
-          },
-          title: t("neetoWebhooks.webhook.title")
-        })]
-      })
+      titleHelpPopoverProps: _objectSpread({
+        description: t("neetoWebhooks.webhook.helpDescription"),
+        helpLinkProps: {
+          href: HELP_LINK_URLS.webhook
+        },
+        title: t("neetoWebhooks.webhook.title")
+      }, titleHelpPopoverProps)
     }), isNotEmpty(webhooks) && /*#__PURE__*/jsx(SubHeader, {
       leftActionBlock: /*#__PURE__*/jsx(Typography, {
         component: "h4",
@@ -1041,6 +1047,7 @@ var Webhooks = function Webhooks(_ref) {
     entityType = _ref.entityType,
     breadcrumbs = _ref.breadcrumbs,
     title = _ref.title,
+    titleHelpPopoverProps = _ref.titleHelpPopoverProps,
     entityId = _ref.entityId,
     onCreate = _ref.onCreate,
     onDelete = _ref.onDelete,
@@ -1084,7 +1091,7 @@ var Webhooks = function Webhooks(_ref) {
   var _useDestroyWebhook = useDestroyWebhook({
       onSuccess: function onSuccess() {
         setIsDeleteAlertOpen(false);
-        onDelete === null || onDelete === void 0 ? void 0 : onDelete();
+        onDelete === null || onDelete === void 0 || onDelete();
       }
     }),
     isDeleting = _useDestroyWebhook.isPending,
@@ -1114,6 +1121,7 @@ var Webhooks = function Webhooks(_ref) {
       headerSize: headerSize,
       setIsAddWebhookPaneOpen: setIsAddWebhookPaneOpen,
       title: title,
+      titleHelpPopoverProps: titleHelpPopoverProps,
       webhooks: webhooks
     }), isNotEmpty(webhooks) ? /*#__PURE__*/jsx(TableWrapper, {
       hasPagination: totalCount > DEFAULT_PAGE_SIZE,
@@ -1190,6 +1198,7 @@ var NeetoWebhooks = function NeetoWebhooks(_ref) {
     _ref$breadcrumbs = _ref.breadcrumbs,
     breadcrumbs = _ref$breadcrumbs === void 0 ? [] : _ref$breadcrumbs,
     title = _ref.title,
+    titleHelpPopoverProps = _ref.titleHelpPopoverProps,
     onCreate = _ref.onCreate,
     onDelete = _ref.onDelete,
     headerSize = _ref.headerSize,
@@ -1213,7 +1222,8 @@ var NeetoWebhooks = function NeetoWebhooks(_ref) {
           headerSize: headerSize,
           onCreate: onCreate,
           onDelete: onDelete,
-          title: title
+          title: title,
+          titleHelpPopoverProps: titleHelpPopoverProps
         });
       }
     }), /*#__PURE__*/jsx(Route, {