@bigbinary/neeto-form-frontend 1.2.42 → 1.2.44

package/dist/index.js

@@ -1,11 +1,11 @@
 import * as React$2 from 'react';
 import React__default, { useState, useRef, useEffect, useContext, useLayoutEffect as useLayoutEffect$1, forwardRef, useImperativeHandle, Fragment, useReducer, useCallback as useCallback$1, useMemo as useMemo$1, createContext, createElement } from 'react';
-import { useField, useFormikContext, FieldArray, Form as Form$1, Formik, Field, FastField } from 'formik';
-import { noop as noop$4, slugify, filterBy, findBy, removeBy, isPresent as isPresent$1, isNotPresent, isNotEmpty, findById, notEqualsDeep } from '@bigbinary/neeto-cist';
+import { useFormikContext, useField, FieldArray, Form as Form$1, Formik, Field, FastField } from 'formik';
+import { noop as noop$4, slugify, filterBy, findBy, isNotEmpty, truncate, humanize, removeBy, isPresent as isPresent$1, isNotPresent, findById, notEqualsDeep } from '@bigbinary/neeto-cist';
 import { withEventTargetValue, showThumbsUpToastr, getQueryParams, dateFormat } from '@bigbinary/neeto-commons-frontend/utils';
 import PageLoader from '@bigbinary/neeto-molecules/PageLoader';
 import { Tooltip, Dropdown as Dropdown$2, Alert, Typography, Button as Button$1, Label, Checkbox as Checkbox$1, Toastr, MultiEmailInput, DatePicker, Radio as Radio$1, Select, Textarea as Textarea$1, Input as Input$2, Spinner as Spinner$2 } from '@bigbinary/neetoui';
-import { assoc, prop, isEmpty, path, values, compose as compose$1, trim, useWith, split, either, isNil, equals, difference, reject, pluck, keys, pick, omit, insert, not, pipe as pipe$1, toLower, map, includes, identity, isNotNil, times, clamp as clamp$2, filter as filter$1 } from 'ramda';
+import { assoc, mergeLeft, prop, isEmpty, path, values, compose as compose$1, trim, useWith, split, either, isNil, equals, difference, reject, pluck, keys, pick, omit, insert, isNotNil, not, pipe as pipe$1, toLower, map, includes, identity, times, clamp as clamp$2, filter as filter$1 } from 'ramda';
 import { useQuery, useQueryClient, useMutation } from 'react-query';
 import i18next, { t as t$4 } from 'i18next';
 import { Input, Email as Email$2, Phone as Phone$2, Globe, Up, Down, MenuHorizontal, Delete, Plus, NeetoInvisible, Checkbox as Checkbox$2, Radio, Dropdown as Dropdown$3, Rating as Rating$4, Smiley, Calendar, Upload, Check, Close, FileGeneric } from '@bigbinary/neeto-icons';
