Merge pull request #10292 from strapi/chore/load-i18n

Load i18n plugin

packages/core/admin/admin/src/StrapiApp.js

@@ -41,10 +41,12 @@ class StrapiApp {
     this.appPlugins = appPlugins || {};
     this.componentApi = Components();
     this.fieldApi = Fields();
+    // FIXME
     this.middlewares = [];
     this.plugins = {};
     this.reducers = { ...reducers };
     this.translations = translations;
+    // this.addMiddleware = this.addMiddleware.bind(this);
     this.getPlugin = this.getPlugin.bind(this);
   }
 

packages/core/admin/admin/src/core/store/configureStore.js

@@ -4,7 +4,7 @@ import createReducer from './createReducer';
 const configureStore = app => {
   const middlewares = [];
 
-  middlewares.forEach(middleware => {
+  app.middlewares.forEach(middleware => {
     middlewares.push(middleware());
   });
 

packages/core/admin/admin/src/plugins.js

@@ -1,6 +1,7 @@
 // TODO temp file
 import documentationPlugin from '../../../../plugins/documentation/admin/src';
 import graphqlPlugin from '../../../../plugins/graphql/admin/src';
+import i18nPlugin from '../../../../plugins/i18n/admin/src';
 import sentryPlugin from '../../../../plugins/sentry/admin/src';
 import usersPermissionsPlugin from '../../../../plugins/users-permissions/admin/src';
 import cmPlugin from '../../../content-manager/admin/src';
@@ -12,6 +13,7 @@ const plugins = {
   '@strapi/plugin-content-manager': cmPlugin,
   '@strapi/plugin-content-type-builder': ctbPlugin,
   '@strapi/plugin-documentation': documentationPlugin,
+  '@strapi/plugin-i18n': i18nPlugin,
   '@strapi/plugin-email': emailPlugin,
   '@strapi/plugin-upload': uploadPlugin,
   '@strapi/plugin-graphql': graphqlPlugin,

packages/plugins/i18n/admin/src/containers/Initializer.js

@@ -9,15 +9,15 @@ import PropTypes from 'prop-types';
 import pluginId from '../pluginId';
 import useLocales from '../hooks/useLocales';
 
-const Initializer = ({ updatePlugin }) => {
+const Initializer = ({ setPlugin }) => {
   const { isLoading, locales } = useLocales();
   const ref = useRef();
 
-  ref.current = updatePlugin;
+  ref.current = setPlugin;
 
   useEffect(() => {
     if (!isLoading && locales.length > 0) {
-      ref.current(pluginId, 'isReady', true);
+      ref.current(pluginId);
     }
   }, [isLoading, locales]);
 
@@ -25,7 +25,7 @@ const Initializer = ({ updatePlugin }) => {
 };
 
 Initializer.propTypes = {
-  updatePlugin: PropTypes.func.isRequired,
+  setPlugin: PropTypes.func.isRequired,
 };
 
 export default Initializer;

packages/plugins/i18n/admin/src/containers/SettingsPage/tests/SettingsPage.test.js

@@ -1,10 +1,7 @@
 /* eslint-disable react/prop-types */
 
 import React from 'react';
-import { createStore } from 'redux';
+import { createStore, combineReducers } from 'redux';
-import { combineReducers } from 'redux-immutable';
-import { fromJS } from 'immutable';
-
 import { Provider } from 'react-redux';
 import { request, useUserPermissions } from '@strapi/helper-plugin';
 import { fireEvent, render, screen, within, waitFor } from '@testing-library/react';
@@ -14,13 +11,13 @@ import LocaleSettingsPage from '..';
 // TODO: move to @strapi/helper-plugin
 import themes from '../../../../../../../core/admin/admin/src/themes';
 import i18nReducers, { initialState } from '../../../hooks/reducers';
+import pluginId from '../../../pluginId';
 
 const TestWrapper = ({ children }) => {
   const queryClient = new QueryClient();
 
-  const initialStoreState = fromJS(initialState);
   const rootReducer = combineReducers(i18nReducers);
-  const store = createStore(rootReducer, initialStoreState);
+  const store = createStore(rootReducer, { [`${pluginId}_locales`]: initialState });
 
   return (
     <Provider store={store}>

packages/plugins/i18n/admin/src/hooks/useHasI18n/index.js

@@ -2,7 +2,7 @@ import { useSelector } from 'react-redux';
 import get from 'lodash/get';
 
 const selectContentManagerListViewPluginOptions = state =>
-  state.get('content-manager_listView').contentType.pluginOptions;
+  state['content-manager_listView'].contentType.pluginOptions;
 
 const useHasI18n = () => {
   const pluginOptions = useSelector(selectContentManagerListViewPluginOptions);

packages/plugins/i18n/admin/src/hooks/useLocales/index.js

@@ -22,8 +22,8 @@ const fetchLocalesList = async () => {
 
 const useLocales = () => {
   const dispatch = useDispatch();
-  const locales = useSelector(state => state.get('i18n_locales').locales);
+  const locales = useSelector(state => state.i18n_locales.locales);
-  const isLoading = useSelector(state => state.get('i18n_locales').isLoading);
+  const isLoading = useSelector(state => state.i18n_locales.isLoading);
 
   useEffect(() => {
     fetchLocalesList().then(locales => dispatch({ type: RESOLVE_LOCALES, locales }));

packages/plugins/i18n/admin/src/index.js

@@ -18,23 +18,29 @@ import LOCALIZED_FIELDS from './utils/localizedFields';
 import i18nReducers from './hooks/reducers';
 import DeleteModalAdditionalInfos from './components/DeleteModalAdditionalInfos';
 
-export default strapi => {
+const pluginDescription = pluginPkg.strapi.description || pluginPkg.description;
-  const pluginDescription = pluginPkg.strapi.description || pluginPkg.description;
+const icon = pluginPkg.strapi.icon;
+const name = pluginPkg.strapi.name;
 
+export default {
+  register(app) {
+    // FIXME
     middlewares.forEach(middleware => {
-    strapi.middlewares.add(middleware);
+      app.addMiddleware(middleware);
     });
 
-  const plugin = {
+    app.addReducers(i18nReducers);
+
+    app.registerPlugin({
       description: pluginDescription,
-    icon: pluginPkg.strapi.icon,
+      icon,
       id: pluginId,
+      initializer: Initializer,
       isReady: false,
       isRequired: pluginPkg.strapi.required || false,
       mainComponent: null,
-    name: pluginPkg.strapi.name,
+      name,
       pluginLogo,
-    preventComponentRendering: false,
       settings: {
         global: {
           links: [
@@ -52,7 +58,8 @@ export default strapi => {
         },
       },
       trads,
-    reducers: i18nReducers,
+    });
+  },
   boot(app) {
     const ctbPlugin = app.getPlugin('content-type-builder');
     const cmPlugin = app.getPlugin('content-manager');
@@ -162,8 +169,4 @@ export default strapi => {
       });
     }
   },
-    initializer: Initializer,
-  };
-
-  return strapi.registerPlugin(plugin);
 };

packages/plugins/i18n/admin/src/middlewares/addCommonFieldsToInitialDataMiddleware.js

@@ -28,8 +28,9 @@ const addCommonFieldsToInitialDataMiddleware = () => ({ getState, dispatch }) =>
     return next(action);
   }
 
-  const cmDataStore = getState().get('content-manager_editViewCrudReducer');
+  const store = getState();
-  const cmLayoutStore = getState().get('content-manager_editViewLayoutManager');
+  const cmDataStore = store['content-manager_editViewCrudReducer'];
+  const cmLayoutStore = store['content-manager_editViewLayoutManager'];
   const { contentTypeDataStructure } = cmDataStore;
   const { currentLayout } = cmLayoutStore;
 

packages/plugins/i18n/admin/src/middlewares/addLocaleColumnToListViewMiddleware.js

@@ -14,7 +14,7 @@ const addLocaleColumnToListViewMiddleware = () => ({ getState }) => next => acti
   }
 
   const store = getState();
-  const { locales } = store.get('i18n_locales');
+  const { locales } = store.i18n_locales;
 
   const locale = {
     key: '__locale_key__',

packages/plugins/i18n/admin/src/middlewares/addLocaleToCollectionTypesMiddleware.js

@@ -7,8 +7,8 @@ const addLocaleToCollectionTypesMiddleware = () => ({ getState }) => next => act
 
   if (action.data.authorizedCtLinks.length) {
     const store = getState();
-    const { locales } = store.get('i18n_locales');
+    const { locales } = store.i18n_locales;
-    const { collectionTypesRelatedPermissions } = store.get('permissionsManager');
+    const { collectionTypesRelatedPermissions } = store.permissionsManager;
 
     action.data.authorizedCtLinks = addLocaleToLinksSearch(
       action.data.authorizedCtLinks,

packages/plugins/i18n/admin/src/middlewares/addLocaleToSingleTypesMiddleware.js

@@ -7,8 +7,8 @@ const addLocaleToSingleTypesMiddleware = () => ({ getState }) => next => action
 
   if (action.data.authorizedStLinks.length) {
     const store = getState();
-    const { locales } = store.get('i18n_locales');
+    const { locales } = store.i18n_locales;
-    const { collectionTypesRelatedPermissions } = store.get('permissionsManager');
+    const { collectionTypesRelatedPermissions } = store.permissionsManager;
 
     action.data.authorizedStLinks = addLocaleToLinksSearch(
       action.data.authorizedStLinks,

packages/plugins/i18n/admin/src/middlewares/extendCTBAttributeInitialDataMiddleware.js

@@ -4,8 +4,8 @@ const extendCTBAttributeInitialDataMiddleware = () => {
       // the block here is to catch the error when trying to access the state
       // of the ctb when the plugin is not mounted
       try {
-        const hasi18nEnabled = getState().getIn([
+        const store = getState();
-          'content-type-builder_dataManagerProvider',
+        const hasi18nEnabled = store['content-type-builder_dataManagerProvider'].getIn([
           'modifiedData',
           'contentType',
           'schema',

packages/plugins/i18n/admin/src/middlewares/tests/addCommonFieldsToInitialDataMiddleware.test.js

@@ -14,12 +14,13 @@ describe('i18n | middlewares | addCommonFieldsToInitialDataMiddleware', () => {
   const dispatch = jest.fn();
 
   beforeEach(() => {
-    const store = new Map();
+    const store = {};
 
-    store.set('content-manager_editViewCrudReducer', {
+    store['content-manager_editViewCrudReducer'] = {
       contentTypeDataStructure: { name: 'test', common: 'common default value' },
-    });
+    };
-    store.set('content-manager_editViewLayoutManager', {
+
+    store['content-manager_editViewLayoutManager'] = {
       currentLayout: {
         components: {},
         contentType: {
@@ -30,7 +31,7 @@ describe('i18n | middlewares | addCommonFieldsToInitialDataMiddleware', () => {
           },
         },
       },
-    });
+    };
 
     getState = () => store;
   });

packages/plugins/i18n/admin/src/middlewares/tests/addLocaleColumnToListViewMiddleware.test.js

@@ -4,9 +4,9 @@ describe('addLocaleColumnToListViewMiddleware', () => {
   let getState;
 
   beforeEach(() => {
-    const store = new Map();
+    const store = {};
 
-    store.set('i18n_locales', { locales: [] });
+    store.i18n_locales = { locales: [] };
 
     getState = () => store;
   });

packages/plugins/i18n/admin/src/middlewares/tests/addLocaleToCollectionTypesMiddleware.test.js

@@ -4,17 +4,18 @@ describe('i18n | middlewares | addLocaleToCollectionTypesMiddleware', () => {
   let getState;
 
   beforeEach(() => {
-    const store = new Map();
+    const store = {
-    store.set('i18n_locales', { locales: [] });
+      i18n_locales: { locales: [] },
-    store.set('permissionsManager', { userPermissions: [] });
+      permissionsManager: {
-    store.set('permissionsManager', {
+        userPermissions: [],
         collectionTypesRelatedPermissions: {
           test: {
             'plugins::content-manager.explorer.read': [],
             'plugins::content-manager.explorer.create': [],
           },
         },
-    });
+      },
+    };
 
     getState = () => store;
   });
@@ -75,17 +76,19 @@ describe('i18n | middlewares | addLocaleToCollectionTypesMiddleware', () => {
   });
 
   it('should add a search key with the default locale when the user has the right to read it', () => {
-    const tempStore = new Map();
+    const tempStore = {
-    tempStore.set('i18n_locales', { locales: [{ code: 'en', isDefault: true }] });
+      i18n_locales: { locales: [{ code: 'en', isDefault: true }] },
-    tempStore.set('permissionsManager', { userPermissions: [] });
+      permissionsManager: {
-    tempStore.set('permissionsManager', {
+        userPermissions: [],
         collectionTypesRelatedPermissions: {
           test: {
             'plugins::content-manager.explorer.read': [{ properties: { locales: ['en'] } }],
             'plugins::content-manager.explorer.create': [],
           },
         },
-    });
+      },
+    };
+
     const action = {
       type: 'StrapiAdmin/LeftMenu/SET_CT_OR_ST_LINKS',
       data: {
@@ -113,16 +116,18 @@ describe('i18n | middlewares | addLocaleToCollectionTypesMiddleware', () => {
   });
 
   it('should set the isDisplayed key to false when the user does not have the right to read any locale', () => {
-    const tempStore = new Map();
+    const tempStore = {
-    tempStore.set('i18n_locales', { locales: [{ code: 'en', isDefault: true }] });
+      i18n_locales: { locales: [{ code: 'en', isDefault: true }] },
-    tempStore.set('permissionsManager', { userPermissions: [] });
+      permissionsManager: {
-    tempStore.set('permissionsManager', {
+        userPermissions: [],
         collectionTypesRelatedPermissions: {
           test: {
             'plugins::content-manager.explorer.read': [{ properties: { locales: [] } }],
           },
         },
-    });
+      },
+    };
+
     const action = {
       type: 'StrapiAdmin/LeftMenu/SET_CT_OR_ST_LINKS',
       data: {
@@ -156,17 +161,19 @@ describe('i18n | middlewares | addLocaleToCollectionTypesMiddleware', () => {
   });
 
   it('should keep the previous search', () => {
-    const tempStore = new Map();
+    const tempStore = {
-    tempStore.set('i18n_locales', { locales: [{ code: 'en', isDefault: true }] });
+      i18n_locales: { locales: [{ code: 'en', isDefault: true }] },
-    tempStore.set('permissionsManager', { userPermissions: [] });
+      permissionsManager: {
-    tempStore.set('permissionsManager', {
+        userPermissions: [],
         collectionTypesRelatedPermissions: {
           test: {
             'plugins::content-manager.explorer.read': [{ properties: { locales: ['en'] } }],
             'plugins::content-manager.explorer.create': [],
           },
         },
-    });
+      },
+    };
+
     const action = {
       type: 'StrapiAdmin/LeftMenu/SET_CT_OR_ST_LINKS',
       data: {

packages/plugins/i18n/admin/src/middlewares/tests/addLocaleToSingleTypesMiddleware.test.js

@@ -4,17 +4,18 @@ describe('i18n | middlewares | addLocaleToSingleTypesMiddleware', () => {
   let getState;
 
   beforeEach(() => {
-    const store = new Map();
+    const store = {
-    store.set('i18n_locales', { locales: [] });
+      i18n_locales: { locales: [] },
-    store.set('permissionsManager', { userPermissions: [] });
+      permissionsManager: {
-    store.set('permissionsManager', {
+        userPermissions: [],
         collectionTypesRelatedPermissions: {
           test: {
             'plugins::content-manager.explorer.read': [],
             'plugins::content-manager.explorer.create': [],
           },
         },
-    });
+      },
+    };
 
     getState = () => store;
   });
@@ -75,17 +76,19 @@ describe('i18n | middlewares | addLocaleToSingleTypesMiddleware', () => {
   });
 
   it('should add a search key with the default locale when the user has the right to read it', () => {
-    const tempStore = new Map();
+    const tempStore = {
-    tempStore.set('i18n_locales', { locales: [{ code: 'en', isDefault: true }] });
+      i18n_locales: { locales: [{ code: 'en', isDefault: true }] },
-    tempStore.set('permissionsManager', { userPermissions: [] });
+      permissionsManager: {
-    tempStore.set('permissionsManager', {
+        userPermissions: [],
         collectionTypesRelatedPermissions: {
           test: {
             'plugins::content-manager.explorer.read': [{ properties: { locales: ['en'] } }],
             'plugins::content-manager.explorer.create': [],
           },
         },
-    });
+      },
+    };
+
     const action = {
       type: 'StrapiAdmin/LeftMenu/SET_CT_OR_ST_LINKS',
       data: {
@@ -113,17 +116,28 @@ describe('i18n | middlewares | addLocaleToSingleTypesMiddleware', () => {
   });
 
   it('should set the isDisplayed key to false when the user does not have the right to read any locale', () => {
-    const tempStore = new Map();
+    const tempStore = {
-    tempStore.set('i18n_locales', { locales: [{ code: 'en', isDefault: true }] });
+      i18n_locales: { locales: [{ code: 'en', isDefault: true }] },
-    tempStore.set('permissionsManager', { userPermissions: [] });
+      permissionsManager: {
-    tempStore.set('permissionsManager', {
+        userPermissions: [],
         collectionTypesRelatedPermissions: {
           test: {
             'plugins::content-manager.explorer.read': [{ properties: { locales: [] } }],
             'plugins::content-manager.explorer.create': [],
           },
         },
-    });
+      },
+    };
+    // tempStore.set('i18n_locales', { locales: [{ code: 'en', isDefault: true }] });
+    // tempStore.set('permissionsManager', { userPermissions: [] });
+    // tempStore.set('permissionsManager', {
+    //   collectionTypesRelatedPermissions: {
+    //     test: {
+    //       'plugins::content-manager.explorer.read': [{ properties: { locales: [] } }],
+    //       'plugins::content-manager.explorer.create': [],
+    //     },
+    //   },
+    // });
     const action = {
       type: 'StrapiAdmin/LeftMenu/SET_CT_OR_ST_LINKS',
       data: {
@@ -149,17 +163,28 @@ describe('i18n | middlewares | addLocaleToSingleTypesMiddleware', () => {
   });
 
   it('should keep the previous search', () => {
-    const tempStore = new Map();
+    const tempStore = {
-    tempStore.set('i18n_locales', { locales: [{ code: 'en', isDefault: true }] });
+      i18n_locales: { locales: [{ code: 'en', isDefault: true }] },
-    tempStore.set('permissionsManager', { userPermissions: [] });
+      permissionsManager: {
-    tempStore.set('permissionsManager', {
+        userPermissions: [],
         collectionTypesRelatedPermissions: {
           test: {
             'plugins::content-manager.explorer.read': [{ properties: { locales: ['en'] } }],
             'plugins::content-manager.explorer.create': [],
           },
         },
-    });
+      },
+    };
+    // tempStore.set('i18n_locales', { locales: [{ code: 'en', isDefault: true }] });
+    // tempStore.set('permissionsManager', { userPermissions: [] });
+    // tempStore.set('permissionsManager', {
+    //   collectionTypesRelatedPermissions: {
+    //     test: {
+    //       'plugins::content-manager.explorer.read': [{ properties: { locales: ['en'] } }],
+    //       'plugins::content-manager.explorer.create': [],
+    //     },
+    //   },
+    // });
     const action = {
       type: 'StrapiAdmin/LeftMenu/SET_CT_OR_ST_LINKS',
       data: {

packages/plugins/i18n/admin/src/middlewares/tests/extendCTBAttrributeInitialDataMiddleware.test.js

@@ -49,7 +49,9 @@ describe('i18n | middlewares | extendCTBAttributeInitialDataMiddleware', () => {
         type: 'ContentTypeBuilder/FormModal/SET_ATTRIBUTE_DATA_SCHEMA',
       };
       const getState = jest.fn(() => ({
+        'content-type-builder_dataManagerProvider': {
           getIn: jest.fn(() => false),
+        },
       }));
 
       const next = jest.fn();
@@ -67,7 +69,9 @@ describe('i18n | middlewares | extendCTBAttributeInitialDataMiddleware', () => {
         type: 'ContentTypeBuilder/FormModal/SET_ATTRIBUTE_DATA_SCHEMA',
       };
       const getState = jest.fn(() => ({
+        'content-type-builder_dataManagerProvider': {
           getIn: undefined,
+        },
       }));
 
       const next = jest.fn();
@@ -86,8 +90,10 @@ describe('i18n | middlewares | extendCTBAttributeInitialDataMiddleware', () => {
       type: 'ContentTypeBuilder/FormModal/SET_ATTRIBUTE_DATA_SCHEMA',
     };
     const getState = jest.fn(() => ({
+      'content-type-builder_dataManagerProvider': {
         // i18n is activated
         getIn: jest.fn(() => true),
+      },
     }));
 
     const next = jest.fn();
@@ -108,8 +114,10 @@ describe('i18n | middlewares | extendCTBAttributeInitialDataMiddleware', () => {
       options: { pluginOptions: { pluginTest: { ok: true } } },
     };
     const getState = jest.fn(() => ({
+      'content-type-builder_dataManagerProvider': {
         // i18n is activated
         getIn: jest.fn(() => true),
+      },
     }));
 
     const next = jest.fn();

packages/plugins/i18n/admin/src/selectors/selectCollectionTypesRelatedPermissions.js

@@ -1,4 +1,4 @@
 const selectCollectionTypesRelatedPermissions = state =>
-  state.get('permissionsManager').collectionTypesRelatedPermissions;
+  state.permissionsManager.collectionTypesRelatedPermissions;
 
 export default selectCollectionTypesRelatedPermissions;

packages/plugins/i18n/admin/src/selectors/selectI18nLocales.js

@@ -1,3 +1,3 @@
-const selectI18NLocales = state => state.get('i18n_locales').locales;
+const selectI18NLocales = state => state.i18n_locales.locales;
 
 export default selectI18NLocales;