Chore: Remove pluginId references

packages/plugins/users-permissions/admin/src/hooks/useFetchRole/index.js

@@ -2,10 +2,9 @@ import { useCallback, useEffect, useReducer, useRef } from 'react';
 
 import { useFetchClient, useNotification } from '@strapi/helper-plugin';
 
-import pluginId from '../../pluginId';
-
 import reducer, { initialState } from './reducer';
 
+// TODO: Refactor to use react-query
 const useFetchRole = (id) => {
   const [state, dispatch] = useReducer(reducer, initialState);
   const toggleNotification = useNotification();
@@ -32,7 +31,7 @@ const useFetchRole = (id) => {
     try {
       const {
         data: { role },
-      } = await get(`/${pluginId}/roles/${roleId}`);
+      } = await get(`/users-permissions/roles/${roleId}`);
 
       // Prevent updating state on an unmounted component
       if (isMounted.current) {

packages/plugins/users-permissions/admin/src/hooks/usePlugins.js

@@ -3,7 +3,6 @@ import { useEffect } from 'react';
 import { useNotification, useFetchClient, useAPIErrorHandler } from '@strapi/helper-plugin';
 import { useQueries } from 'react-query';
 
-import pluginId from '../pluginId';
 import { cleanPermissions, getTrad } from '../utils';
 
 export const usePlugins = () => {
@@ -21,17 +20,17 @@ export const usePlugins = () => {
     { data: routes, isLoading: isLoadingRoutes, error: routesError, refetch: refetchRoutes },
   ] = useQueries([
     {
-      queryKey: [pluginId, 'permissions'],
+      queryKey: ['users-permissions', 'permissions'],
       async queryFn() {
-        const res = await get(`/${pluginId}/permissions`);
+        const res = await get(`/users-permissions/permissions`);
 
         return res.data.permissions;
       },
     },
     {
-      queryKey: [pluginId, 'routes'],
+      queryKey: ['users-permissions', 'routes'],
       async queryFn() {
-        const res = await get(`/${pluginId}/routes`);
+        const res = await get(`/users-permissions/routes`);
 
         return res.data.routes;
       },

packages/plugins/users-permissions/admin/src/hooks/useRolesList/index.js

@@ -3,11 +3,10 @@ import { useCallback, useEffect, useReducer, useRef } from 'react';
 import { useFetchClient, useNotification } from '@strapi/helper-plugin';
 import get from 'lodash/get';
 
-import pluginId from '../../pluginId';
-
 import init from './init';
 import reducer, { initialState } from './reducer';
 
+// TODO: refactor to use react-query or useAdminRoles()
 const useRolesList = (shouldFetchData = true) => {
   const [{ roles, isLoading }, dispatch] = useReducer(reducer, initialState, () =>
     init(initialState, shouldFetchData)
@@ -25,7 +24,7 @@ const useRolesList = (shouldFetchData = true) => {
 
       const {
         data: { roles },
-      } = await fetchClient.get(`/${pluginId}/roles`);
+      } = await fetchClient.get(`/users-permissions/roles`);
 
       dispatch({
         type: 'GET_DATA_SUCCEEDED',

packages/plugins/users-permissions/admin/src/index.js

@@ -9,7 +9,6 @@ import { prefixPluginTranslations } from '@strapi/helper-plugin';
 import pluginPkg from '../../package.json';
 
 import { PERMISSIONS } from './constants';
-import pluginId from './pluginId';
 import getTrad from './utils/getTrad';
 
 const name = pluginPkg.strapi.name;
@@ -19,7 +18,7 @@ export default {
     // Create the plugin's settings section
     app.createSettingSection(
       {
-        id: pluginId,
+        id: 'users-permissions',
         intlLabel: {
           id: getTrad('Settings.section-label'),
           defaultMessage: 'Users & Permissions plugin',
@@ -32,7 +31,7 @@ export default {
             defaultMessage: 'Roles',
           },
           id: 'roles',
-          to: `/settings/${pluginId}/roles`,
+          to: `/settings/users-permissions/roles`,
           async Component() {
             const component = await import(
               /* webpackChunkName: "users-roles-settings-page" */ './pages/Roles'
@@ -48,7 +47,7 @@ export default {
             defaultMessage: 'Providers',
           },
           id: 'providers',
-          to: `/settings/${pluginId}/providers`,
+          to: `/settings/users-permissions/providers`,
           async Component() {
             const component = await import(
               /* webpackChunkName: "users-providers-settings-page" */ './pages/Providers'
@@ -64,7 +63,7 @@ export default {
             defaultMessage: 'Email templates',
           },
           id: 'email-templates',
-          to: `/settings/${pluginId}/email-templates`,
+          to: `/settings/users-permissions/email-templates`,
           async Component() {
             const component = await import(
               /* webpackChunkName: "users-email-settings-page" */ './pages/EmailTemplates'
@@ -80,7 +79,7 @@ export default {
             defaultMessage: 'Advanced Settings',
           },
           id: 'advanced-settings',
-          to: `/settings/${pluginId}/advanced-settings`,
+          to: `/settings/users-permissions/advanced-settings`,
           async Component() {
             const component = await import(
               /* webpackChunkName: "users-advanced-settings-page" */ './pages/AdvancedSettings'
@@ -94,7 +93,7 @@ export default {
     );
 
     app.registerPlugin({
-      id: pluginId,
+      id: 'users-permissions',
       name,
     });
   },
@@ -107,7 +106,7 @@ export default {
         )
           .then(({ default: data }) => {
             return {
-              data: prefixPluginTranslations(data, pluginId),
+              data: prefixPluginTranslations(data, 'users-permissions'),
               locale,
             };
           })

packages/plugins/users-permissions/admin/src/pages/Roles/components/ProtectedCreatePage.js

@@ -2,14 +2,11 @@ import React from 'react';
 
 import { CheckPagePermissions } from '@strapi/helper-plugin';
 
-import { PERMISSIONS } from '../../constants';
+import { PERMISSIONS } from '../../../constants';
+import { CreatePage } from '../pages/CreatePage';
 
-import { CreatePage } from './CreatePage';
+export const ProtectedRolesCreatePage = () => (
-
-const ProtectedRolesCreatePage = () => (
   <CheckPagePermissions permissions={PERMISSIONS.createRole}>
     <CreatePage />
   </CheckPagePermissions>
 );
-
-export default ProtectedRolesCreatePage;

packages/plugins/users-permissions/admin/src/pages/Roles/components/ProtectedEditPage.js

@@ -2,14 +2,11 @@ import React from 'react';
 
 import { CheckPagePermissions } from '@strapi/helper-plugin';
 
-import { PERMISSIONS } from '../../constants';
+import { PERMISSIONS } from '../../../constants';
+import { EditPage } from '../pages/EditPage';
 
-import { EditPage } from './EditPage';
+export const ProtectedRolesEditPage = () => (
-
-const ProtectedRolesEditPage = () => (
   <CheckPagePermissions permissions={PERMISSIONS.updateRole}>
     <EditPage />
   </CheckPagePermissions>
 );
-
-export default ProtectedRolesEditPage;

packages/plugins/users-permissions/admin/src/pages/Roles/components/ProtectedListPage.js

@@ -2,16 +2,13 @@ import React from 'react';
 
 import { CheckPagePermissions } from '@strapi/helper-plugin';
 
-import { PERMISSIONS } from '../../constants';
+import { PERMISSIONS } from '../../../constants';
+import RolesListPage from '../pages/ListPage';
 
-import RolesListPage from './ListPage';
+export const ProtectedRolesListPage = () => {
-
-const ProtectedRolesListPage = () => {
   return (
     <CheckPagePermissions permissions={PERMISSIONS.accessRoles}>
       <RolesListPage />
     </CheckPagePermissions>
   );
 };
-
-export default ProtectedRolesListPage;

packages/plugins/users-permissions/admin/src/pages/Roles/index.js

@@ -4,23 +4,26 @@ import { AnErrorOccurred, CheckPagePermissions } from '@strapi/helper-plugin';
 import { Route, Switch } from 'react-router-dom';
 
 import { PERMISSIONS } from '../../constants';
-import pluginId from '../../pluginId';
 
-import ProtectedRolesCreatePage from './ProtectedCreatePage';
+import { ProtectedRolesCreatePage } from './components/ProtectedCreatePage';
-import ProtectedRolesEditPage from './ProtectedEditPage';
+import { ProtectedRolesEditPage } from './components/ProtectedEditPage';
-import ProtectedRolesListPage from './ProtectedListPage';
+import { ProtectedRolesListPage } from './components/ProtectedListPage';
 
 const Roles = () => {
   return (
     <CheckPagePermissions permissions={PERMISSIONS.accessRoles}>
       <Switch>
         <Route
-          path={`/settings/${pluginId}/roles/new`}
+          path="/settings/users-permissions/roles/new"
           component={ProtectedRolesCreatePage}
           exact
         />
-        <Route path={`/settings/${pluginId}/roles/:id`} component={ProtectedRolesEditPage} exact />
+        <Route
-        <Route path={`/settings/${pluginId}/roles`} component={ProtectedRolesListPage} exact />
+          path="/settings/users-permissions/roles/:id"
+          component={ProtectedRolesEditPage}
+          exact
+        />
+        <Route path="/settings/users-permissions/roles" component={ProtectedRolesListPage} exact />
         <Route path="" component={AnErrorOccurred} />
       </Switch>
     </CheckPagePermissions>

packages/plugins/users-permissions/admin/src/pages/Roles/pages/CreatePage.js

@@ -26,11 +26,10 @@ import { useIntl } from 'react-intl';
 import { useMutation } from 'react-query';
 import { useHistory } from 'react-router-dom';
 
-import UsersPermissions from '../../components/UsersPermissions';
+import UsersPermissions from '../../../components/UsersPermissions';
-import { usePlugins } from '../../hooks';
+import { usePlugins } from '../../../hooks';
-import getTrad from '../../utils/getTrad';
+import getTrad from '../../../utils/getTrad';
-
+import { createRoleSchema } from '../constants';
-import { createRoleSchema } from './constants';
 
 export const CreatePage = () => {
   const { formatMessage } = useIntl();

packages/plugins/users-permissions/admin/src/pages/Roles/pages/EditPage.js

@@ -28,11 +28,10 @@ import { useIntl } from 'react-intl';
 import { useMutation } from 'react-query';
 import { useRouteMatch } from 'react-router-dom';
 
-import UsersPermissions from '../../components/UsersPermissions';
+import UsersPermissions from '../../../components/UsersPermissions';
-import { usePlugins, useFetchRole } from '../../hooks';
+import { usePlugins, useFetchRole } from '../../../hooks';
-import getTrad from '../../utils/getTrad';
+import getTrad from '../../../utils/getTrad';
-
+import { createRoleSchema } from '../constants';
-import { createRoleSchema } from './constants';
 
 export const EditPage = () => {
   const { formatMessage } = useIntl();

packages/plugins/users-permissions/admin/src/pages/Roles/pages/ListPage/components/TableBody.js

@@ -7,8 +7,6 @@ import PropTypes from 'prop-types';
 import { useIntl } from 'react-intl';
 import { useHistory } from 'react-router-dom';
 
-import pluginId from '../../../../pluginId';
-
 const TableBody = ({ sortedRoles, canDelete, permissions, setRoleToDelete, onDelete }) => {
   const { formatMessage } = useIntl();
   const { push } = useHistory();
@@ -23,7 +21,7 @@ const TableBody = ({ sortedRoles, canDelete, permissions, setRoleToDelete, onDel
   };
 
   const handleClickEdit = (id) => {
-    push(`/settings/${pluginId}/roles/${id}`);
+    push(`/settings/users-permissions/roles/${id}`);
   };
 
   return (
@@ -39,7 +37,10 @@ const TableBody = ({ sortedRoles, canDelete, permissions, setRoleToDelete, onDel
           <Td width="30%">
             <Typography>
               {formatMessage(
-                { id: 'Roles.RoleRow.user-count', defaultMessage: '{number, plural, =0 {# user} one {# user} other {# users}}' },
+                {
+                  id: 'Roles.RoleRow.user-count',
+                  defaultMessage: '{number, plural, =0 {# user} one {# user} other {# users}}',
+                },
                 { number: role.nb_users }
               )}
             </Typography>

packages/plugins/users-permissions/admin/src/pages/Roles/pages/ListPage/index.js

@@ -36,9 +36,8 @@ import { useIntl } from 'react-intl';
 import { useMutation, useQuery } from 'react-query';
 import { useHistory } from 'react-router-dom';
 
-import { PERMISSIONS } from '../../../constants';
+import { PERMISSIONS } from '../../../../constants';
-import pluginId from '../../../pluginId';
+import { getTrad } from '../../../../utils';
-import { getTrad } from '../../../utils';
 
 import TableBody from './components/TableBody';
 import { deleteData, fetchData } from './utils/api';
@@ -91,7 +90,7 @@ const RoleListPage = () => {
 
   const handleNewRoleClick = () => {
     trackUsage('willCreateRole');
-    push(`/settings/${pluginId}/roles/new`);
+    push(`/settings/users-permissions/roles/new`);
   };
 
   const handleShowConfirmDelete = () => {

packages/plugins/users-permissions/admin/src/pages/Roles/pages/tests/CreatePage.test.js

@@ -8,7 +8,6 @@ import { IntlProvider } from 'react-intl';
 import { QueryClient, QueryClientProvider } from 'react-query';
 import { MemoryRouter, Switch, Route } from 'react-router-dom';
 
-import pluginId from '../../../pluginId';
 import { CreatePage } from '../CreatePage';
 
 jest.mock('@strapi/helper-plugin', () => ({
@@ -17,7 +16,7 @@ jest.mock('@strapi/helper-plugin', () => ({
 }));
 
 const render = () => ({
-  ...renderRTL(<Route path={`/settings/${pluginId}/roles/new`} component={CreatePage} />, {
+  ...renderRTL(<Route path="/settings/users-permissions/roles/new" component={CreatePage} />, {
     wrapper({ children }) {
       const client = new QueryClient({
         defaultOptions: {
@@ -32,7 +31,7 @@ const render = () => ({
           <ThemeProvider theme={lightTheme}>
             <QueryClientProvider client={client}>
               <NotificationsProvider>
-                <MemoryRouter initialEntries={[`/settings/${pluginId}/roles/new`]}>
+                <MemoryRouter initialEntries={[`/settings/users-permissions/roles/new`]}>
                   <Switch>{children}</Switch>
                 </MemoryRouter>
               </NotificationsProvider>

packages/plugins/users-permissions/admin/src/pages/Roles/pages/tests/EditPage.test.js

@@ -13,7 +13,6 @@ import { IntlProvider } from 'react-intl';
 import { QueryClient, QueryClientProvider } from 'react-query';
 import { MemoryRouter, Switch, Route } from 'react-router-dom';
 
-import pluginId from '../../../pluginId';
 import { EditPage } from '../EditPage';
 
 jest.mock('@strapi/helper-plugin', () => ({
@@ -22,7 +21,7 @@ jest.mock('@strapi/helper-plugin', () => ({
 }));
 
 const render = () => ({
-  ...renderRTL(<Route path={`/settings/${pluginId}/roles/:id`} component={EditPage} />, {
+  ...renderRTL(<Route path="/settings/users-permissions/roles/:id" component={EditPage} />, {
     wrapper({ children }) {
       const client = new QueryClient({
         defaultOptions: {
@@ -37,7 +36,7 @@ const render = () => ({
           <ThemeProvider theme={lightTheme}>
             <QueryClientProvider client={client}>
               <NotificationsProvider>
-                <MemoryRouter initialEntries={[`/settings/${pluginId}/roles/1`]}>
+                <MemoryRouter initialEntries={[`/settings/users-permissions/roles/1`]}>
                   <Switch>{children}</Switch>
                 </MemoryRouter>
               </NotificationsProvider>