@kineticdata/react 5.0.16 → 5.1.0

package/lib/components/core/submission/KappSubmissionTable.js

@@ -0,0 +1,250 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import { getIn, List, Map, Set } from 'immutable';
+import { generateTable } from '../../table/Table';
+import { fetchForm, fetchKapp, searchSubmissions, SubmissionSearch, VALID_KAPP_CORE_STATES } from '../../../apis';
+
+var applyMeta = function applyMeta(query, op, rvalue) {
+  return rvalue ? query[op](rvalue) : query;
+};
+
+var applyOp = function applyOp(query, op, lvalue, rvalue) {
+  return rvalue ? query[op](lvalue, rvalue) : query;
+};
+
+var submissionSearch = function submissionSearch(_ref, include) {
+  var filters = _ref.filters,
+      pageSize = _ref.pageSize,
+      sortColumn = _ref.sortColumn,
+      sortDirection = _ref.sortDirection;
+  var query = new SubmissionSearch().includes(Set([].concat(_toConsumableArray(typeof include === 'string' ? include.split(',') : Array.isArray(include) ? include : []), ['details', 'form'])).toJS()).sortBy(sortColumn || 'createdAt').sortDirection(sortDirection.toLocaleUpperCase()).limit(pageSize);
+  applyMeta(query, 'coreState', filters.get('coreState'));
+  applyMeta(query, 'startDate', filters.get('startDate') && new Date("".concat(filters.get('startDate'), "T00:00:00")));
+  applyMeta(query, 'endDate', filters.get('endDate') && new Date("".concat(filters.get('endDate'), "T00:00:00")));
+  applyOp(query, 'eq', 'handle', filters.get('handle'));
+  applyOp(query, 'eq', 'submittedBy', filters.getIn(['submittedBy', 'username']));
+  filters.get('values', Map()).forEach(function (value, field) {
+    return applyOp(query, 'eq', "values[".concat(field, "]"), value);
+  });
+  return query.build();
+};
+
+var dataSource = function dataSource(_ref2) {
+  var formSlug = _ref2.formSlug,
+      kappSlug = _ref2.kappSlug,
+      include = _ref2.include;
+  return {
+    fn: searchSubmissions,
+    params: function params(paramData) {
+      return [{
+        kapp: kappSlug,
+        form: paramData.filters.getIn(['form', 'slug'], formSlug),
+        pageToken: paramData.nextPageToken,
+        search: submissionSearch(paramData, include)
+      }];
+    },
+    transform: function transform(result) {
+      return {
+        data: result.submissions,
+        nextPageToken: result.nextPageToken
+      };
+    }
+  };
+};
+
+var onValidateFilters = function onValidateFilters(filters) {
+  return filters.getIn(['values', 'value'], List()).reduce(function (valid, value) {
+    return valid && value.get('field') !== '' ? value.get('value') !== '' : valid;
+  }, true);
+};
+
+var filterDataSources = function filterDataSources(_ref3) {
+  var kappSlug = _ref3.kappSlug,
+      formSlug = _ref3.formSlug;
+  return {
+    kapp: {
+      fn: fetchKapp,
+      params: [{
+        kappSlug: kappSlug,
+        include: 'fields'
+      }],
+      transform: function transform(result) {
+        return result.kapp;
+      }
+    },
+    form: {
+      fn: function fn(formSlug) {
+        return formSlug ? fetchForm({
+          kappSlug: kappSlug,
+          formSlug: formSlug,
+          include: 'fields'
+        }) : null;
+      },
+      params: function params(_ref4) {
+        var values = _ref4.values;
+        return [getIn(values, ['form', 'slug'], formSlug)];
+      },
+      transform: function transform(result) {
+        return result && result.form;
+      }
+    },
+    fieldOptions: {
+      fn: function fn(form, kapp) {
+        return form ? form.get('fields').toArray() : kapp.get('fields').toArray();
+      },
+      params: function params(_ref5) {
+        var form = _ref5.form,
+            kapp = _ref5.kapp;
+        return kapp && [form, kapp];
+      },
+      transform: function transform(result) {
+        return result.map(function (field) {
+          return {
+            label: field.get('name'),
+            value: field.get('name')
+          };
+        });
+      }
+    },
+    coreStateOptions: {
+      fn: function fn() {
+        return VALID_KAPP_CORE_STATES;
+      },
+      params: [],
+      transform: function transform(coreStates) {
+        return coreStates.map(function (coreState) {
+          return {
+            label: coreState,
+            value: coreState
+          };
+        });
+      }
+    }
+  };
+};
+
+var filters = function filters(_ref6) {
+  var kappSlug = _ref6.kappSlug,
+      formSlug = _ref6.formSlug;
+  return function (_ref7) {
+    var coreStateOptions = _ref7.coreStateOptions;
+    return coreStateOptions && [{
+      label: 'Start Date',
+      name: 'startDate',
+      type: 'date'
+    }, {
+      label: 'End Date',
+      name: 'endDate',
+      type: 'date'
+    }, {
+      label: 'Handle',
+      name: 'handle',
+      pattern: /[A-F0-9]{6}/,
+      patternMessage: 'Handles only contain characters A-F and 0-9, and are exactly 6 characters long',
+      type: 'text'
+    }, !formSlug && {
+      label: 'Form',
+      name: 'form',
+      type: 'form',
+      search: {
+        kappSlug: kappSlug
+      }
+    }, {
+      label: 'Submitted By',
+      name: 'submittedBy',
+      type: 'user'
+    }, {
+      label: 'State',
+      name: 'coreState',
+      type: 'select',
+      options: coreStateOptions
+    }, {
+      label: 'Values',
+      name: 'values',
+      type: 'map',
+      options: function options(_ref8) {
+        var fieldOptions = _ref8.fieldOptions;
+        return fieldOptions;
+      }
+    }];
+  };
+};
+
+var columns = [{
+  value: 'closedAt',
+  title: 'Closed At',
+  sortable: true
+}, {
+  value: 'closedBy',
+  title: 'closedBy',
+  sortable: false
+}, {
+  value: 'coreState',
+  title: 'Core State',
+  sortable: false
+}, {
+  value: 'createdAt',
+  title: 'Created',
+  sortable: true
+}, {
+  value: 'createdBy',
+  title: 'Created By',
+  sortable: false
+}, {
+  value: 'currentPage',
+  title: 'Current Page',
+  sortable: false
+}, {
+  value: 'handle',
+  title: 'Handle',
+  sortable: false
+}, {
+  value: 'id',
+  title: 'Id',
+  sortable: false
+}, {
+  value: 'label',
+  title: 'Label',
+  sortable: false
+}, {
+  value: 'origin',
+  title: 'Origin',
+  sortable: false
+}, {
+  value: 'parent',
+  title: 'Parent',
+  sortable: false
+}, {
+  value: 'sessionToken',
+  title: 'Session Token',
+  sortable: false
+}, {
+  value: 'submittedAt',
+  title: 'Submitted At',
+  sortable: true
+}, {
+  value: 'submittedBy',
+  title: 'Submitted By',
+  sortable: false
+}, {
+  value: 'type',
+  title: 'Type',
+  sortable: false
+}, {
+  value: 'updatedAt',
+  title: 'Updated',
+  sortable: true
+}, {
+  value: 'updatedBy',
+  title: 'Updated By',
+  sortable: false
+}];
+export var KappSubmissionTable = generateTable({
+  tableOptions: ['kappSlug', 'formSlug', 'datastore', 'include'],
+  columns: columns,
+  dataSource: dataSource,
+  filterDataSources: filterDataSources,
+  filters: filters,
+  onValidateFilters: onValidateFilters
+});
+KappSubmissionTable.displayName = 'KappSubmissionTable';
+export default KappSubmissionTable;

