@bigbinary/neeto-message-templates-frontend 0.6.7 → 0.7.1

package/dist/index.js

@@ -4,7 +4,8 @@ import { buildFiltersFromURL, Bar } from '@bigbinary/neeto-filters-frontend';
 import Container from '@bigbinary/neeto-molecules/Container';
 import NeetoHeader from '@bigbinary/neeto-molecules/Header';
 import SubHeader from '@bigbinary/neeto-molecules/SubHeader';
-import { Button, Typography, Pane, Table, NoData, Alert, Select, Textarea as Textarea$1, Label } from '@bigbinary/neetoui';
+import Button from '@bigbinary/neetoui/Button';
+import Typography from '@bigbinary/neetoui/Typography';
 import { isEmpty, equals, prop, includes, pick, omit, assoc, mergeAll, pluck, whereAny, reject, modify } from 'ramda';
 import { useTranslation, Trans } from 'react-i18next';
 import { t as t$1 } from 'i18next';
@@ -15,13 +16,24 @@ import { useQuery } from 'react-query';
 import axios from 'axios';
 import require$$0 from 'util';
 import { create } from 'zustand';
+import Pane from '@bigbinary/neetoui/Pane';
 import { FormikEditor } from '@bigbinary/neeto-editor';
-import { Textarea, Input, Form as Form$2, ActionBlock, Select as Select$1 } from '@bigbinary/neetoui/formik';
+import NeetoUIForm from '@bigbinary/neetoui/formik/Form';
+import Input from '@bigbinary/neetoui/formik/Input';
+import ActionBlock from '@bigbinary/neetoui/formik/ActionBlock';
 import { useFormikContext, FieldArray } from 'formik';
+import Textarea from '@bigbinary/neetoui/formik/Textarea';
 import { isPhoneNumberValid } from '@bigbinary/neeto-molecules/PhoneNumber';
 import * as yup from 'yup';
 import TableWrapper from '@bigbinary/neeto-molecules/TableWrapper';
+import Alert from '@bigbinary/neetoui/Alert';
+import Table from '@bigbinary/neetoui/Table';
+import NoData from '@bigbinary/neetoui/NoData';
+import Select from '@bigbinary/neetoui/Select';
+import Textarea$1 from '@bigbinary/neetoui/Textarea';
+import Select$1 from '@bigbinary/neetoui/formik/Select';
 import { Delete } from '@bigbinary/neeto-icons';
+import Label from '@bigbinary/neetoui/Label';
 
 function _typeof$1(o) {
   "@babel/helpers - typeof";
@@ -3072,7 +3084,7 @@ var Form$1 = function Form(_ref) {
     });
   };
   var messageBodyLabel = isEmailTemplate ? t("neetoMessageTemplate.template.emailBody") : t("neetoMessageTemplate.template.smsBody");
