@panneau/app 1.0.0-alpha.26 → 1.0.0-alpha.260

package/lib/index.js

@@ -1,302 +1,409 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
+var PropTypes = require('prop-types');
 var React = require('react');
-var reactIntl = require('react-intl');
 var reactRouter = require('react-router');
 var reactRouterDom = require('react-router-dom');
-var PropTypes = require('prop-types');
+var auth = require('@panneau/auth');
 var core = require('@panneau/core');
 var contexts = require('@panneau/core/contexts');
 var data = require('@panneau/data');
+var DisplaysProvider = require('@panneau/displays');
 var FieldsProvider = require('@panneau/fields');
+var FiltersProvider = require('@panneau/filters');
 var FormsProvider = require('@panneau/forms');
+var intl = require('@panneau/intl');
 var ListsProvider = require('@panneau/lists');
-var DisplaysProvider = require('@panneau/displays');
-var FiltersProvider = require('@panneau/filters');
 var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
 var utils = require('@panneau/core/utils');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var queryString = require('query-string');
 var hooks = require('@panneau/core/hooks');
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var classNames = require('classnames');
+var reactIntl = require('react-intl');
+var Button = require('@panneau/element-button');
+var Form = require('@panneau/element-form');
 var Navbar = require('@panneau/element-navbar');
 var Menu = require('@panneau/element-menu');
 var Label = require('@panneau/element-label');
-var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
-var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
-var queryString = require('query-string');
+var isString = require('lodash/isString');
 var Alert = require('@panneau/element-alert');
-var Button = require('@panneau/element-button');
 var Dropdown = require('@panneau/element-dropdown');
+var Pagination = require('@panneau/element-pagination');
+var _toPropertyKey = require('@babel/runtime/helpers/toPropertyKey');
+var freeSolidSvgIcons = require('@fortawesome/free-solid-svg-icons');
+var reactFontawesome = require('@fortawesome/react-fontawesome');
 var FormGroup = require('@panneau/element-form-group');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var _objectSpread__default = /*#__PURE__*/_interopDefaultLegacy(_objectSpread);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var DisplaysProvider__default = /*#__PURE__*/_interopDefaultLegacy(DisplaysProvider);
 var FieldsProvider__default = /*#__PURE__*/_interopDefaultLegacy(FieldsProvider);
+var FiltersProvider__default = /*#__PURE__*/_interopDefaultLegacy(FiltersProvider);
 var FormsProvider__default = /*#__PURE__*/_interopDefaultLegacy(FormsProvider);
 var ListsProvider__default = /*#__PURE__*/_interopDefaultLegacy(ListsProvider);
-var DisplaysProvider__default = /*#__PURE__*/_interopDefaultLegacy(DisplaysProvider);
-var FiltersProvider__default = /*#__PURE__*/_interopDefaultLegacy(FiltersProvider);
 var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
-var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
 var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
+var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
+var Form__default = /*#__PURE__*/_interopDefaultLegacy(Form);
 var Navbar__default = /*#__PURE__*/_interopDefaultLegacy(Navbar);
 var Menu__default = /*#__PURE__*/_interopDefaultLegacy(Menu);
 var Label__default = /*#__PURE__*/_interopDefaultLegacy(Label);
-var _objectSpread__default = /*#__PURE__*/_interopDefaultLegacy(_objectSpread);
-var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
+var isString__default = /*#__PURE__*/_interopDefaultLegacy(isString);
 var Alert__default = /*#__PURE__*/_interopDefaultLegacy(Alert);
-var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
 var Dropdown__default = /*#__PURE__*/_interopDefaultLegacy(Dropdown);
+var Pagination__default = /*#__PURE__*/_interopDefaultLegacy(Pagination);
+var _toPropertyKey__default = /*#__PURE__*/_interopDefaultLegacy(_toPropertyKey);
 var FormGroup__default = /*#__PURE__*/_interopDefaultLegacy(FormGroup);
 
-var useAuthCheck = function useAuthCheck() {
-  var _useState = React.useState(false),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
-      loading = _useState2[0],
-      setLoading = _useState2[1];
-
-  var api = data.useApi();
-  var check = React.useCallback(function () {
-    setLoading(true);
-    return api.auth.check().then(function (response) {
-      setLoading(false);
-      return response;
-    })["catch"](function (e) {
-      setLoading(false);
-      throw e;
-    });
-  }, [api, setLoading]);
-  return {
-    check: check,
-    loading: loading
-  };
+var _excluded$5 = ["resource", "action", "previous", "status", "value", "onSubmit", "errors", "generalError", "className"];
+var propTypes$n = {
+  resource: core.PropTypes.resource.isRequired,
+  action: PropTypes__default["default"].string,
+  previous: PropTypes__default["default"].string,
+  fields: core.PropTypes.fields.isRequired,
+  value: PropTypes__default["default"].object,
+  // eslint-disable-line react/forbid-prop-types
+  onChange: PropTypes__default["default"].func.isRequired,
+  onSubmit: PropTypes__default["default"].func,
+  status: core.PropTypes.formStatus,
+  generalError: PropTypes__default["default"].string,
+  errors: PropTypes__default["default"].objectOf(PropTypes__default["default"].arrayOf(PropTypes__default["default"].string)),
+  className: PropTypes__default["default"].string
 };
-
-var useAuthLogin = function useAuthLogin() {
-  var _useState = React.useState(false),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
-      loading = _useState2[0],
-      setLoading = _useState2[1];
-
-  var api = data.useApi();
-  var login = React.useCallback(function (email, password) {
-    setLoading(true);
-    return api.auth.login(email, password).then(function (response) {
-      setLoading(false);
-      return response;
-    })["catch"](function (e) {
-      setLoading(false);
-      throw e;
-    });
-  }, [api, setLoading]);
-  return {
-    login: login,
-    loading: loading
-  };
+var defaultProps$n = {
+  action: null,
+  previous: null,
+  status: null,
+  value: null,
+  onSubmit: null,
+  generalError: null,
+  errors: null,
+  className: null
 };
 
-var useAuthLogout = function useAuthLogout() {
-  var _useState = React.useState(false),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
-      loading = _useState2[0],
-      setLoading = _useState2[1];
-
-  var api = data.useApi();
-  var logout = React.useCallback(function () {
-    setLoading(true);
-    return api.auth.logout().then(function (response) {
-      setLoading(false);
-      return response;
-    })["catch"](function (e) {
-      setLoading(false);
-      throw e;
-    });
-  }, [api, setLoading]);
-  return {
-    logout: logout,
-    loading: loading
-  };
-};
+var DeleteForm = function DeleteForm(_ref) {
+  var resource = _ref.resource,
+      action = _ref.action,
+      previous = _ref.previous;
+      _ref.status;
+      var value = _ref.value,
+      onSubmit = _ref.onSubmit;
+      _ref.errors;
+      var generalError = _ref.generalError,
+      className = _ref.className,
+      props = _objectWithoutProperties__default["default"](_ref, _excluded$5);
 
-var useAuthRegister = function useAuthRegister() {
-  var _useState = React.useState(false),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
-      loading = _useState2[0],
-      setLoading = _useState2[1];
-
-  var api = data.useApi();
-  var register = React.useCallback(function (data) {
-    setLoading(true);
-    return api.auth.register(data).then(function (response) {
-      setLoading(false);
-      return response;
-    })["catch"](function (e) {
-      setLoading(false);
-      throw e;
-    });
-  }, [api, setLoading]);
-  return {
-    register: register,
-    loading: loading
-  };
+  return /*#__PURE__*/React__default["default"].createElement(Form__default["default"], Object.assign({
+    className: classNames__default["default"](['form', _defineProperty__default["default"]({
+      'invalid-feedback': generalError !== null
+    }, className, className !== null)]),
+    action: action,
+    onSubmit: onSubmit,
+    withoutActions: true,
+    withoutErrors: true
+  }, props), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "card"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "card-body"
+  }, /*#__PURE__*/React__default["default"].createElement(intl.ResourceMessage, {
+    resource: resource,
+    values: value,
+    defaultMessage: "Are you sure you want to delete {the_singular} #{id}?",
+    description: "Confirmation message"
+  }), generalError ? /*#__PURE__*/React__default["default"].createElement("p", {
+    className: "text-danger"
+  }, /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
+    id: "y9zauY",
+    defaultMessage: [{
+      "type": 0,
+      "value": "An error occured and we could not delete this item successfully."
+    }]
+  })) : null), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "card-body d-flex"
+  }, previous !== null ? /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
+    href: previous,
+    className: "me-2",
+    theme: "secondary",
+    outline: true
+  }, /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
+    id: "PyxZY2",
+    defaultMessage: [{
+      "type": 0,
+      "value": "Cancel"
+    }]
+  })) : null, /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
+    type: "submit",
+    className: "ms-auto",
+    theme: "danger"
+  }, /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
+    id: "Bhu3B2",
+    defaultMessage: [{
+      "type": 0,
+      "value": "Delete"
+    }]
+  })))));
 };
 