package/lib/components/core/submission/SubmissionForm.js

@@ -0,0 +1,124 @@
+import { List, getIn } from 'immutable';
+import { fetchSubmission, updateSubmission } from '../../../apis';
+import { generateForm } from '../../form/Form';
+import moment from 'moment';
+
+var dataSources = function dataSources(_ref) {
+  var submissionId = _ref.submissionId;
+  return {
+    submission: {
+      fn: fetchSubmission,
+      params: [{
+        id: submissionId,
+        include: 'details,values,form,form.fields,form.fields.details,form.pages'
+      }],
+      transform: function transform(result) {
+        return result.submission;
+      }
+    }
+  };
+};
+
+var handleSubmit = function handleSubmit(_ref2) {
+  var id = _ref2.submissionId;
+  return function (values) {
+    return updateSubmission({
+      id: id,
+      values: values.toJS()
+    }).then(function (_ref3) {
+      var submission = _ref3.submission,
+          error = _ref3.error;
+
+      if (error) {
+        throw error.statusCode === 400 && error.message || 'There was an error saving the submission';
+      }
+
+      return submission;
+    });
+  };
+};
+
+var traverseElement = function traverseElement(traverse, iteratee, acc) {
+  var element = traverse.get(0);
+  var elements = traverse.shift();
+  var childElements = element.get('elements', List());
+  var result = iteratee(element, acc); // If the current element has child elements make a recursive call.
+
+  if (childElements.size > 0) {
+    result = traverseElement(childElements, iteratee, result);
+  }
+
+  if (elements.size > 0) {
+    return traverseElement(elements, iteratee, result);
+  }
+
+  return result;
+};
+
+var convertRenderType = function convertRenderType(element) {
+  if (element.get('renderType') === 'dropdown') {
+    return element.get('choicesResourceName') ? 'text' : 'select';
+  } else if (element.get('renderType') === 'checkbox') {
+    return 'text-multi';
+  } else if (element.get('renderType') === 'attachment') {
+    return 'text';
+  }
+
+  return element.get('renderType');
+};
+
+var getInitialValue = function getInitialValue(submission, element, type) {
+  var name = element.get('name');
+  var isAttachment = element.get('renderType') === 'attachment';
+  var value = getIn(submission, ['values', name], element.get('renderType') === 'checkbox' ? List() : '') || '';
+  return isAttachment ? JSON.stringify(List.isList(value) ? value.toJS() : value) : type === 'datetime' ? moment(value).format('yyyy-MM-DDThh:mm') : type === 'date' ? moment(value).format('yyyy-MM-DD') : value;
+};
+
+var serializer = function serializer(element, type) {
+  return function (_ref4) {
+    var values = _ref4.values;
+    var name = element.get('name');
+    return type === 'datetime' ? moment(values.get(name)).format() : values.get(name);
+  };
+}; // If the element uses bridged options then the `choices` value represents the
+// label/value mapping from and not actual choices.
+
+
+var getChoices = function getChoices(element) {
+  return !!element.get('choicesResourceName') ? List() : element.get('choices');
+};
+
+var fields = function fields() {
+  return function (_ref5) {
+    var submission = _ref5.submission;
+
+    if (submission) {
+      var pages = submission.getIn(['form', 'pages'], List());
+      var values = traverseElement(pages, function (element, values) {
+        var name = element.get('name');
+        var type = convertRenderType(element);
+        var initialValue = getInitialValue(submission, element, type);
+        var isAttachment = element.get('renderType') === 'attachment';
+        return element.get('type') === 'field' ? values.push({
+          name: name,
+          label: name,
+          type: type,
+          options: getChoices(element, initialValue),
+          initialValue: initialValue,
+          enabled: !isAttachment,
+          "transient": isAttachment,
+          serialize: serializer(element, type)
+        }) : values;
+      }, List());
+      return values.toJS();
+    }
+  };
+};
+
+export var SubmissionForm = generateForm({
+  formOptions: ['submissionId'],
+  dataSources: dataSources,
+  fields: fields,
+  handleSubmit: handleSubmit
+});
+SubmissionForm.displayName = 'SubmissionForm';

