@kineticdata/react/lib/components/common/FormSelect.js

A React library for the Kinetic Platform

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.FormSelect = void 0;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
var _objectSpread3 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
var _react = _interopRequireDefault(require("react"));
var _Typeahead = require("./Typeahead");
var _apis = require("../../apis");
var _immutable = require("immutable");
var _react2 = require("@kineticdata/react");
var fields = function fields(isDatastore) {
  return isDatastore ? [{
    name: 'name'
  }, {
    name: 'slug'
  }] : [{
    name: 'name'
  }, {
    name: 'slug'
  }, {
    name: 'category'
  }];
};

// If dynamic is true, only use operators that can support a single string value
var OPERATORS = function OPERATORS(dynamic) {
  return (0, _immutable.Map)((0, _objectSpread3["default"])({
    equals: 'equals',
    matches: 'matches',
    startsWith: 'startsWith'
  }, dynamic ? {} : {
    "in": 'in'
  }));
};

// Dynamically build query using correct operators
var buildQuery = function buildQuery(searchFields, value) {
  // Start building a KQL query using any provided static values
  var fixedQueryBuilder = searchFields
  // Filter to fields that provided a value
  .filter(function (field) {
    return field.name && field.value;
  })
  // For each field, apply the appropriate operator function
  .reduce(function (filter, _ref) {
    var name = _ref.name,
      operator = _ref.operator,
      strict = _ref.strict;
    return filter[OPERATORS(false).get(operator, 'startsWith')](name, name, strict);
  }, (0, _react2.defineKqlQuery)());

  // Add any fields using the typed in dynamic value to the KQL query
  var queryBuilder = searchFields
  // Filter to fields that didn't provide a value
  .filter(function (field) {
    return field.name && !field.value;
  })
  // For each field, apply the appropriate operator function
  .reduce(function (filter, _ref2) {
    var name = _ref2.name,
      operator = _ref2.operator,
      strict = _ref2.strict;
    return filter[OPERATORS(true).get(operator, 'startsWith')](name, name, strict);
  },
  // Start with the above KQL query and start an OR block
  fixedQueryBuilder.or())
  // End once for the OR block and once to build the query
  .end().end();

  // Build values object using by query builder
  var values = searchFields.reduce(function (values, field) {
    return (0, _objectSpread3["default"])((0, _objectSpread3["default"])({}, values), {}, (0, _defineProperty2["default"])({}, field.name, field.value || value));
  }, {});

  // Build the query
  return queryBuilder(values);
};
var searchForms = function searchForms(_ref3) {
  var _ref3$search = _ref3.search,
    search = _ref3$search === void 0 ? (0, _immutable.Map)() : _ref3$search;
  return function (field, value, callback) {
    var searchFields = _immutable.Map.isMap(search) && search.has('fields') && !search.get('fields').isEmpty() ? search.get('fields').toJS() : fields(search.get('datastore'));
    return (0, _apis.fetchForms)({
      datastore: search.get('datastore'),
      kappSlug: search.get('kappSlug'),
      q: buildQuery(searchFields, value),
      include: search.get('include') || (search.get('datastore') ? '' : 'categorizations.category'),
      limit: search.get('limit') || 25,
      "public": !!search.get('public')
    }).then(function (_ref4) {
      var forms = _ref4.forms,
        error = _ref4.error,
        nextPageToken = _ref4.nextPageToken;
      return {
        suggestions: forms || [],
        error: error,
        nextPageToken: nextPageToken
      };
    }).then(callback);
  };
};
var formToValue = function formToValue(form) {
  return form && form.get('slug') || '';
};

// Converts a typed in value to an option object. Used when adding custom values
// when allowNew is true.
var valueToCustomForm = function valueToCustomForm(_ref5) {
  var allowNew = _ref5.allowNew;
  return function (value) {
    return value.length > 0 ? typeof allowNew !== 'function' || allowNew(value) ? {
      slug: value
    } : null : null;
  };
};
var getStatusProps = function getStatusProps(_ref6) {
  var _ref6$search = _ref6.search,
    search = _ref6$search === void 0 ? (0, _immutable.Map)() : _ref6$search,
    _ref6$messages = _ref6.messages,
    _ref6$messages2 = _ref6$messages === void 0 ? {} : _ref6$messages,
    _ref6$messages2$short = _ref6$messages2["short"],
    _short = _ref6$messages2$short === void 0 ? 'Type to find a form.' : _ref6$messages2$short,
    _ref6$messages2$empty = _ref6$messages2.empty,
    empty = _ref6$messages2$empty === void 0 ? 'No matching forms.' : _ref6$messages2$empty,
    _ref6$messages2$custo = _ref6$messages2.custom,
    custom = _ref6$messages2$custo === void 0 ? 'No matching forms. Type to enter a custom option.' : _ref6$messages2$custo,
    _ref6$messages2$pendi = _ref6$messages2.pending,
    pending = _ref6$messages2$pendi === void 0 ? 'Searching...' : _ref6$messages2$pendi,
    _ref6$messages2$more = _ref6$messages2.more,
    more = _ref6$messages2$more === void 0 ? "Too many forms, first ".concat(search.get('limit') || 25, " shown. Please refine your search.") : _ref6$messages2$more,
    _ref6$messages2$error = _ref6$messages2.error,
    error = _ref6$messages2$error === void 0 ? 'There was an error fetching forms.' : _ref6$messages2$error;
  return function (props) {
    return {
      info: props["short"] ? _short : props.pending ? pending : null,
      warning: props.error || props.empty || props.more ? props.error ? error : props.more ? more : props.empty ? props.custom ? custom : empty : null : null
    };
  };
};
var FormSelect = exports.FormSelect = function FormSelect(props) {
  return /*#__PURE__*/_react["default"].createElement(_Typeahead.Typeahead, {
    components: props.components || {},
    disabled: props.disabled,
    multiple: props.multiple,
    custom: props.allowNew && valueToCustomForm(props),
    search: searchForms(props),
    minSearchLength: props.minSearchLength,
    getSuggestionValue: formToValue,
    getStatusProps: getStatusProps(props),
    value: props.value,
    onChange: props.onChange,
    onFocus: props.onFocus,
    onBlur: props.onBlur,
    placeholder: props.placeholder,
    id: props.id,
    form: props.form,
    invalid: props.invalid
  });
};