@panneau/app 1.0.0-alpha.99 → 1.0.3-alpha.0

package/es/index.js

@@ -1,293 +1,56 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
-import { PropTypes as PropTypes$1 } from '@panneau/core';
-import { useFormsComponents, FormProvider, usePanneauResources, useUrlGenerator, usePanneau, usePanneauColorScheme, ResourceProvider, useFiltersComponents, useListsComponents, useFormComponent, useRoutes, PanneauProvider, UppyProvider, RoutesProvider, ComponentsProvider } from '@panneau/core/contexts';
-import { useApi, useResourceStore, useResourceUpdate, useResourceDestroy, useResourceItem, useResourceItems, ApiProvider } from '@panneau/data';
+import PropTypes$1 from 'prop-types';
+import React, { useMemo, useCallback, useState, useEffect } from 'react';
+import { useLocation, useNavigate, useParams, Route, Routes, MemoryRouter } from 'react-router';
+import { Link, BrowserRouter } from 'react-router-dom';
+import { useUser, useLogout, useAuth, AuthProvider } from '@panneau/auth';
+import { PropTypes } from '@panneau/core';
+import { useLocales, useFormsComponents, FormProvider, useUrlGenerator, usePanneauResources, usePanneau, usePanneauColorScheme, ResourceProvider, useFiltersComponents, useListsComponents, useComponentsManager, useFormComponent, useRoutes, PanneauProvider, UppyProvider, RoutesProvider, ComponentsProvider } from '@panneau/core/contexts';
+import { useResourceStore, useResourceUpdate, useResourceDestroy, useResourceItem, useResourceItems, ApiProvider } from '@panneau/data';
 import DisplaysProvider from '@panneau/displays';
 import FieldsProvider from '@panneau/fields';
 import FiltersProvider from '@panneau/filters';
 import FormsProvider from '@panneau/forms';
-import { ResourceMessage, IntlProvider } from '@panneau/intl';
+import { useResourceValues, IntlProvider } from '@panneau/intl';
 import ListsProvider from '@panneau/lists';
-import PropTypes from 'prop-types';
-import React, { useState, useCallback, useEffect, useContext, useMemo } from 'react';
-import { useLocation, useHistory, Switch, Route, Redirect, MemoryRouter } from 'react-router';
-import { Link, BrowserRouter } from 'react-router-dom';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import { getComponentFromName } from '@panneau/core/utils';
-import { useResourceUrlGenerator, useForm } from '@panneau/core/hooks';
-import { parse, stringify } from 'query-string';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import { parse, stringify } from 'query-string';
+import { FormattedMessage, defineMessages } from 'react-intl';
+import { useResourceUrlGenerator, useForm } from '@panneau/core/hooks';
+import classNames from 'classnames';
 import Button from '@panneau/element-button';
 import Form from '@panneau/element-form';
-import classNames from 'classnames';
-import { FormattedMessage, defineMessages } from 'react-intl';
 import Navbar from '@panneau/element-navbar';
 import Menu from '@panneau/element-menu';
 import Label from '@panneau/element-label';
+import isString from 'lodash/isString';
 import Alert from '@panneau/element-alert';
 import Dropdown from '@panneau/element-dropdown';
+import Pagination from '@panneau/element-pagination';
+import _toPropertyKey from '@babel/runtime/helpers/toPropertyKey';
+import { faUndo } from '@fortawesome/free-solid-svg-icons';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import FormGroup from '@panneau/element-form-group';
 
