@panneau/core 1.0.0-alpha.19 → 1.0.0-alpha.193

package/es/hooks.js

@@ -11,7 +11,9 @@ import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import { getCsrfToken, postJSON, getCSRFHeaders } from '@folklore/fetch';
 import isObject from 'lodash/isObject';
-import { useFieldsManager, usePanneauResources, useUrlGenerator } from '@panneau/core/contexts';
+import isArray from 'lodash/isArray';
+import get from 'lodash/get';
+import { useFieldsManager, usePanneauResources, useResource, useUrlGenerator } from '@panneau/core/contexts';
 import { match } from 'css-mediaquery';
 
 var useAnimationFrame = function useAnimationFrame(onFrame) {
@@ -114,6 +116,7 @@ var getFieldsPropsFromFields = function getFieldsPropsFromFields(fields, _ref) {
       _onChange = _ref.onChange,
       props = _objectWithoutProperties(_ref, ["value", "errors", "onChange"]);
 
+  var locales = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
   return fields.reduce(function (allFields, field) {
     var _ref2 = isObject(field) ? field : {},
         _ref2$name = _ref2.name,
@@ -121,12 +124,18 @@ var getFieldsPropsFromFields = function getFieldsPropsFromFields(fields, _ref) {
         _ref2$component = _ref2.component,
         component = _ref2$component === void 0 ? null : _ref2$component;
 
-    console.log('f', field);
+    var fieldErrors = errors !== null ? errors[name] || [] : [];
+    var localizedErrors = component === 'localized' ? (locales || []).reduce(function (previousErrors, locale) {
+      var items = errors !== null ? get(errors, "".concat(name, ".").concat(locale), []) || [] : [];
+      var finalItems = isArray(items) ? items : [items];
+      var finalPrevious = isArray(previousErrors) ? previousErrors : [];
+      return [].concat(_toConsumableArray(finalPrevious), _toConsumableArray(finalItems));
+    }, fieldErrors) : fieldErrors;
     return [].concat(_toConsumableArray(allFields), [_objectSpread(_objectSpread({}, isObject(field) ? field : null), {}, {
       name: name,
       component: component,
       value: value !== null ? value[name] || null : null,
-      errors: errors !== null ? errors[name] || null : null,
+      errors: localizedErrors.length > 0 ? localizedErrors : null,
       onChange: function onChange(fieldValue) {
         return _onChange(name, fieldValue);
       }
@@ -161,7 +170,9 @@ var useForm = function useForm() {
       _opts$setValue = opts.setValue,
       setProvidedValue = _opts$setValue === void 0 ? null : _opts$setValue,
       _opts$onComplete = opts.onComplete,
-      onComplete = _opts$onComplete === void 0 ? null : _opts$onComplete;
+      onComplete = _opts$onComplete === void 0 ? null : _opts$onComplete,
+      _opts$locales = opts.locales,
+      locales = _opts$locales === void 0 ? [] : _opts$locales;
 
   var _useState = useState(initialValue || providedValue),
       _useState2 = _slicedToArray(_useState, 2),
@@ -201,7 +212,7 @@ var useForm = function useForm() {
   var hasProvidedGeneralError = setProvidedGeneralError !== null;
   var generalError = hasProvidedGeneralError ? providedGeneralError : stateGeneralError;
   var setGeneralError = hasProvidedGeneralError ? setProvidedGeneralError : setStateGeneralError;
-  var fieldsKey = [value, errors].concat(fields);
+  var fieldsKey = [value, errors, locales].concat(fields);
   var onFieldChange = useCallback(function (fieldName, fieldValue) {
     var fieldErrors = errors !== null ? errors[fieldName] || null : null;
 
@@ -216,7 +227,7 @@ var useForm = function useForm() {
       value: value,
       errors: errors,
       onChange: onFieldChange
-    });
+    }, locales);
   }, fieldsKey);
   var csrfToken = useMemo(function () {
     return getCsrfToken();
@@ -951,21 +962,27 @@ var getResource = function getResource(resources, resourceId) {
 var useResourceUrlGenerator = function useResourceUrlGenerator() {
   var resourceId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
   var resources = usePanneauResources();
-  var resource = getResource(resources, resourceId);
+  var contextResource = useResource();
+  var resource = getResource(resources, resourceId) || contextResource;
   var route = useUrlGenerator();
   return function (routeResourceId) {
     var routeName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
     var params = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
     var finalRouteName = resourceId !== null ? routeResourceId : routeName;
     var finalParams = resourceId !== null ? routeName : params;
-    var finalResource = resource || getResource(resources, routeResourceId);
-    var id = finalResource.id,
-        _finalResource$has_ro = finalResource.has_routes,
-        hasRoutes = _finalResource$has_ro === void 0 ? false : _finalResource$has_ro;
-    var routePrefix = hasRoutes ? "resources.".concat(id) : 'resources';
-    return route("".concat(routePrefix, ".").concat(finalRouteName), _objectSpread(_objectSpread({}, finalParams), {}, {
+    var finalResource = getResource(resources, routeResourceId) || resource;
+
+    var _ref = finalResource || {},
+        _ref$id = _ref.id,
+        id = _ref$id === void 0 ? null : _ref$id; // console.log('gen', finalRouteName, route(`resources.${finalRouteName}`, {
+    //     ...finalParams,
+    //     resource: id,
+    // }));
+
+
+    return id !== null ? route("resources.".concat(finalRouteName), _objectSpread(_objectSpread({}, finalParams), {}, {
       resource: id
-    }));
+    })) : null;
   };
 };
 

package/es/index.js

@@ -11,10 +11,12 @@ import 'snake-case';
 import isObject from 'lodash/isObject';
 import 'react';
 import { pascalCase } from 'change-case';
-import 'lodash/isString';
+import ReactIs from 'react-is';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import 'lodash/isString';
 import isArray from 'lodash/isArray';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
+import 'lodash/capitalize';
 import 'slugify';
 import uniqBy from 'lodash/uniqBy';
 import uniq from 'lodash/uniq';
@@ -71,6 +73,7 @@ var routes = PropTypes$1.shape({
   'resources.show': PropTypes$1.string.isRequired,
   'resources.edit': PropTypes$1.string.isRequired,
   'resources.update': PropTypes$1.string.isRequired,
+  'resources.delete': PropTypes$1.string.isRequired,
   'resources.destroy': PropTypes$1.string.isRequired
 });
 var intl = PropTypes$1.shape({
@@ -85,8 +88,9 @@ var pages = PropTypes$1.objectOf(page);
 var field = PropTypes$1.shape({
   // type: PropTypes.string.isRequired,
   name: PropTypes$1.isRequired,
-  component: PropTypes$1.string.isRequired,
-  label: PropTypes$1.isRequired
+  type: PropTypes$1.string,
+  component: PropTypes$1.string,
+  label: PropTypes$1.node
 });
 var fields = PropTypes$1.arrayOf(field);
 var form = PropTypes$1.shape({
@@ -97,11 +101,10 @@ var form = PropTypes$1.shape({
 var forms = PropTypes$1.arrayOf(form);
 var resource = PropTypes$1.shape({
   id: PropTypes$1.string.isRequired,
-  label: PropTypes$1.string.isRequired,
+  name: PropTypes$1.string.isRequired,
   intl: intl,
   fields: fields,
   forms: PropTypes$1.shape({}),
-  has_routes: PropTypes$1.bool,
   shows_in_navbar: PropTypes$1.bool
 });
 var resources = PropTypes$1.arrayOf(resource);
@@ -138,6 +141,11 @@ var formError = PropTypes$1.shape({
   message: PropTypes$1.string
 });
 var formErrors = PropTypes$1.arrayOf(formError);
+var uppy = PropTypes$1.shape({
+  tus: PropTypes$1.object
+}); // eslint-disable-line
+
+var triggerUpdate = PropTypes$1.string;
 
 var PropTypes = /*#__PURE__*/Object.freeze({
     __proto__: null,
@@ -178,9 +186,23 @@ var PropTypes = /*#__PURE__*/Object.freeze({
     selectOptions: selectOptions,
     feedback: feedback,
     formError: formError,
-    formErrors: formErrors
+    formErrors: formErrors,
+    uppy: uppy,
+    triggerUpdate: triggerUpdate
 });
 
+var flattenComponents = function flattenComponents(components) {
+  var prefix = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+
+  if (components === null) {
+    return null;
+  }
+
+  return Object.keys(components).reduce(function (newMap, key) {
+    return ReactIs.isValidElementType(components[key]) ? _objectSpread(_objectSpread({}, newMap), {}, _defineProperty({}, prefix !== null ? "".concat(prefix, ".").concat(key) : key, components[key])) : _objectSpread(_objectSpread({}, newMap), flattenComponents(components[key], key));
+  }, {});
+};
+
 var getComponentFromName = function getComponentFromName() {
   var name = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
   var components = arguments.length > 1 ? arguments[1] : undefined;
@@ -213,7 +235,7 @@ var ComponentsManager = /*#__PURE__*/function (_EventEmitter) {
     _classCallCheck(this, ComponentsManager);
 
     _this = _super.call(this);
-    _this.components = components;
+    _this.components = flattenComponents(components);
     return _this;
   }
 

package/es/utils.js

@@ -4,12 +4,14 @@ import isObject from 'lodash/isObject';
 import { useEffect } from 'react';
 import { pascalCase, paramCase, snakeCase as snakeCase$1 } from 'change-case';
 export { paramCase as dashCase, pascalCase, snakeCase } from 'change-case';
-import isString from 'lodash/isString';
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _objectSpread from '@babel/runtime/helpers/objectSpread2';
+import ReactIs from 'react-is';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import isString from 'lodash/isString';
 import isArray from 'lodash/isArray';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
-import _objectSpread from '@babel/runtime/helpers/objectSpread2';
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import capitalize from 'lodash/capitalize';
 import slugify from 'slugify';
 
 var convertStyleToString = function convertStyleToString(style) {
@@ -56,6 +58,31 @@ var createUseEvent = function createUseEvent(eventsManager) {
   };
 };
 
+var flattenComponents = function flattenComponents(components) {
+  var prefix = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+
+  if (components === null) {
+    return null;
+  }
+
+  return Object.keys(components).reduce(function (newMap, key) {
+    return ReactIs.isValidElementType(components[key]) ? _objectSpread(_objectSpread({}, newMap), {}, _defineProperty({}, prefix !== null ? "".concat(prefix, ".").concat(key) : key, components[key])) : _objectSpread(_objectSpread({}, newMap), flattenComponents(components[key], key));
+  }, {});
+};
+
+var getComponent = function getComponent(component) {
+  var _ref = isObject(component) ? component : {
+    component: component
+  };
+      _ref.component;
+      var props = _objectWithoutProperties(_ref, ["component"]);
+
+  return {
+    name: component,
+    props: props
+  };
+};
+
 var getColumnFromField = function getColumnFromField(field) {
   if (field === null) {
     return null;
@@ -63,82 +90,43 @@ var getColumnFromField = function getColumnFromField(field) {
 
 
   var name = field.name,
-      _field$components = field.components,
-      components = _field$components === void 0 ? null : _field$components,
-      _field$settings = field.settings;
-  _field$settings = _field$settings === void 0 ? {} : _field$settings;
-  var order = _field$settings.orderInIndex,
+      _field$components = field.components;
+  _field$components = _field$components === void 0 ? {} : _field$components;
+  var _field$components$dis = _field$components.display,
+      display = _field$components$dis === void 0 ? null : _field$components$dis,
       label = field.label;
-  return {
+
+  var _getComponent = getComponent(display),
+      _getComponent$name = _getComponent.name,
+      componentName = _getComponent$name === void 0 ? null : _getComponent$name,
+      _getComponent$props = _getComponent.props,
+      componentProps = _getComponent$props === void 0 ? null : _getComponent$props;
+
+  return _objectSpread(_objectSpread({}, componentProps), {}, {
     id: name,
     label: label,
     valueKey: name,
-    order: order,
-    component: components !== null ? components.index_column || components.index || null : null,
+    component: componentName,
     field: field
-  };
-};
-var sortColumns = function sortColumns(columns) {
-  return columns.sort(function (_ref, _ref2) {
-    var _ref$order = _ref.order,
-        aOrder = _ref$order === void 0 ? null : _ref$order;
-    var _ref2$order = _ref2.order,
-        bOrder = _ref2$order === void 0 ? null : _ref2$order;
-
-    if (aOrder === bOrder) {
-      return 0;
-    }
-
-    if (aOrder === null) {
-      return 1;
-    }
-
-    if (bOrder === null) {
-      return -1;
-    }
-
-    return aOrder > bOrder ? 1 : -1;
   });
 };
-var getColumnsFromResource = function getColumnsFromResource(resource) {
-  var fields = resource.fields,
-      _resource$columns = resource.columns,
-      resourceColumns = _resource$columns === void 0 ? null : _resource$columns;
-  var newColumns = resourceColumns !== null ? resourceColumns.map(function (column) {
-    var _ref3 = isString(column) ? {
+var getColumnsWithFields = function getColumnsWithFields(resource, columns) {
+  var fields = resource.fields;
+  var newColumns = columns !== null ? columns.map(function (column) {
+    var _ref = isString(column) ? {
       field: column
     } : column,
-        _ref3$field = _ref3.field,
-        fieldName = _ref3$field === void 0 ? null : _ref3$field;
+        _ref$field = _ref.field,
+        fieldName = _ref$field === void 0 ? null : _ref$field,
+        otherProps = _objectWithoutProperties(_ref, ["field"]);
 
-    return fieldName !== null ? getColumnFromField(fields.find(function (it) {
+    return _objectSpread(_objectSpread({}, fieldName !== null ? getColumnFromField(fields.find(function (it) {
       return it.name === fieldName;
-    }) || null) : column;
+    }) || null) : null), otherProps);
   }).filter(function (it) {
     return it !== null;
-  }) : fields.filter(function (_ref4) {
-    var _ref4$settings = _ref4.settings;
-    _ref4$settings = _ref4$settings === void 0 ? {} : _ref4$settings;
-    var _ref4$settings$hidden = _ref4$settings.hiddenInIndex,
-        hiddenInIndex = _ref4$settings$hidden === void 0 ? false : _ref4$settings$hidden;
-    return !hiddenInIndex;
-  }).map(function (field) {
-    return getColumnFromField(field);
-  });
-  return sortColumns(newColumns);
-};
-
-var getComponent = function getComponent(component) {
-  var _ref = isObject(component) ? component : {
-    component: component
-  };
-      _ref.component;
-      var props = _objectWithoutProperties(_ref, ["component"]);
-
-  return {
-    name: component,
-    props: props
-  };
+  }) : [];
+  return newColumns;
 };
 
 var getComponentFromName = function getComponentFromName() {
@@ -251,9 +239,27 @@ var getFileName = function getFileName() {
 
 var getSelectOptions = function getSelectOptions(options) {
   return options.map(function (it) {
-    return isObject(it) ? it : {
+    if (isObject(it)) {
+      var _it$label = it.label,
+          label = _it$label === void 0 ? null : _it$label,
+          value = it.value;
+
+      if (label === null) {
+        return {
+          value: value,
+          label: capitalize("".concat(value))
+        };
+      }
+
+      return {
+        value: value,
+        label: "".concat(label)
+      };
+    }
+
+    return {
       value: it,
-      label: it
+      label: capitalize("".concat(it))
     };
   });
 };
@@ -309,4 +315,4 @@ var validateFields = function validateFields(fields, value) {
   }, true);
 };
 
-export { convertStyleToString, createNullableOnChange, createUseEvent, getColumnsFromResource, getComponent, getComponentFromName, getDefinitionFromId, getDisplayName, getFieldByName, getFieldFromPath, getFileName, getSelectOptions, isMessage, setValue as setFieldValue, slug, validateFields };
+export { convertStyleToString, createNullableOnChange, createUseEvent, flattenComponents, getColumnsWithFields, getComponent, getComponentFromName, getDefinitionFromId, getDisplayName, getFieldByName, getFieldFromPath, getFileName, getSelectOptions, isMessage, setValue as setFieldValue, slug, validateFields };