@@ -564,8 +564,8 @@ var neetoFormApi = {
 
 var _excluded$c = ["formId", "preview", "language"],
   _excluded3$1 = ["formId", "submissionId"];
-function ownKeys$h(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$g(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$h(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$h(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$i(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$h(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$i(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$i(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var useForm = function useForm(_ref) {
   var formId = _ref.formId,
     _ref$preview = _ref.preview,
@@ -575,14 +575,14 @@ var useForm = function useForm(_ref) {
     options = _objectWithoutProperties$1(_ref, _excluded$c);
   return useQuery([QUERY_KEYS.QUESTIONS, preview ? "preview/".concat(formId) : formId, language], function () {
     return neetoFormApi.getPublicQuestions(formId, language);
-  }, _objectSpread$g({
+  }, _objectSpread$h({
     keepPreviousData: true
   }, options));
 };
 var useCreateForm = function useCreateForm(options) {
   var language = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "en";
   var queryClient = useQueryClient();
-  return useMutation(neetoFormApi.createForm, _objectSpread$g(_objectSpread$g({}, options), {}, {
+  return useMutation(neetoFormApi.createForm, _objectSpread$h(_objectSpread$h({}, options), {}, {
     onSuccess: function onSuccess(form) {
       var _options$onSuccess;
       queryClient.setQueryData(QUERY_KEYS.QUESTIONS, function (forms) {
@@ -602,23 +602,17 @@ var useUpdateForm = function useUpdateForm(options) {
     var id = _ref2.id,
       values = _ref2.values;
     return neetoFormApi.updateForm(id, values);
-  }, _objectSpread$g(_objectSpread$g({}, options), {}, {
+  }, _objectSpread$h(_objectSpread$h({}, options), {}, {
     onSuccess: function onSuccess(data, _ref3) {
       var id = _ref3.id;
-      queryClient.setQueryData([QUERY_KEYS.QUESTIONS, id, language], function (form) {
-        return _objectSpread$g(_objectSpread$g({}, form), {}, {
-          title: data.title
-        });
-      });
-      queryClient.setQueryData([QUERY_KEYS.QUESTIONS, "preview/".concat(id), language], function (form) {
-        return _objectSpread$g(_objectSpread$g({}, form), {}, {
-          title: data.title,
-          questions: data.questions
-        });
-      });
+      queryClient.setQueryData([QUERY_KEYS.QUESTIONS, id, language], assoc("title", data.title));
+      queryClient.setQueryData([QUERY_KEYS.QUESTIONS, "preview/".concat(id), language], mergeLeft({
+        questions: data.questions,
+        title: data.title
+      }));
       queryClient.invalidateQueries([QUERY_KEYS.FORMS]);
-      queryClient.invalidateQueries([QUERY_KEYS.QUESTIONS, id, language]);
-      queryClient.invalidateQueries([QUERY_KEYS.QUESTIONS, "preview/".concat(id), language]);
+      queryClient.invalidateQueries([QUERY_KEYS.QUESTIONS, id]);
+      queryClient.invalidateQueries([QUERY_KEYS.QUESTIONS, "preview/".concat(id)]);
       options.onSuccess && options.onSuccess(data);
     }
   }));
@@ -629,13 +623,15 @@ var useUpdateQuestions = function useUpdateQuestions(options, language) {
     var id = _ref4.id,
       values = _ref4.values;
     return neetoFormApi.updateQuestions(id, values);
-  }, _objectSpread$g(_objectSpread$g({}, options), {}, {
+  }, _objectSpread$h(_objectSpread$h({}, options), {}, {
     onSuccess: function onSuccess() {
       for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
         args[_key] = arguments[_key];
       }
       var data = args[0],
         id = args[1].id;
+      queryClient.invalidateQueries([QUERY_KEYS.QUESTIONS, id]);
+      queryClient.invalidateQueries([QUERY_KEYS.QUESTIONS, "preview/".concat(id)]);
       queryClient.setQueryData([QUERY_KEYS.QUESTIONS, id, language], assoc("questions", data.questions));
       queryClient.setQueryData([QUERY_KEYS.QUESTIONS, "preview/".concat(id), language], assoc("questions", data.questions));
       options.onSuccess && options.onSuccess.apply(options, args);
@@ -643,7 +639,7 @@ var useUpdateQuestions = function useUpdateQuestions(options, language) {
   }));
 };
 var useForms = function useForms(options) {
-  return useQuery([QUERY_KEYS.FORMS], neetoFormApi.getForms, _objectSpread$g({
+  return useQuery([QUERY_KEYS.FORMS], neetoFormApi.getForms, _objectSpread$h({
     keepPreviousData: true
   }, options));
 };
@@ -651,7 +647,7 @@ var useDeleteForm = function useDeleteForm(options) {
   return useMutationWithInvalidation(function (_ref5) {
     var id = _ref5.id;
     return neetoFormApi.destroyForm(id);
-  }, _objectSpread$g(_objectSpread$g({}, options), {}, {
+  }, _objectSpread$h(_objectSpread$h({}, options), {}, {
     keysToInvalidate: function keysToInvalidate(_, _ref6) {
       var id = _ref6.id;
       return [QUERY_KEYS.FORMS, [QUERY_KEYS.QUESTIONS, id], [QUERY_KEYS.QUESTIONS, "preview/".concat(id)]];
@@ -667,7 +663,7 @@ var useSubmission = function useSubmission(_ref8) {
     options = _objectWithoutProperties$1(_ref8, _excluded3$1);
   return useQuery([QUERY_KEYS.SUBMISSION, formId, submissionId], function () {
     return neetoFormApi.getPublicSubmission(formId, submissionId);
-  }, _objectSpread$g(_objectSpread$g({}, options), {}, {
+  }, _objectSpread$h(_objectSpread$h({}, options), {}, {
     keepPreviousData: true
   }));
 };
@@ -677,7 +673,7 @@ var useCreateSubmission = function useCreateSubmission(options) {
     var formId = _ref9.formId,
       values = _ref9.values;
     return neetoFormApi.submitPublicForm(formId, values);
-  }, _objectSpread$g(_objectSpread$g({}, options), {}, {
+  }, _objectSpread$h(_objectSpread$h({}, options), {}, {
     onSuccess: function onSuccess() {
       var _data$submission, _data$submission2;
       for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
@@ -698,7 +694,7 @@ var useUpdateSubmission = function useUpdateSubmission(options) {
     var formId = _ref10.formId,
       values = _ref10.values;
     return neetoFormApi.updatePublicSubmission(formId, values);
-  }, _objectSpread$g(_objectSpread$g({}, options), {}, {
+  }, _objectSpread$h(_objectSpread$h({}, options), {}, {
     onSuccess: function onSuccess() {
       var _data$submission3;
       for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
@@ -714,102 +710,12 @@ var useUpdateSubmission = function useUpdateSubmission(options) {
   }));
 };
 
-({
-  questions: [{
-    id: "bb101126-4183-4ddf-adff-7563a2be0b19",
-    kind: "paragraph",
-    displayOrder: 1,
-    displayKind: "Description Field",
-    label: t$4("neetoForm.common.fillTheFormToChat"),
-    placeholder: "",
-    isRequired: false,
-    options: [],
-    nodeId: "bb101126-4183-4ddf-adff-7563a2be0b19"
-  }, {
-    id: "a8e0178e-44df-465e-8acb-ef5d1c08d541",
-    kind: "email",
-    displayOrder: 2,
-    displayKind: "Email Input Field",
-    label: t$4("neetoForm.common.email"),
-    placeholder: "",
-    isRequired: true,
-    options: [],
-    nodeId: "a8e0178e-44df-465e-8acb-ef5d1c08d541"
-  }, {
-    id: "a7d3e47d-f7a2-4bf9-aaea-d301ad62d8f6",
-    label: t$4("neetoForm.common.selectOne"),
-    isRequired: false,
-    options: [{
-      label: "ABC",
-      id: "ABC"
-    }, {
-      label: "EFG",
-      id: "EFG"
-    }, {
-      label: "QWE",
-      id: "QWE"
-    }],
-    kind: "checkbox",
-    nodeId: "f32ad8aa-039a-4b70-b3af-b97ed6fc67a6"
-  }, {
-    id: "a7d3e47d-f7a2-4bf9-aaea-d301ad62wew",
-    label: t$4("neetoForm.common.rate"),
-    isRequired: true,
-    highestRatingLabel: "",
-    averageRatingLabel: "",
-    lowestRatingLabel: "",
-    kind: "rating",
-    nodeId: "236a8cb3-b86d-4c30-9c18-f0d69788f6bc"
-  }, {
-    id: "a7d3e47d-f7a2-4bf9-aaea-d301ad62d8as",
-    label: t$4("neetoForm.common.phone"),
-    kind: "phone",
-    nodeId: "5dd3be53-ec99-48e2-bf21-298b6108cb00"
-  }, {
-    id: "a7d3e47d-f7a2-4bf9-aaea-d301ad62d8f32",
-    label: t$4("neetoForm.common.select"),
-    isRequired: false,
-    options: [{
-      label: "A",
-      id: "A"
-    }, {
-      label: "B",
-      id: "B"
-    }, {
-      label: "C",
-      id: "C"
-    }],
-    kind: "dropdown",
-    nodeId: "e65f27ea-a9b9-45b1-a8de-efb27a5b3e72"
-  }, {
-    id: "a7d3e47d-f7a2-4bf9-aaea-d301ad62d8f8",
-    label: "Nice",
-    kind: "paragraph",
-    nodeId: "15507c92-4bb5-4428-bc2b-0a7b078a144a"
-  }, {
-    id: "a7d3e47d-f7a2-4bf9-aaea-d301addw2d8f9",
-    label: t$4("neetoForm.common.singleChoice"),
-    isRequired: false,
-    options: [{
-      label: "A",
-      id: "A"
-    }, {
-      label: "B",
-      id: "B"
-    }, {
-      label: "C",
-      id: "C"
-    }],
-    kind: "radio",
-    nodeId: "37683bae-da1b-4890-ade9-0664006dc57d"
-  }]
-});
-var QUESTIONS_WITHOUT_FIELD_CODE = ["paragraph", "termsandcondition", "condition", "file_upload"];
-var RESERVED_FIELD_CODES = ["month", "date", "time"];
 var DEFAULT_AVAILABLE_LANGUAGES = [{
   code: "en",
   name: "English"
 }];
+var QUESTIONS_WITHOUT_FIELD_CODE = ["paragraph", "termsandcondition", "condition", "file_upload"];
+var RESERVED_FIELD_CODES = ["month", "date", "time"];
 
 function _arrayWithHoles$3(arr) {
   if (Array.isArray(arr)) return arr;
@@ -892,7 +798,7 @@ function _defineProperty$5(obj, key, value) {
   return obj;
 }
 
-function ownKeys$g(e, r) {
+function ownKeys$h(e, r) {
   var t = Object.keys(e);
   if (Object.getOwnPropertySymbols) {
     var o = Object.getOwnPropertySymbols(e);
@@ -905,9 +811,9 @@ function ownKeys$g(e, r) {
 function _objectSpread2(e) {
   for (var r = 1; r < arguments.length; r++) {
     var t = null != arguments[r] ? arguments[r] : {};
-    r % 2 ? ownKeys$g(Object(t), !0).forEach(function (r) {
+    r % 2 ? ownKeys$h(Object(t), !0).forEach(function (r) {
       _defineProperty$5(e, r, t[r]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$g(Object(t)).forEach(function (r) {
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$h(Object(t)).forEach(function (r) {
       Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
     });
   }
@@ -9778,8 +9684,8 @@ const ConnectedDroppable = connect(makeMapStateToProps, mapDispatchToProps, (sta
 })(Droppable$1);
 var ConnectedDroppable$1 = ConnectedDroppable;
 
-function ownKeys$f(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$f(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$f(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$f(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$g(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$g(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$g(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$g(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var defaultConfig = {
   strict: true,
   matchKey: "value"
@@ -9787,7 +9693,7 @@ var defaultConfig = {
 var findOptionByValue = function findOptionByValue(value) {
   var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
   var config = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-  var configObject = _objectSpread$f(_objectSpread$f({}, defaultConfig), config);
+  var configObject = _objectSpread$g(_objectSpread$g({}, defaultConfig), config);
   var matchKey = configObject.matchKey,
     strict = configObject.strict;
   return options.find(function (option) {
@@ -9801,7 +9707,7 @@ var filterOptionsByValues = function filterOptionsByValues() {
   var values = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
   var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
   var config = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-  var configObject = _objectSpread$f(_objectSpread$f({}, defaultConfig), config);
+  var configObject = _objectSpread$g(_objectSpread$g({}, defaultConfig), config);
   var matchKey = configObject.matchKey,
     strict = configObject.strict;
   return options.filter(function (option) {
@@ -9819,7 +9725,7 @@ var destroyFromList = function destroyFromList(items, index) {
     var nextItems = _toConsumableArray$1(items);
     nextItems.splice(index, 1);
     if (itemToRemove.id) {
-      nextItems.push(_objectSpread$f(_objectSpread$f({}, itemToRemove), {}, {
+      nextItems.push(_objectSpread$g(_objectSpread$g({}, itemToRemove), {}, {
         _destroy: true
       }));
     }
@@ -9867,8 +9773,7 @@ var useBuildFormState = function useBuildFormState() {
 };
 
 var ChangeLanguageDropdown = function ChangeLanguageDropdown(_ref) {
-  var dirty = _ref.dirty,
-    initialLanguage = _ref.initialLanguage,
+  var initialLanguage = _ref.initialLanguage,
     languages = _ref.languages,
     onChange = _ref.onChange;
   var _useState = useState(false),
@@ -9881,6 +9786,8 @@ var ChangeLanguageDropdown = function ChangeLanguageDropdown(_ref) {
     setSelectedLanguage = _useState4[1];
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
+  var _useFormikContext = useFormikContext(),
+    dirty = _useFormikContext.dirty;
   var languageChangeHandler = function languageChangeHandler(code) {
     if (!dirty) {
       onChange(code);
@@ -9925,7 +9832,6 @@ var Overview = function Overview(_ref) {
     description = _ref.description,
     availableLanguages = _ref.availableLanguages,
     selectedLanguage = _ref.selectedLanguage,
-    dirty = _ref.dirty,
     onLanguageChange = _ref.onLanguageChange;
   return /*#__PURE__*/React__default.createElement("div", {
     className: "mb-4 flex-shrink-0"
@@ -9937,7 +9843,6 @@ var Overview = function Overview(_ref) {
     style: "h4",
     weight: "semibold"
   }, title), availableLanguages.length > 1 && /*#__PURE__*/React__default.createElement(ChangeLanguageDropdown, {
-    dirty: dirty,
     initialLanguage: selectedLanguage,
     languages: availableLanguages,
     onChange: onLanguageChange
@@ -11043,19 +10948,21 @@ var Terms$1 = function Terms(_ref) {
     value = _useField2[0].value,
     error = _useField2[1].error,
     setValue = _useField2[2].setValue;
+  useEffect(function () {
+    var _editorRef$current$ed;
+    (_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(value);
+  }, [value]);
   return /*#__PURE__*/React__default.createElement("div", {
     className: "w-full cursor-auto"
   }, /*#__PURE__*/React__default.createElement(Editor$1, {
-    disabled: isLabelDisabled,
     error: error,
+    disabled: isLabelDisabled,
     id: "editor",
     initialValue: value,
     key: "".concat(name, ".label"),
     name: "".concat(name, ".label"),
     ref: editorRef,
-    onChange: function onChange(text) {
-      setValue(text);
-    }
+    onChange: setValue
   }));
 };
 
@@ -11104,6 +11011,10 @@ var Editor = function Editor(_ref) {
     touched = _useField2$.touched,
     error = _useField2$.error,
     setTouched = _useField2[2].setTouched;
+  useEffect(function () {
+    var _editorRef$current$ed;
+    (_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(value);
+  }, [value]);
   return /*#__PURE__*/React__default.createElement("div", {
     className: "w-full cursor-auto"
   }, /*#__PURE__*/React__default.createElement(Editor$1, {
@@ -11118,11 +11029,11 @@ var Editor = function Editor(_ref) {
     name: fieldName,
     ref: editorRef,
     onBlur: function onBlur() {
-      setTouched(true);
+      return setTouched(true);
     },
     onChange: function onChange(text) {
-      var _editorRef$current$ed;
-      setFieldValue((_editorRef$current$ed = editorRef.current.editor) === null || _editorRef$current$ed === void 0 || (_editorRef$current$ed = _editorRef$current$ed.contentComponent) === null || _editorRef$current$ed === void 0 || (_editorRef$current$ed = _editorRef$current$ed.props) === null || _editorRef$current$ed === void 0 ? void 0 : _editorRef$current$ed.name, text);
+      var _editorRef$current$ed2;
+      setFieldValue((_editorRef$current$ed2 = editorRef.current.editor) === null || _editorRef$current$ed2 === void 0 || (_editorRef$current$ed2 = _editorRef$current$ed2.contentComponent) === null || _editorRef$current$ed2 === void 0 || (_editorRef$current$ed2 = _editorRef$current$ed2.props) === null || _editorRef$current$ed2 === void 0 ? void 0 : _editorRef$current$ed2.name, text);
     }
   }));
 };
@@ -11353,6 +11264,8 @@ var INDEPENDENT_LABELS_MAP = {
 };
 var PADDED_FIELDS = ["paragraph", "termsandcondition"];
 
+function ownKeys$f(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$f(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$f(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$f(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var FormField = function FormField(props) {
   var _INDEPENDENT_LABELS_M;
   var item = props.item,
@@ -11381,21 +11294,21 @@ var FormField = function FormField(props) {
     isSingular = _getActiveKindDetails.isSingular;
   return /*#__PURE__*/React__default.createElement(Accordion, {
     disabledAddButtonTooltipProps: disabledAddButtonTooltipProps,
-    icon: FieldIcon,
     isDeletable: isDeletable,
     isExpanded: isExpanded,
     kindUniqueOn: kindUniqueOn,
-    label: (_INDEPENDENT_LABELS_M = INDEPENDENT_LABELS_MAP[kind]) !== null && _INDEPENDENT_LABELS_M !== void 0 ? _INDEPENDENT_LABELS_M : label,
-    padded: !PADDED_FIELDS.includes(kind),
     questionKinds: questionKinds,
     showAddQuestionDivider: showAddQuestionDivider,
+    icon: FieldIcon,
+    label: (_INDEPENDENT_LABELS_M = INDEPENDENT_LABELS_MAP[kind]) !== null && _INDEPENDENT_LABELS_M !== void 0 ? _INDEPENDENT_LABELS_M : label,
+    padded: !PADDED_FIELDS.includes(kind),
     onAdd: onAddNew,
     onDelete: onRemove,
     onDuplicate: !isSingular && onDuplicate,
     onToggle: function onToggle() {
       return onChangeExpanded(!isExpanded);
     }
-  }, /*#__PURE__*/React__default.createElement(FieldComponent, _extends$8({
+  }, /*#__PURE__*/React__default.createElement(FieldComponent, _objectSpread$f({
     isRequired: isRequired
   }, props)));
 };
@@ -11617,12 +11530,6 @@ var getAvailableQuestionKinds = function getAvailableQuestionKinds(_ref5) {
     });
   }, allQuestionKinds);
 };
-var sliceLabel = function sliceLabel(label) {
-  if (label && label.length > 23) {
-    return "".concat(label.slice(0, 20), "...");
-  }
-  return label;
-};
 
 var _path$2, _path2, _path3, _path4, _path5, _path6, _path7;
 function _extends$2() { _extends$2 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$2.apply(this, arguments); }
@@ -11705,7 +11612,6 @@ var _excluded$6 = ["questionKinds", "showAddQuestionDivider", "onValueChange", "
 function ownKeys$d(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$d(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$d(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$d(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Form = function Form(_ref) {
-  var _INDEPENDENT_LABELS_M, _questions$deleteQues, _questions$deleteQues2;
   var questionKinds = _ref.questionKinds,
     showAddQuestionDivider = _ref.showAddQuestionDivider,
     onValueChange = _ref.onValueChange,
@@ -11817,14 +11723,23 @@ var Form = function Form(_ref) {
     resetForm();
     onLanguageChange(code);
   };
+  var deleteAlertMessageLabel = function deleteAlertMessageLabel() {
+    var questionKind = questions[deleteQuestionIndex].kind;
+    var independentLabel = INDEPENDENT_LABELS_MAP[questionKind];
+    if (isNotNil(independentLabel)) return independentLabel;
+    var questionLabel = questions[deleteQuestionIndex].label;
+    if (isNotEmpty(questionLabel)) return truncate(questionLabel, 40);
+    return humanize(questionKind);
+  };
   return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Alert, {
     isOpen: deleteQuestionIndex !== null,
     submitButtonLabel: t("neetoForm.common.delete"),
     title: t("neetoForm.questions.deleteAlert.title"),
-    message: /*#__PURE__*/React__default.createElement(Trans, {
+    message: deleteQuestionIndex && /*#__PURE__*/React__default.createElement(Trans, {
       i18nKey: "neetoForm.questions.deleteAlert.message",
       values: {
-        label: (_INDEPENDENT_LABELS_M = INDEPENDENT_LABELS_MAP[(_questions$deleteQues = questions[deleteQuestionIndex]) === null || _questions$deleteQues === void 0 ? void 0 : _questions$deleteQues.kind]) !== null && _INDEPENDENT_LABELS_M !== void 0 ? _INDEPENDENT_LABELS_M : sliceLabel((_questions$deleteQues2 = questions[deleteQuestionIndex]) === null || _questions$deleteQues2 === void 0 ? void 0 : _questions$deleteQues2.label)
+        count: availableLanguages.length,
+        label: deleteAlertMessageLabel()
       }
     }),
     onClose: function onClose() {
@@ -11843,7 +11758,6 @@ var Form = function Form(_ref) {
     noValidate: true
   }), formTitle && /*#__PURE__*/React__default.createElement(Overview, {
     availableLanguages: availableLanguages,
-    dirty: dirty,
     selectedLanguage: selectedLanguage,
     description: formDescription,
     title: formTitle,
@@ -11937,29 +11851,34 @@ var getActiveQuestionKindDetails = function getActiveQuestionKindDetails(_ref) {
 };
 
 /* eslint-disable @bigbinary/neeto/file-name-and-export-name-standards */
-var requiredLabel = function requiredLabel() {
-  var errorMessage = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : i18next.t("neetoForm.common.fieldReq", {
-    field: i18next.t("neetoForm.questions.common.questionFields.field.label")
-  });
-  return string().required(errorMessage);
+var requiredLabelValidation = function requiredLabelValidation(schema, field) {
+  return schema.required(i18next.t("neetoForm.common.fieldReq", {
+    field: field
+  }));
 };
 var formValidationSchema = object().shape({
   questions: array().of(object().shape({
-    label: requiredLabel().when("kind", {
-      is: "paragraph",
-      then: requiredLabel(i18next.t("neetoForm.common.paragraphCantBeEmpty"))
+    label: string().when("_destroy", {
+      is: true,
+      otherwise: function otherwise(schema) {
+        return schema.when("kind", {
+          is: "paragraph",
+          then: function then(schema) {
+            return schema.required(i18next.t("neetoForm.common.paragraphCantBeEmpty"));
+          },
+          otherwise: function otherwise(schema) {
+            return requiredLabelValidation(schema, i18next.t("neetoForm.questions.common.questionFields.field.label"));
+          }
+        });
+      }
     }),
     kind: string().required(),
     fieldCode: string().trim().notOneOf(RESERVED_FIELD_CODES, i18next.t("neetoForm.error.invalidFieldCode")).when("kind", function (kind, schema) {
-      return QUESTIONS_WITHOUT_FIELD_CODE.includes(kind) ? schema.notRequired() : schema.required(i18next.t("neetoForm.common.fieldReq", {
-        field: i18next.t("neetoForm.questions.common.questionFields.field.fieldCode")
-      }));
+      return QUESTIONS_WITHOUT_FIELD_CODE.includes(kind) ? schema.notRequired() : requiredLabelValidation(schema, i18next.t("neetoForm.questions.common.questionFields.field.fieldCode"));
     }),
     optionsAttributes: array().when("kind", function (kind, schema) {
       return ["radio", "checkbox", "dropdown"].includes(kind) ? schema.of(object().shape({
-        label: requiredLabel(i18next.t("neetoForm.common.fieldReq", {
-          field: i18next.t("neetoForm.questions.common.questionFields.field.option")
-        }))
+        label: requiredLabelValidation(string(), i18next.t("neetoForm.questions.common.questionFields.field.option"))
       })) : schema.notRequired();
     }),
     highestRatingLabel: string().nullable(),
@@ -12048,23 +11967,22 @@ var BuildForm = function BuildForm(_ref) {
     } : _useForm$data,
     questions = _useForm$data2.questions,
     isQuestionsLoading = _useForm$data2.isQuestionsLoading,
-    isLoading = _useForm.isLoading;
+    isLoading = _useForm.isLoading,
+    refetch = _useForm.refetch;
   if (isLoading || showLoader && isQuestionsLoading) {
     return /*#__PURE__*/React__default.createElement("div", {
       className: "flex h-full w-full items-center justify-center py-6"
     }, /*#__PURE__*/React__default.createElement(PageLoader, null));
   }
-  var handleSubmit = function handleSubmit(payload, _ref2) {
-    var resetForm = _ref2.resetForm;
+  var handleSubmit = function handleSubmit(payload) {
     updateQuestions({
       id: id,
       values: _objectSpread$c({
-        neetoFormQuestion: _objectSpread$c(_objectSpread$c({}, payload), {}, {
-          language: selectedLanguage
-        })
+        language: selectedLanguage,
+        neetoFormQuestion: payload
       }, buildRequestArgs)
     }, {
-      onSuccess: resetForm
+      onSuccess: refetch
     });
   };
   var onValueChange = function onValueChange(questions) {
@@ -12077,8 +11995,8 @@ var BuildForm = function BuildForm(_ref) {
   var isDeletable = isQuestionDeletable !== null && isQuestionDeletable !== void 0 ? isQuestionDeletable : function (question) {
     return !nonRemovableFields.includes(question.kind);
   };
-  var isRequiredField = isFieldRequired !== null && isFieldRequired !== void 0 ? isFieldRequired : function (_ref3) {
-    var kind = _ref3.kind;
+  var isRequiredField = isFieldRequired !== null && isFieldRequired !== void 0 ? isFieldRequired : function (_ref2) {
+    var kind = _ref2.kind;
     return requiredFields.includes(kind);
   };
   var isDisabledFieldLabel = isFieldLabelDisabled !== null && isFieldLabelDisabled !== void 0 ? isFieldLabelDisabled : function () {
@@ -12096,9 +12014,9 @@ var BuildForm = function BuildForm(_ref) {
     },
     validationSchema: formValidationSchema,
     onSubmit: handleSubmit
-  }, function (_ref4) {
-    var errors = _ref4.errors,
-      setFieldError = _ref4.setFieldError;
+  }, function (_ref3) {
+    var errors = _ref3.errors,
+      setFieldError = _ref3.setFieldError;
     return /*#__PURE__*/React__default.createElement(Form, _extends$8({}, _objectSpread$c(_objectSpread$c({}, formDomProps), {}, {
       availableLanguages: availableLanguages,
       cancelButtonProps: cancelButtonProps,
@@ -27030,7 +26948,7 @@ var ExternalForm = function ExternalForm(_ref) {
     _ref$enablePreFilling = _ref.enablePreFilling,
     enablePreFilling = _ref$enablePreFilling === void 0 ? false : _ref$enablePreFilling,
     _ref$language = _ref.language,
-    language = _ref$language === void 0 ? "en" : _ref$language;
+    language = _ref$language === void 0 ? i18next.resolvedLanguage : _ref$language;
   var _useState = useState(false),
     _useState2 = _slicedToArray$3(_useState, 2),
     isSubmitted = _useState2[0],