-var useAuthRequestPassword = function useAuthRequestPassword() {
-  var _useState = React.useState(false),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
-      loading = _useState2[0],
-      setLoading = _useState2[1];
-
-  var api = data.useApi();
-  var request = React.useCallback(function (email) {
-    setLoading(true);
-    return api.auth.requestPassword(email).then(function (response) {
-      setLoading(false);
-      return response;
-    })["catch"](function (e) {
-      setLoading(false);
-      throw e;
-    });
-  }, [api, setLoading]);
-  return {
-    request: request,
-    loading: loading
-  };
+DeleteForm.propTypes = propTypes$n;
+DeleteForm.defaultProps = defaultProps$n;
+
+var _excluded$4 = ["component", "resource", "onSuccess", "item", "type", "isDelete"];
+var propTypes$m = {
+  component: PropTypes__default["default"].string,
+  resource: core.PropTypes.resource.isRequired,
+  item: PropTypes__default["default"].object,
+  // eslint-disable-line react/forbid-prop-types
+  type: PropTypes__default["default"].string,
+  onSuccess: PropTypes__default["default"].func,
+  isDelete: PropTypes__default["default"].bool
+};
+var defaultProps$m = {
+  component: null,
+  item: null,
+  type: null,
+  onSuccess: null,
+  isDelete: false
 };
 
-var useAuthResetPassword = function useAuthResetPassword() {
-  var _useState = React.useState(false),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
-      loading = _useState2[0],
-      setLoading = _useState2[1];
-
-  var api = data.useApi();
-  var reset = React.useCallback(function (data) {
-    setLoading(true);
-    return api.auth.resetPassword(data).then(function (response) {
-      setLoading(false);
-      return response;
-    })["catch"](function (e) {
-      setLoading(false);
-      throw e;
+var ResourceForm = function ResourceForm(_ref) {
+  var component = _ref.component,
+      resource = _ref.resource,
+      onSuccess = _ref.onSuccess,
+      item = _ref.item,
+      type = _ref.type,
+      isDelete = _ref.isDelete,
+      props = _objectWithoutProperties__default["default"](_ref, _excluded$4);
+
+  var locales = contexts.useLocales();
+  var FormComponents = contexts.useFormsComponents();
+  var _resource$fields = resource.fields,
+      resourceFields = _resource$fields === void 0 ? [] : _resource$fields,
+      _resource$types = resource.types,
+      resourceTypes = _resource$types === void 0 ? [] : _resource$types,
+      forms = resource.forms;
+  var resourceType = type !== null ? resourceTypes.find(function (it) {
+    return it.id === type;
+  }) || null : null;
+
+  var _ref2 = resourceType || {},
+      _ref2$fields = _ref2.fields,
+      resourceTypeFields = _ref2$fields === void 0 ? null : _ref2$fields;
+
+  var isCreate = item === null || !item.id; // Pick fields from resource root or form
+
+  var _ref3 = forms || {},
+      _ref3$default = _ref3["default"],
+      defaultForm = _ref3$default === void 0 ? null : _ref3$default,
+      _ref3$create = _ref3.create,
+      createForm = _ref3$create === void 0 ? null : _ref3$create,
+      _ref3$edit = _ref3.edit,
+      editForm = _ref3$edit === void 0 ? null : _ref3$edit,
+      _ref3$delete = _ref3["delete"],
+      deleteForm = _ref3$delete === void 0 ? null : _ref3$delete;
+
+  var _ref4 = defaultForm || {},
+      _ref4$fields = _ref4.fields,
+      defaultFields = _ref4$fields === void 0 ? null : _ref4$fields,
+      defaultComponent = _ref4.component;
+
+  var createOrEditSource = isCreate ? createForm || {} : editForm || {};
+
+  var _ref5 = isDelete ? deleteForm || {} : createOrEditSource || {},
+      _ref5$fields = _ref5.fields,
+      formFields = _ref5$fields === void 0 ? null : _ref5$fields,
+      _ref5$component = _ref5.component,
+      formComponent = _ref5$component === void 0 ? null : _ref5$component;
+
+  var finalFields = React.useMemo(function () {
+    return (formFields || defaultFields || resourceTypeFields || resourceFields).filter(function (_ref6) {
+      var _ref6$settings = _ref6.settings;
+      _ref6$settings = _ref6$settings === void 0 ? {} : _ref6$settings;
+      var _ref6$settings$hidden = _ref6$settings.hiddenInForm,
+          hiddenInForm = _ref6$settings$hidden === void 0 ? false : _ref6$settings$hidden;
+      return !hiddenInForm;
     });
-  }, [api, setLoading]);
-  return {
-    reset: reset,
-    loading: loading
-  };
-};
+  }, [formFields, defaultFields, resourceTypeFields, resourceFields]); // Form routes
 
-var AuthContext = /*#__PURE__*/React__default['default'].createContext(null);
-var useAuth = function useAuth() {
-  return React.useContext(AuthContext);
-};
-var useUser = function useUser() {
-  var _useAuth = useAuth(),
-      user = _useAuth.user;
+  var resourceRoute = hooks.useResourceUrlGenerator(resource);
 
-  return user;
-};
-var useLogout = function useLogout() {
-  var _useAuth3 = useAuth(),
-      logout = _useAuth3.logout;
+  var _useResourceStore = data.useResourceStore(resource),
+      store = _useResourceStore.store;
 
-  return logout;
-};
-var propTypes$o = {
-  children: PropTypes__default['default'].node.isRequired,
-  user: core.PropTypes.user,
-  checkOnMount: PropTypes__default['default'].bool
-};
-var defaultProps$o = {
-  user: null,
-  checkOnMount: false
-};
-var AuthProvider = function AuthProvider(_ref) {
-  var initialUser = _ref.user,
-      checkOnMount = _ref.checkOnMount,
-      children = _ref.children;
+  var _useResourceUpdate = data.useResourceUpdate(resource, item != null ? item.id : null),
+      update = _useResourceUpdate.update;
 
-  var _useState = React.useState(initialUser),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
-      user = _useState2[0],
-      setUser = _useState2[1];
+  var _useResourceDestroy = data.useResourceDestroy(resource, item != null ? item.id : null),
+      destroy = _useResourceDestroy.destroy; // Post actions
 
-  var _useAuthLogin = useAuthLogin(),
-      authLogin = _useAuthLogin.login;
 
-  var _useAuthLogout = useAuthLogout(),
-      authLogout = _useAuthLogout.logout;
+  var postAction = isCreate ? store : update;
+  var postForm = React.useCallback(function (action, data) {
+    return isDelete ? destroy() : postAction(data);
+  }, [postAction, isDelete, destroy, store, update]); // Form state
 
-  var _useAuthCheck = useAuthCheck(),
-      authCheck = _useAuthCheck.check;
+  var getInitialValue = React.useCallback(function () {
+    return item !== null ? item : finalFields.reduce(function (defaultValues, _ref7) {
+      var name = _ref7.name,
+          _ref7$defaultValue = _ref7.defaultValue,
+          defaultValue = _ref7$defaultValue === void 0 ? null : _ref7$defaultValue;
+      return defaultValue !== null ? _objectSpread__default["default"](_objectSpread__default["default"]({}, defaultValues), {}, _defineProperty__default["default"]({}, name, defaultValue)) : defaultValues;
+    }, type !== null ? {
+      type: type
+    } : null);
+  }, [item, type, finalFields]);
 
-  var _useAuthRegister = useAuthRegister(),
-      authRegister = _useAuthRegister.register;
+  var _useState = React.useState(getInitialValue()),
+      _useState2 = _slicedToArray__default["default"](_useState, 2),
+      value = _useState2[0],
+      setValueState = _useState2[1];
 
-  var _useAuthRequestPasswo = useAuthRequestPassword(),
-      authRequestPassword = _useAuthRequestPasswo.request;
+  var setValue = React.useCallback(function (newValue) {
+    // console.log('new value in resource form', newValue); // eslint-disable-line
+    setValueState(newValue);
+  }, [setValueState]);
 
-  var _useAuthResetPassword = useAuthResetPassword(),
-      authResetPassword = _useAuthResetPassword.reset;
+  var _useForm = hooks.useForm({
+    fields: finalFields,
+    value: value,
+    postForm: postForm,
+    setValue: setValue,
+    onComplete: onSuccess,
+    locales: locales
+  }),
+      fields = _useForm.fields,
+      onSubmit = _useForm.onSubmit,
+      status = _useForm.status,
+      generalError = _useForm.generalError,
+      errors = _useForm.errors; // Form action
+
+
+  var modifyAction = isCreate ? resourceRoute('store') : resourceRoute('update', {
+    id: item.id
+  });
+  var action = isDelete ? resourceRoute('destroy', {
+    id: item.id
+  }) : modifyAction;
+  var defaultFormName = isDelete ? component || formComponent || null : component || formComponent || defaultComponent || 'normal'; // Form component
+
+  var FormComponent = utils.getComponentFromName(defaultFormName, FormComponents, isDelete ? DeleteForm : component); // Lisen to item value change - this is important
 
-  var login = React.useCallback(function (email, password) {
-    return authLogin(email, password).then(function (newUser) {
-      setUser(newUser);
-      return newUser;
-    });
-  }, [authLogin, setUser]);
-  var logout = React.useCallback(function () {
-    return authLogout().then(function () {
-      setUser(null);
-    });
-  }, [authLogout, setUser]);
-  var register = React.useCallback(function (data) {
-    return authRegister(data).then(function (newUser) {
-      setUser(newUser);
-      return newUser;
-    });
-  }, [authRegister, setUser]);
-  var requestPassword = React.useCallback(function (email) {
-    return authRequestPassword(email);
-  }, [authRequestPassword]);
-  var resetPassword = React.useCallback(function (data) {
-    return authResetPassword(data);
-  }, [authResetPassword]);
   React.useEffect(function () {
-    if (checkOnMount) {
-      authCheck().then(function () {
-        var newUser = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-        setUser(newUser);
-      })["catch"](function () {
-        setUser(null);
-      });
-    }
-  }, [authCheck, setUser, checkOnMount]);
-  return /*#__PURE__*/React__default['default'].createElement(AuthContext.Provider, {
-    value: {
-      user: user,
-      setUser: setUser,
-      loggedIn: user !== null,
-      logout: logout,
-      login: login,
-      register: register,
-      requestPassword: requestPassword,
-      resetPassword: resetPassword
-    }
-  }, children);
+    // console.log('get initial value from the top'); // eslint-disable-line
+    setValue(getInitialValue());
+  }, [getInitialValue, setValue]);
+  return /*#__PURE__*/React__default["default"].createElement(contexts.FormProvider, {
+    value: value,
+    setValue: setValue
+  }, /*#__PURE__*/React__default["default"].createElement(FormComponent, Object.assign({}, props, {
+    status: status,
+    resource: resource,
+    item: item,
+    fields: fields,
+    generalError: generalError,
+    errors: errors,
+    action: action,
+    onSubmit: onSubmit,
+    isCreate: isCreate,
+    value: value,
+    onChange: setValue
+  })));
 };
-AuthProvider.propTypes = propTypes$o;
-AuthProvider.defaultProps = defaultProps$o;
 
-var propTypes$n = {
-  className: PropTypes__default['default'].string,
-  itemClassName: PropTypes__default['default'].string,
-  linkClassName: PropTypes__default['default'].string
+ResourceForm.propTypes = propTypes$m;
+ResourceForm.defaultProps = defaultProps$m;
+
+var propTypes$l = {
+  className: PropTypes__default["default"].string,
+  itemClassName: PropTypes__default["default"].string,
+  linkClassName: PropTypes__default["default"].string
 };
-var defaultProps$n = {
+var defaultProps$l = {
+  className: null,
+  itemClassName: null,
+  linkClassName: null
+};
+
+var AccountMenu = function AccountMenu(_ref) {
+  var className = _ref.className,
+      itemClassName = _ref.itemClassName,
+      linkClassName = _ref.linkClassName;
+  var route = contexts.useUrlGenerator();
+  var user = auth.useUser();
+  var logout = auth.useLogout();
+  var onClickLogout = React.useCallback(function (e) {
+    e.preventDefault();
+    logout();
+  }, [logout, route]);
+  var items = React.useMemo(function () {
+    return user !== null ? [{
+      id: 'account',
+      label: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
+        id: "IuqEHB",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Account"
+        }]
+      }),
+      href: route('panneau.account'),
+      dropdown: [//   {
+      //       label: (
+      //           <FormattedMessage
+      //               defaultMessage="Update account"
+      //               description="Menu label"
+      //           />
+      //       ),
+      //       href: route('panneau.account'),
+      //   },
+      {
+        label: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
+          id: "REIcPg",
+          defaultMessage: [{
+            "type": 0,
+            "value": "Logout"
+          }]
+        }),
+        href: route('auth.logout'),
+        onClick: onClickLogout
+      }]
+    }] : [{
+      label: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
+        id: "d0g58T",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Login"
+        }]
+      }),
+      href: route('login')
+    }];
+  }, [user, route, onClickLogout]);
+  return items !== null ? /*#__PURE__*/React__default["default"].createElement(Menu__default["default"], {
+    className: className,
+    itemClassName: itemClassName,
+    linkClassName: linkClassName,
+    items: items,
+    dropdownAlign: "end"
+  }) : null;
+};
+
+AccountMenu.propTypes = propTypes$l;
+AccountMenu.defaultProps = defaultProps$l;
+
+var propTypes$k = {
+  className: PropTypes__default["default"].string,
+  itemClassName: PropTypes__default["default"].string,
+  linkClassName: PropTypes__default["default"].string
+};
+var defaultProps$k = {
   className: null,
   itemClassName: null,
   linkClassName: null
@@ -329,7 +436,7 @@ var ResourcesMenu = function ResourcesMenu(_ref) {
       };
     });
   }, [resources, pathname, resourceRoute]);
