@zengenti/contensis-react-base 3.0.0-beta.7 → 3.0.0-beta.70

package/cjs/forms.js

@@ -2,9 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var immutable = require('immutable');
+var immer = require('immer');
 var effects = require('@redux-saga/core/effects');
 var reselect = require('reselect');
+var redux = require('@zengenti/contensis-react-base/redux');
+var routing = require('@zengenti/contensis-react-base/routing');
 var React = require('react');
 var PropTypes = require('prop-types');
 var reactRedux = require('react-redux');
@@ -68,6 +70,18 @@ const initialSettings = {
     siteKey: null
   }
 };
+const initialStatus = {
+  isLoading: false,
+  isSubmitting: false,
+  hasSuccess: false,
+  successMessage: null,
+  hasError: false
+};
+const initialPagingInfo = {
+  pageIndex: 0,
+  pageCount: 0,
+  currentPageId: null
+};
 const initialFormData = {
   formId: null,
   data: {},
@@ -76,120 +90,198 @@ const initialFormData = {
   fieldErrors: [],
   groups: [],
   defaultLanguage: null,
-  pagingInfo: {
-    pageIndex: 0,
-    pageCount: 0,
-    currentPageId: null
-  },
-  status: {
-    isLoading: false,
-    isSubmitting: false,
-    hasSuccess: false,
-    successMessage: null,
-    hasError: false
-  }
+  pagingInfo: initialPagingInfo,
+  status: initialStatus
 };
-let initialState = immutable.Map({
-  settings: immutable.fromJS(initialSettings)
-});
-var reducer = ((state = initialState, action) => {
+let initialState = {
+  settings: initialSettings
+};
+var reducer = immer.produce((state, action) => {
   switch (action.type) {
     case SET_FORM_ID:
-      return state.setIn([action.formId], initialFormData);
+      {
+        const {
+          formId
+        } = action || {};
+        state[formId] = initialFormData;
+        return;
+      }
 
     case SET_FORM_DATA:
       {
-        const fields = action.fields; //const fObj = {};
-
+        const {
+          fields,
+          formId,
+          groups,
+          defaultLanguage
+        } = action || {};
         fields.map(field => {
           field.type = MakeFieldType(field);
         });
-        return state.setIn([immutable.fromJS(action.formId), 'fields'], fields).setIn([immutable.fromJS(action.formId), 'formId'], action.formId).setIn([immutable.fromJS(action.formId), 'groups'], action.groups).setIn([immutable.fromJS(action.formId), 'defaultLanguage'], action.defaultLanguage).setIn([immutable.fromJS(action.formId), 'status', 'isSubmitting'], false).setIn([immutable.fromJS(action.formId), 'status', 'hasSuccess'], false).setIn([immutable.fromJS(action.formId), 'status', 'hasError'], false);
+        state[formId].fields = fields;
+        state[formId].formId = formId;
+        state[formId].groups = groups;
+        state[formId].defaultLanguage = defaultLanguage;
+        state[formId].status.isSubmitting = false;
+        state[formId].status.hasSuccess = false;
+        state[formId].status.hasError = false;
+        return;
       }
 
     case SET_CURRENT_PAGE:
-      return state.setIn([action.formId, 'pagingInfo', 'currentPageId'], action.pageId).setIn([action.formId, 'pagingInfo', 'pageIndex'], action.pageIndex).setIn([action.formId, 'pagingInfo', 'pageCount'], action.pageCount);
+      {
+        const {
+          formId,
+          pageId,
+          pageIndex,
+          pageCount
+        } = action || {};
+        state[formId].pagingInfo.currentPageId = pageId;
+        state[formId].pagingInfo.pageIndex = pageIndex;
+        state[formId].pagingInfo.pageCount = pageCount;
+        return;
+      }
 
     case SET_FIELD_VALUE:
-      return state.setIn([action.formId, 'data', action.id], action.value);
+      {
+        const {
+          formId,
+          id,
+          value
+        } = action || {};
+        state[formId].data[id] = value;
+        return;
+      }
 
     case SET_DEFAULT_FIELD_VALUE:
-      return state.setIn([action.formId, 'data'], action.value);
+      {
+        const {
+          formId,
+          value
+        } = action || {};
+        state[formId].data = value;
+        return;
+      }
 
     case SET_CHECKBOX_VALUE:
       {
-        const prevState = state.getIn([action.formId, 'data', action.id]);
-        let values = prevState ? prevState : [];
-
-        if (action.isChecked) {
-          values.push(action.value);
-        } else {
-          values = values.filter(value => value !== action.value);
-        }
-
-        return state.setIn([action.formId, 'data', action.id], values);
+        const {
+          formId,
+          id,
+          value,
+          isChecked
+        } = action || {};
+        let values = state[formId].data[id] || [];
+        if (isChecked) state[formId].data[id] = { ...values,
+          value
+        };else state[formId].data[id] = values.filter(v => v !== value);
+        return;
       }
 
     case SET_DATE_RANGE_VALUES:
-      return state.setIn([action.formId, 'data', action.id, action.dateType], action.value);
+      {
+        const {
+          formId,
+          id,
+          value,
+          dateType
+        } = action || {};
+        state[formId].data[id][dateType] = value;
+        return;
+      }
 
     case SET_FIELD_ERROR:
-      return state.setIn([action.formId, 'fieldErrors'], action.value);
+      {
+        const {
+          formId,
+          value
+        } = action || {};
+        state[formId].fieldErrors = value;
+        return;
+      }
 
     case SET_SUBMITTING_FORM:
-      return state.setIn([immutable.fromJS(action.formId), 'status', 'isSubmitting'], action.isSubmitting);
+      {
+        const {
+          formId,
+          isSubmitting
+        } = action || {};
+        state[formId].status.isSubmitting = isSubmitting;
+        return;
+      }
 
     case SUBMIT_FORM_SUCCESS:
-      return state.setIn([immutable.fromJS(action.formId), 'status', 'hasError'], false).setIn([immutable.fromJS(action.formId), 'status', 'isSubmitting'], false).setIn([immutable.fromJS(action.formId), 'status', 'hasSuccess'], true);
+      {
+        const {
+          formId
+        } = action || {};
+        state[formId].status.hasError = false;
+        state[formId].status.isSubmitting = false;
+        state[formId].status.hasSuccess = true;
+        return;
+      }
 
     case SET_SUCCESS_MESSAGE:
-      return state.setIn([immutable.fromJS(action.formId), 'status', 'successMessage'], action.message);
+      {
+        const {
+          formId,
+          message
+        } = action || {};
+        state[formId].status.successMessage = message;
+        return;
+      }
 
     case SUBMIT_FORM_ERROR:
-      return state.setIn([immutable.fromJS(action.formId), 'status', 'hasError'], true).setIn([immutable.fromJS(action.formId), 'status', 'isSubmitting'], false);
+      {
+        const {
+          formId
+        } = action || {};
+        state[formId].status.hasError = true;
+        state[formId].status.isSubmitting = false;
+        return;
+      }
 
     case SET_FORM_ENTRIES:
       {
-        const entries = action.entries;
-        const eObj = {};
+        const {
+          formId,
+          entries
+        } = action || {};
+        const entryObject = {};
         entries.map(entry => {
           if (!entry) return null;
-          eObj[entry.id] = entry.entries;
-          return eObj;
+          entryObject[entry.id] = entry.entries;
+          return entryObject;
         });
-        return state.setIn([action.formId, 'entries'], eObj);
+        state[formId].entries = entryObject;
+        return;
       }
 
     case SET_ERROR:
-      return state.setIn([immutable.fromJS(action.formId), 'status', 'hasError'], true).setIn([immutable.fromJS(action.formId), 'status', 'isSubmitting'], false);
+      {
+        const {
+          formId
+        } = action || {};
+        state[formId].status.hasError = true;
+        state[formId].status.isSubmitting = false;
+        return;
+      }
 
     default:
       return state;
   }
-});
-
-const selectForms = state => state.getIn(['forms']);
-const makeSelectIsLoading = formId => reselect.createSelector(selectForms, forms => forms.getIn([formId, 'status', 'isLoading']));
-const makeSelectFormFields = formId => reselect.createSelector(selectForms, forms => forms.getIn([formId, 'fields']));
-const makeSelectDefaultLang = formId => reselect.createSelector(selectForms, forms => forms.getIn([formId, 'defaultLanguage']));
-const selectFieldErrors = (state, formId) => {
-  return state.getIn(['forms', formId, 'fieldErrors']);
-};
-const selectPostData = (state, formId) => {
-  return state.getIn(['forms', formId, 'data']);
-};
-const selectFormGroups = (state, formId) => {
-  return state.getIn(['forms', formId, 'groups']);
-};
-const selectPagingInfo = (state, formId) => {
-  return state.getIn(['forms', formId, 'pagingInfo']);
-};
-const selectFormStatus = (state, formId) => {
-  return state.getIn(['forms', formId, 'status']);
-};
+}, initialState);
+
+const selectForms = state => redux.getIn(state, ['forms']);
+const selectFieldErrors = (state, formId) => redux.getIn(state, ['forms', formId, 'fieldErrors']);
+const selectPostData = (state, formId) => redux.getIn(state, ['forms', formId, 'data']);
+const selectFormGroups = (state, formId) => redux.getIn(state, [('groups')]);
+const selectPagingInfo = (state, formId) => redux.getIn(state, ['forms', formId, 'pagingInfo']);
+const selectFormStatus = (state, formId) => redux.getIn(state, ['forms', formId, 'status']);
+const selectEntries = (state, formId) => redux.getIn(state, ['forms', formId, 'entries']);
 const selectPagedFields = formId => reselect.createSelector([selectForms], form => {
-  const pagingInfo = form.getIn([formId, 'pagingInfo']);
-  const fields = form.getIn([formId, 'fields']);
+  const pagingInfo = redux.getIn(form, [formId, 'pagingInfo']);
+  const fields = redux.getIn(form, [formId, 'fields']);
 
   if (fields && fields.length > 0 && pagingInfo && pagingInfo.pageCount > 1) {
     return fields.filter(f => f.groupId == pagingInfo.currentPageId);
@@ -197,9 +289,9 @@ const selectPagedFields = formId => reselect.createSelector([selectForms], form
 
   return fields;
 });
-const selectEntries = (state, formId) => {
-  return state.getIn(['forms', formId, 'entries']);
-};
+const makeSelectIsLoading = formId => reselect.createSelector(selectForms, forms => redux.getIn(forms, [formId, 'status', 'isLoading']));
+const makeSelectFormFields = formId => reselect.createSelector(selectForms, forms => redux.getIn(forms, [formId, 'fields']));
+const makeSelectDefaultLang = formId => reselect.createSelector(selectForms, forms => redux.getIn(forms, [formId, 'defaultLanguage']));
 
 const URI = '/forms';
 const getFormSchema = async formId => {
@@ -423,7 +515,7 @@ function* togglePage(action) {
     pageIndex
   } = action;
   const state = yield effects.select();
-  const formGroups = selectFormGroups(state, formId);
+  const formGroups = selectFormGroups(state);
 
   if (action.type === PAGE_FORWARD) {
     yield validateGroupfields(formId, formGroups[pageIndex].id);
@@ -441,7 +533,7 @@ function* togglePage(action) {
 function* fetchForm(action) {
   const formId = action.formId;
   const schema = yield getFormSchema(formId);
-  const groups = schema.groups && schema.groups.length > 0 && schema.groups.filter(group => group.id !== 'private');
+  const groups = schema && schema.groups && schema.groups.length > 0 && schema.groups.filter(group => group.id !== 'private');
 
   if (formId && schema) {
     if (schema.groups && schema.groups.length > 0) {
@@ -496,7 +588,7 @@ function* submitForm$1(action) {
       formId: action.formId
     });
     const forms = yield effects.select(selectForms);
-    const rawData = forms.get(action.formId);
+    const rawData = forms[action.formId];
     const formObj = {
       contentType: action.formId,
       formPost: rawData.data
@@ -523,7 +615,7 @@ function* setDefaultValueFields(action) {
     fields,
     defaultLanguage
   } = action;
-  const entryId = yield effects.select(state => state.getIn(['routing', 'entry', 'sys', 'id']));
+  const entryId = yield effects.select(routing.selectors.selectRouteEntryEntryId);
   let fieldObj = {};
   fields.forEach(field => {
     if (field.dataType == 'string' && field.default) {
@@ -575,16 +667,6 @@ function* getEntryPickerData(action) {
   }
 }
 
-const toJS = WrappedComponent => wrappedComponentProps => {
-  const KEY = 0;
-  const VALUE = 1;
-  const propsJS = Object.entries(wrappedComponentProps).reduce((newProps, wrappedComponentProp) => {
-    newProps[wrappedComponentProp[KEY]] = immutable.Iterable.isIterable(wrappedComponentProp[VALUE]) ? wrappedComponentProp[VALUE].toJS() : wrappedComponentProp[VALUE];
-    return newProps;
-  }, {});
-  return /*#__PURE__*/React__default["default"].createElement(WrappedComponent, propsJS);
-};
-
 //Brand
 const open_teal = '#37BFA7'; //Brand dark
 
@@ -1026,7 +1108,7 @@ Dropdown.propTypes = {
 
 const CheckboxStyled = styled__default["default"].div.withConfig({
   displayName: "Checkbox__CheckboxStyled",
-  componentId: "s8ewuf-0"
+  componentId: "sc-s8ewuf-0"
 })(["", ";"], ({
   useDefaultTheme
 }) => {
@@ -1305,7 +1387,7 @@ SingleDate.propTypes = {
 
 const DateRangeStyled = styled__default["default"].div.withConfig({
   displayName: "DateRange__DateRangeStyled",
-  componentId: "hnzg32-0"
+  componentId: "sc-hnzg32-0"
 })(["", ";"], ({
   useDefaultTheme
 }) => {
@@ -1409,7 +1491,7 @@ DateRange.propTypes = {
 
 const EntryPickerStyled = styled__default["default"].div.withConfig({
   displayName: "EntryPicker__EntryPickerStyled",
-  componentId: "svnu18-0"
+  componentId: "sc-svnu18-0"
 })(["", ";"], ({
   useDefaultTheme
 }) => {
@@ -1666,7 +1748,7 @@ FormComposer.propTypes = {
 
 const ButtonStyled = styled__default["default"].button.withConfig({
   displayName: "Button__ButtonStyled",
-  componentId: "hr2oup-0"
+  componentId: "sc-hr2oup-0"
 })(["", ";"], ({
   theme,
   useDefaultTheme
@@ -1696,7 +1778,7 @@ Button.propTypes = {
   useDefaultTheme: PropTypes__default["default"].bool
 };
 
-const ThemeContext = React.createContext();
+const ThemeContext = /*#__PURE__*/React.createContext();
 
 const ThemeProvider = ({
   children,
@@ -2070,7 +2152,7 @@ const Form$1 = ({
       type: "button",
       action: () => {
         submitForm(formId);
-        customSubmit();
+        if (customSubmit) customSubmit();
       },
       useDefaultTheme: useDefaultTheme
     })), status && status.hasSuccess && status.successMessage && /*#__PURE__*/React__default["default"].createElement("p", {
@@ -2099,7 +2181,7 @@ const Form$1 = ({
       type: "button",
       action: () => {
         submitForm(formId);
-        customSubmit();
+        if (customSubmit) customSubmit();
       },
       useDefaultTheme: useDefaultTheme
     })), status && status.hasSuccess && status.successMessage && /*#__PURE__*/React__default["default"].createElement("p", {
@@ -2134,12 +2216,10 @@ Form$1.propTypes = {
   setCheckboxValue: PropTypes__default["default"].func
 };
 
-function action(type, payload = {}) {
-  return {
-    type,
-    ...payload
-  };
-}
+const action = (type, payload = {}) => ({
+  type,
+  ...payload
+});
 
 const submitForm = formId => action(SUBMIT_FORM_FOR_VALIDATION, {
   formId
@@ -2276,8 +2356,9 @@ const mapDispatchToProps = dispatch => {
   };
 };
 
-reactRedux.connect(mapStateToProps, mapDispatchToProps)(toJS(FormContainer));
+var Form = reactRedux.connect(mapStateToProps, mapDispatchToProps)(FormContainer);
 
+exports["default"] = Form;
 exports.reducer = reducer;
 exports.sagas = formV2Sagas;
 //# sourceMappingURL=forms.js.map