@bigbinary/neeto-form-frontend 1.2.50 → 1.2.52

package/dist/index.cjs.js

@@ -12,6 +12,7 @@ var ramda = require('ramda');
 var reactQuery = require('react-query');
 var i18next = require('i18next');
 var neetoIcons = require('@bigbinary/neeto-icons');
+var constants = require('@bigbinary/neeto-commons-frontend/constants');
 var reactUtils = require('@bigbinary/neeto-commons-frontend/react-utils');
 var axios = require('axios');
 var ReactDOM = require('react-dom');
@@ -166,9 +167,9 @@ function _objectWithoutProperties$1(source, excluded) {
 
 var _excluded$d = ["size"],
   _excluded2$2 = ["size"],
-  _excluded3$1 = ["size"],
-  _excluded4$2 = ["size"],
-  _excluded5 = ["size"];
+  _excluded3$2 = ["size"],
+  _excluded4$1 = ["size"],
+  _excluded5$1 = ["size"];
 var Star = function Star(props) {
   var _props$size = props.size,
     size = _props$size === void 0 ? 20 : _props$size,
@@ -208,7 +209,7 @@ var Heart = function Heart(props) {
 var Zap = function Zap(props) {
   var _props$size3 = props.size,
     size = _props$size3 === void 0 ? 20 : _props$size3,
-    other = _objectWithoutProperties$1(props, _excluded3$1);
+    other = _objectWithoutProperties$1(props, _excluded3$2);
   return /*#__PURE__*/React__default["default"].createElement("svg", _extends$8({
     fill: "none",
     height: size,
@@ -226,7 +227,7 @@ var Zap = function Zap(props) {
 var Crown = function Crown(_ref) {
   var _ref$size = _ref.size,
     size = _ref$size === void 0 ? 20 : _ref$size,
-    otherProps = _objectWithoutProperties$1(_ref, _excluded4$2);
+    otherProps = _objectWithoutProperties$1(_ref, _excluded4$1);
   return /*#__PURE__*/React__default["default"].createElement("svg", _extends$8({
     fill: "none",
     height: size,
@@ -248,7 +249,7 @@ var Crown = function Crown(_ref) {
 var Trophy = function Trophy(_ref2) {
   var _ref2$size = _ref2.size,
     size = _ref2$size === void 0 ? 20 : _ref2$size,
-    otherProps = _objectWithoutProperties$1(_ref2, _excluded5);
+    otherProps = _objectWithoutProperties$1(_ref2, _excluded5$1);
   return /*#__PURE__*/React__default["default"].createElement("svg", _extends$8({
     fill: "none",
     height: size,
@@ -537,8 +538,10 @@ var getFormSubmissionsUrl = function getFormSubmissionsUrl(formId) {
 var getFormSubmissionUrl = function getFormSubmissionUrl(formId, submissionId) {
   return "".concat(getFormSubmissionsUrl(formId), "/").concat(submissionId);
 };
-var getForms = function getForms() {
-  return axios__default["default"].get(getFormsUrl());
+var getForms = function getForms(params) {
+  return axios__default["default"].get(getFormsUrl(), {
+    params: params
+  });
 };
 var createForm = function createForm(payload) {
   return axios__default["default"].post(getFormsUrl(), payload);
@@ -619,7 +622,8 @@ var neetoFormApi = {
 
 var _excluded$c = ["formId", "preview", "language"],
   _excluded2$1 = ["formId", "language"],
-  _excluded4$1 = ["formId", "submissionId"];
+  _excluded3$1 = ["page", "pageSize"],
+  _excluded5 = ["formId", "submissionId"];
 function ownKeys$k(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$j(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$k(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$k(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var useForm = function useForm(_ref) {
@@ -705,21 +709,32 @@ var useUpdateQuestions = function useUpdateQuestions(options, language) {
     }
   }));
 };
-var useForms = function useForms(options) {
-  return reactQuery.useQuery([QUERY_KEYS.FORMS], neetoFormApi.getForms, _objectSpread$j({
+var useForms = function useForms() {
+  var _ref6 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+    _ref6$page = _ref6.page,
+    page = _ref6$page === void 0 ? constants.DEFAULT_PAGE_INDEX : _ref6$page,
+    _ref6$pageSize = _ref6.pageSize,
+    pageSize = _ref6$pageSize === void 0 ? constants.DEFAULT_PAGE_SIZE : _ref6$pageSize,
+    options = _objectWithoutProperties$1(_ref6, _excluded3$1);
+  return reactQuery.useQuery([QUERY_KEYS.FORMS, page], function () {
+    return neetoFormApi.getForms({
+      page: page,
+      pageSize: pageSize
+    });
+  }, _objectSpread$j({
     keepPreviousData: true
   }, options));
 };
 var useDeleteForm = function useDeleteForm(options) {
-  return reactUtils.useMutationWithInvalidation(function (_ref6) {
-    var id = _ref6.id;
+  return reactUtils.useMutationWithInvalidation(function (_ref7) {
+    var id = _ref7.id;
     return neetoFormApi.destroyForm(id);
   }, _objectSpread$j(_objectSpread$j({}, options), {}, {
-    keysToInvalidate: [[QUERY_KEYS.FORMS], function (_, _ref7) {
-      var id = _ref7.id;
-      return [QUERY_KEYS.QUESTIONS, id];
-    }, function (_, _ref8) {
+    keysToInvalidate: [[QUERY_KEYS.FORMS], function (_, _ref8) {
       var id = _ref8.id;
+      return [QUERY_KEYS.QUESTIONS, id];
+    }, function (_, _ref9) {
+      var id = _ref9.id;
       return [QUERY_KEYS.QUESTIONS, "preview/".concat(id)];
     }],
     onSuccess: function onSuccess() {
@@ -727,10 +742,10 @@ var useDeleteForm = function useDeleteForm(options) {
     }
   }));
 };
-var useSubmission = function useSubmission(_ref10) {
-  var formId = _ref10.formId,
-    submissionId = _ref10.submissionId,
-    options = _objectWithoutProperties$1(_ref10, _excluded4$1);
+var useSubmission = function useSubmission(_ref11) {
+  var formId = _ref11.formId,
+    submissionId = _ref11.submissionId,
+    options = _objectWithoutProperties$1(_ref11, _excluded5);
   return reactQuery.useQuery([QUERY_KEYS.SUBMISSION, formId, submissionId], function () {
     return neetoFormApi.getPublicSubmission(formId, submissionId);
   }, _objectSpread$j(_objectSpread$j({}, options), {}, {
@@ -739,9 +754,9 @@ var useSubmission = function useSubmission(_ref10) {
 };
 var useCreateSubmission = function useCreateSubmission(options) {
   var queryClient = reactQuery.useQueryClient();
-  return reactQuery.useMutation(function (_ref11) {
-    var formId = _ref11.formId,
-      values = _ref11.values;
+  return reactQuery.useMutation(function (_ref12) {
+    var formId = _ref12.formId,
+      values = _ref12.values;
     return neetoFormApi.submitPublicForm(formId, values);
   }, _objectSpread$j(_objectSpread$j({}, options), {}, {
     onSuccess: function onSuccess() {
@@ -760,9 +775,9 @@ var useCreateSubmission = function useCreateSubmission(options) {
 };
 var useUpdateSubmission = function useUpdateSubmission(options) {
   var queryClient = reactQuery.useQueryClient();
-  return reactQuery.useMutation(function (_ref12) {
-    var formId = _ref12.formId,
-      values = _ref12.values;
+  return reactQuery.useMutation(function (_ref13) {
+    var formId = _ref13.formId,
+      values = _ref13.values;
     return neetoFormApi.updatePublicSubmission(formId, values);
   }, _objectSpread$j(_objectSpread$j({}, options), {}, {
     onSuccess: function onSuccess() {
@@ -11027,20 +11042,38 @@ var StarRating$3 = function StarRating(_ref) {
   }));
 };
 
-var useUpdateEditorContent = function useUpdateEditorContent(editorRef, fieldName) {
+var useUpdateEditorContent = function useUpdateEditorContent(editorRef, fieldName, value) {
+  var initialStateRef = React$2.useRef({
+    language: "",
+    value: null
+  });
   var _useBuildFormState = useBuildFormState(),
     formId = _useBuildFormState.formId,
     language = _useBuildFormState.selectedLanguage;
+  var setEditorContent = function setEditorContent(content) {
+    var _editorRef$current$ed;
+    return (_editorRef$current$ed = editorRef.current.editor) === null || _editorRef$current$ed === void 0 || (_editorRef$current$ed = _editorRef$current$ed.commands) === null || _editorRef$current$ed === void 0 ? void 0 : _editorRef$current$ed.setContent(content);
+  };
+  React$2.useEffect(function () {
+    if (initialStateRef.current["language"] !== language) {
+      initialStateRef.current["language"] = language;
+      initialStateRef.current["value"] = null;
+      return;
+    }
+    if (initialStateRef.current["value"] === null && value !== null) {
+      setEditorContent(value);
+      initialStateRef.current["value"] = value;
+    }
+  }, [language, value]);
   useFetchQuestions({
     formId: formId,
     language: language,
     onSuccess: function onSuccess(data) {
-      var _editorRef$current$ed;
       var pathArray = fieldName.split(".").map(function (part) {
         var parsedPart = parseInt(part);
         return isNaN(parsedPart) ? part : parsedPart;
       });
-      (_editorRef$current$ed = editorRef.current.editor) === null || _editorRef$current$ed === void 0 || (_editorRef$current$ed = _editorRef$current$ed.commands) === null || _editorRef$current$ed === void 0 || _editorRef$current$ed.setContent(ramda.path(pathArray, data));
+      setEditorContent(ramda.path(pathArray, data));
     }
   });
 };
@@ -11052,7 +11085,6 @@ var Terms$1 = function Terms(_ref) {
     editor: {}
   });
   var fieldName = "".concat(name, ".label");
-  useUpdateEditorContent(editorRef, fieldName);
   var _useField = formik.useField({
       name: fieldName,
       validate: validateEditorContent(editorRef)
@@ -11061,6 +11093,7 @@ var Terms$1 = function Terms(_ref) {
     value = _useField2[0].value,
     error = _useField2[1].error,
     setValue = _useField2[2].setValue;
+  useUpdateEditorContent(editorRef, fieldName, value);
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "w-full cursor-auto"
   }, /*#__PURE__*/React__default["default"].createElement(neetoEditor.Editor, {
@@ -11099,7 +11132,6 @@ var Editor = function Editor(_ref) {
     editor: {}
   });
   var fieldName = "".concat(name, ".label");
-  useUpdateEditorContent(editorRef, fieldName);
   var _useField = formik.useField({
       name: fieldName,
       validate: validateEditorContent(editorRef)
@@ -11112,6 +11144,7 @@ var Editor = function Editor(_ref) {
     _useField2$2 = _useField2[2],
     setTouched = _useField2$2.setTouched,
     setValue = _useField2$2.setValue;
+  useUpdateEditorContent(editorRef, fieldName, value);
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "w-full cursor-auto"
   }, /*#__PURE__*/React__default["default"].createElement(neetoEditor.Editor, {
@@ -26703,24 +26736,24 @@ var RichTextEditor = function RichTextEditor(_ref) {
     nodeId = question.nodeId;
   var label = fieldWithFallback(question, "label");
   var debouncedPlaceholder = reactUtils.useDebounce(fieldWithFallback(question, "placeholder"), 300);
+  var propsToCompare = preview ? ["debouncedPlaceholder", "error"] : ["debouncedPlaceholder"];
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "neeto-form-engine-input__wrapper"
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "neeto-form-engine-input__label-wrapper"
   }, label && /*#__PURE__*/React__default["default"].createElement("label", {
     className: "neeto-form-engine-label"
-  }, getLabel(label, isRequired))), /*#__PURE__*/React__default["default"].createElement(formik.FastField, _extends$8({
+  }, getLabel(label, isRequired))), /*#__PURE__*/React__default["default"].createElement(formik.FastField, {
     debouncedPlaceholder: debouncedPlaceholder,
     error: errors[name],
     name: name || nodeId,
+    shouldUpdate: isPropsUnequal(propsToCompare),
     validate: validateFieldValue({
       kind: kind,
       label: label,
       isRequired: isRequired
     })
-  }, preview && {
-    shouldUpdate: isPropsUnequal(["debouncedPlaceholder", "error"])
-  }), function (_ref2) {
+  }, function (_ref2) {
     var field = _ref2.field,
       form = _ref2.form,
       meta = _ref2.meta;