-  return /*#__PURE__*/React__default['default'].createElement(Menu__default['default'], {
+  return /*#__PURE__*/React__default["default"].createElement(Menu__default["default"], {
     items: items,
     className: className,
     itemClassName: itemClassName,
@@ -337,219 +444,12 @@ var ResourcesMenu = function ResourcesMenu(_ref) {
   });
 };
 
-ResourcesMenu.propTypes = propTypes$n;
-ResourcesMenu.defaultProps = defaultProps$n;
-
-var messages$1 = reactIntl.defineMessages({
-  // Resources
-  index: {
-    "id": "resources.index",
-    "defaultMessage": [{
-      "type": 0,
-      "value": "View "
-    }, {
-      "type": 1,
-      "value": "a_plural"
-    }]
-  },
-  create: {
-    "id": "resources.create",
-    "defaultMessage": [{
-      "type": 0,
-      "value": "Create "
-    }, {
-      "type": 1,
-      "value": "a_singular"
-    }]
-  },
-  edit: {
-    "id": "resources.edit",
-    "defaultMessage": [{
-      "type": 0,
-      "value": "Edit "
-    }, {
-      "type": 1,
-      "value": "a_singular"
-    }]
-  },
-  "delete": {
-    "id": "resources.delete",
-    "defaultMessage": [{
-      "type": 0,
-      "value": "Delete "
-    }, {
-      "type": 1,
-      "value": "a_singular"
-    }]
-  },
-  created: {
-    "id": "resources.created",
-    "defaultMessage": [{
-      "type": 1,
-      "value": "the_singular"
-    }, {
-      "type": 0,
-      "value": " has been created."
-    }]
-  },
-  deleted: {
-    "id": "resources.deleted",
-    "defaultMessage": [{
-      "type": 1,
-      "value": "the_singular"
-    }, {
-      "type": 0,
-      "value": " has been deleted."
-    }]
-  },
-  loading: {
-    "id": "resources.loading",
-    "defaultMessage": [{
-      "type": 0,
-      "value": "Loading "
-    }, {
-      "type": 1,
-      "value": "plural"
-    }, {
-      "type": 0,
-      "value": "..."
-    }]
-  },
-  // Forms
-  confirm_delete: {
-    "id": "form.confirm_delete",
-    "defaultMessage": [{
-      "type": 0,
-      "value": "Are you sure you want to delete item #"
-    }, {
-      "type": 1,
-      "value": "id"
-    }, {
-      "type": 0,
-      "value": "?"
-    }]
-  },
-  show_button: {
-    "id": "form.show_button",
-    "defaultMessage": [{
-      "type": 0,
-      "value": "Cancel"
-    }]
-  },
-  edit_button: {
-    "id": "form.edit_button",
-    "defaultMessage": [{
-      "type": 0,
-      "value": "Edit"
-    }]
-  },
-  cancel_button: {
-    "id": "form.cancel_button",
-    "defaultMessage": [{
-      "type": 0,
-      "value": "Cancel"
-    }]
-  },
-  delete_button: {
-    "id": "form.delete_button",
-    "defaultMessage": [{
-      "type": 0,
-      "value": "Delete"
-    }]
-  },
-  // Auth
-  login_title: {
-    "id": "auth.login.title",
-    "defaultMessage": [{
-      "type": 0,
-      "value": "Login"
-    }]
-  },
-  login: {
-    "id": "auth.login",
-    "defaultMessage": [{
-      "type": 0,
-      "value": "Login"
-    }]
-  },
-  logout: {
-    "id": "auth.logout",
-    "defaultMessage": [{
-      "type": 0,
-      "value": "Logout"
-    }]
-  },
-  account: {
-    "id": "auth.account",
-    "defaultMessage": [{
-      "type": 0,
-      "value": "Account"
-    }]
-  },
-  updateAccount: {
-    "id": "auth.update_account",
-    "defaultMessage": [{
-      "type": 0,
-      "value": "Update account"
-    }]
-  }
-});
-
-var propTypes$m = {
-  className: PropTypes__default['default'].string,
-  itemClassName: PropTypes__default['default'].string,
-  linkClassName: PropTypes__default['default'].string
-};
-var defaultProps$m = {
-  className: null,
-  itemClassName: null,
-  linkClassName: null
-};
-
-var AccountMenu = function AccountMenu(_ref) {
-  var className = _ref.className,
-      itemClassName = _ref.itemClassName,
-      linkClassName = _ref.linkClassName;
-  var route = contexts.useUrlGenerator();
-  var user = useUser();
-  var logout = useLogout();
-  var onClickLogout = React.useCallback(function (e) {
-    e.preventDefault();
-    logout();
-  }, [logout]);
-  var items = React.useMemo(function () {
-    return user !== null ? [{
-      id: 'account',
-      label: messages$1.account,
-      href: route('auth.account'),
-      dropdown: [{
-        label: messages$1.updateAccount,
-        href: route('auth.account')
-      }, {
-        label: messages$1.logout,
-        href: route('auth.logout'),
-        onClick: onClickLogout
-      }]
-    }] : [{
-      label: messages$1.login,
-      href: route('login')
-    }];
-  }, [user, route, onClickLogout]);
-  return items !== null ? /*#__PURE__*/React__default['default'].createElement(Menu__default['default'], {
-    className: className,
-    itemClassName: itemClassName,
-    linkClassName: linkClassName,
-    items: items,
-    dropdownAlign: "end"
-  }) : null;
-};
-
-AccountMenu.propTypes = propTypes$m;
-AccountMenu.defaultProps = defaultProps$m;
+ResourcesMenu.propTypes = propTypes$k;
+ResourcesMenu.defaultProps = defaultProps$k;
 
 /* eslint-disable react/jsx-props-no-spreading */
-var propTypes$l = {};
-var defaultProps$l = {};
+var propTypes$j = {};
+var defaultProps$j = {};
 
 var MainNavbar = function MainNavbar(props) {
   var _usePanneau = contexts.usePanneau(),
@@ -559,276 +459,109 @@ var MainNavbar = function MainNavbar(props) {
       background = _usePanneauColorSchem.background;
 
   var route = contexts.useUrlGenerator();
-  var user = useUser();
-  return /*#__PURE__*/React__default['default'].createElement(Navbar__default['default'], Object.assign({
+  var user = auth.useUser();
+  return /*#__PURE__*/React__default["default"].createElement(Navbar__default["default"], Object.assign({
     theme: background
-  }, props), name !== null ? /*#__PURE__*/React__default['default'].createElement(reactRouterDom.Link, {
+  }, props), name !== null ? /*#__PURE__*/React__default["default"].createElement(reactRouterDom.Link, {
     to: route('home'),
     className: "navbar-brand"
-  }, name) : null, user !== null ? /*#__PURE__*/React__default['default'].createElement(ResourcesMenu, {
+  }, name) : null, user !== null ? /*#__PURE__*/React__default["default"].createElement(ResourcesMenu, {
     className: "navbar-nav ml-4",
     itemClassName: "nav-item",
     linkClassName: "nav-link"
-  }) : null, /*#__PURE__*/React__default['default'].createElement(AccountMenu, {
+  }) : null, /*#__PURE__*/React__default["default"].createElement(AccountMenu, {
     className: "navbar-nav ms-auto",
     itemClassName: "nav-item",
     linkClassName: "nav-link"
   }));
 };
 
-MainNavbar.propTypes = propTypes$l;
-MainNavbar.defaultProps = defaultProps$l;
-
-var propTypes$k = {
-  children: PropTypes__default['default'].node.isRequired,
-  fullscreen: PropTypes__default['default'].bool
-};
-var defaultProps$k = {
-  fullscreen: false
-};
-
-var MainLayout = function MainLayout(_ref) {
-  var _classNames;
-
-  var children = _ref.children,
-      fullscreen = _ref.fullscreen;
-
-  var _usePanneauColorSchem = contexts.usePanneauColorScheme(),
-      background = _usePanneauColorSchem.background,
-      text = _usePanneauColorSchem.text;
-
-  return /*#__PURE__*/React__default['default'].createElement("div", {
-    className: classNames__default['default']({
-      'd-flex flex-column min-vh-100': fullscreen
-    })
-  }, /*#__PURE__*/React__default['default'].createElement(MainNavbar, {
-    className: classNames__default['default'](['border-bottom', 'sticky-top', 'px-3'])
-  }), /*#__PURE__*/React__default['default'].createElement("div", {
-    className: classNames__default['default']((_classNames = {
-      'd-flex flex-column flex-grow-1': fullscreen
-    }, _defineProperty__default['default'](_classNames, "bg-".concat(background), background !== null), _defineProperty__default['default'](_classNames, "text-".concat(text), text !== null), _classNames))
-  }, children));
-};
-
-MainLayout.propTypes = propTypes$k;
-MainLayout.defaultProps = defaultProps$k;
-
-var propTypes$j = {
-  title: core.PropTypes.label,
-  actions: PropTypes__default['default'].node,
-  small: PropTypes__default['default'].bool,
-  className: PropTypes__default['default'].string,
-  children: PropTypes__default['default'].node
-};
-var defaultProps$j = {
-  title: null,
-  actions: null,
-  small: false,
-  className: null,
-  children: null
-};
-
-var PageHeader = function PageHeader(_ref) {
-  var _ref2;
-
-  var title = _ref.title,
-      actions = _ref.actions,
-      small = _ref.small,
-      className = _ref.className,
-      children = _ref.children;
-
-  var _usePanneau = contexts.usePanneau(),
-      components = _usePanneau.components;
-
-  var _usePanneauColorSchem = contexts.usePanneauColorScheme(),
-      text = _usePanneauColorSchem.text,
-      background = _usePanneauColorSchem.background;
-
-  console.log(components);
-  var inner = /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "d-flex align-items-center flex-wrap"
-  }, title !== null ? /*#__PURE__*/React__default['default'].createElement("h1", {
-    className: "mb-0"
-  }, /*#__PURE__*/React__default['default'].createElement(Label__default['default'], null, title)) : null, actions !== null ? /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "ms-auto"
-  }, actions) : null);
-  return /*#__PURE__*/React__default['default'].createElement("div", {
-    className: classNames__default['default'](['py-4', (_ref2 = {}, _defineProperty__default['default'](_ref2, "bg-".concat(background), background !== null), _defineProperty__default['default'](_ref2, "text-".concat(text), text !== null), _defineProperty__default['default'](_ref2, "border-bottom", background || text !== null), _defineProperty__default['default'](_ref2, className, className !== null), _ref2)])
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "container-sm"
-  }, small ? /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "row justify-content-center"
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "col-12 col-md-8 col-lg-7"
-  }, inner)) : inner), children);
-};
-
-PageHeader.propTypes = propTypes$j;
-PageHeader.defaultProps = defaultProps$j;
-
-var propTypes$i = {
-  resource: core.PropTypes.resource.isRequired,
-  values: PropTypes__default['default'].object,
-  // eslint-disable-line react/forbid-prop-types,
-  message: core.PropTypes.message.isRequired
-};
-var defaultProps$i = {
-  values: null
-};
-
-var ResourceLabel = function ResourceLabel(_ref) {
-  var resource = _ref.resource,
-      values = _ref.values,
-      message = _ref.message;
-  var _resource$label = resource.label,
-      label = _resource$label === void 0 ? null : _resource$label,
-      _resource$intl = resource.intl,
-      intl = _resource$intl === void 0 ? null : _resource$intl,
-      _resource$localizatio = resource.localization,
-      localization = _resource$localizatio === void 0 ? null : _resource$localizatio;
-
-  var _ref2 = intl || localization || {},
-      resourceValues = _ref2.values;
-
-  return /*#__PURE__*/React__default['default'].createElement(reactIntl.FormattedMessage, Object.assign({
-    values: _objectSpread__default['default'](_objectSpread__default['default']({
-      label: label
-    }, resourceValues), values)
-  }, message));
-};
-
-ResourceLabel.propTypes = propTypes$i;
-ResourceLabel.defaultProps = defaultProps$i;
-
-var propTypes$h = {
-  component: PropTypes__default['default'].string,
-  resource: core.PropTypes.resource.isRequired,
-  messages: PropTypes__default['default'].object,
-  // eslint-disable-line react/forbid-prop-types
-  item: PropTypes__default['default'].object,
-  // eslint-disable-line react/forbid-prop-types
-  onSuccess: PropTypes__default['default'].func,
-  isDelete: PropTypes__default['default'].bool
-};
-var defaultProps$h = {
-  component: null,
-  item: null,
-  messages: null,
-  onSuccess: null,
-  isDelete: false
-};
-
-var ResourceForm = function ResourceForm(_ref) {
-  var component = _ref.component,
-      resource = _ref.resource,
-      messages = _ref.messages,
-      onSuccess = _ref.onSuccess,
-      item = _ref.item,
-      isDelete = _ref.isDelete,
-      props = _objectWithoutProperties__default['default'](_ref, ["component", "resource", "messages", "onSuccess", "item", "isDelete"]);
-
-  var FormComponents = contexts.useFormsComponents();
-
-  var _ref2 = resource || {},
-      baseFields = _ref2.fields,
-      _ref2$forms = _ref2.forms,
-      forms = _ref2$forms === void 0 ? {} : _ref2$forms;
-
-  var isCreate = item === null || !item.id; // Pick fields from resource root or form
-
-  var _ref3 = forms || {},
-      _ref3$default = _ref3["default"],
-      defaultForm = _ref3$default === void 0 ? null : _ref3$default,
-      _ref3$create = _ref3.create,
-      createForm = _ref3$create === void 0 ? null : _ref3$create,
-      _ref3$edit = _ref3.edit,
-      editForm = _ref3$edit === void 0 ? null : _ref3$edit;
-
-  var _ref4 = defaultForm || {},
-      defaultFields = _ref4.fields,
-      defaultComponent = _ref4.component;
-
-  var _ref5 = isCreate ? createForm || {} : editForm || {},
-      _ref5$fields = _ref5.fields,
-      formFields = _ref5$fields === void 0 ? null : _ref5$fields,
-      _ref5$component = _ref5.component,
-      formComponent = _ref5$component === void 0 ? null : _ref5$component;
+MainNavbar.propTypes = propTypes$j;
+MainNavbar.defaultProps = defaultProps$j;
 
-  var resourceFields = formFields || defaultFields || baseFields; // Form routes
+var propTypes$i = {
+  children: PropTypes__default["default"].node.isRequired,
+  fullscreen: PropTypes__default["default"].bool
+};
+var defaultProps$i = {
+  fullscreen: false
+};
 
-  var resourceRoute = hooks.useResourceUrlGenerator(resource);
+var MainLayout = function MainLayout(_ref) {
+  var _ref2;
 
-  var _useResourceStore = data.useResourceStore(resource),
-      store = _useResourceStore.store;
+  var children = _ref.children,
+      fullscreen = _ref.fullscreen;
 
-  var _useResourceUpdate = data.useResourceUpdate(resource, item != null ? item.id : null),
-      update = _useResourceUpdate.update;
+  var _usePanneauColorSchem = contexts.usePanneauColorScheme(),
+      background = _usePanneauColorSchem.background,
+      text = _usePanneauColorSchem.text;
 
-  var postForm = React.useCallback(function (action, data) {
-    return isCreate ? store(data) : update(data);
-  }, [isCreate, store, update]); // Form state
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: classNames__default["default"](['d-flex', 'flex-column', 'min-vh-100'])
+  }, /*#__PURE__*/React__default["default"].createElement(MainNavbar, {
+    className: classNames__default["default"](['border-bottom', 'sticky-top', 'px-3'])
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: classNames__default["default"](['flex-grow-1', (_ref2 = {
+      'd-flex flex-column': fullscreen
+    }, _defineProperty__default["default"](_ref2, "bg-".concat(background), background !== null), _defineProperty__default["default"](_ref2, "text-".concat(text), text !== null), _ref2)])
+  }, children));
+};
 
-  var getInitialValue = React.useCallback(function () {
-    return item !== null ? item : resourceFields.reduce(function (defaultValues, _ref6) {
-      var name = _ref6.name,
-          _ref6$default_value = _ref6.default_value,
-          defaultValue = _ref6$default_value === void 0 ? null : _ref6$default_value;
-      return defaultValue !== null ? _objectSpread__default['default'](_objectSpread__default['default']({}, defaultValues), {}, _defineProperty__default['default']({}, name, defaultValue)) : defaultValues;
-    }, null);
-  }, [item, resourceFields]);
+MainLayout.propTypes = propTypes$i;
+MainLayout.defaultProps = defaultProps$i;
 
-  var _useState = React.useState(getInitialValue()),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
-      value = _useState2[0],
-      setValue = _useState2[1];
+var propTypes$h = {
+  title: core.PropTypes.label,
+  actions: PropTypes__default["default"].node,
+  small: PropTypes__default["default"].bool,
+  className: PropTypes__default["default"].string,
+  children: PropTypes__default["default"].node
+};
+var defaultProps$h = {
+  title: null,
+  actions: null,
+  small: false,
+  className: null,
+  children: null
+};
 
-  var _useForm = hooks.useForm({
-    fields: resourceFields,
-    value: value,
-    postForm: postForm,
-    setValue: setValue,
-    onComplete: onSuccess
-  }),
-      fields = _useForm.fields,
-      onSubmit = _useForm.onSubmit,
-      status = _useForm.status,
-      generalError = _useForm.generalError,
-      errors = _useForm.errors; // Form action
+var PageHeader = function PageHeader(_ref) {
+  var _ref2;
 
+  var title = _ref.title,
+      actions = _ref.actions,
+      small = _ref.small,
+      className = _ref.className,
+      children = _ref.children;
 
-  var modifyAction = isCreate ? resourceRoute('store') : resourceRoute('update', {
-    id: item.id
-  });
-  var action = isDelete ? resourceRoute('destroy', {
-    id: item.id
-  }) : modifyAction; // Form component
+  // TODO: fix page header components
+  // const { components } = usePanneau();
+  var _usePanneauColorSchem = contexts.usePanneauColorScheme(),
+      text = _usePanneauColorSchem.text,
+      background = _usePanneauColorSchem.background; // console.log('page-header', components); // eslint-disable-line
 
-  var FormComponent = utils.getComponentFromName(component || formComponent || defaultComponent || 'normal', FormComponents, component); // Lisen to item value change
 
-  React.useEffect(function () {
-    setValue(getInitialValue());
-  }, [getInitialValue, setValue]);
-  return /*#__PURE__*/React__default['default'].createElement(contexts.FormProvider, {
-    value: value,
-    setValue: setValue
-  }, /*#__PURE__*/React__default['default'].createElement(FormComponent, Object.assign({}, props, {
-    status: status,
-    resource: resource,
-    item: item,
-    fields: fields,
-    generalError: generalError,
-    errors: errors,
-    action: action,
-    onSubmit: onSubmit,
-    isCreate: isCreate,
-    value: value,
-    messages: messages,
-    onChange: setValue
-  })));
+  var inner = /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "d-flex align-items-center flex-wrap"
+  }, title !== null ? /*#__PURE__*/React__default["default"].createElement("h1", {
+    className: "mb-0"
+  }, /*#__PURE__*/React__default["default"].createElement(Label__default["default"], null, title)) : null, actions !== null ? /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "ms-auto"
+  }, actions) : null);
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: classNames__default["default"](['py-4', (_ref2 = {}, _defineProperty__default["default"](_ref2, "bg-".concat(background), background !== null), _defineProperty__default["default"](_ref2, "text-".concat(text), text !== null), _defineProperty__default["default"](_ref2, "border-bottom", background || text !== null), _defineProperty__default["default"](_ref2, className, className !== null), _ref2)])
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "container-sm"
+  }, small ? /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "row justify-content-center"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "col-12 col-md-8 col-lg-7"
+  }, inner)) : inner), children);
 };
 
