fix(content-manager): simplify useSyncRbac hook

docs/docs/docs/01-core/admin/02-permissions/02-frontend/using-permissions.mdx

@@ -74,7 +74,7 @@ available in the `@strapi/helper-plugin`.
 ### CheckPagePermissions
 
 Used to apply RBAC to a view/page of the application. If the user does not have the permissions to access this page they will
-be redirect to the homepage.
+be redirected to the homepage.
 
 #### Usage
 

packages/admin-test-utils/src/fixtures/store/index.ts

@@ -20,7 +20,6 @@ const reducers = {
       total: 0,
     },
   })),
-  'content-manager_rbacManager': jest.fn(() => ({ permissions: null })),
   'content-manager_editViewLayoutManager': jest.fn(() => ({ currentLayout: null })),
   'content-manager_editViewCrudReducer': jest.fn(() => ({
     componentsDataStructure: {},

packages/core/admin/admin/src/content-manager/hooks/useSyncRbac/actions.js

@@ -1,14 +0,0 @@
-import { RESET_PERMISSIONS, SET_PERMISSIONS } from './constants';
-
-export const setPermissions = (permissions, plugins, containerName) => {
-  return {
-    type: SET_PERMISSIONS,
-    permissions,
-    __meta__: {
-      plugins,
-      containerName,
-    },
-  };
-};
-
-export const resetPermissions = () => ({ type: RESET_PERMISSIONS });

packages/core/admin/admin/src/content-manager/hooks/useSyncRbac/constants.js

@@ -1,2 +0,0 @@
-export const SET_PERMISSIONS = 'ContentManager/RBACManager/SET_PERMISSIONS';
-export const RESET_PERMISSIONS = 'ContentManager/RBACManager/RESET_PERMISSIONS';

packages/core/admin/admin/src/content-manager/hooks/useSyncRbac/index.js

@@ -1,28 +1,12 @@
-import { useEffect } from 'react';
+import { useSelector } from 'react-redux';
 
-import { useDispatch, useSelector } from 'react-redux';
+import { selectCollectionTypePermissions } from './selectors';
 
-import { resetPermissions, setPermissions } from './actions';
+const useSyncRbac = (collectionTypeUID) => {
-import { selectCollectionTypePermissions, selectPermissions } from './selectors';
+  const relatedPermissions = useSelector((state) =>
-
+    selectCollectionTypePermissions(state, collectionTypeUID)
-const useSyncRbac = (query, collectionTypeUID, containerName = 'listView') => {
+  );
-  const collectionTypesRelatedPermissions = useSelector(selectCollectionTypePermissions);
+  const permissions = [].concat(...Object.values(relatedPermissions));
-  const permissions = useSelector(selectPermissions);
-  const dispatch = useDispatch();
-
-  const relatedPermissions = collectionTypesRelatedPermissions[collectionTypeUID];
-
-  useEffect(() => {
-    if (relatedPermissions) {
-      dispatch(setPermissions(relatedPermissions, query ? query.plugins : null, containerName));
-
-      return () => {
-        dispatch(resetPermissions());
-      };
-    }
-
-    return () => {};
-  }, [relatedPermissions, dispatch, query, containerName]);
 
   return permissions;
 };

packages/core/admin/admin/src/content-manager/hooks/useSyncRbac/reducer.js

@@ -1,33 +0,0 @@
-/**
- *
- * RBACManager reducer
- */
-
-import produce from 'immer';
-
-import { RESET_PERMISSIONS, SET_PERMISSIONS } from './constants';
-
-export const initialState = {
-  permissions: null,
-};
-
-const rbacManagerReducer = (state = initialState, action) =>
-  // eslint-disable-next-line consistent-return
-  produce(state, (draftState) => {
-    switch (action.type) {
-      case SET_PERMISSIONS: {
-        draftState.permissions = Object.entries(action.permissions).reduce((acc, current) => {
-          return [...acc, ...current[1]];
-        }, []);
-        break;
-      }
-      case RESET_PERMISSIONS: {
-        draftState.permissions = null;
-        break;
-      }
-      default:
-        return draftState;
-    }
-  });
-
-export default rbacManagerReducer;

packages/core/admin/admin/src/content-manager/hooks/useSyncRbac/selectors.js

@@ -1,4 +1,2 @@
-export const selectPermissions = (state) => state['content-manager_rbacManager'].permissions;
+export const selectCollectionTypePermissions = (state, collectionTypeUID) =>
-
+  state.rbacProvider.collectionTypesRelatedPermissions[collectionTypeUID];
-export const selectCollectionTypePermissions = (state) =>
-  state.rbacProvider.collectionTypesRelatedPermissions;

packages/core/admin/admin/src/content-manager/hooks/useSyncRbac/tests/reducer.test.js

@@ -1,83 +0,0 @@
-import { resetPermissions, setPermissions } from '../actions';
-import reducer, { initialState } from '../reducer';
-
-describe('CONTENT MANAGER | CONTAINERS | RBACMANAGER | reducer', () => {
-  let state;
-
-  beforeEach(() => {
-    state = initialState;
-  });
-
-  describe('SET_PERMISSIONS', () => {
-    it('should set the permissions to an empty array when the permissions are empty', () => {
-      const expected = {
-        permissions: [],
-      };
-
-      expect(reducer(state, setPermissions({}))).toEqual(expected);
-    });
-
-    it('should set the permissions correctly when the permissions are not empty', () => {
-      const permissions = {
-        create: [
-          {
-            action: 'create',
-            subject: 'article',
-            properties: 'test',
-          },
-          {
-            action: 'create',
-            subject: 'article',
-            properties: 'test1',
-          },
-        ],
-        read: [
-          {
-            action: 'read',
-            subject: 'article',
-            properties: 'test',
-          },
-          {
-            action: 'read',
-            subject: 'article',
-            properties: 'test1',
-          },
-        ],
-      };
-      const expected = {
-        permissions: [
-          {
-            action: 'create',
-            subject: 'article',
-            properties: 'test',
-          },
-          {
-            action: 'create',
-            subject: 'article',
-            properties: 'test1',
-          },
-          {
-            action: 'read',
-            subject: 'article',
-            properties: 'test',
-          },
-          {
-            action: 'read',
-            subject: 'article',
-            properties: 'test1',
-          },
-        ],
-      };
-
-      expect(reducer(state, setPermissions(permissions))).toEqual(expected);
-    });
-  });
-
-  describe('RESET_PERMISSIONS', () => {
-    it('should set the permissions to null', () => {
-      state.permissions = [];
-
-      expect(reducer(state, resetPermissions())).toEqual({ permissions: null });
-    });
-  });
-});

packages/core/admin/admin/src/content-manager/hooks/useSyncRbac/tests/selectors.test.js

@@ -1,6 +1,6 @@
 import { fixtures } from '@strapi/admin-test-utils';
 
-import { selectCollectionTypePermissions, selectPermissions } from '../selectors';
+import { selectCollectionTypePermissions } from '../selectors';
 
 describe('Admin | content manager | hooks | useSyncRbac | selectors', () => {
   let store;
@@ -9,31 +9,13 @@ describe('Admin | content manager | hooks | useSyncRbac | selectors', () => {
     store = { ...fixtures.store.state };
   });
 
-  describe('selectPermissions', () => {
-    it('resolves the permissions key of the "content-manager_rbacManager" store key', () => {
-      store['content-manager_rbacManager'] = {
-        permissions: {
-          some: 'permission',
-        },
-      };
-
-      const actual = selectPermissions(store);
-      const expected = {
-        some: 'permission',
-      };
-
-      expect(actual).toEqual(expected);
-    });
-  });
-
   describe('selectCollectionTypePermissions', () => {
     it('resolves the permissions key of the "rbacProvider" store key', () => {
-      store.rbacProvider.collectionTypesRelatedPermissions.some = 'permission again';
+      const uid = 'uid';
+      store.rbacProvider.collectionTypesRelatedPermissions[uid] = { permission: true };
 
-      const actual = selectCollectionTypePermissions(store);
+      const actual = selectCollectionTypePermissions(store, uid);
-      const expected = {
+      const expected = { permission: true };
-        some: 'permission again',
-      };
 
       expect(actual).toEqual(expected);
     });

packages/core/admin/admin/src/content-manager/pages/EditViewLayoutManager/index.js

@@ -16,7 +16,7 @@ const EditViewLayoutManager = ({ layout, ...rest }) => {
   const dispatch = useDispatch();
   const [{ query }] = useQueryParams();
   const { runHookWaterfall } = useStrapiApp();
-  const permissions = useSyncRbac(query, rest.slug, 'editView');
+  const permissions = useSyncRbac(rest.slug);
 
   useEffect(() => {
     // Allow the plugins to extend the edit view layout

packages/core/admin/admin/src/content-manager/pages/ListViewLayoutManager/index.js

@@ -13,8 +13,8 @@ import Permissions from './Permissions';
 const ListViewLayout = ({ layout, ...props }) => {
   const dispatch = useDispatch();
   const { replace } = useHistory();
-  const [{ query, rawQuery }] = useQueryParams();
+  const [{ rawQuery }] = useQueryParams();
-  const permissions = useSyncRbac(query, props.slug, 'listView');
+  const permissions = useSyncRbac(props.slug);
   const redirectionLink = useFindRedirectionLink(props.slug);
 
   useEffect(() => {

packages/core/admin/admin/src/reducers.js

@@ -1,5 +1,4 @@
 import rbacProviderReducer from './components/RBACProvider/reducer';
-import rbacManagerReducer from './content-manager/hooks/useSyncRbac/reducer';
 import cmAppReducer from './content-manager/pages/App/reducer';
 import editViewLayoutManagerReducer from './content-manager/pages/EditViewLayoutManager/reducer';
 import listViewReducer from './content-manager/pages/ListView/reducer';
@@ -9,7 +8,6 @@ import appReducer from './pages/App/reducer';
 const contentManagerReducers = {
   'content-manager_app': cmAppReducer,
   'content-manager_listView': listViewReducer,
-  'content-manager_rbacManager': rbacManagerReducer,
   'content-manager_editViewLayoutManager': editViewLayoutManagerReducer,
   'content-manager_editViewCrudReducer': editViewCrudReducer,
 };