-var useAuthCheck = function useAuthCheck() {
-  var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      loading = _useState2[0],
-      setLoading = _useState2[1];
-
-  var api = useApi();
-  var check = 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 useAuthLogin = function useAuthLogin() {
-  var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      loading = _useState2[0],
-      setLoading = _useState2[1];
-
-  var api = useApi();
-  var login = 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 useAuthLogout = function useAuthLogout() {
-  var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      loading = _useState2[0],
-      setLoading = _useState2[1];
-
-  var api = useApi();
-  var logout = 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 useAuthRegister = function useAuthRegister() {
-  var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      loading = _useState2[0],
-      setLoading = _useState2[1];
-
-  var api = useApi();
-  var register = 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
-  };
-};
-
-var useAuthRequestPassword = function useAuthRequestPassword() {
-  var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      loading = _useState2[0],
-      setLoading = _useState2[1];
-
-  var api = useApi();
-  var request = 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
-  };
-};
-
-var useAuthResetPassword = function useAuthResetPassword() {
-  var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      loading = _useState2[0],
-      setLoading = _useState2[1];
-
-  var api = useApi();
-  var reset = useCallback(function (data) {
-    setLoading(true);
-    return api.auth.resetPassword(data).then(function (response) {
-      setLoading(false);
-      return response;
-    })["catch"](function (e) {
-      setLoading(false);
-      throw e;
-    });
-  }, [api, setLoading]);
-  return {
-    reset: reset,
-    loading: loading
-  };
-};
-
-var AuthContext = /*#__PURE__*/React.createContext(null);
-var useAuth = function useAuth() {
-  return useContext(AuthContext);
-};
-var useUser = function useUser() {
-  var _useAuth = useAuth(),
-      user = _useAuth.user;
-
-  return user;
-};
-var useLogout = function useLogout() {
-  var _useAuth3 = useAuth(),
-      logout = _useAuth3.logout;
-
-  return logout;
-};
-var propTypes$o = {
-  children: PropTypes.node.isRequired,
-  user: PropTypes$1.user,
-  checkOnMount: PropTypes.bool
-};
-var defaultProps$o = {
-  user: null,
-  checkOnMount: false
-};
-var AuthProvider = function AuthProvider(_ref) {
-  var initialUser = _ref.user,
-      checkOnMount = _ref.checkOnMount,
-      children = _ref.children;
-
-  // const route = useUrlGenerator();
-  var _useState = useState(initialUser),
-      _useState2 = _slicedToArray(_useState, 2),
-      user = _useState2[0],
-      setUser = _useState2[1];
-
-  var _useAuthLogin = useAuthLogin(),
-      authLogin = _useAuthLogin.login;
-
-  var _useAuthLogout = useAuthLogout(),
-      authLogout = _useAuthLogout.logout;
-
-  var _useAuthCheck = useAuthCheck(),
-      authCheck = _useAuthCheck.check;
-
-  var _useAuthRegister = useAuthRegister(),
-      authRegister = _useAuthRegister.register;
-
-  var _useAuthRequestPasswo = useAuthRequestPassword(),
-      authRequestPassword = _useAuthRequestPasswo.request;
-
-  var _useAuthResetPassword = useAuthResetPassword(),
-      authResetPassword = _useAuthResetPassword.reset;
-
-  var login = useCallback(function (email, password) {
-    return authLogin(email, password).then(function (newUser) {
-      setUser(newUser);
-      return newUser;
-    });
-  }, [authLogin, setUser]);
-  var logout = useCallback(function () {
-    return authLogout().then(function () {
-      setUser(null);
-    }).then(function () {
-      console.log('logout redirect'); // eslint-disable-line
-
-      window.location.href = '/';
-    });
-  }, [authLogout, setUser]);
-  var register = useCallback(function (data) {
-    return authRegister(data).then(function (newUser) {
-      setUser(newUser);
-      return newUser;
-    });
-  }, [authRegister, setUser]);
-  var requestPassword = useCallback(function (email) {
-    return authRequestPassword(email);
-  }, [authRequestPassword]);
-  var resetPassword = useCallback(function (data) {
-    return authResetPassword(data);
-  }, [authResetPassword]);
-  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.createElement(AuthContext.Provider, {
-    value: {
-      user: user,
-      setUser: setUser,
-      loggedIn: user !== null,
-      logout: logout,
-      login: login,
-      register: register,
-      requestPassword: requestPassword,
-      resetPassword: resetPassword
-    }
-  }, children);
-};
-AuthProvider.propTypes = propTypes$o;
-AuthProvider.defaultProps = defaultProps$o;
-
-var propTypes$n = {
-  resource: PropTypes$1.resource.isRequired,
-  action: PropTypes.string,
-  previous: PropTypes.string,
-  fields: PropTypes$1.fields.isRequired,
-  value: PropTypes.object,
+var _excluded$5 = ["resource", "action", "previous", "status", "value", "onSubmit", "errors", "generalError", "className"];
+var propTypes$m = {
+  resource: PropTypes.resource.isRequired,
+  action: PropTypes$1.string,
+  previous: PropTypes$1.string,
+  fields: PropTypes.fields.isRequired,
+  value: PropTypes$1.object,
   // eslint-disable-line react/forbid-prop-types
-  onChange: PropTypes.func.isRequired,
-  onSubmit: PropTypes.func,
-  status: PropTypes$1.formStatus,
-  generalError: PropTypes.string,
-  errors: PropTypes.objectOf(PropTypes.arrayOf(PropTypes.string)),
-  className: PropTypes.string
+  onChange: PropTypes$1.func.isRequired,
+  onSubmit: PropTypes$1.func,
+  status: PropTypes.formStatus,
+  generalError: PropTypes$1.string,
+  errors: PropTypes$1.objectOf(PropTypes$1.arrayOf(PropTypes$1.string)),
+  className: PropTypes$1.string
 };
-var defaultProps$n = {
+var defaultProps$m = {
   action: null,
   previous: null,
   status: null,
@@ -304,26 +67,59 @@ var DeleteForm = function DeleteForm(_ref) {
       previous = _ref.previous;
       _ref.status;
       var value = _ref.value,
-      onSubmit = _ref.onSubmit,
+      onSubmit = _ref.onSubmit;
+      _ref.errors;
+      var generalError = _ref.generalError,
       className = _ref.className,
-      props = _objectWithoutProperties(_ref, ["resource", "action", "previous", "status", "value", "onSubmit", "className"]);
+      props = _objectWithoutProperties(_ref, _excluded$5);
 
+  var _ref2 = value || {},
+      _ref2$id = _ref2.id,
+      id = _ref2$id === void 0 ? null : _ref2$id;
+
+  var resourceValues = useResourceValues(resource, {
+    id: id
+  });
   return /*#__PURE__*/React.createElement(Form, Object.assign({
-    className: classNames(['form', _defineProperty({}, className, className !== null)]),
+    className: classNames(['form', _defineProperty({
+      'invalid-feedback': generalError !== null
+    }, className, className !== null)]),
     action: action,
     onSubmit: onSubmit,
-    withoutActions: true
+    withoutActions: true,
+    withoutErrors: true
   }, props), /*#__PURE__*/React.createElement("div", {
     className: "card"
   }, /*#__PURE__*/React.createElement("div", {
     className: "card-body"
-  }, /*#__PURE__*/React.createElement(ResourceMessage, {
-    resource: resource,
-    values: value,
-    id: "resources.confirm_delete",
-    defaultMessage: "Are you sure you want to delete {the_singular} #{id}?",
-    description: "Confirmation message"
-  })), /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React.createElement(FormattedMessage, {
+    values: resourceValues,
+    id: "yzfiXJ",
+    defaultMessage: [{
+      "type": 0,
+      "value": "Are you sure you want to delete "
+    }, {
+      "type": 1,
+      "value": "the_singular"
+    }, {
+      "type": 0,
+      "value": " #"
+    }, {
+      "type": 1,
+      "value": "id"
+    }, {
+      "type": 0,
+      "value": "?"
+    }]
+  }), generalError ? /*#__PURE__*/React.createElement("p", {
+    className: "text-danger"
+  }, /*#__PURE__*/React.createElement(FormattedMessage, {
+    id: "y9zauY",
+    defaultMessage: [{
+      "type": 0,
+      "value": "An error occured and we could not delete this item successfully."
+    }]
+  })) : null), /*#__PURE__*/React.createElement("div", {
     className: "card-body d-flex"
   }, previous !== null ? /*#__PURE__*/React.createElement(Button, {
     href: previous,
@@ -349,19 +145,20 @@ var DeleteForm = function DeleteForm(_ref) {
   })))));
 };
 
-DeleteForm.propTypes = propTypes$n;
-DeleteForm.defaultProps = defaultProps$n;
+DeleteForm.propTypes = propTypes$m;
+DeleteForm.defaultProps = defaultProps$m;
 
-var propTypes$m = {
-  component: PropTypes.string,
-  resource: PropTypes$1.resource.isRequired,
-  item: PropTypes.object,
+var _excluded$4 = ["component", "resource", "onSuccess", "item", "type", "isDelete"];
+var propTypes$l = {
+  component: PropTypes$1.string,
+  resource: PropTypes.resource.isRequired,
+  item: PropTypes$1.object,
   // eslint-disable-line react/forbid-prop-types
-  type: PropTypes.string,
-  onSuccess: PropTypes.func,
-  isDelete: PropTypes.bool
+  type: PropTypes$1.string,
+  onSuccess: PropTypes$1.func,
+  isDelete: PropTypes$1.bool
 };
-var defaultProps$m = {
+var defaultProps$l = {
   component: null,
   item: null,
   type: null,
@@ -376,8 +173,9 @@ var ResourceForm = function ResourceForm(_ref) {
       item = _ref.item,
       type = _ref.type,
       isDelete = _ref.isDelete,
-      props = _objectWithoutProperties(_ref, ["component", "resource", "onSuccess", "item", "type", "isDelete"]);
+      props = _objectWithoutProperties(_ref, _excluded$4);
 
+  var locales = useLocales();
   var FormComponents = useFormsComponents();
   var _resource$fields = resource.fields,
       resourceFields = _resource$fields === void 0 ? [] : _resource$fields,
@@ -458,14 +256,20 @@ var ResourceForm = function ResourceForm(_ref) {
   var _useState = useState(getInitialValue()),
       _useState2 = _slicedToArray(_useState, 2),
       value = _useState2[0],
-      setValue = _useState2[1];
+      setValueState = _useState2[1];
+
+  var setValue = useCallback(function (newValue) {
+    // console.log('new value in resource form', newValue); // eslint-disable-line
+    setValueState(newValue);
+  }, [setValueState]);
 
   var _useForm = useForm({
     fields: finalFields,
     value: value,
     postForm: postForm,
     setValue: setValue,
-    onComplete: onSuccess
+    onComplete: onSuccess,
+    locales: locales
   }),
       fields = _useForm.fields,
       onSubmit = _useForm.onSubmit,
@@ -482,9 +286,10 @@ var ResourceForm = function ResourceForm(_ref) {
   }) : modifyAction;
   var defaultFormName = isDelete ? component || formComponent || null : component || formComponent || defaultComponent || 'normal'; // Form component
 
-  var FormComponent = getComponentFromName(defaultFormName, FormComponents, isDelete ? DeleteForm : component); // Lisen to item value change
+  var FormComponent = getComponentFromName(defaultFormName, FormComponents, isDelete ? DeleteForm : component); // Lisen to item value change - this is important
 
   useEffect(function () {
+    // console.log('get initial value from the top'); // eslint-disable-line
     setValue(getInitialValue());
   }, [getInitialValue, setValue]);
   return /*#__PURE__*/React.createElement(FormProvider, {
@@ -505,62 +310,13 @@ var ResourceForm = function ResourceForm(_ref) {
   })));
 };
 
-ResourceForm.propTypes = propTypes$m;
-ResourceForm.defaultProps = defaultProps$m;
-
-var propTypes$l = {
-  className: PropTypes.string,
-  itemClassName: PropTypes.string,
-  linkClassName: PropTypes.string
-};
-var defaultProps$l = {
-  className: null,
-  itemClassName: null,
-  linkClassName: null
-};
-
-var ResourcesMenu = function ResourcesMenu(_ref) {
-  var className = _ref.className,
-      itemClassName = _ref.itemClassName,
-      linkClassName = _ref.linkClassName;
-
-  var _useLocation = useLocation(),
-      pathname = _useLocation.pathname;
-
-  var resources = usePanneauResources();
-  var resourceRoute = useResourceUrlGenerator();
-  var items = useMemo(function () {
-    return resources.filter(function (_ref2) {
-      var _ref2$settings = _ref2.settings;
-      _ref2$settings = _ref2$settings === void 0 ? {} : _ref2$settings;
-      var _ref2$settings$hideIn = _ref2$settings.hideInNavbar,
-          hideInNavbar = _ref2$settings$hideIn === void 0 ? false : _ref2$settings$hideIn;
-      return !hideInNavbar;
-    }).map(function (it) {
-      var url = resourceRoute(it, 'index');
-      return {
-        id: it.id,
-        label: it.name,
-        href: url,
-        active: pathname.substr(0, url.length) === url
-      };
-    });
-  }, [resources, pathname, resourceRoute]);
-  return /*#__PURE__*/React.createElement(Menu, {
-    items: items,
-    className: className,
-    itemClassName: itemClassName,
-    linkClassName: linkClassName
-  });
-};
-
-ResourcesMenu.propTypes = propTypes$l;
-ResourcesMenu.defaultProps = defaultProps$l;
+ResourceForm.propTypes = propTypes$l;
+ResourceForm.defaultProps = defaultProps$l;
 
 var propTypes$k = {
-  className: PropTypes.string,
-  itemClassName: PropTypes.string,
-  linkClassName: PropTypes.string
+  className: PropTypes$1.string,
+  itemClassName: PropTypes$1.string,
+  linkClassName: PropTypes$1.string
 };
 var defaultProps$k = {
   className: null,
@@ -589,7 +345,7 @@ var AccountMenu = function AccountMenu(_ref) {
           "value": "Account"
         }]
       }),
-      href: route('auth.account'),
+      href: route('account'),
       dropdown: [//   {
       //       label: (
       //           <FormattedMessage
@@ -597,7 +353,7 @@ var AccountMenu = function AccountMenu(_ref) {
       //               description="Menu label"
       //           />
       //       ),
-      //       href: route('auth.account'),
+      //       href: route('panneau.account'),
       //   },
       {
         label: /*#__PURE__*/React.createElement(FormattedMessage, {
@@ -633,9 +389,58 @@ var AccountMenu = function AccountMenu(_ref) {
 AccountMenu.propTypes = propTypes$k;
 AccountMenu.defaultProps = defaultProps$k;
 
+var propTypes$j = {
+  className: PropTypes$1.string,
+  itemClassName: PropTypes$1.string,
+  linkClassName: PropTypes$1.string
+};
+var defaultProps$j = {
+  className: null,
+  itemClassName: null,
+  linkClassName: null
+};
+
+var ResourcesMenu = function ResourcesMenu(_ref) {
+  var className = _ref.className,
+      itemClassName = _ref.itemClassName,
+      linkClassName = _ref.linkClassName;
+
+  var _useLocation = useLocation(),
+      pathname = _useLocation.pathname;
+
+  var resources = usePanneauResources();
+  var resourceRoute = useResourceUrlGenerator();
+  var items = useMemo(function () {
+    return resources.filter(function (_ref2) {
+      var _ref2$settings = _ref2.settings;
+      _ref2$settings = _ref2$settings === void 0 ? {} : _ref2$settings;
+      var _ref2$settings$hideIn = _ref2$settings.hideInNavbar,
+          hideInNavbar = _ref2$settings$hideIn === void 0 ? false : _ref2$settings$hideIn;
+      return !hideInNavbar;
+    }).map(function (it) {
+      var url = resourceRoute(it, 'index');
+      return {
+        id: it.id,
+        label: it.name,
+        href: url,
+        active: pathname.substr(0, url.length) === url
+      };
+    });
+  }, [resources, pathname, resourceRoute]);
+  return /*#__PURE__*/React.createElement(Menu, {
+    items: items,
+    className: className,
+    itemClassName: itemClassName,
+    linkClassName: linkClassName
+  });
+};
+
+ResourcesMenu.propTypes = propTypes$j;
+ResourcesMenu.defaultProps = defaultProps$j;
+
 /* eslint-disable react/jsx-props-no-spreading */
-var propTypes$j = {};
-var defaultProps$j = {};
+var propTypes$i = {};
+var defaultProps$i = {};
 
 var MainNavbar = function MainNavbar(props) {
   var _usePanneau = usePanneau(),
@@ -662,14 +467,14 @@ var MainNavbar = function MainNavbar(props) {
   }));
 };
 
-MainNavbar.propTypes = propTypes$j;
-MainNavbar.defaultProps = defaultProps$j;
+MainNavbar.propTypes = propTypes$i;
+MainNavbar.defaultProps = defaultProps$i;
 
-var propTypes$i = {
-  children: PropTypes.node.isRequired,
-  fullscreen: PropTypes.bool
+var propTypes$h = {
+  children: PropTypes$1.node.isRequired,
+  fullscreen: PropTypes$1.bool
 };
-var defaultProps$i = {
+var defaultProps$h = {
   fullscreen: false
 };
 
@@ -694,17 +499,17 @@ var MainLayout = function MainLayout(_ref) {
   }, children));
 };
 
-MainLayout.propTypes = propTypes$i;
-MainLayout.defaultProps = defaultProps$i;
+MainLayout.propTypes = propTypes$h;
+MainLayout.defaultProps = defaultProps$h;
 
-var propTypes$h = {
-  title: PropTypes$1.label,
-  actions: PropTypes.node,
-  small: PropTypes.bool,
-  className: PropTypes.string,
-  children: PropTypes.node
+var propTypes$g = {
+  title: PropTypes.label,
+  actions: PropTypes$1.node,
+  small: PropTypes$1.bool,
+  className: PropTypes$1.string,
+  children: PropTypes$1.node
 };
-var defaultProps$h = {
+var defaultProps$g = {
   title: null,
   actions: null,
   small: false,
@@ -721,14 +526,12 @@ var PageHeader = function PageHeader(_ref) {
       className = _ref.className,
       children = _ref.children;
 
-  var _usePanneau = usePanneau(),
-      components = _usePanneau.components;
-
+  // TODO: fix page header components
+  // const { components } = usePanneau();
   var _usePanneauColorSchem = usePanneauColorScheme(),
       text = _usePanneauColorSchem.text,
-      background = _usePanneauColorSchem.background;
+      background = _usePanneauColorSchem.background; // console.log('page-header', components); // eslint-disable-line
 
-  console.log('page-header', components); // eslint-disable-line
 
   var inner = /*#__PURE__*/React.createElement("div", {
     className: "d-flex align-items-center flex-wrap"
@@ -748,25 +551,25 @@ var PageHeader = function PageHeader(_ref) {
   }, inner)) : inner), children);
 };
 
-PageHeader.propTypes = propTypes$h;
-PageHeader.defaultProps = defaultProps$h;
+PageHeader.propTypes = propTypes$g;
+PageHeader.defaultProps = defaultProps$g;
 
-var propTypes$g = {
-  resource: PropTypes$1.resource.isRequired
+var propTypes$f = {
+  resource: PropTypes.resource.isRequired
 };
-var defaultProps$g = {};
+var defaultProps$f = {};
 
 var ResourceCreatePage = function ResourceCreatePage(_ref) {
   var resource = _ref.resource;
-  var history = useHistory();
+  var navigate = useNavigate();
 
   var _useLocation = useLocation(),
       search = _useLocation.search;
 
   var resourceRoute = useResourceUrlGenerator(resource);
   var onSuccess = useCallback(function () {
-    history.push("".concat(resourceRoute('index'), "?created=true"));
-  }, [history, resourceRoute]);
+    navigate("".concat(resourceRoute('index'), "?created=true"));
+  }, [navigate, resourceRoute]);
 
   var _useMemo = useMemo(function () {
     return parse(search);
@@ -774,14 +577,20 @@ var ResourceCreatePage = function ResourceCreatePage(_ref) {
       _useMemo$type = _useMemo.type,
       type = _useMemo$type === void 0 ? null : _useMemo$type;
 
+  var resourceValues = useResourceValues(resource);
   return /*#__PURE__*/React.createElement(ResourceProvider, {
     resource: resource
   }, /*#__PURE__*/React.createElement(MainLayout, null, /*#__PURE__*/React.createElement(PageHeader, {
-    title: /*#__PURE__*/React.createElement(ResourceMessage, {
-      resource: resource,
-      id: "resources.create",
-      defaultMessage: "Create {a_singular}",
-      description: "Page title"
+    title: /*#__PURE__*/React.createElement(FormattedMessage, {
+      values: resourceValues,
+      id: "6viUpq",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Create "
+      }, {
+        "type": 1,
+        "value": "a_singular"
+      }]
     }),
     small: true
   }), /*#__PURE__*/React.createElement("div", {
@@ -797,27 +606,29 @@ var ResourceCreatePage = function ResourceCreatePage(_ref) {
   }))))));
 };
 
-ResourceCreatePage.propTypes = propTypes$g;
-ResourceCreatePage.defaultProps = defaultProps$g;
+ResourceCreatePage.propTypes = propTypes$f;
+ResourceCreatePage.defaultProps = defaultProps$f;
 
-var propTypes$f = {
-  resource: PropTypes$1.resource.isRequired,
-  itemId: PropTypes.string.isRequired
+var propTypes$e = {
+  resource: PropTypes.resource.isRequired
 };
-var defaultProps$f = {};
+var defaultProps$e = {};
 
 var ResourceDeletePage = function ResourceDeletePage(_ref) {
-  var resource = _ref.resource,
-      itemId = _ref.itemId;
-  var history = useHistory();
+  var resource = _ref.resource;
+
+  var _useParams = useParams(),
+      itemId = _useParams.id;
+
+  var navigate = useNavigate();
   var resourceRoute = useResourceUrlGenerator(resource);
 
   var _useResourceItem = useResourceItem(resource, itemId),
       item = _useResourceItem.item;
 
   var onSuccess = useCallback(function () {
-    return history.push("".concat(resourceRoute('index'), "?deleted=true"));
-  }, [history, resourceRoute]); // Navigate back
+    return navigate("".concat(resourceRoute('index'), "?deleted=true"));
+  }, [navigate, resourceRoute]); // Navigate back
 
   var _ref2 = history || {},
       _ref2$entries = _ref2.entries,
@@ -825,14 +636,20 @@ var ResourceDeletePage = function ResourceDeletePage(_ref) {
 
   var previousEntry = entries !== null && entries.length > 1 ? entries[entries.length - 2] : null;
   var previous = (previousEntry === null || previousEntry === void 0 ? void 0 : previousEntry.pathname) || null;
+  var resourceValues = useResourceValues(resource);
   return /*#__PURE__*/React.createElement(ResourceProvider, {
     resource: resource
   }, /*#__PURE__*/React.createElement(MainLayout, null, /*#__PURE__*/React.createElement(PageHeader, {
-    title: /*#__PURE__*/React.createElement(ResourceMessage, {
-      resource: resource,
-      id: "resources.delete",
-      defaultMessage: "Delete {a_singular}",
-      description: "Page title"
+    title: /*#__PURE__*/React.createElement(FormattedMessage, {
+      values: resourceValues,
+      id: "zN5N/Q",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Delete "
+      }, {
+        "type": 1,
+        "value": "a_singular"
+      }]
     }),
     small: true
   }), /*#__PURE__*/React.createElement("div", {
@@ -851,18 +668,19 @@ var ResourceDeletePage = function ResourceDeletePage(_ref) {
   }) : null)))));
 };
 
-ResourceDeletePage.propTypes = propTypes$f;
-ResourceDeletePage.defaultProps = defaultProps$f;
+ResourceDeletePage.propTypes = propTypes$e;
+ResourceDeletePage.defaultProps = defaultProps$e;
 
-var propTypes$e = {
-  resource: PropTypes$1.resource.isRequired,
-  itemId: PropTypes.string.isRequired
+var propTypes$d = {
+  resource: PropTypes.resource.isRequired
 };
-var defaultProps$e = {};
+var defaultProps$d = {};
 
 var ResourceEditPage = function ResourceEditPage(_ref) {
-  var resource = _ref.resource,
-      itemId = _ref.itemId;
+  var resource = _ref.resource;
+
+  var _useParams = useParams(),
+      itemId = _useParams.id;
 
   var _useResourceItem = useResourceItem(resource, itemId),
       item = _useResourceItem.item;
@@ -882,14 +700,20 @@ var ResourceEditPage = function ResourceEditPage(_ref) {
   useEffect(function () {
     setEditItem(item);
   }, [item, setEditItem]);
+  var resourceValues = useResourceValues(resource);
   return /*#__PURE__*/React.createElement(ResourceProvider, {
     resource: resource
   }, /*#__PURE__*/React.createElement(MainLayout, null, /*#__PURE__*/React.createElement(PageHeader, {
-    title: /*#__PURE__*/React.createElement(ResourceMessage, {
-      resource: resource,
-      id: "resources.edit",
-      defaultMessage: "Edit {a_singular}",
-      description: "Page title"
+    title: /*#__PURE__*/React.createElement(FormattedMessage, {
+      values: resourceValues,
+      id: "mCfzkJ",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Edit "
+      }, {
+        "type": 1,
+        "value": "a_singular"
+      }]
     }),
     small: true
   }), /*#__PURE__*/React.createElement("div", {
@@ -906,14 +730,14 @@ var ResourceEditPage = function ResourceEditPage(_ref) {
   }) : null)))));
 };
 
-ResourceEditPage.propTypes = propTypes$e;
-ResourceEditPage.defaultProps = defaultProps$e;
+ResourceEditPage.propTypes = propTypes$d;
+ResourceEditPage.defaultProps = defaultProps$d;
 
-var propTypes$d = {
-  resource: PropTypes$1.resource.isRequired,
-  className: PropTypes.string
+var propTypes$c = {
+  resource: PropTypes.resource.isRequired,
+  className: PropTypes$1.string
 };
-var defaultProps$d = {
+var defaultProps$c = {
   className: null
 };
 
@@ -921,8 +745,10 @@ var ResourceCreateButtom = function ResourceCreateButtom(_ref) {
   var resource = _ref.resource,
       className = _ref.className;
   var _resource$types = resource.types,
-      types = _resource$types === void 0 ? null : _resource$types;
+      types = _resource$types === void 0 ? null : _resource$types; // const intl = useIntl();
+
   var resourceRoute = useResourceUrlGenerator(resource);
+  var resourceValues = useResourceValues(resource);
 
   var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -931,34 +757,46 @@ var ResourceCreateButtom = function ResourceCreateButtom(_ref) {
 
   var onClickDropdown = useCallback(function (e) {
     e.preventDefault();
-    setDropdownOpened(!dropdownOpened);
-  }, [dropdownOpened, setDropdownOpened]);
+    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 = useCallback(function () {
+    setDropdownOpened(false);
+  }, [setDropdownOpened]);
   var button = /*#__PURE__*/React.createElement(Button, {
-    href: types === null ? resourceRoute('create') : '#',
+    href: !hasMultipleTypes ? "".concat(resourceRoute('create')).concat(finalTypes !== null && finalTypes.length === 1 ? "?type=".concat(finalTypes[0].id) : '') : '#',
     size: "lg",
     theme: "primary",
     className: classNames([_defineProperty({
-      'dropdown-toggle': types !== null
+      'dropdown-toggle': hasMultipleTypes
     }, className, className !== null)]),
-    onClick: types !== null ? onClickDropdown : null
-  }, /*#__PURE__*/React.createElement(ResourceMessage, {
-    resource: resource,
-    id: "resources.create_btn",
-    defaultMessage: "Create {a_singular}",
-    description: "Button label"
+    onClick: hasMultipleTypes ? onClickDropdown : null
+  }, /*#__PURE__*/React.createElement(FormattedMessage, {
+    values: resourceValues,
+    id: "l+ddDH",
+    defaultMessage: [{
+      "type": 0,
+      "value": "Create "
+    }, {
+      "type": 1,
+      "value": "a_singular"
+    }]
   }));
-  return types !== null ? /*#__PURE__*/React.createElement("div", {
+  return hasMultipleTypes ? /*#__PURE__*/React.createElement("div", {
     className: classNames(['dropdown', {
       show: dropdownOpened
     }])
   }, button, /*#__PURE__*/React.createElement(Dropdown, {
-    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) {
+    items: finalTypes.map(function (it) {
       return {
         id: it.id,
         label: it.name,
@@ -966,31 +804,40 @@ var ResourceCreateButtom = function ResourceCreateButtom(_ref) {
       };
     }),
     visible: dropdownOpened,
-    align: "right"
+    align: "end",
+    onClickOutside: onDropdownClickOutside
   })) : button;
 };
 
-ResourceCreateButtom.propTypes = propTypes$d;
-ResourceCreateButtom.defaultProps = defaultProps$d;
+ResourceCreateButtom.propTypes = propTypes$c;
+ResourceCreateButtom.defaultProps = defaultProps$c;
 
-var propTypes$c = {
-  filters: PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.string.isRequired,
-    component: PropTypes.string.isRequired
+var _excluded$3 = ["component", "name", "groupLabel"];
+var propTypes$b = {
+  filters: PropTypes$1.arrayOf(PropTypes$1.shape({
+    id: PropTypes$1.string.isRequired,
+    component: PropTypes$1.string.isRequired
   })),
-  value: PropTypes.object,
+  value: PropTypes$1.object,
   // eslint-disable-line react/forbid-prop-types
-  onChange: PropTypes.func,
-  withContainer: PropTypes.bool,
-  withReset: PropTypes.bool,
-  className: PropTypes.string
+  onChange: PropTypes$1.func,
+  onReset: PropTypes$1.func,
+  withContainer: PropTypes$1.bool,
+  withReset: PropTypes$1.bool,
+  defaultValue: PropTypes$1.objectOf(PropTypes$1.object),
+  // eslint-disable-line react/forbid-prop-types
+  className: PropTypes$1.string
 };
-var defaultProps$c = {
+var defaultProps$b = {
   filters: [],
   value: null,
   onChange: null,
+  onReset: null,
   withContainer: false,
-  withReset: false,
+  withReset: true,
+  defaultValue: {
+    page: null
+  },
   className: null
 };
 
@@ -998,65 +845,100 @@ var ResourceFilters = function ResourceFilters(_ref) {
   var filters = _ref.filters,
       value = _ref.value,
       onChange = _ref.onChange,
+      onReset = _ref.onReset,
       withContainer = _ref.withContainer,
       withReset = _ref.withReset,
+      defaultValue = _ref.defaultValue,
       className = _ref.className;
   var FilterComponents = useFiltersComponents();
-  var onReset = useCallback(function () {
-    if (onChange !== null) {
-      onChange(null);
+
+  var _usePanneauColorSchem = usePanneauColorScheme(),
+      background = _usePanneauColorSchem.background;
+
+  var currentFilters = filters || [];
+  var onFiltersReset = useCallback(function () {
+    if (onReset !== null) {
+      onReset(null);
+    }
+  }, [onReset]);
+  var hasActiveFilter = (currentFilters || []).reduce(function (isActive, item) {
+    if (value !== null && value[item.name]) {
+      return true;
     }
-  }, [onChange]);
+
+    return isActive;
+  }, false); // console.log('value', value);
+
   return /*#__PURE__*/React.createElement(Navbar, {
     className: classNames([_defineProperty({
       '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
-  }, filters.map(function (_ref3, index) {
-    var id = _ref3.id,
-        component = _ref3.component,
-        filterProps = _objectWithoutProperties(_ref3, ["id", "component"]);
+  }, currentFilters.map(function (_ref3, index) {
+    var component = _ref3.component,
+        name = _ref3.name,
+        groupLabel = _ref3.groupLabel,
+        filterProps = _objectWithoutProperties(_ref3, _excluded$3);
 
     var FilterComponent = getComponentFromName(component, FilterComponents, null);
-    return FilterComponent !== null ? /*#__PURE__*/React.createElement(FilterComponent, Object.assign({}, filterProps, {
-      key: "filter-".concat(id, "-").concat(index + 1),
-      id: id,
-      value: value,
-      onChange: onChange
-    })) : null;
-  }), withReset ? /*#__PURE__*/React.createElement(Button, {
+    var filterValue = value !== null && value[name] ? value[name] : null;
+    var onFilterChange = useCallback(function (newFilterValue) {
+      if (name !== null && onChange !== null) {
+        onChange(_objectSpread(_objectSpread({}, value), {}, _defineProperty({}, name, newFilterValue), defaultValue));
+      }
+    }, [onChange, name, value, defaultValue]);
+    var onFilterClear = useCallback(function () {
+      if (name !== null && onChange !== null) {
+        var _ref4 = value || {};
+            _ref4[name];
+            var newValue = _objectWithoutProperties(_ref4, [name].map(_toPropertyKey));
+
+        onChange(_objectSpread(_objectSpread({}, newValue), defaultValue));
+      }
+    }, [onChange, name, value, defaultValue]);
+    return FilterComponent !== null ? /*#__PURE__*/React.createElement(FormGroup, {
+      key: "filter-".concat(name, "-").concat(index + 1),
+      label: groupLabel,
+      className: "me-4"
+    }, /*#__PURE__*/React.createElement(FilterComponent, Object.assign({}, filterProps, {
+      value: filterValue,
+      onChange: onFilterChange,
+      onClear: onFilterClear
+    }))) : null;
+  }), withReset && hasActiveFilter && currentFilters.length > 0 ? /*#__PURE__*/React.createElement(Button, {
     theme: "primary",
-    onClick: onReset
-  }, /*#__PURE__*/React.createElement(FormattedMessage, {
-    id: "q6bmY1",
-    defaultMessage: [{
-      "type": 0,
-      "value": "Reset"
-    }]
+    onClick: onFiltersReset
+  }, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
+    icon: faUndo
   })) : null);
 };
 
-ResourceFilters.propTypes = propTypes$c;
-ResourceFilters.defaultProps = defaultProps$c;
+ResourceFilters.propTypes = propTypes$b;
+ResourceFilters.defaultProps = defaultProps$b;
 
-var propTypes$b = {
-  resource: PropTypes$1.resource.isRequired,
-  query: PropTypes.object,
+var _excluded$2 = ["component", "showPagination", "filters"],
+    _excluded2 = ["page"];
+var propTypes$a = {
+  resource: PropTypes.resource.isRequired,
+  query: PropTypes$1.object,
   // eslint-disable-line react/forbid-prop-types
-  paginated: PropTypes.bool,
-  baseUrl: PropTypes.string,
-  component: PropTypes.oneOfType([PropTypes.elementType, PropTypes.string]),
-  componentProps: PropTypes.object,
+  paginated: PropTypes$1.bool,
+  baseUrl: PropTypes$1.string,
+  component: PropTypes$1.oneOfType([PropTypes$1.elementType, PropTypes$1.string]),
+  componentProps: PropTypes$1.object,
   // eslint-disable-line react/forbid-prop-types
-  onQueryChange: PropTypes.func
+  onQueryChange: PropTypes$1.func,
+  onQueryReset: PropTypes$1.func
 };
-var defaultProps$b = {
+var defaultProps$a = {
   query: null,
   paginated: true,
   component: null,
   baseUrl: null,
   componentProps: null,
-  onQueryChange: null
+  onQueryChange: null,
+  onQueryReset: null
 };
 
 var ResourceItemsList = function ResourceItemsList(_ref) {
@@ -1064,15 +946,18 @@ var ResourceItemsList = function ResourceItemsList(_ref) {
       query = _ref.query,
       baseUrl = _ref.baseUrl,
       onQueryChange = _ref.onQueryChange,
+      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(_resource$index, ["component", "filters"]);
+      listProps = _objectWithoutProperties(_resource$index, _excluded$2);
 
   var _usePanneauColorSchem = usePanneauColorScheme(),
       _usePanneauColorSchem2 = _usePanneauColorSchem.background,
@@ -1080,45 +965,77 @@ var ResourceItemsList = function ResourceItemsList(_ref) {
 
   var ListComponents = useListsComponents();
 
-  var _ref2 = query || {},
-      _ref2$page = _ref2.page,
-      page = _ref2$page === void 0 ? 1 : _ref2$page;
+  var _useMemo = useMemo(function () {
+    var _ref2 = query || {},
+        _ref2$page = _ref2.page,
+        currentPage = _ref2$page === void 0 ? 1 : _ref2$page,
+        rest = _objectWithoutProperties(_ref2, _excluded2);
+
+    return [currentPage, rest];
+  }, [query]),
+      _useMemo2 = _slicedToArray(_useMemo, 2),
+      page = _useMemo2[0],
+      queryWithoutPage = _useMemo2[1];
+
+  var itemsProps = 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 itemsProps = useResourceItems(resource, query, paginated ? parseInt(page, 10) : null);
-  var onListQueryChange = useCallback(function (newQuery) {
-    if (onQueryChange !== null) {
-      onQueryChange(newQuery);
-    }
-  }, [onQueryChange]);
   var ListComponent = getComponentFromName(listComponent || 'table', ListComponents);
   return /*#__PURE__*/React.createElement(React.Fragment, null, filters !== null ? /*#__PURE__*/React.createElement(ResourceFilters, {
     filters: filters,
     value: query,
     onChange: onQueryChange,
-    className: "mb-4"
+    onReset: onQueryReset
+  }) : null, paginated && showPagination ? /*#__PURE__*/React.createElement(Pagination, {
+    page: page,
+    lastPage: lastPage,
+    total: total,
+    url: baseUrl,
+    query: query,
+    className: "mt-1 mb-1"
   }) : null, ListComponent !== null ? /*#__PURE__*/React.createElement(ListComponent, Object.assign({}, itemsProps, listProps, {
-    page: paginated ? parseInt(page, 10) : null,
-    baseUrl: baseUrl,
     resource: resource,
+    baseUrl: baseUrl,
     query: query,
-    onQueryChange: onListQueryChange,
+    onQueryChange: onQueryChange,
+    onQueryReset: onQueryReset,
     theme: theme
-  })) : null);
+  })) : null, paginated && showPagination ? /*#__PURE__*/React.createElement(Pagination, {
+    page: page,
+    lastPage: lastPage,
+    total: total,
+    url: baseUrl,
+    query: query,
+    className: "mt-4 mb-1"
+  }) : null);
 };
 
-ResourceItemsList.propTypes = propTypes$b;
-ResourceItemsList.defaultProps = defaultProps$b;
+ResourceItemsList.propTypes = propTypes$a;
+ResourceItemsList.defaultProps = defaultProps$a;
 
-var propTypes$a = {
-  resource: PropTypes$1.resource.isRequired
+var _excluded$1 = ["id", "component"];
+var propTypes$9 = {
+  resource: PropTypes.resource.isRequired,
+  defaultActions: PropTypes$1.arrayOf(PropTypes$1.object) // eslint-disable-line react/forbid-prop-types
+
+};
+var defaultProps$9 = {
+  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;
+      settings = _resource$settings === void 0 ? {} : _resource$settings,
+      _resource$index = resource.index,
+      index = _resource$index === void 0 ? {} : _resource$index;
 
   var _ref2 = settings || {},
       _ref2$canCreate = _ref2.canCreate,
@@ -1126,10 +1043,29 @@ var ResourceIndexPage = function ResourceIndexPage(_ref) {
       _ref2$indexIsPaginate = _ref2.indexIsPaginated,
       paginated = _ref2$indexIsPaginate === void 0 ? false : _ref2$indexIsPaginate;
 
+  var _ref3 = index || {},
+      _ref3$actions = _ref3.actions,
+      actions = _ref3$actions === void 0 ? null : _ref3$actions;
+
+  var finalActions = 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 resourceValues = useResourceValues(resource);
+  var componentsManager = useComponentsManager();
+
   var _useLocation = useLocation(),
       search = _useLocation.search;
 
-  var history = useHistory();
+  var navigate = useNavigate();
   var query = useMemo(function () {
     return parse(search);
   }, [search]);
@@ -1137,19 +1073,29 @@ var ResourceIndexPage = function ResourceIndexPage(_ref) {
     return query;
   }, [query]); // TODO: omit routes
 
-  var _ref3 = query || {},
-      _ref3$created = _ref3.created,
-      created = _ref3$created === void 0 ? false : _ref3$created,
-      _ref3$deleted = _ref3.deleted,
-      deleted = _ref3$deleted === void 0 ? false : _ref3$deleted;
+  var _ref4 = query || {},
+      _ref4$created = _ref4.created,
+      created = _ref4$created === void 0 ? false : _ref4$created,
+      _ref4$deleted = _ref4.deleted,
+      deleted = _ref4$deleted === void 0 ? false : _ref4$deleted;
 
   var resourceRoute = useResourceUrlGenerator(resource);
   var url = resourceRoute('index');
   var onQueryChange = useCallback(function (submitQuery) {
-    history.push("".concat(url, "?").concat(stringify(submitQuery, {
+    var newQuery = submitQuery !== null ? Object.keys(submitQuery).reduce(function (currentQuery, key) {
+      var value = submitQuery[key];
+      return value !== null ? _objectSpread(_objectSpread({}, currentQuery), {}, _defineProperty({}, key, value)) : currentQuery;
+    }, null) : null;
+    navigate("".concat(url).concat(newQuery !== null ? "?".concat(stringify(newQuery, {
       arrayFormat: 'bracket'
-    })));
-  }, [history, url]);
+    })) : ''));
+  }, [navigate, url, query, paginated]);
+  var onQueryReset = useCallback(function () {
+    var queryString = stringify(null, {
+      arrayFormat: 'bracket'
+    });
+    navigate("".concat(url, "?").concat(queryString));
+  }, [navigate, url, paginated]);
   var onClickCloseAlert = useCallback(function () {
     history.replace(url);
   }, [history, url]);
@@ -1157,45 +1103,68 @@ var ResourceIndexPage = function ResourceIndexPage(_ref) {
     resource: resource
   }, /*#__PURE__*/React.createElement(MainLayout, null, /*#__PURE__*/React.createElement(PageHeader, {
     title: name,
-    actions: canCreate ? /*#__PURE__*/React.createElement(ResourceCreateButtom, {
-      resource: resource,
-      size: "lg",
-      theme: "primary"
-    }) : null
+    actions: finalActions.length > 0 ? /*#__PURE__*/React.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 : _ref5$component,
+          actionProps = _objectWithoutProperties(_ref5, _excluded$1);
+
+      var ActionComponent = isString(component) ? componentsManager.getComponent(component) : component;
+      return ActionComponent !== null ? /*#__PURE__*/React.createElement(ActionComponent, Object.assign({
+        key: "action-".concat(id)
+      }, actionProps, ActionComponent !== Button ? {
+        resource: resource,
+        query: query,
+        onQueryChange: onQueryChange
+      } : {})) : null;
+    })) : null
   }), /*#__PURE__*/React.createElement("div", {
     className: classNames(['container-sm py-4'])
   }, created ? /*#__PURE__*/React.createElement(Alert, {
     className: "mb-4",
     onClose: onClickCloseAlert
-  }, /*#__PURE__*/React.createElement(ResourceMessage, {
-    resource: resource,
-    id: "resources.created",
-    defaultMessage: "{the_singular} has been created.",
-    description: "Alert message"
+  }, /*#__PURE__*/React.createElement(FormattedMessage, {
+    values: resourceValues,
+    id: "bfP/d8",
+    defaultMessage: [{
+      "type": 1,
+      "value": "The_singular"
+    }, {
+      "type": 0,
+      "value": " has been created."
+    }]
   })) : null, deleted ? /*#__PURE__*/React.createElement(Alert, {
     className: "mb-4",
     onClose: onClickCloseAlert
-  }, /*#__PURE__*/React.createElement(ResourceMessage, {
-    resource: resource,
-    id: "resources.deleted",
-    defaultMessage: "{the_singular} has been deleted.",
-    description: "Alert message"
+  }, /*#__PURE__*/React.createElement(FormattedMessage, {
+    values: resourceValues,
+    id: "dkRdks",
+    defaultMessage: [{
+      "type": 1,
+      "value": "The_singular"
+    }, {
+      "type": 0,
+      "value": " has been deleted."
+    }]
   })) : null, /*#__PURE__*/React.createElement(ResourceItemsList, {
     resource: resource,
     baseUrl: url,
     query: listQuery,
     paginated: paginated,
-    onQueryChange: onQueryChange
+    onQueryChange: onQueryChange,
+    onQueryReset: onQueryReset
   }))));
 };
 
-ResourceIndexPage.propTypes = propTypes$a;
-ResourceIndexPage.defaultProps = defaultProps$a;
+ResourceIndexPage.propTypes = propTypes$9;
+ResourceIndexPage.defaultProps = defaultProps$9;
 
-var propTypes$9 = {
-  resource: PropTypes$1.resource.isRequired
+var propTypes$8 = {
+  resource: PropTypes.resource.isRequired
 };
-var defaultProps$9 = {};
+var defaultProps$8 = {};
 
 var ResourceShowPage = function ResourceShowPage(_ref) {
   var resource = _ref.resource;
@@ -1208,12 +1177,12 @@ var ResourceShowPage = function ResourceShowPage(_ref) {
   }, "Show page")));
 };
 
-ResourceShowPage.propTypes = propTypes$9;
-ResourceShowPage.defaultProps = defaultProps$9;
+ResourceShowPage.propTypes = propTypes$8;
+ResourceShowPage.defaultProps = defaultProps$8;
 
 /* eslint-disable react/jsx-props-no-spreading */
-var propTypes$8 = {};
-var defaultProps$8 = {};
+var propTypes$7 = {};
+var defaultProps$7 = {};
 
 var HomePage = function HomePage() {
   var route = useUrlGenerator();
@@ -1231,26 +1200,32 @@ var HomePage = function HomePage() {
     var _ref2 = resource || {},
         resourceId = _ref2.id;
 
+    var resourceValues = useResourceValues(resource);
     return /*#__PURE__*/React.createElement(Link, {
       className: "d-block my-2",
       key: "resource-link-".concat(resourceId),
       to: route('resources.index', {
         resource: resourceId
       })
-    }, /*#__PURE__*/React.createElement(ResourceMessage, {
-      resource: resource,
-      id: "resources.view",
-      defaultMessage: "View {the_plural}",
-      description: "Button label"
+    }, /*#__PURE__*/React.createElement(FormattedMessage, {
+      values: resourceValues,
+      id: "FntHPK",
+      defaultMessage: [{
+        "type": 0,
+        "value": "View "
+      }, {
+        "type": 1,
+        "value": "the_plural"
+      }]
     }));
   })));
 };
 
-HomePage.propTypes = propTypes$8;
-HomePage.defaultProps = defaultProps$8;
+HomePage.propTypes = propTypes$7;
+HomePage.defaultProps = defaultProps$7;
 
-var propTypes$7 = {};
-var defaultProps$7 = {};
+var propTypes$6 = {};
+var defaultProps$6 = {};
 
 var AccountPage = function AccountPage() {
   return /*#__PURE__*/React.createElement(MainLayout, null, /*#__PURE__*/React.createElement("div", {
@@ -1258,52 +1233,14 @@ var AccountPage = function AccountPage() {
   }, "Account page"));
 };
 
-AccountPage.propTypes = propTypes$7;
-AccountPage.defaultProps = defaultProps$7;
-
-var propTypes$6 = {
-  children: PropTypes.node.isRequired,
-  fullscreen: PropTypes.bool
-};
-var defaultProps$6 = {
-  fullscreen: false
-};
-
-var GuestLayout = function GuestLayout(_ref) {
-  var _classNames;
-
-  var fullscreen = _ref.fullscreen,
-      children = _ref.children;
-
-  var _usePanneauColorSchem = usePanneauColorScheme(),
-      background = _usePanneauColorSchem.background,
-      text = _usePanneauColorSchem.text;
-
-  return /*#__PURE__*/React.createElement("div", {
-    className: classNames({
-      'd-flex flex-column min-vh-100': fullscreen
-    })
-  }, /*#__PURE__*/React.createElement(MainNavbar, {
-    className: classNames(['sticky-top', 'px-3'])
-  }), /*#__PURE__*/React.createElement("div", {
-    className: classNames((_classNames = {
-      'd-flex flex-column flex-grow-1': fullscreen
-    }, _defineProperty(_classNames, "bg-".concat(background), background !== null), _defineProperty(_classNames, "text-".concat(text), text !== null), _classNames))
-  }, /*#__PURE__*/React.createElement("div", {
-    className: classNames({
-      'w-100 my-auto': fullscreen
-    })
-  }, children)));
-};
-
-GuestLayout.propTypes = propTypes$6;
-GuestLayout.defaultProps = defaultProps$6;
+AccountPage.propTypes = propTypes$6;
+AccountPage.defaultProps = defaultProps$6;
 
 /* eslint-disable react/jsx-props-no-spreading */
 var propTypes$5 = {
-  fields: PropTypes$1.fields,
-  className: PropTypes.string,
-  onSuccess: PropTypes.func
+  fields: PropTypes.fields,
+  className: PropTypes$1.string,
+  onSuccess: PropTypes$1.func
 };
 var defaultProps$5 = {
   fields: [{
@@ -1386,9 +1323,47 @@ var LoginForm = function LoginForm(_ref) {
 LoginForm.propTypes = propTypes$5;
 LoginForm.defaultProps = defaultProps$5;
 
+var propTypes$4 = {
+  children: PropTypes$1.node.isRequired,
+  fullscreen: PropTypes$1.bool
+};
+var defaultProps$4 = {
+  fullscreen: false
+};
+
+var GuestLayout = function GuestLayout(_ref) {
+  var _classNames;
+
+  var fullscreen = _ref.fullscreen,
+      children = _ref.children;
+
+  var _usePanneauColorSchem = usePanneauColorScheme(),
+      background = _usePanneauColorSchem.background,
+      text = _usePanneauColorSchem.text;
+
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames({
+      'd-flex flex-column min-vh-100': fullscreen
+    })
+  }, /*#__PURE__*/React.createElement(MainNavbar, {
+    className: classNames(['sticky-top', 'px-3'])
+  }), /*#__PURE__*/React.createElement("div", {
+    className: classNames((_classNames = {
+      'd-flex flex-column flex-grow-1': fullscreen
+    }, _defineProperty(_classNames, "bg-".concat(background), background !== null), _defineProperty(_classNames, "text-".concat(text), text !== null), _classNames))
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classNames({
+      'w-100 my-auto': fullscreen
+    })
+  }, children)));
+};
+
+GuestLayout.propTypes = propTypes$4;
+GuestLayout.defaultProps = defaultProps$4;
+
 /* eslint-disable react/jsx-props-no-spreading */
-var propTypes$4 = {};
-var defaultProps$4 = {};
+var propTypes$3 = {};
+var defaultProps$3 = {};
 
 var LoginPage = function LoginPage() {
   var route = useUrlGenerator();
@@ -1416,8 +1391,8 @@ var LoginPage = function LoginPage() {
   })))));
 };
 
-LoginPage.propTypes = propTypes$4;
-LoginPage.defaultProps = defaultProps$4;
+LoginPage.propTypes = propTypes$3;
+LoginPage.defaultProps = defaultProps$3;
 
 var messages = defineMessages({
   metaTitle401: {
@@ -1512,10 +1487,10 @@ var messages = defineMessages({
     }]
   }
 });
-var propTypes$3 = {
-  statusCode: PropTypes$1.statusCode
+var propTypes$2 = {
+  statusCode: PropTypes.statusCode
 };
-var defaultProps$3 = {
+var defaultProps$2 = {
   statusCode: null
 };
 
@@ -1532,8 +1507,8 @@ var ErrorPage = function ErrorPage(_ref) {
   }, /*#__PURE__*/React.createElement("h1", null, /*#__PURE__*/React.createElement(Label, null, messages["title".concat(statusCode || 404)])), /*#__PURE__*/React.createElement("p", null, /*#__PURE__*/React.createElement(Label, null, messages["description".concat(statusCode || 404)]))))));
 };
 
-ErrorPage.propTypes = propTypes$3;
-ErrorPage.defaultProps = defaultProps$3;
+ErrorPage.propTypes = propTypes$2;
+ErrorPage.defaultProps = defaultProps$2;
 
 var basePages = /*#__PURE__*/Object.freeze({
     __proto__: null,
@@ -1548,17 +1523,16 @@ var basePages = /*#__PURE__*/Object.freeze({
     Error: ErrorPage
 });
 
-var propTypes$2 = {
-  resource: PropTypes$1.resource.isRequired
-};
-var defaultProps$2 = {};
+var _excluded = ["path", "component", "exact"];
 
-var ResourceRoutes = function ResourceRoutes(_ref) {
-  var resource = _ref.resource;
+var createResourceRoutes = function createResourceRoutes(resource, _ref) {
+  var route = _ref.route,
+      componentsManager = _ref.componentsManager;
   var resourceId = resource.id,
       _resource$pages = resource.pages,
-      pages = _resource$pages === void 0 ? {} : _resource$pages;
-  var route = useUrlGenerator(); // Load custom pages from resource
+      pages = _resource$pages === void 0 ? {} : _resource$pages,
+      _resource$extraRoutes = resource.extraRoutes,
+      extraRoutes = _resource$extraRoutes === void 0 ? [] : _resource$extraRoutes; // Load custom pages from resource
 
   var _ref2 = pages || {},
       _ref2$index = _ref2.index,
@@ -1572,78 +1546,75 @@ var ResourceRoutes = function ResourceRoutes(_ref) {
       _ref2$delete = _ref2["delete"],
       deletePage = _ref2$delete === void 0 ? null : _ref2$delete;
 
-  var ResourceIndexComponent = getComponentFromName((indexPage === null || indexPage === void 0 ? void 0 : indexPage.component) || 'resource-index', basePages, indexPage === null || indexPage === void 0 ? void 0 : indexPage.component);
-  var ResourceShowComponent = getComponentFromName((showPage === null || showPage === void 0 ? void 0 : showPage.component) || 'resource-show', basePages, showPage === null || showPage === void 0 ? void 0 : showPage.component);
-  var ResourceCreateComponent = getComponentFromName((createPage === null || createPage === void 0 ? void 0 : createPage.component) || 'resource-create', basePages, createPage === null || createPage === void 0 ? void 0 : createPage.component);
-  var ResourceEditComponent = getComponentFromName((editPage === null || editPage === void 0 ? void 0 : editPage.component) || 'resource-edit', basePages, editPage === null || editPage === void 0 ? void 0 : editPage.component);
-  var ResourceDeleteComponent = 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.createElement(Switch, null, /*#__PURE__*/React.createElement(Route, {
+  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.createElement(React.Fragment, 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(_ref3, _excluded);
+
+    var RouteComponent = componentsManager.getComponent(component);
+    return RouteComponent !== null ? /*#__PURE__*/React.createElement(Route, {
+      key: "route-".concat(path),
+      path: path,
+      exact: exact,
+      element: /*#__PURE__*/React.createElement(RouteComponent, Object.assign({
+        resource: resource
+      }, pageProps))
+    }) : null;
+  }), /*#__PURE__*/React.createElement(Route, {
     path: route('resources.index', {
       resource: resourceId
     }),
     exact: true,
-    render: function render() {
-      return /*#__PURE__*/React.createElement(ResourceIndexComponent, {
-        resource: resource
-      });
-    }
+    element: /*#__PURE__*/React.createElement(ResourceIndexComponent, {
+      resource: resource
+    })
   }), /*#__PURE__*/React.createElement(Route, {
     path: route('resources.create', {
       resource: resourceId
     }),
     exact: true,
-    render: function render() {
-      return /*#__PURE__*/React.createElement(ResourceCreateComponent, {
-        resource: resource
-      });
-    }
+    element: /*#__PURE__*/React.createElement(ResourceCreateComponent, {
+      resource: resource
+    })
   }), /*#__PURE__*/React.createElement(Route, {
     path: route('resources.show', {
       resource: resourceId,
       id: ':id'
     }),
     exact: true,
-    render: function render(_ref3) {
-      var id = _ref3.match.params.id;
-      return /*#__PURE__*/React.createElement(ResourceShowComponent, {
-        resource: resource,
-        itemId: id
-      });
-    }
+    element: /*#__PURE__*/React.createElement(ResourceShowComponent, {
+      resource: resource
+    })
   }), /*#__PURE__*/React.createElement(Route, {
     path: route('resources.edit', {
       resource: resourceId,
       id: ':id'
     }),
     exact: true,
-    render: function render(_ref4) {
-      var id = _ref4.match.params.id;
-      return /*#__PURE__*/React.createElement(ResourceEditComponent, {
-        resource: resource,
-        itemId: id
-      });
-    }
+    element: /*#__PURE__*/React.createElement(ResourceEditComponent, {
+      resource: resource
+    })
   }), /*#__PURE__*/React.createElement(Route, {
     path: route('resources.delete', {
       resource: resourceId,
       id: ':id'
     }),
     exact: true,
-    render: function render(_ref5) {
-      var id = _ref5.match.params.id;
-      return /*#__PURE__*/React.createElement(ResourceDeleteComponent, {
-        resource: resource,
-        itemId: id
-      });
-    }
+    element: /*#__PURE__*/React.createElement(ResourceDeleteComponent, {
+      resource: resource
+    })
   }));
 };
 
-ResourceRoutes.propTypes = propTypes$2;
-ResourceRoutes.defaultProps = defaultProps$2;
-
 var propTypes$1 = {
-  statusCode: PropTypes$1.statusCode
+  statusCode: PropTypes.statusCode
 };
 var defaultProps$1 = {
   statusCode: null
@@ -1674,7 +1645,8 @@ var PanneauRoutes = function PanneauRoutes(_ref) {
 
   var user = useUser();
   var route = useUrlGenerator();
-  var resources = usePanneauResources(); // const nextUrl = useMemo(() => {
+  var resources = usePanneauResources();
+  var componentsManager = useComponentsManager(); // const nextUrl = useMemo(() => {
   //     const query = parseQuery(search);
   //     return query !== null ? query.next || null : null;
   // }, [search]);
@@ -1702,52 +1674,49 @@ var PanneauRoutes = function PanneauRoutes(_ref) {
   var LoginComponent = getComponentFromName((loginPage === null || loginPage === void 0 ? void 0 : loginPage.component) || 'login', basePages, loginPage === null || loginPage === void 0 ? void 0 : loginPage.component);
   var AccountComponent = getComponentFromName((accountPage === null || accountPage === void 0 ? void 0 : accountPage.component) || 'account', basePages, accountPage === null || accountPage === void 0 ? void 0 : accountPage.component);
   var ErrorComponent = getComponentFromName((errorPage === null || errorPage === void 0 ? void 0 : errorPage.component) || 'error', basePages, errorPage === null || errorPage === void 0 ? void 0 : errorPage.component);
-  return /*#__PURE__*/React.createElement(Switch, null, statusCode !== null ? /*#__PURE__*/React.createElement(Route, {
-    path: "*",
-    render: function render() {
-      return /*#__PURE__*/React.createElement(ErrorComponent, {
-        statusCode: statusCode
-      });
-    }
-  }) : null, user === null ? /*#__PURE__*/React.createElement(Route, {
+  return /*#__PURE__*/React.createElement(Routes, null, statusCode !== null ? /*#__PURE__*/React.createElement(Route, {
     path: "*",
-    exact: true,
-    component: LoginComponent
-  }) : null, user !== null ? /*#__PURE__*/React.createElement(Route, {
+    element: /*#__PURE__*/React.createElement(ErrorComponent, {
+      statusCode: statusCode
+    })
+  }) : null, /*#__PURE__*/React.createElement(Route, {
     path: routes.home,
     exact: true,
-    component: HomeComponent
-  }) : /*#__PURE__*/React.createElement(Redirect, {
-    from: routes.home,
+    element: user !== null ? /*#__PURE__*/React.createElement(HomeComponent, null) : /*#__PURE__*/React.createElement(Navigate, {
+      to: route('login'),
+      replace: true
+    })
+  }), user === null ? /*#__PURE__*/React.createElement(Route, {
+    path: routes.login,
     exact: true,
-    to: route('login')
-  }), resources.map(function (resource) {
+    element: /*#__PURE__*/React.createElement(LoginComponent, null)
+  }) : null, resources.map(function (resource) {
     var _ref3 = resource || {},
         resourceId = _ref3.id;
 
-    return user !== null ? /*#__PURE__*/React.createElement(Route, {
+    return user !== null ? createResourceRoutes(resource, {
+      route: route,
+      componentsManager: componentsManager
+    }) : /*#__PURE__*/React.createElement(Route, {
       key: "resource-".concat(resourceId),
       path: route('resources.index', {
         resource: resourceId
       }),
-      render: function render() {
-        return /*#__PURE__*/React.createElement(ResourceRoutes, {
-          resource: resource
-        });
-      }
-    }) : /*#__PURE__*/React.createElement(Redirect, {
-      key: "resource-".concat(resourceId),
-      from: route('resources.index', {
-        resource: resourceId
-      }),
-      to: "".concat(route('login'), "?next=").concat(encodeURIComponent(pathname))
+      element: /*#__PURE__*/React.createElement(Navigate, {
+        to: "".concat(route('login'), "?next=").concat(encodeURIComponent(pathname)),
+        replace: true
+      })
     });
   }), /*#__PURE__*/React.createElement(Route, {
-    path: route('auth.account'),
-    component: AccountComponent
+    path: route('account'),
+    exact: true,
+    element: user !== null ? /*#__PURE__*/React.createElement(AccountComponent, null) : /*#__PURE__*/React.createElement(Navigate, {
+      to: "".concat(route('login'), "?next=").concat(encodeURIComponent(pathname)),
+      replace: true
+    })
   }), /*#__PURE__*/React.createElement(Route, {
     path: "*",
-    component: ErrorComponent
+    elmeent: /*#__PURE__*/React.createElement(ErrorComponent, null)
   }));
 };
 
@@ -1755,13 +1724,13 @@ PanneauRoutes.propTypes = propTypes$1;
 PanneauRoutes.defaultProps = defaultProps$1;
 
 var propTypes = {
-  definition: PropTypes$1.panneauDefinition.isRequired,
-  components: PropTypes.oneOfType([PropTypes.objectOf(PropTypes.elementType), PropTypes.objectOf(PropTypes.objectOf(PropTypes.elementType))]),
-  user: PropTypes$1.user,
-  memoryRouter: PropTypes.bool,
-  baseUrl: PropTypes.string,
-  uppy: PropTypes$1.uppy,
-  statusCode: PropTypes$1.statusCode
+  definition: PropTypes.panneauDefinition.isRequired,
+  components: PropTypes$1.oneOfType([PropTypes$1.objectOf(PropTypes$1.elementType), PropTypes$1.objectOf(PropTypes$1.objectOf(PropTypes$1.elementType))]),
+  user: PropTypes.user,
+  memoryRouter: PropTypes$1.bool,
+  baseUrl: PropTypes$1.string,
+  uppy: PropTypes.uppy,
+  statusCode: PropTypes.statusCode
 };
 var defaultProps = {
   components: null,
@@ -1811,6 +1780,12 @@ var Container = function Container(_ref) {
       }, {}));
     }, {}));
   }, [definition]);
+  var onUnauthorized = useCallback(function () {
+    window.location.href = baseUrl;
+  }, [baseUrl]);
+  var onLogout = useCallback(function () {
+    window.location.reload();
+  }, [baseUrl]);
   return /*#__PURE__*/React.createElement(Router, null, /*#__PURE__*/React.createElement(IntlProvider, {
     locale: locale,
     locales: locales,
@@ -1820,9 +1795,11 @@ var Container = function Container(_ref) {
   }, /*#__PURE__*/React.createElement(UppyProvider, uppy, /*#__PURE__*/React.createElement(RoutesProvider, {
     routes: routes
   }, /*#__PURE__*/React.createElement(FieldsProvider, null, /*#__PURE__*/React.createElement(FormsProvider, null, /*#__PURE__*/React.createElement(ListsProvider, null, /*#__PURE__*/React.createElement(DisplaysProvider, null, /*#__PURE__*/React.createElement(FiltersProvider, null, /*#__PURE__*/React.createElement(ApiProvider, {
-    baseUrl: baseUrl
+    baseUrl: baseUrl,
+    onUnauthorized: onUnauthorized
   }, /*#__PURE__*/React.createElement(AuthProvider, {
-    user: user
+    user: user,
+    onLogout: onLogout
   }, /*#__PURE__*/React.createElement(ComponentsProvider, {
     components: components
   }, /*#__PURE__*/React.createElement(PanneauRoutes, {
@@ -1833,4 +1810,4 @@ var Container = function Container(_ref) {
 Container.propTypes = propTypes;
 Container.defaultProps = defaultProps;
 
-export default Container;
+export { GuestLayout, MainLayout, PageHeader, ResourceFilters, ResourceForm, ResourceItemsList, Container as default };