-ResourceForm.propTypes = propTypes$h;
-ResourceForm.defaultProps = defaultProps$h;
+PageHeader.propTypes = propTypes$h;
+PageHeader.defaultProps = defaultProps$h;
 
 var propTypes$g = {
   resource: core.PropTypes.resource.isRequired
@@ -838,27 +571,39 @@ var defaultProps$g = {};
 var ResourceCreatePage = function ResourceCreatePage(_ref) {
   var resource = _ref.resource;
   var history = reactRouter.useHistory();
+
+  var _useLocation = reactRouter.useLocation(),
+      search = _useLocation.search;
+
   var resourceRoute = hooks.useResourceUrlGenerator(resource);
   var onSuccess = React.useCallback(function () {
     history.push("".concat(resourceRoute('index'), "?created=true"));
   }, [history, resourceRoute]);
-  return /*#__PURE__*/React__default['default'].createElement(contexts.ResourceProvider, {
+
+  var _useMemo = React.useMemo(function () {
+    return queryString.parse(search);
+  }, [search]),
+      _useMemo$type = _useMemo.type,
+      type = _useMemo$type === void 0 ? null : _useMemo$type;
+
+  return /*#__PURE__*/React__default["default"].createElement(contexts.ResourceProvider, {
     resource: resource
-  }, /*#__PURE__*/React__default['default'].createElement(MainLayout, null, /*#__PURE__*/React__default['default'].createElement(PageHeader, {
-    title: /*#__PURE__*/React__default['default'].createElement(ResourceLabel, {
+  }, /*#__PURE__*/React__default["default"].createElement(MainLayout, null, /*#__PURE__*/React__default["default"].createElement(PageHeader, {
+    title: /*#__PURE__*/React__default["default"].createElement(intl.ResourceMessage, {
       resource: resource,
-      message: messages$1.create
+      defaultMessage: "Create {a_singular}",
+      description: "Page title"
     }),
     small: true
-  }), /*#__PURE__*/React__default['default'].createElement("div", {
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "container-sm py-4"
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "row justify-content-center"
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "col-12 col-md-8 col-lg-7"
-  }, /*#__PURE__*/React__default['default'].createElement(ResourceForm, {
+  }, /*#__PURE__*/React__default["default"].createElement(ResourceForm, {
     resource: resource,
-    messages: messages$1,
+    type: type,
     onSuccess: onSuccess
   }))))));
 };
@@ -868,7 +613,7 @@ ResourceCreatePage.defaultProps = defaultProps$g;
 
 var propTypes$f = {
   resource: core.PropTypes.resource.isRequired,
-  itemId: PropTypes__default['default'].string.isRequired
+  itemId: PropTypes__default["default"].string.isRequired
 };
 var defaultProps$f = {};
 
@@ -885,30 +630,30 @@ var ResourceDeletePage = function ResourceDeletePage(_ref) {
     return history.push("".concat(resourceRoute('index'), "?deleted=true"));
   }, [history, resourceRoute]); // Navigate back
 
-  var _ref2 = history || [],
-      entries = _ref2.entries,
-      length = _ref2.length;
+  var _ref2 = history || {},
+      _ref2$entries = _ref2.entries,
+      entries = _ref2$entries === void 0 ? [] : _ref2$entries;
 
-  var previousEntry = length > 1 ? entries[length - 2] : null;
+  var previousEntry = entries !== null && entries.length > 1 ? entries[entries.length - 2] : null;
   var previous = (previousEntry === null || previousEntry === void 0 ? void 0 : previousEntry.pathname) || null;
-  return /*#__PURE__*/React__default['default'].createElement(contexts.ResourceProvider, {
+  return /*#__PURE__*/React__default["default"].createElement(contexts.ResourceProvider, {
     resource: resource
-  }, /*#__PURE__*/React__default['default'].createElement(MainLayout, null, /*#__PURE__*/React__default['default'].createElement(PageHeader, {
-    title: /*#__PURE__*/React__default['default'].createElement(ResourceLabel, {
+  }, /*#__PURE__*/React__default["default"].createElement(MainLayout, null, /*#__PURE__*/React__default["default"].createElement(PageHeader, {
+    title: /*#__PURE__*/React__default["default"].createElement(intl.ResourceMessage, {
       resource: resource,
-      message: messages$1["delete"]
+      defaultMessage: "Delete {a_singular}",
+      description: "Page title"
     }),
     small: true
-  }), /*#__PURE__*/React__default['default'].createElement("div", {
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "container-sm py-4"
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "row justify-content-center"
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "col-12 col-md-8 col-lg-7"
-  }, item !== null ? /*#__PURE__*/React__default['default'].createElement(ResourceForm, {
-    component: "delete",
+  }, item !== null ? /*#__PURE__*/React__default["default"].createElement(ResourceForm, {
+    component: "",
     resource: resource,
-    messages: messages$1,
     item: item,
     onSuccess: onSuccess,
     previous: previous,
@@ -921,7 +666,7 @@ ResourceDeletePage.defaultProps = defaultProps$f;
 
 var propTypes$e = {
   resource: core.PropTypes.resource.isRequired,
-  itemId: PropTypes__default['default'].string.isRequired
+  itemId: PropTypes__default["default"].string.isRequired
 };
 var defaultProps$e = {};
 
@@ -929,13 +674,15 @@ var ResourceEditPage = function ResourceEditPage(_ref) {
   var resource = _ref.resource,
       itemId = _ref.itemId;
 
-  // console.log(itemId);
-  // const resourceRoute = useResourceUrlGenerator(resource);
   var _useResourceItem = data.useResourceItem(resource, itemId),
       item = _useResourceItem.item;
 
+  var _ref2 = item || {},
+      _ref2$type = _ref2.type,
+      type = _ref2$type === void 0 ? null : _ref2$type;
+
   var _useState = React.useState(item),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
+      _useState2 = _slicedToArray__default["default"](_useState, 2),
       editItem = _useState2[0],
       setEditItem = _useState2[1];
 
@@ -945,24 +692,25 @@ var ResourceEditPage = function ResourceEditPage(_ref) {
   React.useEffect(function () {
     setEditItem(item);
   }, [item, setEditItem]);
-  return /*#__PURE__*/React__default['default'].createElement(contexts.ResourceProvider, {
+  return /*#__PURE__*/React__default["default"].createElement(contexts.ResourceProvider, {
     resource: resource
-  }, /*#__PURE__*/React__default['default'].createElement(MainLayout, null, /*#__PURE__*/React__default['default'].createElement(PageHeader, {
-    title: /*#__PURE__*/React__default['default'].createElement(ResourceLabel, {
+  }, /*#__PURE__*/React__default["default"].createElement(MainLayout, null, /*#__PURE__*/React__default["default"].createElement(PageHeader, {
+    title: /*#__PURE__*/React__default["default"].createElement(intl.ResourceMessage, {
       resource: resource,
-      message: messages$1.edit
+      defaultMessage: "Edit {a_singular}",
+      description: "Page title"
     }),
     small: true
-  }), /*#__PURE__*/React__default['default'].createElement("div", {
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "container-sm py-4"
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "row justify-content-center"
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "col-12 col-md-8 col-lg-7"
-  }, editItem !== null ? /*#__PURE__*/React__default['default'].createElement(ResourceForm, {
+  }, editItem !== null ? /*#__PURE__*/React__default["default"].createElement(ResourceForm, {
     resource: resource,
-    messages: messages$1,
     item: editItem,
+    type: type,
     onSuccess: onSuccess
   }) : null)))));
 };
@@ -972,7 +720,7 @@ ResourceEditPage.defaultProps = defaultProps$e;
 
 var propTypes$d = {
   resource: core.PropTypes.resource.isRequired,
-  className: PropTypes__default['default'].string
+  className: PropTypes__default["default"].string
 };
 var defaultProps$d = {
   className: null
@@ -986,38 +734,46 @@ var ResourceCreateButtom = function ResourceCreateButtom(_ref) {
   var resourceRoute = hooks.useResourceUrlGenerator(resource);
 
   var _useState = React.useState(false),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
+      _useState2 = _slicedToArray__default["default"](_useState, 2),
       dropdownOpened = _useState2[0],
       setDropdownOpened = _useState2[1];
 
   var onClickDropdown = React.useCallback(function (e) {
     e.preventDefault();
-    setDropdownOpened(!dropdownOpened);
-  }, [dropdownOpened, setDropdownOpened]);
-  var button = /*#__PURE__*/React__default['default'].createElement(Button__default['default'], {
-    href: types === null ? resourceRoute('create') : '#',
+    setDropdownOpened(function (opened) {
+      return !opened;
+    });
+  }, [setDropdownOpened]);
+  var finalTypes = types !== null ? types.filter(function (_ref2) {
+    var _ref2$settings = _ref2.settings;
+    _ref2$settings = _ref2$settings === void 0 ? {} : _ref2$settings;
+    var _ref2$settings$canCre = _ref2$settings.canCreate,
+        canCreate = _ref2$settings$canCre === void 0 ? true : _ref2$settings$canCre;
+    return canCreate;
+  }) : null;
+  var hasMultipleTypes = finalTypes !== null && finalTypes.length > 1;
+  var onDropdownClickOutside = React.useCallback(function () {
+    setDropdownOpened(false);
+  }, [setDropdownOpened]);
+  var button = /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
+    href: !hasMultipleTypes ? "".concat(resourceRoute('create')).concat(finalTypes !== null && finalTypes.length === 1 ? "?type=".concat(finalTypes[0].id) : '') : '#',
     size: "lg",
     theme: "primary",
-    className: classNames__default['default']([_defineProperty__default['default']({
-      'dropdown-toggle': types !== null
+    className: classNames__default["default"]([_defineProperty__default["default"]({
+      'dropdown-toggle': hasMultipleTypes
     }, className, className !== null)]),
-    onClick: types !== null ? onClickDropdown : null
-  }, /*#__PURE__*/React__default['default'].createElement(ResourceLabel, {
+    onClick: hasMultipleTypes ? onClickDropdown : null
+  }, /*#__PURE__*/React__default["default"].createElement(intl.ResourceMessage, {
     resource: resource,
-    message: messages$1.create
+    defaultMessage: "Create {a_singular}",
+    description: "Button label"
   }));
-  return types !== null ? /*#__PURE__*/React__default['default'].createElement("div", {
-    className: classNames__default['default'](['dropdown', {
+  return hasMultipleTypes ? /*#__PURE__*/React__default["default"].createElement("div", {
+    className: classNames__default["default"](['dropdown', {
       show: dropdownOpened
     }])
-  }, button, /*#__PURE__*/React__default['default'].createElement(Dropdown__default['default'], {
-    items: types.filter(function (_ref3) {
-      var _ref3$settings = _ref3.settings;
-      _ref3$settings = _ref3$settings === void 0 ? {} : _ref3$settings;
-      var _ref3$settings$can_cr = _ref3$settings.can_create,
-          canCreate = _ref3$settings$can_cr === void 0 ? true : _ref3$settings$can_cr;
-      return canCreate;
-    }).map(function (it) {
+  }, button, /*#__PURE__*/React__default["default"].createElement(Dropdown__default["default"], {
+    items: finalTypes.map(function (it) {
       return {
         id: it.id,
         label: it.name,
@@ -1025,135 +781,160 @@ var ResourceCreateButtom = function ResourceCreateButtom(_ref) {
       };
     }),
     visible: dropdownOpened,
-    align: "right"
+    align: "end",
+    onClickOutside: onDropdownClickOutside
   })) : button;
 };
 
 ResourceCreateButtom.propTypes = propTypes$d;
 ResourceCreateButtom.defaultProps = defaultProps$d;
 
-var getValueWithout = function getValueWithout(value, withoutKey) {
-  return value !== null ? _objectSpread__default['default']({}, Object.keys(value).reduce(function (newValueMap, key) {
-    return key !== withoutKey ? _objectSpread__default['default'](_objectSpread__default['default']({}, newValueMap), {}, _defineProperty__default['default']({}, key, value[key])) : newValueMap;
-  }, {})) : null;
-};
-
+var _excluded$3 = ["component", "name", "groupLabel"];
 var propTypes$c = {
-  filters: PropTypes__default['default'].arrayOf(PropTypes__default['default'].oneOf([''])),
-  value: PropTypes__default['default'].object,
+  filters: PropTypes__default["default"].arrayOf(PropTypes__default["default"].shape({
+    id: PropTypes__default["default"].string.isRequired,
+    component: PropTypes__default["default"].string.isRequired
+  })),
+  value: PropTypes__default["default"].object,
   // eslint-disable-line react/forbid-prop-types
-  onChange: PropTypes__default['default'].func,
-  onSubmit: PropTypes__default['default'].func,
-  withContainer: PropTypes__default['default'].bool,
-  withReset: PropTypes__default['default'].bool,
-  className: PropTypes__default['default'].string
+  onChange: PropTypes__default["default"].func,
+  onReset: PropTypes__default["default"].func,
+  withContainer: PropTypes__default["default"].bool,
+  withReset: PropTypes__default["default"].bool,
+  defaultValue: PropTypes__default["default"].objectOf(PropTypes__default["default"].object),
+  // eslint-disable-line react/forbid-prop-types
+  className: PropTypes__default["default"].string
 };
 var defaultProps$c = {
   filters: [],
   value: null,
   onChange: null,
-  onSubmit: null,
+  onReset: null,
   withContainer: false,
-  withReset: false,
+  withReset: true,
+  defaultValue: {
+    page: null
+  },
   className: null
 };
 
 var ResourceFilters = function ResourceFilters(_ref) {
   var filters = _ref.filters,
-      initialValue = _ref.value,
+      value = _ref.value,
       onChange = _ref.onChange,
-      onSubmit = _ref.onSubmit,
+      onReset = _ref.onReset,
       withContainer = _ref.withContainer,
       withReset = _ref.withReset,
+      defaultValue = _ref.defaultValue,
       className = _ref.className;
   var FilterComponents = contexts.useFiltersComponents();
 
-  var _useState = React.useState(initialValue),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
-      value = _useState2[0],
-      setValue = _useState2[1];
-
-  var onFormChange = React.useCallback(function (newFieldValue, key) {
-    var newValue = newFieldValue !== null ? _objectSpread__default['default'](_objectSpread__default['default']({}, value), {}, _defineProperty__default['default']({}, key, newFieldValue)) : getValueWithout(value, key);
-    setValue(newValue);
+  var _usePanneauColorSchem = contexts.usePanneauColorScheme(),
+      background = _usePanneauColorSchem.background;
 
-    if (onChange !== null) {
-      onChange(newValue);
+  var currentFilters = filters || [];
+  var onFiltersReset = React.useCallback(function () {
+    if (onReset !== null) {
+      onReset(null);
     }
-  }, [value, setValue, onChange]);
-  var onReset = React.useCallback(function () {
-    setValue(initialValue);
-    onChange(initialValue);
-  }, [onChange, setValue, initialValue]);
-  var filterItems = (filters || []).filter(function (f) {
-    return f !== null;
-  });
-  return /*#__PURE__*/React__default['default'].createElement(Navbar__default['default'], {
-    className: classNames__default['default']([_defineProperty__default['default']({
+  }, [onReset]);
+  var hasActiveFilter = (currentFilters || []).reduce(function (isActive, item) {
+    if (value !== null && value[item.name]) {
+      return true;
+    }
+
+    return isActive;
+  }, false); // console.log('value', value);
+
+  return /*#__PURE__*/React__default["default"].createElement(Navbar__default["default"], {
+    className: classNames__default["default"]([_defineProperty__default["default"]({
       'navbar-expand-md': withContainer
-    }, className, className !== null)]),
+    }, className, className !== null), 'justify-content-start', 'align-items-start', 'flex-column', 'flex-md-row']),
+    theme: background,
     withoutCollapse: true
-  }, filterItems.map(function (_ref3, index) {
-    var id = _ref3.id,
-        component = _ref3.component;
+  }, currentFilters.map(function (_ref3, index) {
+    var component = _ref3.component,
+        name = _ref3.name,
+        groupLabel = _ref3.groupLabel,
+        filterProps = _objectWithoutProperties__default["default"](_ref3, _excluded$3);
+
     var FilterComponent = utils.getComponentFromName(component, FilterComponents, null);
-    return FilterComponent !== null ? /*#__PURE__*/React__default['default'].createElement(FilterComponent, {
-      key: "filter-".concat(id, "-").concat(index + 1),
-      onChange: onFormChange
-    }) : null;
-  }), filterItems.length > 0 && onSubmit !== null ? /*#__PURE__*/React__default['default'].createElement(Button__default['default'], {
-    theme: "primary",
-    onClick: onSubmit
-  }, /*#__PURE__*/React__default['default'].createElement(reactIntl.FormattedMessage, {
-    id: "lists.filters.submit",
-    defaultMessage: [{
-      "type": 0,
-      "value": "Submit"
-    }]
-  })) : null, filterItems.length > 0 && withReset ? /*#__PURE__*/React__default['default'].createElement(Button__default['default'], {
+    var filterValue = value !== null && value[name] ? value[name] : null;
+    var onFilterChange = React.useCallback(function (newFilterValue) {
+      if (name !== null && onChange !== null) {
+        onChange(_objectSpread__default["default"](_objectSpread__default["default"]({}, value), {}, _defineProperty__default["default"]({}, name, newFilterValue), defaultValue));
+      }
+    }, [onChange, name, value, defaultValue]);
+    var onFilterClear = React.useCallback(function () {
+      if (name !== null && onChange !== null) {
+        var _ref4 = value || {};
+            _ref4[name];
+            var newValue = _objectWithoutProperties__default["default"](_ref4, [name].map(_toPropertyKey__default["default"]));
+
+        onChange(_objectSpread__default["default"](_objectSpread__default["default"]({}, newValue), defaultValue));
+      }
+    }, [onChange, name, value, defaultValue]);
+    return FilterComponent !== null ? /*#__PURE__*/React__default["default"].createElement(FormGroup__default["default"], {
+      key: "filter-".concat(name, "-").concat(index + 1),
+      label: groupLabel,
+      className: "me-4"
+    }, /*#__PURE__*/React__default["default"].createElement(FilterComponent, Object.assign({}, filterProps, {
+      value: filterValue,
+      onChange: onFilterChange,
+      onClear: onFilterClear
+    }))) : null;
+  }), withReset && hasActiveFilter && currentFilters.length > 0 ? /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
     theme: "primary",
-    onClick: onReset
-  }, /*#__PURE__*/React__default['default'].createElement(reactIntl.FormattedMessage, {
-    id: "lists.filters.reset",
-    defaultMessage: [{
-      "type": 0,
-      "value": "Reset"
-    }]
+    onClick: onFiltersReset
+  }, /*#__PURE__*/React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, {
+    icon: freeSolidSvgIcons.faUndo
   })) : null);
 };
 
 ResourceFilters.propTypes = propTypes$c;
 ResourceFilters.defaultProps = defaultProps$c;
 
+var _excluded$2 = ["component", "showPagination", "filters"],
+    _excluded2$1 = ["page"];
 var propTypes$b = {
   resource: core.PropTypes.resource.isRequired,
-  query: PropTypes__default['default'].object,
+  query: PropTypes__default["default"].object,
   // eslint-disable-line react/forbid-prop-types
-  paginated: PropTypes__default['default'].bool,
-  component: PropTypes__default['default'].oneOfType([PropTypes__default['default'].elementType, PropTypes__default['default'].string]),
-  componentProps: PropTypes__default['default'].object,
+  paginated: PropTypes__default["default"].bool,
+  baseUrl: PropTypes__default["default"].string,
+  component: PropTypes__default["default"].oneOfType([PropTypes__default["default"].elementType, PropTypes__default["default"].string]),
+  componentProps: PropTypes__default["default"].object,
   // eslint-disable-line react/forbid-prop-types
-  withoutFilters: PropTypes__default['default'].bool,
-  onQueryChange: PropTypes__default['default'].func
+  onQueryChange: PropTypes__default["default"].func,
+  onQueryReset: PropTypes__default["default"].func
 };
 var defaultProps$b = {
   query: null,
   paginated: true,
   component: null,
+  baseUrl: null,
   componentProps: null,
-  withoutFilters: true,
-  onQueryChange: null
+  onQueryChange: null,
+  onQueryReset: null
 };
 
 var ResourceItemsList = function ResourceItemsList(_ref) {
   var resource = _ref.resource,
-      component = _ref.component,
-      componentProps = _ref.componentProps,
       query = _ref.query,
+      baseUrl = _ref.baseUrl,
       onQueryChange = _ref.onQueryChange,
-      paginated = _ref.paginated,
-      withoutFilters = _ref.withoutFilters,
-      props = _objectWithoutProperties__default['default'](_ref, ["resource", "component", "componentProps", "query", "onQueryChange", "paginated", "withoutFilters"]);
+      onQueryReset = _ref.onQueryReset,
+      paginated = _ref.paginated;
+  var _resource$index = resource.index;
+  _resource$index = _resource$index === void 0 ? {} : _resource$index;
+
+  var _resource$index$compo = _resource$index.component,
+      listComponent = _resource$index$compo === void 0 ? null : _resource$index$compo,
+      _resource$index$showP = _resource$index.showPagination,
+      showPagination = _resource$index$showP === void 0 ? true : _resource$index$showP,
+      _resource$index$filte = _resource$index.filters,
+      filters = _resource$index$filte === void 0 ? null : _resource$index$filte,
+      listProps = _objectWithoutProperties__default["default"](_resource$index, _excluded$2);
 
   var _usePanneauColorSchem = contexts.usePanneauColorScheme(),
       _usePanneauColorSchem2 = _usePanneauColorSchem.background,
@@ -1161,48 +942,76 @@ var ResourceItemsList = function ResourceItemsList(_ref) {
 
   var ListComponents = contexts.useListsComponents();
 
-  var _ref2 = query || {},
-      _ref2$page = _ref2.page,
-      page = _ref2$page === void 0 ? 1 : _ref2$page;
-
-  var items = data.useResourceItems(resource, query, paginated ? parseInt(page, 10) : null);
-  var onListQueryChange = React.useCallback(function (newQuery) {
-    if (onQueryChange !== null) {
-      onQueryChange(newQuery);
-    }
-  }, [onQueryChange]);
-  var ListComponent = utils.getComponentFromName(component || 'table', ListComponents, component || null);
-  return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, !withoutFilters ? /*#__PURE__*/React__default['default'].createElement(ResourceFilters, {
-    filters: [],
+  var _useMemo = React.useMemo(function () {
+    var _ref2 = query || {},
+        _ref2$page = _ref2.page,
+        currentPage = _ref2$page === void 0 ? 1 : _ref2$page,
+        rest = _objectWithoutProperties__default["default"](_ref2, _excluded2$1);
+
+    return [currentPage, rest];
+  }, [query]),
+      _useMemo2 = _slicedToArray__default["default"](_useMemo, 2),
+      page = _useMemo2[0],
+      queryWithoutPage = _useMemo2[1];
+
+  var itemsProps = data.useResourceItems(resource, queryWithoutPage, paginated ? parseInt(page, 10) : null);
+
+  var _ref3 = itemsProps || {},
+      _ref3$lastPage = _ref3.lastPage,
+      lastPage = _ref3$lastPage === void 0 ? 0 : _ref3$lastPage,
+      _ref3$total = _ref3.total,
+      total = _ref3$total === void 0 ? 0 : _ref3$total;
+
+  var ListComponent = utils.getComponentFromName(listComponent || 'table', ListComponents);
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, filters !== null ? /*#__PURE__*/React__default["default"].createElement(ResourceFilters, {
+    filters: filters,
     value: query,
-    onSubmit: onQueryChange,
-    className: "mb-4"
-  }) : null, ListComponent !== null ? /*#__PURE__*/React__default['default'].createElement(ListComponent, Object.assign({}, props, items, componentProps, {
-    page: paginated ? parseInt(page, 10) : null,
+    onChange: onQueryChange,
+    onReset: onQueryReset
+  }) : null, paginated && showPagination ? /*#__PURE__*/React__default["default"].createElement(Pagination__default["default"], {
+    page: page,
+    lastPage: lastPage,
+    total: total,
+    url: baseUrl,
+    query: query,
+    className: "mt-1 mb-1"
+  }) : null, ListComponent !== null ? /*#__PURE__*/React__default["default"].createElement(ListComponent, Object.assign({}, itemsProps, listProps, {
     resource: resource,
+    baseUrl: baseUrl,
     query: query,
-    onQueryChange: onListQueryChange,
+    onQueryChange: onQueryChange,
+    onQueryReset: onQueryReset,
     theme: theme
-  })) : null);
+  })) : null, paginated && showPagination ? /*#__PURE__*/React__default["default"].createElement(Pagination__default["default"], {
+    page: page,
+    lastPage: lastPage,
+    total: total,
+    url: baseUrl,
+    query: query,
+    className: "mt-4 mb-1"
+  }) : null);
 };
 
 ResourceItemsList.propTypes = propTypes$b;
 ResourceItemsList.defaultProps = defaultProps$b;
 
+var _excluded$1 = ["id", "component"];
 var propTypes$a = {
-  resource: core.PropTypes.resource.isRequired
+  resource: core.PropTypes.resource.isRequired,
+  defaultActions: PropTypes__default["default"].arrayOf(PropTypes__default["default"].object)
+};
+var defaultProps$a = {
+  defaultActions: ['create']
 };
-var defaultProps$a = {};
 
 var ResourceIndexPage = function ResourceIndexPage(_ref) {
-  var resource = _ref.resource;
+  var resource = _ref.resource,
+      defaultActions = _ref.defaultActions;
   var name = resource.name,
       _resource$settings = resource.settings,
       settings = _resource$settings === void 0 ? {} : _resource$settings,
-      _resource$components = resource.components;
-  _resource$components = _resource$components === void 0 ? {} : _resource$components;
-  var _resource$components$ = _resource$components.index,
-      index = _resource$components$ === void 0 ? {} : _resource$components$;
+      _resource$index = resource.index,
+      index = _resource$index === void 0 ? {} : _resource$index;
 
   var _ref2 = settings || {},
       _ref2$canCreate = _ref2.canCreate,
@@ -1211,10 +1020,22 @@ var ResourceIndexPage = function ResourceIndexPage(_ref) {
       paginated = _ref2$indexIsPaginate === void 0 ? false : _ref2$indexIsPaginate;
 
   var _ref3 = index || {},
-      _ref3$component = _ref3.component,
-      indexComponent = _ref3$component === void 0 ? null : _ref3$component,
-      _ref3$props = _ref3.props,
-      indexProps = _ref3$props === void 0 ? null : _ref3$props;
+      _ref3$actions = _ref3.actions,
+      actions = _ref3$actions === void 0 ? null : _ref3$actions;
+
+  var finalActions = React.useMemo(function () {
+    return (actions || defaultActions.filter(function (it) {
+      return it !== 'create' || canCreate;
+    })).map(function (it) {
+      return it === 'create' ? {
+        id: 'create',
+        component: ResourceCreateButtom,
+        size: 'lg',
+        theme: 'primary'
+      } : it;
+    });
+  }, [canCreate, actions]);
+  var componentsManager = contexts.useComponentsManager();
 
   var _useLocation = reactRouter.useLocation(),
       search = _useLocation.search;
@@ -1236,45 +1057,67 @@ var ResourceIndexPage = function ResourceIndexPage(_ref) {
   var resourceRoute = hooks.useResourceUrlGenerator(resource);
   var url = resourceRoute('index');
   var onQueryChange = React.useCallback(function (submitQuery) {
-    history.push("".concat(url, "?").concat(queryString.stringify(submitQuery, {
+    var newQuery = submitQuery !== null ? Object.keys(submitQuery).reduce(function (currentQuery, key) {
+      var value = submitQuery[key];
+      return value !== null ? _objectSpread__default["default"](_objectSpread__default["default"]({}, currentQuery), {}, _defineProperty__default["default"]({}, key, value)) : currentQuery;
+    }, null) : null;
+    history.push("".concat(url).concat(newQuery !== null ? "?".concat(queryString.stringify(newQuery, {
       arrayFormat: 'bracket'
-    })));
-  }, [history, url]);
+    })) : ''));
+  }, [history, url, query, paginated]);
+  var onQueryReset = React.useCallback(function () {
+    var queryString$1 = queryString.stringify(null, {
+      arrayFormat: 'bracket'
+    });
+    history.push("".concat(url, "?").concat(queryString$1));
+  }, [history, url, paginated]);
   var onClickCloseAlert = React.useCallback(function () {
     history.replace(url);
   }, [history, url]);
-  return /*#__PURE__*/React__default['default'].createElement(contexts.ResourceProvider, {
+  return /*#__PURE__*/React__default["default"].createElement(contexts.ResourceProvider, {
     resource: resource
-  }, /*#__PURE__*/React__default['default'].createElement(MainLayout, null, /*#__PURE__*/React__default['default'].createElement(PageHeader, {
+  }, /*#__PURE__*/React__default["default"].createElement(MainLayout, null, /*#__PURE__*/React__default["default"].createElement(PageHeader, {
     title: name,
-    actions: canCreate ? /*#__PURE__*/React__default['default'].createElement(ResourceCreateButtom, {
-      resource: resource,
-      size: "lg",
-      theme: "primary"
-    }) : null
-  }), /*#__PURE__*/React__default['default'].createElement("div", {
-    className: classNames__default['default'](['container-sm py-4'])
-  }, created ? /*#__PURE__*/React__default['default'].createElement(Alert__default['default'], {
+    actions: finalActions.length > 0 ? /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "d-flex align-items-center"
+    }, finalActions.map(function (_ref5) {
+      var id = _ref5.id,
+          _ref5$component = _ref5.component,
+          component = _ref5$component === void 0 ? Button__default["default"] : _ref5$component,
+          actionProps = _objectWithoutProperties__default["default"](_ref5, _excluded$1);
+
+      var ActionComponent = isString__default["default"](component) ? componentsManager.getComponent(component) : component;
+      return ActionComponent !== null ? /*#__PURE__*/React__default["default"].createElement(ActionComponent, Object.assign({
+        key: "action-".concat(id)
+      }, actionProps, ActionComponent !== Button__default["default"] ? {
+        resource: resource,
+        query: query,
+        onQueryChange: onQueryChange
+      } : {})) : null;
+    })) : null
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: classNames__default["default"](['container-sm py-4'])
+  }, created ? /*#__PURE__*/React__default["default"].createElement(Alert__default["default"], {
     className: "mb-4",
     onClose: onClickCloseAlert
-  }, /*#__PURE__*/React__default['default'].createElement(ResourceLabel, {
+  }, /*#__PURE__*/React__default["default"].createElement(intl.ResourceMessage, {
     resource: resource,
-    message: messages$1.created
-  })) : null, deleted ? /*#__PURE__*/React__default['default'].createElement(Alert__default['default'], {
+    defaultMessage: "{The_singular} has been created.",
+    description: "Alert message"
+  })) : null, deleted ? /*#__PURE__*/React__default["default"].createElement(Alert__default["default"], {
     className: "mb-4",
     onClose: onClickCloseAlert
-  }, /*#__PURE__*/React__default['default'].createElement(ResourceLabel, {
+  }, /*#__PURE__*/React__default["default"].createElement(intl.ResourceMessage, {
     resource: resource,
-    message: messages$1.deleted
-  })) : null, /*#__PURE__*/React__default['default'].createElement(ResourceItemsList, {
+    defaultMessage: "{The_singular} has been deleted.",
+    description: "Alert message"
+  })) : null, /*#__PURE__*/React__default["default"].createElement(ResourceItemsList, {
     resource: resource,
-    messages: messages$1,
     baseUrl: url,
     query: listQuery,
     paginated: paginated,
-    component: indexComponent,
-    componentProps: indexProps,
-    onQueryChange: onQueryChange
+    onQueryChange: onQueryChange,
+    onQueryReset: onQueryReset
   }))));
 };
 
@@ -1288,11 +1131,11 @@ var defaultProps$9 = {};
 
 var ResourceShowPage = function ResourceShowPage(_ref) {
   var resource = _ref.resource;
-  return /*#__PURE__*/React__default['default'].createElement(contexts.ResourceProvider, {
+  return /*#__PURE__*/React__default["default"].createElement(contexts.ResourceProvider, {
     resource: resource
-  }, /*#__PURE__*/React__default['default'].createElement(MainLayout, null, /*#__PURE__*/React__default['default'].createElement(PageHeader, {
+  }, /*#__PURE__*/React__default["default"].createElement(MainLayout, null, /*#__PURE__*/React__default["default"].createElement(PageHeader, {
     title: resource === null || resource === void 0 ? void 0 : resource.name
-  }), /*#__PURE__*/React__default['default'].createElement("div", {
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "container-sm"
   }, "Show page")));
 };
@@ -1307,23 +1150,29 @@ var defaultProps$8 = {};
 var HomePage = function HomePage() {
   var route = contexts.useUrlGenerator();
   var resources = contexts.usePanneauResources();
-  return /*#__PURE__*/React__default['default'].createElement(MainLayout, null, /*#__PURE__*/React__default['default'].createElement("div", {
+  var visibleResources = resources.filter(function (_ref) {
+    var _ref$settings = _ref.settings;
+    _ref$settings = _ref$settings === void 0 ? {} : _ref$settings;
+    var _ref$settings$hideInN = _ref$settings.hideInNavbar,
+        hideInNavbar = _ref$settings$hideInN === void 0 ? false : _ref$settings$hideInN;
+    return !hideInNavbar;
+  });
+  return /*#__PURE__*/React__default["default"].createElement(MainLayout, null, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "container-sm py-4"
-  }, resources.map(function (resource) {
-    var _ref = resource || {},
-        resourceId = _ref.id,
-        hasRoutes = _ref.has_routes;
+  }, visibleResources.map(function (resource) {
+    var _ref2 = resource || {},
+        resourceId = _ref2.id;
 
-    var routeName = hasRoutes ? "resources.".concat(resourceId, ".index") : 'resources.index';
-    return /*#__PURE__*/React__default['default'].createElement(reactRouterDom.Link, {
+    return /*#__PURE__*/React__default["default"].createElement(reactRouterDom.Link, {
       className: "d-block my-2",
       key: "resource-link-".concat(resourceId),
-      to: route("".concat(routeName), {
+      to: route('resources.index', {
         resource: resourceId
       })
-    }, /*#__PURE__*/React__default['default'].createElement(ResourceLabel, {
+    }, /*#__PURE__*/React__default["default"].createElement(intl.ResourceMessage, {
       resource: resource,
-      message: messages$1.index
+      defaultMessage: "View {the_plural}",
+      description: "Button label"
     }));
   })));
 };
@@ -1335,7 +1184,7 @@ var propTypes$7 = {};
 var defaultProps$7 = {};
 
 var AccountPage = function AccountPage() {
-  return /*#__PURE__*/React__default['default'].createElement(MainLayout, null, /*#__PURE__*/React__default['default'].createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement(MainLayout, null, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "container-sm py-4"
   }, "Account page"));
 };
@@ -1343,171 +1192,157 @@ var AccountPage = function AccountPage() {
 AccountPage.propTypes = propTypes$7;
 AccountPage.defaultProps = defaultProps$7;
 
+/* eslint-disable react/jsx-props-no-spreading */
 var propTypes$6 = {
-  children: PropTypes__default['default'].node.isRequired,
-  fullscreen: PropTypes__default['default'].bool
+  fields: core.PropTypes.fields,
+  className: PropTypes__default["default"].string,
+  onSuccess: PropTypes__default["default"].func
 };
 var defaultProps$6 = {
-  fullscreen: false
-};
-
-var GuestLayout = function GuestLayout(_ref) {
-  var _classNames;
-
-  var fullscreen = _ref.fullscreen,
-      children = _ref.children;
-
-  var _usePanneauColorSchem = contexts.usePanneauColorScheme(),
-      background = _usePanneauColorSchem.background,
-      text = _usePanneauColorSchem.text;
-
-  return /*#__PURE__*/React__default['default'].createElement("div", {
-    className: classNames__default['default']({
-      'd-flex flex-column min-vh-100': fullscreen
+  fields: [{
+    name: 'email',
+    type: 'email',
+    size: 'lg',
+    label: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
+      id: "LI0Gz4",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Email"
+      }]
     })
-  }, /*#__PURE__*/React__default['default'].createElement(MainNavbar, {
-    className: classNames__default['default'](['sticky-top', 'px-3'])
-  }), /*#__PURE__*/React__default['default'].createElement("div", {
-    className: classNames__default['default']((_classNames = {
-      'd-flex flex-column flex-grow-1': fullscreen
-    }, _defineProperty__default['default'](_classNames, "bg-".concat(background), background !== null), _defineProperty__default['default'](_classNames, "text-".concat(text), text !== null), _classNames))
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
-    className: classNames__default['default']({
-      'w-100 my-auto': fullscreen
+  }, {
+    name: 'password',
+    type: 'password',
+    size: 'lg',
+    label: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
+      id: "4yfet+",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Password"
+      }]
     })
-  }, children)));
-};
-
-GuestLayout.propTypes = propTypes$6;
-GuestLayout.defaultProps = defaultProps$6;
-
-var propTypes$5 = {
-  className: PropTypes__default['default'].string,
-  onSuccess: PropTypes__default['default'].func
-};
-var defaultProps$5 = {
+  }],
   className: null,
   onSuccess: null
 };
 
 var LoginForm = function LoginForm(_ref) {
-  var className = _ref.className,
+  var formFields = _ref.fields,
+      className = _ref.className,
       onSuccess = _ref.onSuccess;
+  var url = contexts.useUrlGenerator();
 
-  // const url = useUrlGenerator();
-  var _useAuth = useAuth(),
+  var _useAuth = auth.useAuth(),
       login = _useAuth.login;
 
-  var TextField = contexts.useFieldComponent('text');
-
-  var _useState = React.useState(''),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
-      email = _useState2[0],
-      setEmail = _useState2[1];
-
-  var _useState3 = React.useState(''),
-      _useState4 = _slicedToArray__default['default'](_useState3, 2),
-      password = _useState4[0],
-      setPassword = _useState4[1];
-
-  var _useState5 = React.useState(null),
-      _useState6 = _slicedToArray__default['default'](_useState5, 2),
-      error = _useState6[0],
-      setError = _useState6[1];
+  var postForm = React.useCallback(function (action, _ref2) {
+    var email = _ref2.email,
+        password = _ref2.password;
+    return login(email, password);
+  }, [login]);
 
-  var postForm = React.useCallback(function () {
-    return login(email, password).then(function () {
-      return onSuccess();
-    })["catch"](function (e) {
-      console.error(e);
+  var _useForm = hooks.useForm({
+    fields: formFields,
+    postForm: postForm,
+    onComplete: onSuccess
+  }),
+      value = _useForm.value,
+      setValue = _useForm.setValue,
+      fields = _useForm.fields,
+      onSubmit = _useForm.onSubmit,
+      status = _useForm.status,
+      generalError = _useForm.generalError,
+      errors = _useForm.errors;
 
-      if (e.message) {
-        setError(e.message);
-      }
-    });
-  }, [login, email, password, setError]);
-  var onChangeEmail = React.useCallback(function (value) {
-    setEmail(value);
-  }, [setEmail]);
-  var onChangePassword = React.useCallback(function (value) {
-    setPassword(value);
-  }, [setPassword]);
-  return /*#__PURE__*/React__default['default'].createElement("form", {
+  var NormalForm = contexts.useFormComponent('normal');
+  return /*#__PURE__*/React__default["default"].createElement(NormalForm, {
+    action: url('auth.login'),
     method: "post",
-    className: className
-  }, error !== null ? /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "alert alert-danger mt-2"
-  }, error) : null, /*#__PURE__*/React__default['default'].createElement(FormGroup__default['default'], {
-    label: /*#__PURE__*/React__default['default'].createElement(reactIntl.FormattedMessage, {
-      id: "form.email",
+    fields: fields,
+    onSubmit: onSubmit,
+    className: className,
+    status: status,
+    generalError: generalError,
+    errors: errors,
+    value: value,
+    onChange: setValue,
+    submitButtonLabel: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
+      id: "g6qbbX",
       defaultMessage: [{
         "type": 0,
-        "value": "Email"
+        "value": "Log in"
       }]
     })
-  }, /*#__PURE__*/React__default['default'].createElement(TextField, {
-    type: "email",
-    size: "lg",
-    value: email,
-    onChange: onChangeEmail
-  })), /*#__PURE__*/React__default['default'].createElement(FormGroup__default['default'], {
-    label: /*#__PURE__*/React__default['default'].createElement(reactIntl.FormattedMessage, {
-      id: "form.password",
-      defaultMessage: [{
-        "type": 0,
-        "value": "Password"
-      }]
+  });
+};
+
+LoginForm.propTypes = propTypes$6;
+LoginForm.defaultProps = defaultProps$6;
+
+var propTypes$5 = {
+  children: PropTypes__default["default"].node.isRequired,
+  fullscreen: PropTypes__default["default"].bool
+};
+var defaultProps$5 = {
+  fullscreen: false
+};
+
+var GuestLayout = function GuestLayout(_ref) {
+  var _classNames;
+
+  var fullscreen = _ref.fullscreen,
+      children = _ref.children;
+
+  var _usePanneauColorSchem = contexts.usePanneauColorScheme(),
+      background = _usePanneauColorSchem.background,
+      text = _usePanneauColorSchem.text;
+
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: classNames__default["default"]({
+      'd-flex flex-column min-vh-100': fullscreen
     })
-  }, /*#__PURE__*/React__default['default'].createElement(TextField, {
-    type: "password",
-    size: "lg",
-    value: password,
-    onChange: onChangePassword
-  })), /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "mt4 d-flex"
-  }, /*#__PURE__*/React__default['default'].createElement(Button__default['default'], {
-    onClick: postForm,
-    type: "button",
-    theme: "primary",
-    size: "lg",
-    className: "ms-auto",
-    disabled: email === '' || password === ''
-  }, /*#__PURE__*/React__default['default'].createElement(reactIntl.FormattedMessage, {
-    id: "login",
-    defaultMessage: [{
-      "type": 0,
-      "value": "Log in"
-    }]
-  }))));
+  }, /*#__PURE__*/React__default["default"].createElement(MainNavbar, {
+    className: classNames__default["default"](['sticky-top', 'px-3'])
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: classNames__default["default"]((_classNames = {
+      'd-flex flex-column flex-grow-1': fullscreen
+    }, _defineProperty__default["default"](_classNames, "bg-".concat(background), background !== null), _defineProperty__default["default"](_classNames, "text-".concat(text), text !== null), _classNames))
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: classNames__default["default"]({
+      'w-100 my-auto': fullscreen
+    })
+  }, children)));
 };
 
-LoginForm.propTypes = propTypes$5;
-LoginForm.defaultProps = defaultProps$5;
+GuestLayout.propTypes = propTypes$5;
+GuestLayout.defaultProps = defaultProps$5;
 
 /* eslint-disable react/jsx-props-no-spreading */
 var propTypes$4 = {};
 var defaultProps$4 = {};
 
 var LoginPage = function LoginPage() {
-  var _ref = messages$1 || {},
-      _ref$login_title = _ref.login_title,
-      loginMessage = _ref$login_title === void 0 ? null : _ref$login_title;
-
   var route = contexts.useUrlGenerator();
   var onSuccess = React.useCallback(function () {
     window.location.href = route('home');
   }, [route]);
-  return /*#__PURE__*/React__default['default'].createElement(GuestLayout, {
+  return /*#__PURE__*/React__default["default"].createElement(GuestLayout, {
     fullscreen: true
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "container-sm py-4"
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "row justify-content-center"
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "col-12 col-sm-8 col-md-6"
-  }, /*#__PURE__*/React__default['default'].createElement("h1", {
+  }, /*#__PURE__*/React__default["default"].createElement("h1", {
     className: "mb-4"
-  }, /*#__PURE__*/React__default['default'].createElement(reactIntl.FormattedMessage, loginMessage)), /*#__PURE__*/React__default['default'].createElement(LoginForm, {
+  }, /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
+    id: "AeOZq+",
+    defaultMessage: [{
+      "type": 0,
+      "value": "Login"
+    }]
+  })), /*#__PURE__*/React__default["default"].createElement(LoginForm, {
     onSuccess: onSuccess
   })))));
 };
@@ -1517,91 +1352,91 @@ LoginPage.defaultProps = defaultProps$4;
 
 var messages = reactIntl.defineMessages({
   metaTitle401: {
-    "id": "meta.title_401",
+    "id": "HOobY2",
     "defaultMessage": [{
       "type": 0,
       "value": "Error 401"
     }]
   },
   title401: {
-    "id": "errors.title_401",
+    "id": "6nwWPR",
     "defaultMessage": [{
       "type": 0,
       "value": "Error 401"
     }]
   },
   description401: {
-    "id": "errors.description_401",
+    "id": "82P2dS",
     "defaultMessage": [{
       "type": 0,
       "value": "You are not authorized to access this page."
     }]
   },
   metaTitle403: {
-    "id": "meta.title_403",
+    "id": "+6cCPF",
     "defaultMessage": [{
       "type": 0,
       "value": "Error 403"
     }]
   },
   title403: {
-    "id": "errors.title_403",
+    "id": "Pih2UO",
     "defaultMessage": [{
       "type": 0,
       "value": "Error 403"
     }]
   },
   description403: {
-    "id": "errors.description_403",
+    "id": "8HFiMs",
     "defaultMessage": [{
       "type": 0,
       "value": "Access to this page is forbidden"
     }]
   },
   metaTitle404: {
-    "id": "meta.title_404",
+    "id": "US/AMe",
     "defaultMessage": [{
       "type": 0,
       "value": "Error 404"
     }]
   },
   title404: {
-    "id": "errors.title_404",
+    "id": "6Ie+vL",
     "defaultMessage": [{
       "type": 0,
       "value": "Error 404"
     }]
   },
   description404: {
-    "id": "errors.description_404",
+    "id": "wKPI1y",
     "defaultMessage": [{
       "type": 0,
       "value": "This page doesn’t exist"
     }]
   },
   metaTitle500: {
-    "id": "meta.title_500",
+    "id": "ejwBSw",
     "defaultMessage": [{
       "type": 0,
       "value": "Error 500"
     }]
   },
   title500: {
-    "id": "errors.title_500",
+    "id": "owrRHV",
     "defaultMessage": [{
       "type": 0,
       "value": "Error 500"
     }]
   },
   description500: {
-    "id": "errors.description_500",
+    "id": "yALN2p",
     "defaultMessage": [{
       "type": 0,
       "value": "There was an error"
     }]
   },
   gotoHome: {
-    "id": "errors.goto_home",
+    "id": "hezcGl",
     "defaultMessage": [{
       "type": 0,
       "value": "Go to home page"
@@ -1617,15 +1452,15 @@ var defaultProps$3 = {
 
 var ErrorPage = function ErrorPage(_ref) {
   var statusCode = _ref.statusCode;
-  return /*#__PURE__*/React__default['default'].createElement(GuestLayout, {
+  return /*#__PURE__*/React__default["default"].createElement(GuestLayout, {
     fullscreen: true
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "container-sm py-4"
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "row justify-content-center"
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "col-12 col-sm-8 col-md-6"
-  }, /*#__PURE__*/React__default['default'].createElement("h1", null, /*#__PURE__*/React__default['default'].createElement(Label__default['default'], null, messages["title".concat(statusCode || 404)])), /*#__PURE__*/React__default['default'].createElement("p", null, /*#__PURE__*/React__default['default'].createElement(Label__default['default'], null, messages["description".concat(statusCode || 404)]))))));
+  }, /*#__PURE__*/React__default["default"].createElement("h1", null, /*#__PURE__*/React__default["default"].createElement(Label__default["default"], null, messages["title".concat(statusCode || 404)])), /*#__PURE__*/React__default["default"].createElement("p", null, /*#__PURE__*/React__default["default"].createElement(Label__default["default"], null, messages["description".concat(statusCode || 404)]))))));
 };
 
 ErrorPage.propTypes = propTypes$3;
@@ -1644,6 +1479,8 @@ var basePages = /*#__PURE__*/Object.freeze({
     Error: ErrorPage
 });
 
+var _excluded = ["path", "component", "exact"],
+    _excluded2 = ["id"];
 var propTypes$2 = {
   resource: core.PropTypes.resource.isRequired
 };
@@ -1652,11 +1489,12 @@ var defaultProps$2 = {};
 var ResourceRoutes = function ResourceRoutes(_ref) {
   var resource = _ref.resource;
   var resourceId = resource.id,
-      hasRoutes = resource.has_routes,
       _resource$pages = resource.pages,
-      pages = _resource$pages === void 0 ? {} : _resource$pages;
+      pages = _resource$pages === void 0 ? {} : _resource$pages,
+      _resource$extraRoutes = resource.extraRoutes,
+      extraRoutes = _resource$extraRoutes === void 0 ? [] : _resource$extraRoutes;
   var route = contexts.useUrlGenerator();
-  var routeName = hasRoutes ? "resources.".concat(resourceId) : 'resources'; // Load custom pages from resource
+  var componentsManager = contexts.useComponentsManager(); // Load custom pages from resource
 
   var _ref2 = pages || {},
       _ref2$index = _ref2.index,
@@ -1670,66 +1508,89 @@ var ResourceRoutes = function ResourceRoutes(_ref) {
       _ref2$delete = _ref2["delete"],
       deletePage = _ref2$delete === void 0 ? null : _ref2$delete;
 
-  var ResourceIndexComponent = utils.getComponentFromName((indexPage === null || indexPage === void 0 ? void 0 : indexPage.component) || 'resource-index', basePages, indexPage === null || indexPage === void 0 ? void 0 : indexPage.component);
-  var ResourceShowComponent = utils.getComponentFromName((showPage === null || showPage === void 0 ? void 0 : showPage.component) || 'resource-show', basePages, showPage === null || showPage === void 0 ? void 0 : showPage.component);
-  var ResourceCreateComponent = utils.getComponentFromName((createPage === null || createPage === void 0 ? void 0 : createPage.component) || 'resource-create', basePages, createPage === null || createPage === void 0 ? void 0 : createPage.component);
-  var ResourceEditComponent = utils.getComponentFromName((editPage === null || editPage === void 0 ? void 0 : editPage.component) || 'resource-edit', basePages, editPage === null || editPage === void 0 ? void 0 : editPage.component);
-  var ResourceDeleteComponent = utils.getComponentFromName((deletePage === null || deletePage === void 0 ? void 0 : deletePage.component) || 'resource-delete', basePages, deletePage === null || deletePage === void 0 ? void 0 : deletePage.component);
-  return /*#__PURE__*/React__default['default'].createElement(reactRouter.Switch, null, /*#__PURE__*/React__default['default'].createElement(reactRouter.Route, {
-    path: route("".concat(routeName, ".index"), {
+  var ResourceIndexComponent = indexPage !== null && typeof indexPage.component !== 'undefined' ? componentsManager.getComponent(indexPage.component) : ResourceIndexPage;
+  var ResourceShowComponent = showPage !== null && typeof showPage.component !== 'undefined' ? componentsManager.getComponent(showPage.component) : ResourceShowPage;
+  var ResourceCreateComponent = createPage !== null && typeof createPage.component !== 'undefined' ? componentsManager.getComponent(createPage.component) : ResourceCreatePage;
+  var ResourceEditComponent = editPage !== null && typeof editPage.component !== 'undefined' ? componentsManager.getComponent(editPage.component) : ResourceEditPage;
+  var ResourceDeleteComponent = deletePage !== null && typeof deletePage.component !== 'undefined' ? componentsManager.getComponent(deletePage.component) : ResourceDeletePage;
+  return /*#__PURE__*/React__default["default"].createElement(reactRouter.Switch, null, extraRoutes.map(function (_ref3) {
+    var path = _ref3.path,
+        component = _ref3.component,
+        _ref3$exact = _ref3.exact,
+        exact = _ref3$exact === void 0 ? true : _ref3$exact,
+        pageProps = _objectWithoutProperties__default["default"](_ref3, _excluded);
+
+    var RouteComponent = componentsManager.getComponent(component);
+    return RouteComponent !== null ? /*#__PURE__*/React__default["default"].createElement(reactRouter.Route, {
+      key: "route-".concat(path),
+      path: path,
+      exact: exact,
+      render: function render(_ref4) {
+        var _ref4$match$params = _ref4.match.params,
+            id = _ref4$match$params.id,
+            params = _objectWithoutProperties__default["default"](_ref4$match$params, _excluded2);
+
+        return /*#__PURE__*/React__default["default"].createElement(RouteComponent, Object.assign({
+          resource: resource,
+          itemId: id
+        }, pageProps, params));
+      }
+    }) : null;
+  }), /*#__PURE__*/React__default["default"].createElement(reactRouter.Route, {
+    path: route('resources.index', {
       resource: resourceId
     }),
     exact: true,
     render: function render() {
-      return /*#__PURE__*/React__default['default'].createElement(ResourceIndexComponent, {
+      return /*#__PURE__*/React__default["default"].createElement(ResourceIndexComponent, {
         resource: resource
       });
     }
-  }), /*#__PURE__*/React__default['default'].createElement(reactRouter.Route, {
-    path: route("".concat(routeName, ".create"), {
+  }), /*#__PURE__*/React__default["default"].createElement(reactRouter.Route, {
+    path: route('resources.create', {
       resource: resourceId
     }),
     exact: true,
     render: function render() {
-      return /*#__PURE__*/React__default['default'].createElement(ResourceCreateComponent, {
+      return /*#__PURE__*/React__default["default"].createElement(ResourceCreateComponent, {
         resource: resource
       });
     }
-  }), /*#__PURE__*/React__default['default'].createElement(reactRouter.Route, {
-    path: route("".concat(routeName, ".show"), {
+  }), /*#__PURE__*/React__default["default"].createElement(reactRouter.Route, {
+    path: route('resources.show', {
       resource: resourceId,
       id: ':id'
     }),
     exact: true,
-    render: function render(_ref3) {
-      var id = _ref3.match.params.id;
-      return /*#__PURE__*/React__default['default'].createElement(ResourceShowComponent, {
+    render: function render(_ref5) {
+      var id = _ref5.match.params.id;
+      return /*#__PURE__*/React__default["default"].createElement(ResourceShowComponent, {
         resource: resource,
         itemId: id
       });
     }
-  }), /*#__PURE__*/React__default['default'].createElement(reactRouter.Route, {
-    path: route("".concat(routeName, ".edit"), {
+  }), /*#__PURE__*/React__default["default"].createElement(reactRouter.Route, {
+    path: route('resources.edit', {
       resource: resourceId,
       id: ':id'
     }),
     exact: true,
-    render: function render(_ref4) {
-      var id = _ref4.match.params.id;
-      return /*#__PURE__*/React__default['default'].createElement(ResourceEditComponent, {
+    render: function render(_ref6) {
+      var id = _ref6.match.params.id;
+      return /*#__PURE__*/React__default["default"].createElement(ResourceEditComponent, {
         resource: resource,
         itemId: id
       });
     }
-  }), /*#__PURE__*/React__default['default'].createElement(reactRouter.Route, {
-    path: route("".concat(routeName, ".delete"), {
+  }), /*#__PURE__*/React__default["default"].createElement(reactRouter.Route, {
+    path: route('resources.delete', {
       resource: resourceId,
       id: ':id'
     }),
     exact: true,
-    render: function render(_ref5) {
-      var id = _ref5.match.params.id;
-      return /*#__PURE__*/React__default['default'].createElement(ResourceDeleteComponent, {
+    render: function render(_ref7) {
+      var id = _ref7.match.params.id;
+      return /*#__PURE__*/React__default["default"].createElement(ResourceDeleteComponent, {
         resource: resource,
         itemId: id
       });
@@ -1758,20 +1619,19 @@ var PanneauRoutes = function PanneauRoutes(_ref) {
 
   var _useLocation = reactRouter.useLocation(),
       pathname = _useLocation.pathname; // search
-  // console.log('PATHNAME', pathname); // eslint-disable-line
 
 
   var _useState = React.useState({
     statusCode: initialStatusCode,
     pathname: pathname
   }),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
+      _useState2 = _slicedToArray__default["default"](_useState, 2),
       _useState2$ = _useState2[0],
       statusCode = _useState2$.statusCode,
       initialPathname = _useState2$.pathname,
       setInitialRequest = _useState2[1];
 
-  var user = useUser();
+  var user = auth.useUser();
   var route = contexts.useUrlGenerator();
   var resources = contexts.usePanneauResources(); // const nextUrl = useMemo(() => {
   //     const query = parseQuery(search);
@@ -1801,52 +1661,50 @@ var PanneauRoutes = function PanneauRoutes(_ref) {
   var LoginComponent = utils.getComponentFromName((loginPage === null || loginPage === void 0 ? void 0 : loginPage.component) || 'login', basePages, loginPage === null || loginPage === void 0 ? void 0 : loginPage.component);
   var AccountComponent = utils.getComponentFromName((accountPage === null || accountPage === void 0 ? void 0 : accountPage.component) || 'account', basePages, accountPage === null || accountPage === void 0 ? void 0 : accountPage.component);
   var ErrorComponent = utils.getComponentFromName((errorPage === null || errorPage === void 0 ? void 0 : errorPage.component) || 'error', basePages, errorPage === null || errorPage === void 0 ? void 0 : errorPage.component);
-  return /*#__PURE__*/React__default['default'].createElement(reactRouter.Switch, null, statusCode !== null ? /*#__PURE__*/React__default['default'].createElement(reactRouter.Route, {
+  return /*#__PURE__*/React__default["default"].createElement(reactRouter.Switch, null, statusCode !== null ? /*#__PURE__*/React__default["default"].createElement(reactRouter.Route, {
     path: "*",
     render: function render() {
-      return /*#__PURE__*/React__default['default'].createElement(ErrorComponent, {
+      return /*#__PURE__*/React__default["default"].createElement(ErrorComponent, {
         statusCode: statusCode
       });
     }
-  }) : null, user === null ? /*#__PURE__*/React__default['default'].createElement(reactRouter.Route, {
+  }) : null, user === null ? /*#__PURE__*/React__default["default"].createElement(reactRouter.Route, {
     path: "*",
     exact: true,
     component: LoginComponent
-  }) : null, user !== null ? /*#__PURE__*/React__default['default'].createElement(reactRouter.Route, {
+  }) : null, user !== null ? /*#__PURE__*/React__default["default"].createElement(reactRouter.Route, {
     path: routes.home,
     exact: true,
     component: HomeComponent
-  }) : /*#__PURE__*/React__default['default'].createElement(reactRouter.Redirect, {
+  }) : /*#__PURE__*/React__default["default"].createElement(reactRouter.Redirect, {
     from: routes.home,
     exact: true,
     to: route('login')
   }), resources.map(function (resource) {
     var _ref3 = resource || {},
-        resourceId = _ref3.id,
-        hasRoutes = _ref3.has_routes;
+        resourceId = _ref3.id;
 
-    var routeName = hasRoutes ? "resources.".concat(resourceId) : 'resources.index';
-    return user !== null ? /*#__PURE__*/React__default['default'].createElement(reactRouter.Route, {
+    return user !== null ? /*#__PURE__*/React__default["default"].createElement(reactRouter.Route, {
       key: "resource-".concat(resourceId),
-      path: route("".concat(routeName), {
+      path: route('resources.index', {
         resource: resourceId
       }),
       render: function render() {
-        return /*#__PURE__*/React__default['default'].createElement(ResourceRoutes, {
+        return /*#__PURE__*/React__default["default"].createElement(ResourceRoutes, {
           resource: resource
         });
       }
-    }) : /*#__PURE__*/React__default['default'].createElement(reactRouter.Redirect, {
+    }) : /*#__PURE__*/React__default["default"].createElement(reactRouter.Redirect, {
       key: "resource-".concat(resourceId),
-      from: route("".concat(routeName, ".index"), {
+      from: route('resources.index', {
         resource: resourceId
       }),
       to: "".concat(route('login'), "?next=").concat(encodeURIComponent(pathname))
     });
-  }), /*#__PURE__*/React__default['default'].createElement(reactRouter.Route, {
+  }), /*#__PURE__*/React__default["default"].createElement(reactRouter.Route, {
     path: route('auth.account'),
     component: AccountComponent
-  }), /*#__PURE__*/React__default['default'].createElement(reactRouter.Route, {
+  }), /*#__PURE__*/React__default["default"].createElement(reactRouter.Route, {
     path: "*",
     component: ErrorComponent
   }));
@@ -1857,64 +1715,95 @@ PanneauRoutes.defaultProps = defaultProps$1;
 
 var propTypes = {
   definition: core.PropTypes.panneauDefinition.isRequired,
+  components: PropTypes__default["default"].oneOfType([PropTypes__default["default"].objectOf(PropTypes__default["default"].elementType), PropTypes__default["default"].objectOf(PropTypes__default["default"].objectOf(PropTypes__default["default"].elementType))]),
   user: core.PropTypes.user,
-  memoryRouter: PropTypes__default['default'].bool,
-  baseUrl: PropTypes__default['default'].string,
+  memoryRouter: PropTypes__default["default"].bool,
+  baseUrl: PropTypes__default["default"].string,
+  uppy: core.PropTypes.uppy,
   statusCode: core.PropTypes.statusCode
 };
 var defaultProps = {
+  components: null,
   user: null,
   memoryRouter: false,
   baseUrl: null,
+  uppy: null,
   statusCode: null
 };
 
 var Container = function Container(_ref) {
   var definition = _ref.definition,
+      components = _ref.components,
       user = _ref.user,
       memoryRouter = _ref.memoryRouter,
       baseUrl = _ref.baseUrl,
+      uppy = _ref.uppy,
       statusCode = _ref.statusCode;
   var _definition$intl = definition.intl;
   _definition$intl = _definition$intl === void 0 ? {} : _definition$intl;
   var _definition$intl$loca = _definition$intl.locale,
       locale = _definition$intl$loca === void 0 ? 'en' : _definition$intl$loca,
-      locales = _definition$intl.locales,
-      _definition$intl$mess = _definition$intl.messages,
-      translations = _definition$intl$mess === void 0 ? {} : _definition$intl$mess,
+      _definition$intl$loca2 = _definition$intl.locales,
+      locales = _definition$intl$loca2 === void 0 ? [] : _definition$intl$loca2,
       _definition$routes = definition.routes,
       routes = _definition$routes === void 0 ? {} : _definition$routes,
-      _definition$settings = definition.settings,
-      settings = _definition$settings === void 0 ? {} : _definition$settings;
-
-  var _ref2 = settings || {},
-      _ref2$memoryRouter = _ref2.memoryRouter,
-      usesMemoryRouter = _ref2$memoryRouter === void 0 ? false : _ref2$memoryRouter;
-
-  var Router = memoryRouter || usesMemoryRouter ? reactRouter.MemoryRouter : reactRouterDom.BrowserRouter; // For storybook: auto load page with: initialEntries={['/pages/1/edit']} initialIndex={0}
-
-  console.log('definition', definition); // eslint-disable-line
-
-  return /*#__PURE__*/React__default['default'].createElement(Router, null, /*#__PURE__*/React__default['default'].createElement(contexts.PanneauProvider, {
-    definition: definition
-  }, /*#__PURE__*/React__default['default'].createElement(reactIntl.IntlProvider, {
-    locale: locale,
-    messages: translations[locale] || translations
-  }, /*#__PURE__*/React__default['default'].createElement(contexts.LocalesProvider, {
+      _definition$settings = definition.settings;
+  _definition$settings = _definition$settings === void 0 ? {} : _definition$settings;
+  var _definition$settings$ = _definition$settings.memoryRouter,
+      usesMemoryRouter = _definition$settings$ === void 0 ? false : _definition$settings$;
+  var Router = memoryRouter || usesMemoryRouter ? reactRouter.MemoryRouter : reactRouterDom.BrowserRouter;
+  var extraMessages = React.useMemo(function () {
+    var _definition$intl2 = definition.intl;
+    _definition$intl2 = _definition$intl2 === void 0 ? {} : _definition$intl2;
+    var _definition$intl2$mes = _definition$intl2.messages,
+        messages = _definition$intl2$mes === void 0 ? null : _definition$intl2$mes,
+        _definition$resources = definition.resources,
+        resources = _definition$resources === void 0 ? [] : _definition$resources;
+    return _objectSpread__default["default"](_objectSpread__default["default"]({}, messages), resources.reduce(function (allMessages, _ref2) {
+      var id = _ref2.id,
+          _ref2$intl = _ref2.intl;
+      _ref2$intl = _ref2$intl === void 0 ? {} : _ref2$intl;
+      var _ref2$intl$messages = _ref2$intl.messages,
+          resourceMessages = _ref2$intl$messages === void 0 ? {} : _ref2$intl$messages;
+      return _objectSpread__default["default"](_objectSpread__default["default"]({}, allMessages), Object.keys(resourceMessages).reduce(function (allResourceMessages, key) {
+        return _objectSpread__default["default"](_objectSpread__default["default"]({}, allResourceMessages), {}, _defineProperty__default["default"]({}, "resources.".concat(id, ".").concat(key), resourceMessages[key]));
+      }, {}));
+    }, {}));
+  }, [definition]);
+  var onUnauthorized = React.useCallback(function () {
+    window.location.href = baseUrl;
+  }, [baseUrl]);
+  var onLogout = React.useCallback(function () {
+    window.location.reload();
+  }, [baseUrl]);
+  return /*#__PURE__*/React__default["default"].createElement(Router, null, /*#__PURE__*/React__default["default"].createElement(intl.IntlProvider, {
     locale: locale,
-    locales: locales
-  }, /*#__PURE__*/React__default['default'].createElement(contexts.RoutesProvider, {
+    locales: locales,
+    extraMessages: extraMessages
+  }, /*#__PURE__*/React__default["default"].createElement(contexts.PanneauProvider, {
+    definition: definition
+  }, /*#__PURE__*/React__default["default"].createElement(contexts.UppyProvider, uppy, /*#__PURE__*/React__default["default"].createElement(contexts.RoutesProvider, {
     routes: routes
-  }, /*#__PURE__*/React__default['default'].createElement(FieldsProvider__default['default'], null, /*#__PURE__*/React__default['default'].createElement(FormsProvider__default['default'], null, /*#__PURE__*/React__default['default'].createElement(ListsProvider__default['default'], null, /*#__PURE__*/React__default['default'].createElement(DisplaysProvider__default['default'], null, /*#__PURE__*/React__default['default'].createElement(FiltersProvider__default['default'], null, /*#__PURE__*/React__default['default'].createElement(data.ApiProvider, {
-    baseUrl: baseUrl
-  }, /*#__PURE__*/React__default['default'].createElement(AuthProvider, {
-    user: user
-  }, /*#__PURE__*/React__default['default'].createElement(PanneauRoutes, {
+  }, /*#__PURE__*/React__default["default"].createElement(FieldsProvider__default["default"], null, /*#__PURE__*/React__default["default"].createElement(FormsProvider__default["default"], null, /*#__PURE__*/React__default["default"].createElement(ListsProvider__default["default"], null, /*#__PURE__*/React__default["default"].createElement(DisplaysProvider__default["default"], null, /*#__PURE__*/React__default["default"].createElement(FiltersProvider__default["default"], null, /*#__PURE__*/React__default["default"].createElement(data.ApiProvider, {
+    baseUrl: baseUrl,
+    onUnauthorized: onUnauthorized
+  }, /*#__PURE__*/React__default["default"].createElement(auth.AuthProvider, {
+    user: user,
+    onLogout: onLogout
+  }, /*#__PURE__*/React__default["default"].createElement(contexts.ComponentsProvider, {
+    components: components
+  }, /*#__PURE__*/React__default["default"].createElement(PanneauRoutes, {
     statusCode: statusCode
-  })))))))))))));
+  }))))))))))))));
 };
 
 Container.propTypes = propTypes;
 Container.defaultProps = defaultProps;
 
-module.exports = Container;
+exports.GuestLayout = GuestLayout;
+exports.MainLayout = MainLayout;
+exports.PageHeader = PageHeader;
+exports.ResourceFilters = ResourceFilters;
+exports.ResourceForm = ResourceForm;
+exports.ResourceItemsList = ResourceItemsList;
+exports["default"] = Container;