diff --git a/packages/strapi-admin/admin/ee/components/Roles/RoleForm.js b/packages/strapi-admin/admin/ee/components/Roles/RoleForm.js
new file mode 100644
index 0000000000..9a44a82f17
--- /dev/null
+++ b/packages/strapi-admin/admin/ee/components/Roles/RoleForm.js
@@ -0,0 +1,67 @@
+import React from 'react';
+import { PropTypes } from 'prop-types';
+import { useIntl } from 'react-intl';
+
+import SizedInput from '../../../src/components/SizedInput';
+import { ButtonWithNumber } from '../../../src/components/Roles';
+import FormCard from '../../../src/components/FormBloc';
+
+const RoleForm = ({ values, errors, onChange, onBlur, isLoading }) => {
+ const { formatMessage } = useIntl();
+
+ const actions = [
+ console.log('Open user modal')} key="user-button">
+ {formatMessage({
+ id: 'Settings.roles.form.button.users-with-role',
+ })}
+ ,
+ ];
+
+ return (
+
+
+
+
+
+ );
+};
+
+RoleForm.defaultProps = {
+ isLoading: false,
+ values: { name: '', description: '' },
+};
+RoleForm.propTypes = {
+ values: PropTypes.object,
+ errors: PropTypes.object.isRequired,
+ onChange: PropTypes.func.isRequired,
+ onBlur: PropTypes.func.isRequired,
+ isLoading: PropTypes.bool,
+};
+
+export default RoleForm;
diff --git a/packages/strapi-admin/admin/ee/containers/Roles/CreatePage/index.js b/packages/strapi-admin/admin/ee/containers/Roles/CreatePage/index.js
index 6843522196..ae7c7eb524 100644
--- a/packages/strapi-admin/admin/ee/containers/Roles/CreatePage/index.js
+++ b/packages/strapi-admin/admin/ee/containers/Roles/CreatePage/index.js
@@ -6,18 +6,10 @@ import { useIntl } from 'react-intl';
import { request } from 'strapi-helper-plugin';
import { useHistory } from 'react-router-dom';
-import { roleTabsLabel } from '../../../../src/utils';
import BaselineAlignement from '../../../../src/components/BaselineAlignement';
import ContainerFluid from '../../../../src/components/ContainerFluid';
import FormCard from '../../../../src/components/FormBloc';
-import {
- ButtonWithNumber,
- CollectionTypesPermissions,
- Tabs,
- SingleTypesPermissions,
- PluginsPermissions,
- SettingsPermissions,
-} from '../../../../src/components/Roles';
+import { ButtonWithNumber, Permissions } from '../../../../src/components/Roles';
import SizedInput from '../../../../src/components/SizedInput';
import schema from './utils/schema';
@@ -126,12 +118,7 @@ const CreatePage = () => {
-
-
-
-
-
-
+
diff --git a/packages/strapi-admin/admin/ee/containers/Roles/ListPage/index.js b/packages/strapi-admin/admin/ee/containers/Roles/ListPage/index.js
index ea551b560c..72ecf68ed8 100644
--- a/packages/strapi-admin/admin/ee/containers/Roles/ListPage/index.js
+++ b/packages/strapi-admin/admin/ee/containers/Roles/ListPage/index.js
@@ -12,9 +12,10 @@ import {
request,
} from 'strapi-helper-plugin';
import { useIntl } from 'react-intl';
+
import useSettingsHeaderSearchContext from '../../../../src/hooks/useSettingsHeaderSearchContext';
import { EmptyRole, RoleListWrapper } from '../../../../src/components/Roles';
-import useRolesList from '../../../../src/hooks/useRolesList';
+import { useRolesList } from '../../../../src/hooks';
import RoleRow from './RoleRow';
import BaselineAlignment from './BaselineAlignment';
import reducer, { initialState } from './reducer';
diff --git a/packages/strapi-admin/admin/src/components/Roles/CollectionTypesPermissions/index.js b/packages/strapi-admin/admin/src/components/Roles/CollectionTypesPermissions/index.js
deleted file mode 100644
index 231b5caf0e..0000000000
--- a/packages/strapi-admin/admin/src/components/Roles/CollectionTypesPermissions/index.js
+++ /dev/null
@@ -1,12 +0,0 @@
-import React from 'react';
-import { Padded, Flex } from '@buffetjs/core';
-
-const CollectionTypesPermissions = () => (
-
-
- COLLECTION TYPES PERMISSIONS COMMING SOON
-
-
-);
-
-export default CollectionTypesPermissions;
diff --git a/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/ContentTypesRow/Chevron.js b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/ContentTypesRow/Chevron.js
new file mode 100644
index 0000000000..3019f8e0cf
--- /dev/null
+++ b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/ContentTypesRow/Chevron.js
@@ -0,0 +1,10 @@
+import styled from 'styled-components';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+
+const Chevron = styled(FontAwesomeIcon)`
+ display: none;
+ padding-left: 0.5rem;
+ font-size: 1.6rem;
+`;
+
+export default Chevron;
diff --git a/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/ContentTypesRow/PermissionName.js b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/ContentTypesRow/PermissionName.js
new file mode 100644
index 0000000000..465183a35d
--- /dev/null
+++ b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/ContentTypesRow/PermissionName.js
@@ -0,0 +1,16 @@
+import styled from 'styled-components';
+import PropTypes from 'prop-types';
+
+const PermissionName = styled.div`
+ display: flex;
+ align-items: center;
+ width: ${({ width }) => width};
+`;
+
+PermissionName.defaultProps = {
+ width: '20rem',
+};
+PermissionName.propTypes = {
+ width: PropTypes.string,
+};
+export default PermissionName;
diff --git a/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/ContentTypesRow/StyledRow.js b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/ContentTypesRow/StyledRow.js
new file mode 100644
index 0000000000..b20a8c8f95
--- /dev/null
+++ b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/ContentTypesRow/StyledRow.js
@@ -0,0 +1,38 @@
+import styled from 'styled-components';
+import { Text } from '@buffetjs/core';
+import Chevron from './Chevron';
+
+const StyledRow = styled.div`
+ display: flex;
+ align-items: center;
+ height: 36px;
+ background-color: ${({ isGrey, theme }) =>
+ isGrey ? theme.main.colors.content.background : theme.main.colors.white};
+ border: 1px solid transparent;
+ ${({ isActive, theme }) =>
+ isActive &&
+ `
+ border: 1px solid ${theme.main.colors.darkBlue};
+ background-color: ${theme.main.colors.lightBlue};
+ color: ${theme.main.colors.mediumBlue};
+ ${Text} {
+ color: ${theme.main.colors.mediumBlue};
+ }
+ ${Chevron} {
+ display: block;
+ }
+ `}
+ &:hover {
+ border: 1px solid ${({ theme }) => theme.main.colors.darkBlue};
+ background-color: ${({ theme }) => theme.main.colors.lightBlue};
+ color: ${({ theme }) => theme.main.colors.mediumBlue};
+ ${Text} {
+ color: ${({ theme }) => theme.main.colors.mediumBlue};
+ }
+ ${Chevron} {
+ display: block;
+ }
+ }
+`;
+
+export default StyledRow;
diff --git a/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/ContentTypesRow/index.js b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/ContentTypesRow/index.js
new file mode 100644
index 0000000000..1f5ce0d947
--- /dev/null
+++ b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/ContentTypesRow/index.js
@@ -0,0 +1,67 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import styled from 'styled-components';
+import { Checkbox, Flex, Text, Padded } from '@buffetjs/core';
+
+import PermissionCheckbox from '../PermissionCheckbox';
+import PermissionName from './PermissionName';
+import Chevron from './Chevron';
+import StyledRow from './StyledRow';
+
+// No need to create an other file for this style. It will be used only in this file.
+const CollapseLabel = styled(Flex)`
+ cursor: pointer;
+`;
+
+const ContentTypeRow = ({
+ openContentTypeAttributes,
+ openedContentTypeAttributes,
+ contentType,
+ index,
+}) => {
+ const isActive = openedContentTypeAttributes === contentType.name;
+
+ const handleToggleAttributes = () => {
+ openContentTypeAttributes(contentType.name);
+ };
+
+ return (
+
+
+
+
+
+
+
+ {contentType.name}
+
+
+
+
+
+
+
+
+
+
+
+ );
+};
+
+ContentTypeRow.defaultProps = {
+ openedContentTypeAttributes: null,
+};
+ContentTypeRow.propTypes = {
+ contentType: PropTypes.object.isRequired,
+ index: PropTypes.number.isRequired,
+ openContentTypeAttributes: PropTypes.func.isRequired,
+ openedContentTypeAttributes: PropTypes.string,
+};
+
+export default ContentTypeRow;
diff --git a/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/PermissionCheckbox.js b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/PermissionCheckbox.js
new file mode 100644
index 0000000000..c78d9252c6
--- /dev/null
+++ b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/PermissionCheckbox.js
@@ -0,0 +1,8 @@
+import styled from 'styled-components';
+import { Checkbox } from '@buffetjs/core';
+
+const PermissionCheckbox = styled(Checkbox)`
+ width: 10rem;
+`;
+
+export default PermissionCheckbox;
diff --git a/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/PermissionsHeader/Wrapper.js b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/PermissionsHeader/Wrapper.js
new file mode 100644
index 0000000000..952aeeb1e5
--- /dev/null
+++ b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/PermissionsHeader/Wrapper.js
@@ -0,0 +1,9 @@
+import styled from 'styled-components';
+
+const PermissionsHeaderWrapper = styled.div`
+ padding-left: 211px;
+ padding-bottom: 25px;
+ padding-top: 26px;
+`;
+
+export default PermissionsHeaderWrapper;
diff --git a/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/PermissionsHeader/index.js b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/PermissionsHeader/index.js
new file mode 100644
index 0000000000..7e4114df4e
--- /dev/null
+++ b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/PermissionsHeader/index.js
@@ -0,0 +1,21 @@
+import React from 'react';
+import { Flex } from '@buffetjs/core';
+
+import PermissionCheckbox from '../PermissionCheckbox';
+import Wrapper from './Wrapper';
+
+const PermissionsHeader = () => {
+ return (
+
+
+
+
+
+
+
+
+
+ );
+};
+
+export default PermissionsHeader;
diff --git a/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/Wrapper.js b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/Wrapper.js
new file mode 100644
index 0000000000..7946772322
--- /dev/null
+++ b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/Wrapper.js
@@ -0,0 +1,7 @@
+import styled from 'styled-components';
+
+const Wrapper = styled.div`
+ background-color: ${({ theme }) => theme.main.colors.white};
+`;
+
+export default Wrapper;
diff --git a/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/index.js b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/index.js
new file mode 100644
index 0000000000..5043609217
--- /dev/null
+++ b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/index.js
@@ -0,0 +1,44 @@
+import React, { useReducer } from 'react';
+import PropTypes from 'prop-types';
+import { Padded } from '@buffetjs/core';
+
+import ContentTypeRow from './ContentTypesRow';
+import Wrapper from './Wrapper';
+import PermissionsHeader from './PermissionsHeader';
+
+import reducer, { initialState } from './reducer';
+
+const ContentTypesPermissions = ({ contentTypes }) => {
+ const [state, dispatch] = useReducer(reducer, initialState);
+
+ const openContentTypeAttributes = contentTypeToOpen => {
+ dispatch({
+ type: 'OPEN_CONTENT_TYPE_ATTRIBUTES',
+ contentTypeToOpen,
+ });
+ };
+
+ return (
+
+
+
+ {contentTypes &&
+ contentTypes.map((contentType, index) => (
+
+ ))}
+
+
+ );
+};
+
+ContentTypesPermissions.propTypes = {
+ contentTypes: PropTypes.array.isRequired,
+};
+
+export default ContentTypesPermissions;
diff --git a/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/reducer.js b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/reducer.js
new file mode 100644
index 0000000000..6ea6e03196
--- /dev/null
+++ b/packages/strapi-admin/admin/src/components/Roles/Permissions/ContentTypes/reducer.js
@@ -0,0 +1,24 @@
+/* eslint-disable consistent-return */
+import produce from 'immer';
+
+export const initialState = {
+ collapseContentTypeAttribute: null,
+};
+
+const reducer = (state, action) =>
+ produce(state, draftState => {
+ switch (action.type) {
+ case 'OPEN_CONTENT_TYPE_ATTRIBUTES': {
+ if (state.collapseContentTypeAttribute === action.contentTypeToOpen) {
+ draftState.collapseContentTypeAttribute = null;
+ } else {
+ draftState.collapseContentTypeAttribute = action.contentTypeToOpen;
+ }
+ break;
+ }
+ default:
+ return draftState;
+ }
+ });
+
+export default reducer;
diff --git a/packages/strapi-admin/admin/src/components/Roles/PluginsPermissions/index.js b/packages/strapi-admin/admin/src/components/Roles/Permissions/Plugins/index.js
similarity index 100%
rename from packages/strapi-admin/admin/src/components/Roles/PluginsPermissions/index.js
rename to packages/strapi-admin/admin/src/components/Roles/Permissions/Plugins/index.js
diff --git a/packages/strapi-admin/admin/src/components/Roles/SettingsPermissions/index.js b/packages/strapi-admin/admin/src/components/Roles/Permissions/Settings/index.js
similarity index 100%
rename from packages/strapi-admin/admin/src/components/Roles/SettingsPermissions/index.js
rename to packages/strapi-admin/admin/src/components/Roles/Permissions/Settings/index.js
diff --git a/packages/strapi-admin/admin/src/components/Roles/Permissions/fakeData.js b/packages/strapi-admin/admin/src/components/Roles/Permissions/fakeData.js
new file mode 100644
index 0000000000..9cb2848e48
--- /dev/null
+++ b/packages/strapi-admin/admin/src/components/Roles/Permissions/fakeData.js
@@ -0,0 +1,45 @@
+const permissions = {
+ sections: {
+ contentTypes: [
+ {
+ name: 'Create',
+ action: 'plugins::content-type.create', // same with read, update and delete
+ subjects: ['plugins::users-permissions.user'], // on which content type it will be applied
+ },
+ ],
+ plugins: [
+ {
+ name: 'Read', // Label checkbox
+ plugin: 'plugin::content-type-builder', // Retrieve banner info
+ subCategory: 'Category name', // if null, then the front uses plugin's name by default
+ action: 'plugins::content-type-builder.read', // Mapping
+ },
+ ],
+ settings: [
+ {
+ name: 'Create', // Label checkbox
+ category: 'Webhook', // Banner info
+ subCategory: 'category name', // Divider title
+ action: 'plugins::content-type-builder.create',
+ },
+ ],
+ },
+ conditions: [{}], // To be defined
+};
+
+const rolePermissions = [
+ {
+ action: 'plugins::content-manager.create',
+ subject: 'plugins::users-permissions.user',
+ fields: ['email', 'firstname', 'lastname', 'roles'], // or ["*"] or ["**"]
+ conditions: [],
+ },
+ {
+ action: 'plugins::content-manager.anAction',
+ subject: null,
+ fields: null,
+ conditions: [],
+ },
+];
+
+export { permissions, rolePermissions };
diff --git a/packages/strapi-admin/admin/src/components/Roles/Permissions/index.js b/packages/strapi-admin/admin/src/components/Roles/Permissions/index.js
new file mode 100644
index 0000000000..594ee90ef9
--- /dev/null
+++ b/packages/strapi-admin/admin/src/components/Roles/Permissions/index.js
@@ -0,0 +1,46 @@
+import React, { useReducer, useEffect } from 'react';
+import { request } from 'strapi-helper-plugin';
+
+import Tabs from '../Tabs';
+import ContentTypes from './ContentTypes';
+import PluginsPermissions from './Plugins';
+import SettingsPermissions from './Settings';
+import reducer, { initialState } from './reducer';
+import { roleTabsLabel } from '../../../utils';
+
+const Permissions = () => {
+ const [{ collectionTypes, singleTypes }, dispatch] = useReducer(reducer, initialState);
+
+ useEffect(() => {
+ fetchContentTypes();
+ }, []);
+
+ const fetchContentTypes = async () => {
+ try {
+ const { data } = await request('/content-manager/content-types', {
+ method: 'GET',
+ });
+
+ dispatch({
+ type: 'GET_CONTENT_TYPES_SUCCEDED',
+ data,
+ });
+ } catch (err) {
+ dispatch({
+ type: 'GET_CONTENT_TYPES_ERROR',
+ });
+ strapi.notification.error('notification.error');
+ }
+ };
+
+ return (
+
+
+
+
+
+
+ );
+};
+
+export default Permissions;
diff --git a/packages/strapi-admin/admin/src/components/Roles/Permissions/reducer.js b/packages/strapi-admin/admin/src/components/Roles/Permissions/reducer.js
new file mode 100644
index 0000000000..310ef5bacf
--- /dev/null
+++ b/packages/strapi-admin/admin/src/components/Roles/Permissions/reducer.js
@@ -0,0 +1,33 @@
+/* eslint-disable consistent-return */
+import produce from 'immer';
+
+export const initialState = {
+ collectionTypes: [],
+ singleTypes: [],
+ isLoading: true,
+};
+
+const reducer = (state, action) =>
+ produce(state, draftState => {
+ switch (action.type) {
+ case 'GET_CONTENT_TYPES_SUCCEDED': {
+ const getContentTypeByKind = kind =>
+ action.data.filter(
+ contentType => contentType.isDisplayed && contentType.schema.kind === kind
+ );
+
+ draftState.isLoading = false;
+ draftState.collectionTypes = getContentTypeByKind('collectionType');
+ draftState.singleTypes = getContentTypeByKind('singleType');
+ break;
+ }
+ case 'GET_CONTENT_TYPES_ERROR': {
+ draftState.isLoading = false;
+ break;
+ }
+ default:
+ return draftState;
+ }
+ });
+
+export default reducer;
diff --git a/packages/strapi-admin/admin/src/components/Roles/Permissions/tests/reducer.test.js b/packages/strapi-admin/admin/src/components/Roles/Permissions/tests/reducer.test.js
new file mode 100644
index 0000000000..67473e3517
--- /dev/null
+++ b/packages/strapi-admin/admin/src/components/Roles/Permissions/tests/reducer.test.js
@@ -0,0 +1,92 @@
+import reducer from '../reducer';
+
+describe('ADMIN | COMPONENTS | ROLES | PERMISSIONS | reducer', () => {
+ describe('DEFAULT_ACTION', () => {
+ it('should return the initialState', () => {
+ const state = {
+ test: true,
+ };
+
+ expect(reducer(state, {})).toEqual(state);
+ });
+ });
+
+ describe('GET_DATA_ERROR', () => {
+ it('should set isLoading to false is an error occured', () => {
+ const action = {
+ type: 'GET_CONTENT_TYPES_ERROR',
+ };
+ const initialState = {
+ collectionTypes: [],
+ singleTypes: [],
+ isLoading: true,
+ };
+ const expected = {
+ collectionTypes: [],
+ singleTypes: [],
+ isLoading: false,
+ };
+
+ expect(reducer(initialState, action)).toEqual(expected);
+ });
+ });
+
+ describe('GET_CONTENT_TYPES_SUCCEDED', () => {
+ it('should return the state with the collectionTypes and singleTypes', () => {
+ const action = {
+ type: 'GET_CONTENT_TYPES_SUCCEDED',
+ data: [
+ {
+ uid: 'app.homepage',
+ isDisplayed: true,
+ schema: {
+ kind: 'singleType',
+ },
+ },
+ {
+ uid: 'permissions.role',
+ isDisplayed: false,
+ schema: {
+ kind: 'collectionType',
+ },
+ },
+ {
+ uid: 'app.category',
+ isDisplayed: true,
+ schema: {
+ kind: 'collectionType',
+ },
+ },
+ ],
+ };
+ const initialState = {
+ collectionTypes: [],
+ singleTypes: [],
+ isLoading: true,
+ };
+ const expected = {
+ collectionTypes: [
+ {
+ uid: 'app.category',
+ isDisplayed: true,
+ schema: {
+ kind: 'collectionType',
+ },
+ },
+ ],
+ singleTypes: [
+ {
+ uid: 'app.homepage',
+ isDisplayed: true,
+ schema: {
+ kind: 'singleType',
+ },
+ },
+ ],
+ isLoading: false,
+ };
+
+ expect(reducer(initialState, action)).toEqual(expected);
+ });
+ });
+});
diff --git a/packages/strapi-admin/admin/src/components/Roles/SingleTypesPermissions/index.js b/packages/strapi-admin/admin/src/components/Roles/SingleTypesPermissions/index.js
deleted file mode 100644
index f3c01edeea..0000000000
--- a/packages/strapi-admin/admin/src/components/Roles/SingleTypesPermissions/index.js
+++ /dev/null
@@ -1,12 +0,0 @@
-import React from 'react';
-import { Padded, Flex } from '@buffetjs/core';
-
-const SingleTypesPermissions = () => (
-
-
- SINGLE TYPES PERMISSIONS COMMING SOON
-
-
-);
-
-export default SingleTypesPermissions;
diff --git a/packages/strapi-admin/admin/src/components/Roles/index.js b/packages/strapi-admin/admin/src/components/Roles/index.js
index 354edddf7d..c7bdd06e52 100644
--- a/packages/strapi-admin/admin/src/components/Roles/index.js
+++ b/packages/strapi-admin/admin/src/components/Roles/index.js
@@ -4,7 +4,4 @@ export { default as RoleDescription } from './RoleDescription';
export { default as RoleListWrapper } from './RoleListWrapper';
export { default as RoleRow } from './RoleRow';
export { default as Tabs } from './Tabs';
-export { default as SingleTypesPermissions } from './SingleTypesPermissions';
-export { default as CollectionTypesPermissions } from './CollectionTypesPermissions';
-export { default as PluginsPermissions } from './PluginsPermissions';
-export { default as SettingsPermissions } from './SettingsPermissions';
+export { default as Permissions } from './Permissions';
diff --git a/packages/strapi-admin/admin/src/components/Users/index.js b/packages/strapi-admin/admin/src/components/Users/index.js
new file mode 100644
index 0000000000..7369960137
--- /dev/null
+++ b/packages/strapi-admin/admin/src/components/Users/index.js
@@ -0,0 +1,9 @@
+export { default as Header } from './Header';
+export { default as MagicLink } from './MagicLink';
+export { default as Filter } from './Filter';
+export { default as Footer } from './Footer';
+export { default as List } from './List';
+export { default as FilterPicker } from './FilterPicker';
+export { default as SortPicker } from './SortPicker';
+export { default as SelectRoles } from './SelectRoles';
+export { default as ModalCreateBody } from './ModalCreateBody';
diff --git a/packages/strapi-admin/admin/src/containers/MarketplacePage/index.js b/packages/strapi-admin/admin/src/containers/MarketplacePage/index.js
index 85d5c4af91..55d848bb32 100644
--- a/packages/strapi-admin/admin/src/containers/MarketplacePage/index.js
+++ b/packages/strapi-admin/admin/src/containers/MarketplacePage/index.js
@@ -2,7 +2,8 @@ import React from 'react';
import PropTypes from 'prop-types';
import { LoadingIndicatorPage, useGlobalContext, request } from 'strapi-helper-plugin';
import { Header } from '@buffetjs/custom';
-import useFetchPluginsFromMarketPlace from '../../hooks/useFetchPluginsFromMarketPlace';
+
+import { useFetchPluginsFromMarketPlace } from '../../hooks';
import PageTitle from '../../components/PageTitle';
import PluginCard from './PluginCard';
import Wrapper from './Wrapper';
diff --git a/packages/strapi-admin/admin/src/containers/ProfilePage/index.js b/packages/strapi-admin/admin/src/containers/ProfilePage/index.js
index c8367670ef..8f3bd31f7a 100644
--- a/packages/strapi-admin/admin/src/containers/ProfilePage/index.js
+++ b/packages/strapi-admin/admin/src/containers/ProfilePage/index.js
@@ -2,12 +2,13 @@ import React from 'react';
import { BackHeader, auth } from 'strapi-helper-plugin';
import { useHistory } from 'react-router-dom';
import { get } from 'lodash';
+
import BaselineAlignement from '../../components/BaselineAlignement';
import ContainerFluid from '../../components/ContainerFluid';
import FormBloc from '../../components/FormBloc';
import SizedInput from '../../components/SizedInput';
-import Header from '../../components/Users/Header';
-import useUsersForm from '../../hooks/useUsersForm';
+import { Header } from '../../components/Users';
+import { useUsersForm } from '../../hooks';
import { form, schema } from './utils';
const ProfilePage = () => {
diff --git a/packages/strapi-admin/admin/src/containers/Roles/EditPage/index.js b/packages/strapi-admin/admin/src/containers/Roles/EditPage/index.js
index b865f5f0c7..66d448de67 100644
--- a/packages/strapi-admin/admin/src/containers/Roles/EditPage/index.js
+++ b/packages/strapi-admin/admin/src/containers/Roles/EditPage/index.js
@@ -6,17 +6,10 @@ import { Padded } from '@buffetjs/core';
import { Formik } from 'formik';
import { useIntl } from 'react-intl';
-import { roleTabsLabel } from '../../../utils';
import RoleForm from '../../../components/Roles/RoleForm';
import BaselineAlignement from '../../../components/BaselineAlignement';
import ContainerFluid from '../../../components/ContainerFluid';
-import {
- CollectionTypesPermissions,
- PluginsPermissions,
- SettingsPermissions,
- SingleTypesPermissions,
- Tabs,
-} from '../../../components/Roles';
+import { Permissions } from '../../../components/Roles';
import { useFetchRole, useFetchPermissionsLayout } from '../../../hooks';
import schema from './utils/schema';
@@ -113,12 +106,7 @@ const EditPage = () => {
onBlur={handleBlur}
/>
-
-
-
-
-
-
+
diff --git a/packages/strapi-admin/admin/src/containers/Roles/ListPage/index.js b/packages/strapi-admin/admin/src/containers/Roles/ListPage/index.js
index ac88928e9a..259d42dc0b 100644
--- a/packages/strapi-admin/admin/src/containers/Roles/ListPage/index.js
+++ b/packages/strapi-admin/admin/src/containers/Roles/ListPage/index.js
@@ -7,9 +7,8 @@ import { useHistory } from 'react-router-dom';
import { useGlobalContext, useQuery } from 'strapi-helper-plugin';
import { EmptyRole, RoleListWrapper, RoleRow } from '../../../components/Roles';
+import { useRolesList, useSettingsHeaderSearchContext } from '../../../hooks';
import BaselineAlignment from './BaselineAlignment';
-import useRolesList from '../../../hooks/useRolesList';
-import useSettingsHeaderSearchContext from '../../../hooks/useSettingsHeaderSearchContext';
const RoleListPage = () => {
const { formatMessage } = useIntl();
diff --git a/packages/strapi-admin/admin/src/containers/Users/EditPage/index.js b/packages/strapi-admin/admin/src/containers/Users/EditPage/index.js
index c5a3dda394..e77ec94730 100644
--- a/packages/strapi-admin/admin/src/containers/Users/EditPage/index.js
+++ b/packages/strapi-admin/admin/src/containers/Users/EditPage/index.js
@@ -5,14 +5,13 @@ import { get, isEmpty } from 'lodash';
import { useGlobalContext, auth } from 'strapi-helper-plugin';
import { Col } from 'reactstrap';
import { Padded } from '@buffetjs/core';
+
import BaselineAlignement from '../../../components/BaselineAlignement';
import ContainerFluid from '../../../components/ContainerFluid';
import FormBloc from '../../../components/FormBloc';
import SizedInput from '../../../components/SizedInput';
-import Header from '../../../components/Users/Header';
-import MagicLink from '../../../components/Users/MagicLink';
-import SelectRoles from '../../../components/Users/SelectRoles';
-import useUsersForm from '../../../hooks/useUsersForm';
+import { Header, MagicLink, SelectRoles } from '../../../components/Users';
+import { useUsersForm } from '../../../hooks';
import { editValidation } from '../../../validations/users';
import form from './utils/form';
diff --git a/packages/strapi-admin/admin/src/containers/Users/ListPage/index.js b/packages/strapi-admin/admin/src/containers/Users/ListPage/index.js
index 0a7de0c9a7..a0692f8e5f 100644
--- a/packages/strapi-admin/admin/src/containers/Users/ListPage/index.js
+++ b/packages/strapi-admin/admin/src/containers/Users/ListPage/index.js
@@ -2,13 +2,10 @@ import React, { useEffect, useMemo, useReducer, useRef, useState } from 'react';
import { useQuery, request } from 'strapi-helper-plugin';
import { useHistory, useLocation } from 'react-router-dom';
import { Flex, Padded } from '@buffetjs/core';
+
import BaselineAlignement from '../../../components/BaselineAlignement';
-import useSettingsHeaderSearchContext from '../../../hooks/useSettingsHeaderSearchContext';
-import Footer from '../../../components/Users/Footer';
-import List from '../../../components/Users/List';
-import Filter from '../../../components/Users/Filter';
-import FilterPicker from '../../../components/Users/FilterPicker';
-import SortPicker from '../../../components/Users/SortPicker';
+import { useSettingsHeaderSearchContext } from '../../../hooks';
+import { Footer, List, Filter, FilterPicker, SortPicker } from '../../../components/Users';
import Header from './Header';
import ModalForm from './ModalForm';
import getFilters from './utils/getFilters';
diff --git a/packages/strapi-admin/admin/src/containers/Users/ListPage/stepper.js b/packages/strapi-admin/admin/src/containers/Users/ListPage/stepper.js
index 882afd85f7..58c99f9cfe 100644
--- a/packages/strapi-admin/admin/src/containers/Users/ListPage/stepper.js
+++ b/packages/strapi-admin/admin/src/containers/Users/ListPage/stepper.js
@@ -1,4 +1,4 @@
-import ModalCreateBody from '../../../components/Users/ModalCreateBody';
+import { ModalCreateBody } from '../../../components/Users';
const stepper = {
create: {
diff --git a/packages/strapi-admin/admin/src/hooks/index.js b/packages/strapi-admin/admin/src/hooks/index.js
index 79eeb3202d..ccea9bcb56 100644
--- a/packages/strapi-admin/admin/src/hooks/index.js
+++ b/packages/strapi-admin/admin/src/hooks/index.js
@@ -1,3 +1,6 @@
export { default as useFetchRole } from './useFetchRole';
export { default as useRolesList } from './useRolesList';
export { default as useFetchPermissionsLayout } from './useFetchPermissionsLayout';
+export { default as useFetchPluginsFromMarketPlace } from './useFetchPluginsFromMarketPlace';
+export { default as useSettingsHeaderSearchContext } from './useSettingsHeaderSearchContext';
+export { default as useUsersForm } from './useUsersForm';