@bigbinary/neeto-webhooks-frontend 1.6.25 → 1.6.26

package/app/javascript/src/translations/en.json

@@ -49,7 +49,8 @@
       "title": "Webhooks",
       "description": "All new action event details will be posted to the configured webhook URLs",
       "helpDescription": "Receive a webhook when the specified events take place.",
-      "empty": "There are no webhooks defined currently",
+      "empty": "There are no webhooks to show.",
+      "emptyHelpText": "What are webhooks?",
       "add": "Add new webhook",
       "endpoint": "Endpoint",
       "event_one": "Event",

package/dist/index.cjs.js

@@ -24,6 +24,7 @@ var HelpPopover = require('@bigbinary/neeto-molecules/HelpPopover');
 var MoreDropdown = require('@bigbinary/neeto-molecules/MoreDropdown');
 var formik = require('@bigbinary/neetoui/formik');
 var yup = require('yup');
+var reactUtils = require('@bigbinary/neeto-commons-frontend/react-utils');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -976,6 +977,9 @@ var useDestroyWebhook = function useDestroyWebhook(options) {
   });
 };
 
+var WEBHOOK_HELP_URL = "https://neetocalhelp.neetokb.com/p/a-4bb6c2a2";
+var WEBHOOK_SECRETS_HELP_URL = "https://neetocalhelp.neetokb.com/p/a-80de90bd";
+
 function _typeof(o) {
   "@babel/helpers - typeof";
 
@@ -1031,9 +1035,6 @@ var useFetchEvents = function useFetchEvents() {
   });
 };
 
-var WEBHOOK_HELP_URL = "https://neetocalhelp.neetokb.com/p/a-4bb6c2a2";
-var WEBHOOK_SECRETS_HELP_URL = "https://neetocalhelp.neetokb.com/p/a-80de90bd";
-
 // Unique ID creation requires a high quality random # generator. In the browser we therefore
 // require the crypto API and do not support built-in fallback to lower quality random number
 // generators (like Math.random()).
@@ -1386,28 +1387,35 @@ var AddWebhookPane = function AddWebhookPane(_ref) {
   }));
 };
 
-var Header = function Header(_ref) {
-  var breadcrumbs = _ref.breadcrumbs,
+var Header = reactUtils.withT(function (_ref) {
+  var t = _ref.t,
+    breadcrumbs = _ref.breadcrumbs,
     setIsAddWebhookPaneOpen = _ref.setIsAddWebhookPaneOpen;
-  var _useTranslation = reactI18next.useTranslation(),
-    t = _useTranslation.t;
   return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Header__default["default"], {
     breadcrumbs: breadcrumbs,
-    title: t("neetoWebhooks.webhook.title"),
     actionBlock: /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
       "data-cy": "add-new-webhook-button",
       label: t("neetoWebhooks.webhook.add"),
       onClick: function onClick() {
         return setIsAddWebhookPaneOpen(true);
       }
-    })
+    }),
+    title: /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "flex items-center gap-x-2"
+    }, t("neetoWebhooks.webhook.title"), /*#__PURE__*/React__default["default"].createElement(HelpPopover__default["default"], {
+      description: t("neetoWebhooks.webhook.helpDescription"),
+      helpLinkProps: {
+        href: WEBHOOK_HELP_URL
+      },
+      title: t("neetoWebhooks.webhook.title")
+    }))
   }), /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
     className: "mb-3",
     "data-cy": "webhook-description-header",
     style: "h5",
     weight: "normal"
   }, t("neetoWebhooks.webhook.description")));
-};
+});
 var Header$1 = /*#__PURE__*/React__default["default"].memo(Header);
 
 var Webhooks = function Webhooks(_ref) {
@@ -1487,9 +1495,7 @@ var Webhooks = function Webhooks(_ref) {
     fixedHeight: true,
     currentPageNumber: pageNumber,
     defaultPageSize: constants.DEFAULT_PAGE_SIZE,
-    handlePageChange: function handlePageChange(page) {
-      return setPageNumber(page);
-    },
+    handlePageChange: setPageNumber,
     loading: isFetching,
     rowData: webhooks,
     columnData: buildColumns({
@@ -1500,7 +1506,19 @@ var Webhooks = function Webhooks(_ref) {
   })) : /*#__PURE__*/React__default["default"].createElement("div", {
     className: "flex h-full w-full items-center justify-center"
   }, /*#__PURE__*/React__default["default"].createElement(neetoui.NoData, {
-    title: t("neetoWebhooks.webhook.empty")
+    title: t("neetoWebhooks.webhook.empty"),
+    helpText: /*#__PURE__*/React__default["default"].createElement("a", {
+      className: "neeto-ui-text-primary-800 hover:neeto-ui-text-primary-800 visited:neeto-ui-text-primary-600 font-medium",
+      href: WEBHOOK_HELP_URL,
+      rel: "noreferrer",
+      target: "_blank"
+    }, t("neetoWebhooks.webhook.emptyHelpText")),
+    primaryButtonProps: {
+      label: t("neetoWebhooks.webhook.add"),
+      onClick: function onClick() {
+        return setIsAddWebhookPaneOpen(true);
+      }
+    }
   })), /*#__PURE__*/React__default["default"].createElement(AddWebhookPane, {
     editingWebhookId: editingWebhookId,
     entityId: entityId,