@kineticdata/react 5.0.17 → 5.0.18

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

@@ -0,0 +1,116 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import { generateTable } from '../../table/Table';
+import { searchSubmissions } from '../../../apis';
+import { generatePaginationParams, transformCoreResult } from '../../../apis/http';
+import { filterDataSources, filters } from './FormSubmissionFilters';
+import { Set } from 'immutable';
+
+var dataSource = function dataSource(_ref) {
+  var kappSlug = _ref.kappSlug,
+      formSlug = _ref.formSlug,
+      include = _ref.include,
+      count = _ref.count;
+  return {
+    fn: function fn(options) {
+      return searchSubmissions(options);
+    },
+    params: function params(paramData) {
+      var q = paramData.filters.getIn(['query', 'q']) || undefined;
+      var orderBy = paramData.filters.getIn(['query', 'orderBy']) || 'createdAt';
+      return [{
+        form: formSlug,
+        kapp: kappSlug,
+        search: _objectSpread({
+          direction: paramData.filters.get('orderDirection', 'DESC'),
+          include: Set([].concat(_toConsumableArray(typeof include === 'string' ? include.split(',') : Array.isArray(include) ? include : []), ['details'])).toJS(),
+          // need to pass undefined instead of null so the `q` parameter is not
+          // added to the query string with empty value
+          q: q,
+          orderBy: orderBy
+        }, generatePaginationParams(paramData)),
+        count: count ? true : undefined
+      }];
+    },
+    transform: transformCoreResult('submissions')
+  };
+};
+
+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: false
+}, {
+  value: 'updatedBy',
+  title: 'Updated By',
+  sortable: false
+}];
+export var FormSubmissionTable = generateTable({
+  tableOptions: ['kappSlug', 'formSlug', 'include', 'count'],
+  columns: columns,
+  dataSource: dataSource,
+  filters: filters,
+  filterDataSources: filterDataSources
+});
+FormSubmissionTable.displayName = 'FormSubmissionTable';
+export default FormSubmissionTable;

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/helpers.js

@@ -0,0 +1,95 @@
+import { fromJS, List, Range } from 'immutable';
+import { TIMELINES, MAX_PART_LENGTH } from '../../../helpers';
+export var getUsedFields = function getUsedFields(values, partIndex) {
+  var partType = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'eq';
+  var equalities = List();
+
+  if (partType === 'eq' && partIndex === 0) {
+    equalities = List();
+  } else if (partType === 'eq' && partIndex === 1) {
+    equalities = List([values.get('op0-part')]);
+  } else if (partType === 'eq') {
+    equalities = Range(0, partIndex).map(function (i) {
+      return values.get("op".concat(i, "-part"));
+    }).toList().filter(function (f) {
+      return f !== '';
+    });
+  } else if (partType === 'range') {
+    var orders = Range(0, MAX_PART_LENGTH).map(function (i) {
+      return values.get("orderby".concat(i, "-part"));
+    }).toList().filter(function (f) {
+      return f !== '' && f !== values.get('range-part');
+    });
+    equalities = Range(0, MAX_PART_LENGTH).map(function (i) {
+      return values.get("op".concat(i, "-part"));
+    }).toList().concat(orders).filter(function (f) {
+      return f !== '';
+    });
+  } else if (partType === 'orderBy') {
+    var _orders;
+
+    if (partIndex === 0) {
+      _orders = List();
+    } else if (partIndex === 1) {
+      _orders = List([values.get('orderby0-part')]);
+    } else {
+      _orders = Range(0, partIndex).map(function (i) {
+        return values.get("orderby".concat(i, "-part"));
+      }).toList().filter(function (f) {
+        return f !== '';
+      });
+    }
+
+    equalities = Range(0, MAX_PART_LENGTH).map(function (i) {
+      return values.get("op".concat(i, "-part"));
+    }).toList().concat(_orders).filter(function (f) {
+      return f !== '';
+    });
+  }
+
+  return equalities;
+};
+export var availableParts = function availableParts(values, indexes, equalityFields) {
+  var partType = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'eq';
+  var remainingParts = indexes.map(function (index) {
+    return getRemainingParts(index.get('parts', List()), equalityFields);
+  });
+  var containsTimeline = equalityFields.some(function (index) {
+    return TIMELINES.includes(index);
+  });
+  var anyAtLast = remainingParts.some(function (index) {
+    return index && index.size === 0;
+  });
+  var rangePart = values.get('range-part');
+  var timelinesAvailable = anyAtLast && !containsTimeline ? TIMELINES : containsTimeline ? getRemainingParts(List([equalityFields.last()]), fromJS(TIMELINES)) : List();
+
+  if (partType === 'range') {
+    var rangeRemaining = remainingParts.filter(function (index) {
+      return index && index.size === 1;
+    });
+    return rangeRemaining.concat(rangePart && rangeRemaining.size === 0 && values.get('orderby0-part') && values.get('orderby0-part') !== rangePart ? List([]) : timelinesAvailable || List([]));
+  } else if (partType === 'orderBy') {
+    return (rangePart ? List([rangePart]) : remainingParts.filter(function (index) {
+      return index && index.size > 0;
+    }).map(function (index) {
+      return index.first();
+    })).concat(TIMELINES.includes(rangePart) ? List([rangePart]) : anyAtLast ? fromJS(TIMELINES) : equalityFields.size === 0 ? fromJS(TIMELINES) : List()).toSet().toList();
+  } else {
+    return remainingParts.filterNot(function (index) {
+      return !index || index.size === 0;
+    }).map(function (index) {
+      return index.first();
+    }).toSet().toList().filterNot(function (p) {
+      return TIMELINES.includes(p);
+    });
+  }
+};
+export var getRemainingParts = function getRemainingParts(src, dst) {
+  if (src.size === 0 && dst.size === 0) return List(); // If we're matching so far, and the are no more to compare it's a match.
+
+  if (src.size > 0 && dst.size === 0) return src; // If we're out of elements but there's more to match, it's not a match.
+
+  if (src.size === 0 && dst.size > 0) return List();
+  if (src.first() === dst.first()) return getRemainingParts(src.shift(), dst.shift());
+  return null;
+};