package/lib/components/core/submission/SubmissionTable.js

@@ -1,252 +1,38 @@
-import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import { getIn, List, Map, Set } from 'immutable';
-import { generateTable } from '../../table/Table';
-import { fetchForm, fetchKapp, searchSubmissions, SubmissionSearch, VALID_KAPP_CORE_STATES } from '../../../apis';
-
-var applyMeta = function applyMeta(query, op, rvalue) {
-  return rvalue ? query[op](rvalue) : query;
-};
-
-var applyOp = function applyOp(query, op, lvalue, rvalue) {
-  return rvalue ? query[op](lvalue, rvalue) : query;
-};
-
-var submissionSearch = function submissionSearch(_ref, include) {
-  var filters = _ref.filters,
-      pageSize = _ref.pageSize,
-      sortColumn = _ref.sortColumn,
-      sortDirection = _ref.sortDirection;
-  var query = new SubmissionSearch().includes(Set([].concat(_toConsumableArray(typeof include === 'string' ? include.split(',') : Array.isArray(include) ? include : []), ['details', 'form'])).toJS()).sortBy(sortColumn || 'createdAt').sortDirection(sortDirection.toLocaleUpperCase()).limit(pageSize);
-  applyMeta(query, 'coreState', filters.get('coreState'));
-  applyMeta(query, 'startDate', filters.get('startDate') && new Date("".concat(filters.get('startDate'), "T00:00:00")));
-  applyMeta(query, 'endDate', filters.get('endDate') && new Date("".concat(filters.get('endDate'), "T00:00:00")));
-  applyOp(query, 'eq', 'handle', filters.get('handle'));
-  applyOp(query, 'eq', 'submittedBy', filters.getIn(['submittedBy', 'username']));
-  filters.get('values', Map()).forEach(function (value, field) {
-    return applyOp(query, 'eq', "values[".concat(field, "]"), value);
-  });
-  return query.build();
-};
-
-var dataSource = function dataSource(_ref2) {
-  var formSlug = _ref2.formSlug,
-      kappSlug = _ref2.kappSlug,
-      include = _ref2.include;
-  return {
-    fn: searchSubmissions,
-    params: function params(paramData) {
-      return [{
-        kapp: kappSlug,
-        form: paramData.filters.getIn(['form', 'slug'], formSlug),
-        pageToken: paramData.nextPageToken,
-        search: submissionSearch(paramData, include)
-      }];
-    },
-    transform: function transform(result) {
-      return {
-        data: result.submissions,
-        nextPageToken: result.nextPageToken
-      };
-    }
-  };
-};
-
-var onValidateFilters = function onValidateFilters(filters) {
-  return filters.getIn(['values', 'value'], List()).reduce(function (valid, value) {
-    return valid && value.get('field') !== '' ? value.get('value') !== '' : valid;
-  }, true);
-};
-
-var filterDataSources = function filterDataSources(_ref3) {
-  var kappSlug = _ref3.kappSlug,
-      formSlug = _ref3.formSlug;
-  return {
-    kapp: {
-      fn: fetchKapp,
-      params: [{
-        kappSlug: kappSlug,
-        include: 'fields'
-      }],
-      transform: function transform(result) {
-        return result.kapp;
-      }
-    },
-    form: {
-      fn: function fn(formSlug) {
-        return formSlug ? fetchForm({
-          kappSlug: kappSlug,
-          formSlug: formSlug,
-          include: 'fields'
-        }) : null;
-      },
-      params: function params(_ref4) {
-        var values = _ref4.values;
-        return [getIn(values, ['form', 'slug'], formSlug)];
-      },
-      transform: function transform(result) {
-        return result && result.form;
-      }
-    },
-    fieldOptions: {
-      fn: function fn(form, kapp) {
-        return form ? form.get('fields').toArray() : kapp.get('fields').toArray();
-      },
-      params: function params(_ref5) {
-        var form = _ref5.form,
-            kapp = _ref5.kapp;
-        return kapp && [form, kapp];
-      },
-      transform: function transform(result) {
-        return result.map(function (field) {
-          return {
-            label: field.get('name'),
-            value: field.get('name')
-          };
-        });
-      }
-    },
-    coreStateOptions: {
-      fn: function fn() {
-        return VALID_KAPP_CORE_STATES;
-      },
-      params: [],
-      transform: function transform(coreStates) {
-        return coreStates.map(function (coreState) {
-          return {
-            label: coreState,
-            value: coreState
-          };
-        });
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _createSuper from "@babel/runtime/helpers/esm/createSuper";
+import React, { Component } from 'react';
+import FormSubmissionTable from './FormSubmissionTable';
+import DatastoreSubmissionTable from './DatastoreSubmissionTable';
+import KappSubmissionTable from './KappSubmissionTable';
+export var SubmissionTable = /*#__PURE__*/function (_Component) {
+  _inherits(SubmissionTable, _Component);
+
+  var _super = _createSuper(SubmissionTable);
+
+  function SubmissionTable() {
+    _classCallCheck(this, SubmissionTable);
+
+    return _super.apply(this, arguments);
+  }
+
+  _createClass(SubmissionTable, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      if (this.props.mode === 'space') {
+        console.warn('Datastore Submissions are deprecated in Core 5.1, please upgrade to "form" mode.');
+      } else if (this.props.mode === 'kapp' || !this.props.mode) {
+        console.warn('Kapp Submissions are deprecated in Core 5.1, please upgrade to "form" mode.');
       }
     }
-  };
-};
-
-var filters = function filters(_ref6) {
-  var kappSlug = _ref6.kappSlug,
-      formSlug = _ref6.formSlug;
-  return function (_ref7) {
-    var coreStateOptions = _ref7.coreStateOptions,
-        form = _ref7.form,
-        forms = _ref7.forms;
-    return coreStateOptions && [{
-      label: 'Start Date',
-      name: 'startDate',
-      type: 'date'
-    }, {
-      label: 'End Date',
-      name: 'endDate',
-      type: 'date'
-    }, {
-      label: 'Handle',
-      name: 'handle',
-      pattern: /[A-F0-9]{6}/,
-      patternMessage: 'Handles only contain characters A-F and 0-9, and are exactly 6 characters long',
-      type: 'text'
-    }, !formSlug && {
-      label: 'Form',
-      name: 'form',
-      type: 'form',
-      search: {
-        kappSlug: kappSlug
-      }
-    }, {
-      label: 'Submitted By',
-      name: 'submittedBy',
-      type: 'user'
-    }, {
-      label: 'State',
-      name: 'coreState',
-      type: 'select',
-      options: coreStateOptions
-    }, {
-      label: 'Values',
-      name: 'values',
-      type: 'map',
-      options: function options(_ref8) {
-        var fieldOptions = _ref8.fieldOptions;
-        return fieldOptions;
-      }
-    }];
-  };
-};
+  }, {
+    key: "render",
+    value: function render() {
+      var TableComponent = this.props.mode === 'form' ? FormSubmissionTable : this.props.mode === 'space' ? DatastoreSubmissionTable : this.props.mode === 'kapp' ? KappSubmissionTable : KappSubmissionTable;
+      return /*#__PURE__*/React.createElement(TableComponent, this.props, this.props.children);
+    }
+  }]);
 
