@bigbinary/neeto-message-templates-frontend 0.8.0-beta1 → 1.0.1

package/dist/index.cjs.js

@@ -23,7 +23,7 @@ var require$$0 = require('util');
 var zustand = require('zustand');
 var jsxRuntime = require('react/jsx-runtime');
 var Pane = require('@bigbinary/neetoui/Pane');
-var neetoEditor = require('@bigbinary/neeto-editor');
+var FormikEditor = require('@bigbinary/neeto-editor/FormikEditor');
 var NeetoUIForm = require('@bigbinary/neetoui/formik/Form');
 var Input = require('@bigbinary/neetoui/formik/Input');
 var ActionBlock = require('@bigbinary/neetoui/formik/ActionBlock');
@@ -39,7 +39,7 @@ var Spinner = require('@bigbinary/neetoui/Spinner');
 var Select = require('@bigbinary/neetoui/Select');
 var Textarea$1 = require('@bigbinary/neetoui/Textarea');
 var Select$1 = require('@bigbinary/neetoui/formik/Select');
-var neetoIcons = require('@bigbinary/neeto-icons');
+var Delete = require('@bigbinary/neeto-icons/Delete');
 var Label = require('@bigbinary/neetoui/Label');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -72,6 +72,7 @@ var MoreDropdown__default = /*#__PURE__*/_interopDefaultLegacy(MoreDropdown);
 var axios__default = /*#__PURE__*/_interopDefaultLegacy(axios);
 var require$$0__default = /*#__PURE__*/_interopDefaultLegacy(require$$0);
 var Pane__default = /*#__PURE__*/_interopDefaultLegacy(Pane);
+var FormikEditor__default = /*#__PURE__*/_interopDefaultLegacy(FormikEditor);
 var NeetoUIForm__default = /*#__PURE__*/_interopDefaultLegacy(NeetoUIForm);
 var Input__default = /*#__PURE__*/_interopDefaultLegacy(Input);
 var ActionBlock__default = /*#__PURE__*/_interopDefaultLegacy(ActionBlock);
@@ -85,6 +86,7 @@ var Spinner__default = /*#__PURE__*/_interopDefaultLegacy(Spinner);
 var Select__default = /*#__PURE__*/_interopDefaultLegacy(Select);
 var Textarea__default$1 = /*#__PURE__*/_interopDefaultLegacy(Textarea$1);
 var Select__default$1 = /*#__PURE__*/_interopDefaultLegacy(Select$1);
+var Delete__default = /*#__PURE__*/_interopDefaultLegacy(Delete);
 var Label__default = /*#__PURE__*/_interopDefaultLegacy(Label);
 
 function _typeof$1(o) {
@@ -2352,7 +2354,7 @@ var useCreateTemplate = function useCreateTemplate(ownerId, options) {
       ownerId: ownerIdValue(ownerId)
     });
   }, _objectSpread$d({
-    keysToInvalidate: [QUERY_KEYS.NEETO_MESSAGE_TEMPLATES]
+    keysToInvalidate: [[QUERY_KEYS.NEETO_MESSAGE_TEMPLATES]]
   }, options));
 };
 var useUpdateTemplate = function useUpdateTemplate(ownerId) {
@@ -2365,7 +2367,7 @@ var useUpdateTemplate = function useUpdateTemplate(ownerId) {
       ownerId: ownerIdValue(ownerId)
     });
   }, {
-    keysToInvalidate: [QUERY_KEYS.NEETO_MESSAGE_TEMPLATES]
+    keysToInvalidate: [[QUERY_KEYS.NEETO_MESSAGE_TEMPLATES]]
   });
 };
 var useDeleteTemplate = function useDeleteTemplate(ownerId) {
@@ -2375,7 +2377,7 @@ var useDeleteTemplate = function useDeleteTemplate(ownerId) {
       ownerId: ownerIdValue(ownerId)
     });
   }, {
-    keysToInvalidate: [QUERY_KEYS.NEETO_MESSAGE_TEMPLATES]
+    keysToInvalidate: [[QUERY_KEYS.NEETO_MESSAGE_TEMPLATES]]
   });
 };
 