-  return /*#__PURE__*/React.createElement(Form$2, {
+  return /*#__PURE__*/React.createElement(NeetoUIForm, {
     formProps: {
       noValidate: true,
       className: "flex w-full flex-col gap-y-4 pb-6"
@@ -3531,7 +3543,7 @@ var EmailAndSms = function EmailAndSms(_ref) {
   var updatedInitialValues = mergeAll([INITIAL_VALUES, customFieldsInitialValues]);
   var updatedValidationSchema = yup.object().shape(_objectSpread$3(_objectSpread$3({}, SEND_MESSAGE_FORM_SCHEMA === null || SEND_MESSAGE_FORM_SCHEMA === void 0 ? void 0 : SEND_MESSAGE_FORM_SCHEMA.fields), customFieldsValidationSchema === null || customFieldsValidationSchema === void 0 ? void 0 : customFieldsValidationSchema.fields));
   var initialValueKeys = Object.keys(INITIAL_VALUES);
-  return /*#__PURE__*/React.createElement(Form$2, {
+  return /*#__PURE__*/React.createElement(NeetoUIForm, {
     formProps: {
       noValidate: true,
       className: "flex w-full flex-col gap-y-4 pb-6"
@@ -3602,7 +3614,9 @@ var Whatsapp = function Whatsapp(_ref) {
     handleSubmit = _ref.handleSubmit,
     customFields = _ref.customFields,
     customFieldsInitialValues = _ref.customFieldsInitialValues,
-    customFieldsValidationSchema = _ref.customFieldsValidationSchema;
+    customFieldsValidationSchema = _ref.customFieldsValidationSchema,
+    _ref$helpDocUrl = _ref.helpDocUrl,
+    helpDocUrl = _ref$helpDocUrl === void 0 ? "" : _ref$helpDocUrl;
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
   var getInitialVariableComponents = function getInitialVariableComponents(variables) {
@@ -3628,9 +3642,19 @@ var Whatsapp = function Whatsapp(_ref) {
   };
   var updatedInitialValues = mergeAll([initialFormValues, customFieldsInitialValues]);
   var updatedValidationSchema = yup.object().shape(_objectSpread$2(_objectSpread$2({}, WHATSAPP_MESSAGE_FORM_VALIDATIONS_SCHEMA === null || WHATSAPP_MESSAGE_FORM_VALIDATIONS_SCHEMA === void 0 ? void 0 : WHATSAPP_MESSAGE_FORM_VALIDATIONS_SCHEMA.fields), customFieldsValidationSchema === null || customFieldsValidationSchema === void 0 ? void 0 : customFieldsValidationSchema.fields));
+  var initialValueKeys = Object.keys(initialFormValues);
   if (isEmpty(templates)) {
     return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Typography, null, t("neetoMessageTemplate.template.emptyState", {
       type: t("neetoMessageTemplate.template.whatsappTemplates")
+    }), " ", helpDocUrl && /*#__PURE__*/React.createElement(Trans, {
+      i18nKey: "neetoMessageTemplate.template.whatsapp.helpDocText",
+      components: {
+        Link: /*#__PURE__*/React.createElement(Button, {
+          size: "large",
+          style: "link",
+          to: helpDocUrl
+        })
+      }
     })), /*#__PURE__*/React.createElement(Pane.Footer, {
       className: "absolute bottom-0 left-0"
     }, /*#__PURE__*/React.createElement(Button, {
@@ -3638,7 +3662,7 @@ var Whatsapp = function Whatsapp(_ref) {
       onClick: onClose
     })));
   }
-  return /*#__PURE__*/React.createElement(Form$2, {
+  return /*#__PURE__*/React.createElement(NeetoUIForm, {
     formProps: {
       noValidate: true,
       className: "flex w-full flex-col gap-y-4 pb-6"
@@ -3656,14 +3680,15 @@ var Whatsapp = function Whatsapp(_ref) {
       var template = findBy({
         id: value === null || value === void 0 ? void 0 : value.value
       }, templates);
-      setValues({
+      var customFieldValues = omit(initialValueKeys, values);
+      setValues(_objectSpread$2({
         selectedTemplate: {
           label: template.name,
           value: template.id
         },
         templateMessage: getTemplateMessage(template.components),
         variableContents: getInitialVariableComponents(template.variableCount)
-      });
+      }, customFieldValues));
     };
     return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Select$1, {
       required: true,
@@ -3731,7 +3756,9 @@ var SendMessagePane = function SendMessagePane(_ref) {
     _ref$templateVariable = _ref.templateVariables,
     templateVariables = _ref$templateVariable === void 0 ? {} : _ref$templateVariable,
     _ref$ownerId = _ref.ownerId,
-    ownerId = _ref$ownerId === void 0 ? "" : _ref$ownerId;
+    ownerId = _ref$ownerId === void 0 ? "" : _ref$ownerId,
+    _ref$helpDocUrl = _ref.helpDocUrl,
+    helpDocUrl = _ref$helpDocUrl === void 0 ? "" : _ref$helpDocUrl;
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
   var initialFocusField = useRef();
@@ -3762,6 +3789,7 @@ var SendMessagePane = function SendMessagePane(_ref) {
     customFieldsInitialValues: customFieldsInitialValues,
     customFieldsValidationSchema: customFieldsValidationSchema,
     handleSubmit: handleSubmit,
+    helpDocUrl: helpDocUrl,
     onClose: onClose,
     templates: templates
   }) : /*#__PURE__*/React.createElement(EmailAndSms, {
@@ -4023,7 +4051,7 @@ var Form = function Form(_ref) {
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Pane.Header, null, /*#__PURE__*/React.createElement(Typography, {
     style: "h2",
     weight: "semibold"
-  }, isEdit ? t("neetoMessageTemplate.api.editApiTemplate") : t("neetoMessageTemplate.api.addApiTemplate"))), /*#__PURE__*/React.createElement(Form$2, {
+  }, isEdit ? t("neetoMessageTemplate.api.editApiTemplate") : t("neetoMessageTemplate.api.addApiTemplate"))), /*#__PURE__*/React.createElement(NeetoUIForm, {
     formikProps: {
       initialValues: buildApiTemplateInitialValues(isEdit, selectedApiTemplate),
       validationSchema: API_TEMPLATE_FORM_VALIDATION_SCHEMA,
@@ -4310,7 +4338,7 @@ var SendToApiForm = function SendToApiForm(_ref) {
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Pane.Header, null, /*#__PURE__*/React.createElement(Typography, {
     style: "h2",
     weight: "semibold"
-  }, t("neetoMessageTemplate.api.sendToApi"))), /*#__PURE__*/React.createElement(Form$2, {
+  }, t("neetoMessageTemplate.api.sendToApi"))), /*#__PURE__*/React.createElement(NeetoUIForm, {
     formikProps: {
       initialValues: SEND_TO_API_FORM_INITIAL_VALUES,
       validationSchema: SEND_TO_API_FORM_VALIDATION_SCHEMA,