package/lib/components/core/submission/helpers.test.js

@@ -0,0 +1,96 @@
+import { List, Map, fromJS } from 'immutable';
+import { availableParts, getRemainingParts } from './helpers';
+var INDEX_A_B = fromJS({
+  name: 'values[A],values[B]',
+  parts: ['values[A]', 'values[B]']
+});
+var INDEX_A_C = fromJS({
+  name: 'values[A],values[C]',
+  parts: ['values[A]', 'values[C]']
+});
+var INDEX_A_B_C = fromJS({
+  name: 'values[A],values[B],values[C]',
+  parts: ['values[A]', 'values[B]', 'values[C]']
+});
+describe('submission filter helpers', function () {
+  var indexes;
+  var values;
+  beforeEach(function () {
+    values = Map({});
+    indexes = List([]);
+  });
+  describe('#getRemainingParts', function () {
+    test('empty sets match', function () {
+      var result = getRemainingParts(List(), List());
+      expect(result).toBeImmutableList();
+      expect(result.size).toBe(0);
+    });
+    test('when left is the same as right', function () {
+      var result = getRemainingParts(List([1]), List([1]));
+      expect(result).toBeImmutableList();
+      expect(result.size).toBe(0);
+    });
+    test('when left is larger than right', function () {
+      var result = getRemainingParts(List([1, 2]), List([1]));
+      expect(result).toBeImmutableList();
+      expect(result.size).toBe(1);
+      expect(result.first()).toBe(2);
+    });
+    test('when left is larger than right with multiple values', function () {
+      var result = getRemainingParts(List([1, 2, 3, 4]), List([1]));
+      expect(result).toBeImmutableList();
+      expect(result.size).toBe(3);
+      expect(result.first()).toBe(2);
+    });
+    test('when left does not start with right', function () {
+      var result = getRemainingParts(List([2, 1]), List([1]));
+      expect(result).toBeNull();
+    });
+    test('when left does fully not start with right', function () {
+      var result = getRemainingParts(List([1, 1, 1]), List([1, 2]));
+      expect(result).toBeNull();
+    });
+    test('when left contains but does not start with right', function () {
+      var result = getRemainingParts(List([1, 1, 2]), List([1, 2]));
+      expect(result).toBeNull();
+    });
+  });
+  describe('#avaialbleParts', function () {
+    test('when there are no indexes', function () {
+      var result = availableParts(values, indexes, List(['values[A]', 'values[B]']));
+      expect(result).toBeImmutableList();
+      expect(result.size).toBe(0);
+    });
+    test('when there are no indexes with parts remaining', function () {
+      var result = availableParts(values, indexes.push(INDEX_A_B), List(['values[A]', 'values[B]']));
+      expect(result).toBeImmutableList();
+      expect(result.size).toBe(0);
+    });
+    test('when there are fewer parts', function () {
+      // We're expecting parts from `values[A],values[B]`
+      var result = availableParts(values, indexes.push(INDEX_A_B), List(['values[A]']));
+      expect(result).toBeImmutableList();
+      expect(result.size).toBe(1);
+      expect(result.first()).toBe('values[B]');
+    });
+    test('when there are fewer parts in multiple indexes', function () {
+      var result = availableParts(values, indexes.push(INDEX_A_B).push(INDEX_A_C), List(['values[A]']));
+      expect(result).toBeImmutableList();
+      expect(result.size).toBe(2);
+      expect(result.first()).toBe('values[B]');
+      expect(result.last()).toBe('values[C]');
+    });
+    test('when there are more parts in the index', function () {
+      var result = availableParts(values, indexes.push(INDEX_A_B_C), List(['values[A]']));
+      expect(result).toBeImmutableList();
+      expect(result.size).toBe(1);
+      expect(result.first()).toBe('values[B]');
+    });
+    test('when multiple indexes start the same', function () {
+      var result = availableParts(values, indexes.push(INDEX_A_B).push(INDEX_A_B_C), List(['values[A]']));
+      expect(result).toBeImmutableList();
+      expect(result.size).toBe(1);
+      expect(result.first()).toBe('values[B]');
+    });
+  });
+});

package/lib/components/form/Form.js

@@ -918,8 +918,8 @@ var FormImplComponent = /*#__PURE__*/function (_Component2) {
       } // else if the autoFocus prop has been changed we will also focus the new
       // resulting focus element
       else if (this.props.autoFocus !== prevProps.autoFocus && this.focusRef.current) {
-          this.focusRef.current.focus();
-        }
+        this.focusRef.current.focus();
+      }
     }
   }, {
     key: "render",