@kineticdata/react 5.1.0-rc.1 → 5.1.1

package/lib/components/common/TableInput.js

@@ -1,6 +1,7 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import React, { Fragment } from 'react';
-import { OrderedMap, Map } from 'immutable';
+import { Map } from 'immutable';
+import { DragDropContext, Draggable, Droppable } from 'react-beautiful-dnd';
 
 var TextInput = function TextInput(props) {
   return /*#__PURE__*/React.createElement("input", {
@@ -26,6 +27,10 @@ var CheckboxInput = function CheckboxInput(props) {
   });
 };
 
+var DragHandle = function DragHandle(props) {
+  return /*#__PURE__*/React.createElement("span", props, "\u2195");
+};
+
 export var TableLayout = function TableLayout(_ref) {
   var rows = _ref.rows,
       onAdd = _ref.onAdd,
@@ -54,6 +59,7 @@ var RowLayout = function RowLayout(_ref2) {
 };
 
 var typeToComponent = {
+  drag: 'DragHandle',
   text: 'TextInput',
   checkbox: 'CheckboxInput'
 };
@@ -61,7 +67,8 @@ var defaultComponents = {
   TableLayout: TableLayout,
   RowLayout: RowLayout,
   TextInput: TextInput,
-  CheckboxInput: CheckboxInput
+  CheckboxInput: CheckboxInput,
+  DragHandle: DragHandle
 };
 
 var fieldFromConfig = function fieldFromConfig(config) {
@@ -85,45 +92,83 @@ export var TableInput = function TableInput(props) {
 
   var handleAddRow = function handleAddRow(e) {
     e.preventDefault();
-    var newRow = options.reduce(function (row, config) {
+    var newRow = options.filter(function (config) {
+      return config.get('type') !== 'drag';
+    }).reduce(function (row, config) {
       return row.set(config.get('name'), config.get('type') === 'checkbox' ? false : '');
     }, Map());
     onChange(rows.push(newRow));
   };
 
+  var onDragEnd = function onDragEnd(e) {
+    if (e.source && e.destination) {
+      onChange(rows["delete"](e.source.index).insert(e.destination.index, rows.get(e.source.index)));
+    }
+  };
+
+  var isDragDisabled = !options.some(function (option) {
+    return option.get('type') === 'drag';
+  });
   var fieldRows = props.rows.map(function (row, index) {
     var handleDeleteRow = function handleDeleteRow(e) {
       e.preventDefault();
       onChange(rows["delete"](index));
     };
 
-    var fields = options.reduce(function (fields, config) {
-      var Field = fieldFromConfig(config, appliedComponents);
-      var value = row.get(config.get('name'));
-
-      var handleChangeField = function handleChangeField(e) {
-        var value = config.get('type') === 'checkbox' ? e.target.checked : e.target.value;
-        return onChange(rows.setIn([index, config.get('name')], value));
-      };
-
-      return fields.set(config.get('name'), /*#__PURE__*/React.createElement(Field, {
-        value: value,
-        onChange: handleChangeField,
-        label: config.get('label'),
-        onBlur: onBlur,
-        onFocus: onFocus
-      }));
-    }, OrderedMap());
-    return /*#__PURE__*/React.createElement(RowLayout, {
+    return /*#__PURE__*/React.createElement(Draggable, {
+      draggableId: "draggable".concat(index),
+      index: index,
       key: index,
-      fields: fields,
-      options: options,
-      onDelete: handleDeleteRow
+      isDragDisabled: isDragDisabled
+    }, function (provided, snapshot) {
+      // For each of the options specified for the field, we render a table
+      // cell with a field in it. The field type is determined by the type
+      // of the option.
+      var fields = options.toOrderedMap().mapKeys(function (_, config) {
+        return config.get('name');
+      }).map(function (config) {
+        var Field = fieldFromConfig(config, appliedComponents);
+
+        var _config$toObject = config.toObject(),
+            label = _config$toObject.label,
+            name = _config$toObject.name,
+            type = _config$toObject.type;
+
+        var fieldOnChange = function fieldOnChange(e) {
+          return onChange(rows.setIn([index, name], type === 'checkbox' ? e.target.checked : e.target.value));
+        };
+
+        var value = row.get(name);
+        var props = type === 'drag' ? provided.dragHandleProps : {
+          label: label,
+          onBlur: onBlur,
+          onChange: fieldOnChange,
+          onFocus: onFocus,
+          value: value
+        };
+        return /*#__PURE__*/React.createElement(Field, props);
+      });
+      return /*#__PURE__*/React.createElement(RowLayout, {
+        draggableRef: provided.innerRef,
+        draggableProps: provided.draggableProps,
+        dragging: snapshot.isDragging,
+        fields: fields,
+        options: options,
+        onDelete: handleDeleteRow
+      });
     });
   });
-  return /*#__PURE__*/React.createElement(TableLayout, {
-    rows: fieldRows,
-    onAdd: handleAddRow,
-    options: options
-  });
+  return /*#__PURE__*/React.createElement(DragDropContext, {
+    onDragEnd: onDragEnd
+  }, /*#__PURE__*/React.createElement(Droppable, {
+    droppableId: "droppable"
+  }, function (provided) {
+    return /*#__PURE__*/React.createElement(TableLayout, {
+      droppableRef: provided.innerRef,
+      rows: fieldRows,
+      onAdd: handleAddRow,
+      options: options,
+      placeholder: provided.placeholder
+    });
+  }));
 };

package/lib/components/common/TeamSelect.js

@@ -19,7 +19,8 @@ var searchTeams = function searchTeams(_ref) {
         return "".concat(field, " =* \"").concat(value, "\"");
       }).join(' OR '),
       limit: search.get('limit') || 25,
-      include: search.get('include') || ''
+      include: search.get('include') || '',
+      "public": !!search.get('public')
     }).then(function (_ref2) {
       var teams = _ref2.teams,
           error = _ref2.error,

package/lib/components/common/Typeahead.js

@@ -135,11 +135,14 @@ export var Typeahead = /*#__PURE__*/function (_React$Component) {
       // Prevent form submission if enter key is used to select suggestion.
       if (method === 'enter') {
         event.preventDefault();
-      }
+      } // Update state if single search or query is multiple and should be cleared
+
 
-      _this.setState(_this.props.multiple ? {
-        searchValue: ''
-      } : initialState);
+      if (!_this.props.multiple || !event.ctrlKey && !event.metaKey && !event.shiftKey) {
+        _this.setState(_this.props.multiple ? {
+          searchValue: ''
+        } : initialState);
+      }
 
       _this.props.onChange(_this.props.multiple ? _this.props.value.push(suggestion) : suggestion);
     };

package/lib/components/common/UserSelect.js

@@ -26,7 +26,8 @@ var searchUsers = function searchUsers(_ref) {
         return "".concat(field, " =* \"").concat(value, "\"");
       }).join(' OR '),
       limit: search.get('limit') || 25,
-      include: search.get('include') || ''
+      include: search.get('include') || '',
+      "public": !!search.get('public')
     }).then(function (_ref2) {
       var users = _ref2.users,
           error = _ref2.error,

package/lib/components/common/authentication/AuthenticationContainer.js

@@ -11,7 +11,7 @@ import moment from 'moment';
 import { action, regHandlers, connect, dispatch, regSaga, store } from '../../../store';
 import { login, logoutDirect, retrieveJwt, singleSignOn, fetchSpaMeta, systemLogin } from '../../../apis';
 import { socketIdentify } from '../../../apis/socket';
-import { refreshSystemToken } from '../../../apis/system';
+import { refreshSystemToken } from '../../../apis';
 var defaultLoginProps = {
   error: null,
   password: '',
@@ -52,6 +52,9 @@ regHandlers({
       system: action.payload.system
     }).set('login', defaultLoginProps);
   },
+  SET_SERVER_ERROR: function SET_SERVER_ERROR(state, action) {
+    return state.set('serverError', action.payload);
+  },
   SET_ERROR: function SET_ERROR(state, action) {
     return state.mergeIn(['login'], {
       error: action.payload,
@@ -357,13 +360,13 @@ regSaga(takeEvery('SINGLE_SIGN_ON', /*#__PURE__*/_regeneratorRuntime.mark(functi
 })));
 var SYSTEM_TOKEN = 'kd-system';
 regSaga(takeEvery('INITIALIZE', /*#__PURE__*/_regeneratorRuntime.mark(function _callee4(_ref3) {
-  var _ref3$payload, system, socket, token, localToken, parsedToken, isValid, _yield$call4, securityStrategies, _yield$call4$session, csrfToken, isAuthenticated, spaceSlug, _token;
+  var _ref3$payload, system, socket, skipInit, token, localToken, parsedToken, isValid, _yield$call4, securityStrategies, _yield$call4$session, csrfToken, isAuthenticated, spaceSlug, error, _token;
 
   return _regeneratorRuntime.wrap(function _callee4$(_context4) {
     while (1) {
       switch (_context4.prev = _context4.next) {
         case 0:
-          _ref3$payload = _ref3.payload, system = _ref3$payload.system, socket = _ref3$payload.socket;
+          _ref3$payload = _ref3.payload, system = _ref3$payload.system, socket = _ref3$payload.socket, skipInit = _ref3$payload.skipInit;
           _context4.prev = 1;
 
           if (!system) {
@@ -387,7 +390,7 @@ regSaga(takeEvery('INITIALIZE', /*#__PURE__*/_regeneratorRuntime.mark(function _
           }));
 
         case 7:
-          _context4.next = 30;
+          _context4.next = 34;
           break;
 
         case 9:
@@ -398,39 +401,51 @@ regSaga(takeEvery('INITIALIZE', /*#__PURE__*/_regeneratorRuntime.mark(function _
           _yield$call4 = _context4.sent;
           securityStrategies = _yield$call4.securityStrategies;
           _yield$call4$session = _yield$call4.session;
-          csrfToken = _yield$call4$session.csrfToken;
-          isAuthenticated = _yield$call4$session.isAuthenticated;
-          spaceSlug = _yield$call4.spaceSlug;
+          _yield$call4$session = _yield$call4$session === void 0 ? {} : _yield$call4$session;
+          csrfToken = _yield$call4$session.csrfToken, isAuthenticated = _yield$call4$session.isAuthenticated, spaceSlug = _yield$call4.spaceSlug, error = _yield$call4.error;
+
+          if (!error) {
+            _context4.next = 21;
+            break;
+          }
+
+          _context4.next = 19;
+          return put(action('SET_SERVER_ERROR', error));
+
+        case 19:
+          _context4.next = 34;
+          break;
 
-          if (!isAuthenticated) {
-            _context4.next = 23;
+        case 21:
+          if (!(isAuthenticated && !skipInit)) {
+            _context4.next = 27;
             break;
           }
 
-          _context4.next = 20;
+          _context4.next = 24;
           return call(retrieveJwt);
 
-        case 20:
+        case 24:
           _context4.t0 = _context4.sent;
-          _context4.next = 24;
+          _context4.next = 28;
           break;
 
-        case 23:
+        case 27:
           _context4.t0 = null;
 
-        case 24:
+        case 28:
           _token = _context4.t0;
 
           if (!(socket && _token)) {
-            _context4.next = 28;
+            _context4.next = 32;
             break;
           }
 
-          _context4.next = 28;
+          _context4.next = 32;
           return call(socketIdentify, _token);
 
-        case 28:
-          _context4.next = 30;
+        case 32:
+          _context4.next = 34;
           return put(action('SET_INITIALIZED', {
             csrfToken: csrfToken,
             securityStrategies: securityStrategies,
@@ -439,21 +454,21 @@ regSaga(takeEvery('INITIALIZE', /*#__PURE__*/_regeneratorRuntime.mark(function _
             token: _token
           }));
 
-        case 30:
-          _context4.next = 35;
+        case 34:
+          _context4.next = 39;
           break;
 
-        case 32:
-          _context4.prev = 32;
+        case 36:
+          _context4.prev = 36;
           _context4.t1 = _context4["catch"](1);
           console.error(_context4.t1);
 
-        case 35:
+        case 39:
         case "end":
           return _context4.stop();
       }
     }
-  }, _callee4, null, [[1, 32]]);
+  }, _callee4, null, [[1, 36]]);
 })));
 regSaga(takeEvery('LOGOUT_START', /*#__PURE__*/_regeneratorRuntime.mark(function _callee5(_ref4) {
   var payload, system, loggedIn;
@@ -580,6 +595,10 @@ var getToken = function getToken() {
   return store.getState().getIn(['session', 'token']);
 };
 
+var getCsrfToken = function getCsrfToken() {
+  return store.getState().getIn(['session', 'csrfToken']);
+};
+
 export var AuthenticationComponent = /*#__PURE__*/function (_Component) {
   _inherits(AuthenticationComponent, _Component);
 
@@ -601,7 +620,8 @@ export var AuthenticationComponent = /*#__PURE__*/function (_Component) {
         });
       } else {
         dispatch('INITIALIZE', {
-          socket: !this.props.noSocket
+          socket: !this.props.noSocket,
+          skipInit: this.props.skipInit
         });
       }
     }
@@ -613,9 +633,11 @@ export var AuthenticationComponent = /*#__PURE__*/function (_Component) {
           loggedIn = _this$props.loggedIn,
           login = _this$props.login,
           securityStrategies = _this$props.securityStrategies,
+          serverError = _this$props.serverError,
           spaceSlug = _this$props.spaceSlug,
           token = _this$props.token;
       return this.props.children({
+        serverError: serverError,
         initialized: initialized,
         timedOut: loggedIn && !token,
         loggedIn: loggedIn,
@@ -644,9 +666,10 @@ var mapStateToProps = function mapStateToProps(state) {
     token: state.getIn(['session', 'token'], null),
     login: state.get('login', defaultLoginProps),
     spaceSlug: state.getIn(['session', 'spaceSlug'], ''),
-    securityStrategies: state.getIn(['session', 'securityStrategies'], [])
+    securityStrategies: state.getIn(['session', 'securityStrategies'], []),
+    serverError: state.get('serverError')
   };
 };
 
 var AuthenticationContainer = connect(mapStateToProps)(AuthenticationComponent);
-export { AuthenticationContainer, getToken, logout, timedOut };
+export { AuthenticationContainer, getCsrfToken, getToken, logout, timedOut };

package/lib/components/core/core_form/CoreForm.js

@@ -286,16 +286,16 @@ export var CoreFormComponent = /*#__PURE__*/function (_Component) {
         }));
       } // If pending and error state has just been set, call error callback
       else if (this.state.pending && this.state.error && !prevState.error) {
-          if (this.state.error.statusCode === 401) {
-            applyGuard(this.props.onUnauthorized || this.props.unauthorized);
-          } else if (this.state.error.statusCode === 403) {
-            applyGuard(this.props.onForbidden || this.props.forbidden);
-          } else if (this.state.error.statusCode === 404) {
-            applyGuard(this.props.onNotFound || this.props.onNotFound);
-          } else {
-            applyGuard(this.props.onError || this.props.error);
-          }
-        } // If locking is turned on and has been initalized
+        if (this.state.error.statusCode === 401) {
+          applyGuard(this.props.onUnauthorized || this.props.unauthorized);
+        } else if (this.state.error.statusCode === 403) {
+          applyGuard(this.props.onForbidden || this.props.forbidden);
+        } else if (this.state.error.statusCode === 404) {
+          applyGuard(this.props.onNotFound || this.props.onNotFound);
+        } else {
+          applyGuard(this.props.onError || this.props.error);
+        }
+      } // If locking is turned on and has been initalized
 
 
       if (this.state.lock && this.state.lock.init) {

package/lib/components/core/file_resource/FileResourceForm.js

@@ -0,0 +1,180 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import { get, Map } from 'immutable';
+import { createFileResource, fetchAgentComponents, fetchFileResource, fetchFilestores, fetchSecurityPolicyDefinitions, updateFileResource } from '../../../apis';
+import { generateForm } from '../../form/Form';
+import { handleFormErrors } from '../../form/Form.helpers';
+
+var dataSources = function dataSources(_ref) {
+  var fileResourceSlug = _ref.fileResourceSlug;
+  return {
+    fileResource: {
+      fn: fetchFileResource,
+      params: fileResourceSlug && [{
+        fileResourceSlug: fileResourceSlug,
+        include: 'details,securityPolicies'
+      }],
+      transform: function transform(result) {
+        return result.fileResource;
+      }
+    },
+    agents: {
+      fn: fetchAgentComponents,
+      params: [],
+      transform: function transform(result) {
+        return [{
+          label: 'System',
+          value: 'system'
+        }].concat(_toConsumableArray(get(result, 'agents', []).map(function (agent) {
+          return {
+            label: agent.name,
+            value: agent.slug
+          };
+        })));
+      }
+    },
+    filestores: {
+      fn: function fn(options) {
+        return options && options.agentSlug ? fetchFilestores(options) : Promise.resolve([]);
+      },
+      params: function params(_ref2) {
+        var values = _ref2.values;
+        return [{
+          agentSlug: get(values, 'agentSlug', 'system')
+        }];
+      },
+      transform: function transform(result) {
+        return get(result, 'filestores', []).map(function (agent) {
+          return {
+            label: agent.name,
+            value: agent.slug
+          };
+        });
+      }
+    },
+    securityPolicyDefinitions: {
+      fn: fetchSecurityPolicyDefinitions,
+      params: [],
+      transform: function transform(result) {
+        return result.securityPolicyDefinitions;
+      }
+    }
+  };
+};
+
+var handleSubmit = function handleSubmit(_ref3) {
+  var fileResourceSlug = _ref3.fileResourceSlug;
+  return function (values) {
+    return (fileResourceSlug ? updateFileResource : createFileResource)({
+      fileResourceSlug: fileResourceSlug,
+      fileResource: values.toJS()
+    }).then(handleFormErrors('fileResource', 'There was a problem saving the File Resource.'));
+  };
+};
+
+var securityEndpoints = {
+  fileAccess: {
+    endpoint: 'File Access',
+    label: 'File Access',
+    types: ['Space', 'File Resource']
+  },
+  fileModification: {
+    endpoint: 'File Modification',
+    label: 'File Modification',
+    types: ['Space', 'File Resource']
+  }
+};
+
+var fields = function fields(_ref4) {
+  var fileResourceSlug = _ref4.fileResourceSlug;
+  return function (_ref5) {
+    var fileResource = _ref5.fileResource,
+        agents = _ref5.agents,
+        securityPolicyDefinitions = _ref5.securityPolicyDefinitions;
+    return (!fileResourceSlug || fileResource) && securityPolicyDefinitions && agents && [{
+      name: 'slug',
+      label: 'Slug',
+      type: 'text',
+      required: true,
+      initialValue: get(fileResource, 'slug', '')
+    }, {
+      name: 'agentSlug',
+      label: 'Agent Slug',
+      type: 'select',
+      required: true,
+      initialValue: get(fileResource, 'agentSlug', 'system'),
+      options: function options(_ref6) {
+        var agents = _ref6.agents;
+        return agents;
+      },
+      onChange: function onChange(_, _ref7) {
+        var setValue = _ref7.setValue;
+        return setValue('filestoreSlug', '');
+      }
+    }, {
+      name: 'filestoreSlug',
+      label: 'Filestore Slug',
+      type: 'select',
+      required: true,
+      initialValue: get(fileResource, 'filestoreSlug', ''),
+      options: function options(_ref8) {
+        var filestores = _ref8.filestores;
+        return filestores;
+      }
+    }].concat(_toConsumableArray(Object.entries(securityEndpoints).map(function (_ref9) {
+      var _ref10 = _slicedToArray(_ref9, 2),
+          endpointFieldName = _ref10[0],
+          endpoint = _ref10[1];
+
+      return {
+        name: endpointFieldName,
+        label: endpoint.label,
+        type: 'select',
+        options: function options(_ref11) {
+          var securityPolicyDefinitions = _ref11.securityPolicyDefinitions;
+          return securityPolicyDefinitions ? securityPolicyDefinitions.filter(function (definition) {
+            return endpoint.types.includes(definition.get('type'));
+          }).map(function (definition) {
+            return Map({
+              value: definition.get('name'),
+              label: definition.get('name')
+            });
+          }) : [];
+        },
+        initialValue: fileResource ? fileResource.get('securityPolicies').find(function (pol) {
+          return pol.get('endpoint') === endpoint.endpoint;
+        }, null, Map({})).get('name', '') : '',
+        "transient": true
+      };
+    })), [{
+      name: 'securityPolicies',
+      label: 'Security Policies',
+      type: null,
+      visible: false,
+      serialize: function serialize(_ref12) {
+        var values = _ref12.values;
+        return Object.entries(securityEndpoints).map(function (_ref13) {
+          var _ref14 = _slicedToArray(_ref13, 2),
+              endpointFieldName = _ref14[0],
+              policy = _ref14[1];
+
+          return {
+            endpoint: policy.endpoint,
+            name: values.get(endpointFieldName)
+          };
+        }).filter(function (endpoint) {
+          return endpoint.name !== '';
+        });
+      },
+      initialValue: get(fileResource, 'securityPolicies')
+    }]);
+  };
+};
+
+export var FileResourceForm = generateForm({
+  formOptions: ['fileResourceSlug'],
+  dataSources: dataSources,
+  fields: fields,
+  handleSubmit: handleSubmit
+});
+FileResourceForm.displayName = 'FileResourceForm';

package/lib/components/core/file_resource/FileResourceTable.js

@@ -0,0 +1,71 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import { defineKqlQuery } from '../../../helpers';
+import { fetchFileResources } from '../../../apis';
+import { generatePaginationParams, generateSortParams } from '../../../apis/http';
+import { generateTable } from '../../table/Table';
+
+var filters = function filters() {
+  return function () {
+    return [{
+      name: 'slug',
+      label: 'Slug',
+      type: 'text'
+    }];
+  };
+};
+
+var fileResourceQuery = defineKqlQuery().matches('agentSlug', 'agentSlug').matches('filestoreSlug', 'filestoreSlug').matches('slug', 'slug').end();
+
+var dataSource = function dataSource() {
+  return {
+    fn: fetchFileResources,
+    params: function params(paramData) {
+      return [_objectSpread(_objectSpread(_objectSpread({}, generateSortParams(paramData)), generatePaginationParams(paramData)), {}, {
+        q: fileResourceQuery(paramData.filters.toJS()),
+        include: 'details'
+      })];
+    },
+    transform: function transform(result) {
+      return {
+        data: result.fileResources,
+        nextPageToken: result.nextPageToken
+      };
+    }
+  };
+};
+
+var columns = [{
+  value: 'slug',
+  title: 'Slug',
+  sortable: true
+}, {
+  value: 'agentSlug',
+  title: 'Agent Slug',
+  sortable: true
+}, {
+  value: 'filestoreSlug',
+  title: 'File Store Slug',
+  sortable: true
+}, {
+  value: 'createdAt',
+  title: 'Created',
+  sortable: true
+}, {
+  value: 'createdBy',
+  title: 'Created By'
+}, {
+  value: 'updatedAt',
+  title: 'Updated At',
+  sortable: true
+}, {
+  value: 'updatedBy',
+  title: 'Updated By',
+  sortable: true
+}];
+export var FileResourceTable = generateTable({
+  tableOptions: [],
+  columns: columns,
+  filters: filters,
+  dataSource: dataSource
+});
+FileResourceTable.displayName = 'FileResourceTable';