@@ -3159,7 +3161,7 @@ var Form$1 = function Form(_ref) {
       required: true,
       label: t("neetoMessageTemplate.template.emailSubject"),
       name: "subject"
-    }), /*#__PURE__*/jsxRuntime.jsx(neetoEditor.FormikEditor, {
+    }), /*#__PURE__*/jsxRuntime.jsx(FormikEditor__default["default"], {
       hideSlashCommands: true,
       required: true,
       contentClassName: "max-h-40",
@@ -3516,6 +3518,7 @@ var MessageTemplates = function MessageTemplates(_ref) {
       templateType: value
     });
   }, [value]);
+  var shouldShowTemplatesCount = !isLoading && (isFilterApplied || templatesCount > 0);
   return /*#__PURE__*/jsxRuntime.jsxs(Container__default["default"], {
     children: [/*#__PURE__*/jsxRuntime.jsx(NeetoHeader__default["default"], {
       breadcrumbs: breadcrumbs,
@@ -3537,7 +3540,7 @@ var MessageTemplates = function MessageTemplates(_ref) {
         })]
       })
     }), /*#__PURE__*/jsxRuntime.jsx(SubHeader__default["default"], {
-      leftActionBlock: /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
+      leftActionBlock: shouldShowTemplatesCount && /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
         component: "h4",
         children: t("neetoMessageTemplate.template.messageTemplatesWithCount", {
           type: MESSAGE_TYPES[type],
@@ -3699,13 +3702,14 @@ var EmailAndSms = function EmailAndSms(_ref) {
       var setValues = _ref4.setValues,
         values = _ref4.values;
       var handleTemplateChange = function handleTemplateChange(value) {
+        var _editorRef$current;
         if (!value) return;
         var customFieldValues = ramda.omit(initialValueKeys, values);
         var template = neetoCist.findBy({
           id: value === null || value === void 0 ? void 0 : value.value
         }, templates);
         setValues(_objectSpread$5(_objectSpread$5({}, template), customFieldValues));
-        editorRef.current.editor.commands.setContent(template.body);
+        (_editorRef$current = editorRef.current) === null || _editorRef$current === void 0 || (_editorRef$current = _editorRef$current.editor) === null || _editorRef$current === void 0 || (_editorRef$current = _editorRef$current.commands) === null || _editorRef$current === void 0 || _editorRef$current.setContent(template.body);
       };
       return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
         children: [/*#__PURE__*/jsxRuntime.jsx(Select__default["default"], {
@@ -3723,7 +3727,7 @@ var EmailAndSms = function EmailAndSms(_ref) {
           required: true,
           label: t("neetoMessageTemplate.template.subject"),
           name: "subject"
-        }), /*#__PURE__*/jsxRuntime.jsx(neetoEditor.FormikEditor, {
+        }), /*#__PURE__*/jsxRuntime.jsx(FormikEditor__default["default"], {
           hideSlashCommands: true,
           required: true,
           contentClassName: "max-h-40",
@@ -4064,14 +4068,17 @@ var KeyValuePairs = reactUtils.withT(function (_ref) {
             className: "flex h-8 space-x-3",
             children: [/*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
               className: "w-2/5",
+              "data-cy": "key-input-".concat(index),
               name: "".concat(name, ".").concat(index, ".key"),
               placeholder: t("neetoMessageTemplate.api.key")
             }), /*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
               className: "w-3/5",
+              "data-cy": "value-input-".concat(index),
               name: "".concat(name, ".").concat(index, ".value"),
               placeholder: t("neetoMessageTemplate.api.value"),
               suffix: showDeleteButton && /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
-                icon: neetoIcons.Delete,
+                "data-cy": "delete-key-value-pair-".concat(index),
+                icon: Delete__default["default"],
                 size: "small",
                 style: "text",
                 onClick: function onClick() {
@@ -4086,6 +4093,7 @@ var KeyValuePairs = reactUtils.withT(function (_ref) {
           }, index);
         }), /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
           className: "w-full justify-center",
+          "data-cy": "add-key-value-pair-button",
           label: t("neetoMessageTemplate.api.addKeyValuePair"),
           style: "secondary",
           onClick: function onClick() {
@@ -4126,30 +4134,37 @@ var buildTableColumnData = function buildTableColumnData(_ref) {
       return /*#__PURE__*/jsxRuntime.jsxs("div", {
         className: "flex items-center justify-between gap-x-3",
         children: [/*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
+          "data-cy": "api-template-name-link",
           label: name,
           style: "link",
           onClick: function onClick() {
             return handleOpenEditPane(apiTemplate);
           }
         }), /*#__PURE__*/jsxRuntime.jsx(MoreDropdown__default["default"], {
+          dropdownButtonProps: {
+            "data-cy": "api-template-dropdown"
+          },
           dropdownProps: {
             strategy: "fixed"
           },
           menuItems: [{
             key: "edit",
             label: i18next.t("neetoMessageTemplate.template.edit"),
+            "data-cy": "api-template-button-edit-button",
             onClick: function onClick() {
               return handleOpenEditPane(apiTemplate);
             }
           }, {
             key: "status",
             label: ramda.equals(apiTemplate.status, TEMPLATE_STATUS.ACTIVE) ? i18next.t("neetoMessageTemplate.template.markAsInactive") : i18next.t("neetoMessageTemplate.template.markAsActive"),
+            "data-cy": "api-template-button-status-button",
             onClick: function onClick() {
               return handleMarkAsActiveOrInactive(apiTemplate);
             }
           }, {
             key: "delete",
             label: i18next.t("neetoMessageTemplate.template.delete"),
+            "data-cy": "api-template-button-delete-button",
             onClick: function onClick() {
               return handleOpenDeleteAlert(apiTemplate);
             }
@@ -4388,18 +4403,21 @@ var ApiTemplates = function ApiTemplates(_ref) {
       type: title
     })
   });
+  var shouldShowTemplatesCount = !isLoading && (isFilterApplied || totalCount > 0);
   return /*#__PURE__*/jsxRuntime.jsxs(Container__default["default"], {
     children: [/*#__PURE__*/jsxRuntime.jsx(NeetoHeader__default["default"], {
       breadcrumbs: breadcrumbs,
       size: "small",
       actionBlock: /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
+        "data-cy": "add-api-templates-button",
         label: t("neetoMessageTemplate.api.addApiTemplate"),
         onClick: function onClick() {
           return setIsFormPaneOpen(true);
         }
       }),
       searchProps: {
-        placeholder: t("neetoMessageTemplate.template.searchApiTemplates")
+        placeholder: t("neetoMessageTemplate.template.searchApiTemplates"),
+        "data-cy": "api-templates-search-input"
       },
       title: /*#__PURE__*/jsxRuntime.jsxs("span", {
         className: "flex",
@@ -4412,7 +4430,7 @@ var ApiTemplates = function ApiTemplates(_ref) {
         })]
       })
     }), /*#__PURE__*/jsxRuntime.jsx(SubHeader__default["default"], {
-      leftActionBlock: /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
+      leftActionBlock: shouldShowTemplatesCount && /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
         component: "h4",
         children: t("neetoMessageTemplate.template.messageTemplatesWithCount", {
           type: t("messageType.api"),
@@ -4505,6 +4523,10 @@ var SEND_TO_API_FORM_VALIDATION_SCHEMA = yup__namespace.object({
   }))
 });
 
+var formatAdditionalData = function formatAdditionalData(additionalData) {
+  return neetoCist.isPresent(additionalData) ? additionalData : [ADDITIONAL_DATA_INITIAL_VALUE];
+};
+
 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 SendToApiPane = function SendToApiPane(props) {
@@ -4541,7 +4563,7 @@ var SendToApiForm = function SendToApiForm(_ref) {
     isLoadingTemplates = _useFetchTemplates.isLoading;
   var handleTemplateChange = function handleTemplateChange(setFieldValue, template) {
     setFieldValue("endpoint", template.endpoint);
-    setFieldValue("additionalData", template.additionalData);
+    setFieldValue("additionalData", formatAdditionalData(template.additionalData));
   };
   var handleSubmit = function handleSubmit(formValues) {
     var additionalDataModifiedFormValues = ramda.modify("additionalData", rejectEmptyKeyValuePairs, formValues);
@@ -4598,10 +4620,12 @@ var SendToApiForm = function SendToApiForm(_ref) {
             children: /*#__PURE__*/jsxRuntime.jsx(ActionBlock__default["default"], {
               isSubmitting: isSubmitting,
               cancelButtonProps: {
-                onClick: onClose
+                onClick: onClose,
+                "data-cy": "api-template-cancel-button"
               },
               submitButtonProps: {
-                label: t("neetoMessageTemplate.template.send")
+                label: t("neetoMessageTemplate.template.send"),
+                "data-cy": "api-template-send-button"
               }
             })
           })]