-var columns = [{
-  value: 'closedAt',
-  title: 'Closed At',
-  sortable: true
-}, {
-  value: 'closedBy',
-  title: 'closedBy',
-  sortable: false
-}, {
-  value: 'coreState',
-  title: 'Core State',
-  sortable: false
-}, {
-  value: 'createdAt',
-  title: 'Created',
-  sortable: true
-}, {
-  value: 'createdBy',
-  title: 'Created By',
-  sortable: false
-}, {
-  value: 'currentPage',
-  title: 'Current Page',
-  sortable: false
-}, {
-  value: 'handle',
-  title: 'Handle',
-  sortable: false
-}, {
-  value: 'id',
-  title: 'Id',
-  sortable: false
-}, {
-  value: 'label',
-  title: 'Label',
-  sortable: false
-}, {
-  value: 'origin',
-  title: 'Origin',
-  sortable: false
-}, {
-  value: 'parent',
-  title: 'Parent',
-  sortable: false
-}, {
-  value: 'sessionToken',
-  title: 'Session Token',
-  sortable: false
-}, {
-  value: 'submittedAt',
-  title: 'Submitted At',
-  sortable: true
-}, {
-  value: 'submittedBy',
-  title: 'Submitted By',
-  sortable: false
-}, {
-  value: 'type',
-  title: 'Type',
-  sortable: false
-}, {
-  value: 'updatedAt',
-  title: 'Updated',
-  sortable: true
-}, {
-  value: 'updatedBy',
-  title: 'Updated By',
-  sortable: false
-}];
-export var SubmissionTable = generateTable({
-  tableOptions: ['kappSlug', 'formSlug', 'datastore', 'include'],
-  columns: columns,
-  dataSource: dataSource,
-  filterDataSources: filterDataSources,
-  filters: filters,
-  onValidateFilters: onValidateFilters
-});
-SubmissionTable.displayName = 'SubmissionTable';
-export default SubmissionTable;
+  return SubmissionTable;
+}(Component);