Rename containers to pages in upload plugin

Signed-off-by: soupette <cyril.lpz@gmail.com>

packages/core/admin/admin/src/components/PrivateRoute/index.js

@@ -32,7 +32,7 @@ const PrivateRoute = ({ component: Component, path, ...rest }) => (
 );
 
 PrivateRoute.propTypes = {
-  component: PropTypes.oneOfType([PropTypes.node, PropTypes.func, PropTypes.element]).isRequired,
+  component: PropTypes.any.isRequired,
   path: PropTypes.string.isRequired,
 };
 

packages/core/admin/admin/src/pages/App/index.js

@@ -4,13 +4,12 @@
  *
  */
 
-import React, { useEffect, useRef, useState, useMemo } from 'react';
+import React, { useEffect, useRef, useState, useMemo, lazy, Suspense } from 'react';
 import PropTypes from 'prop-types';
 import { Switch, Route } from 'react-router-dom';
 import { connect } from 'react-redux';
 import { bindActionCreators, compose } from 'redux';
 import { LoadingIndicatorPage, auth, request, useNotification } from '@strapi/helper-plugin';
-import AuthenticatedApp from '../../components/AuthenticatedApp';
 import PrivateRoute from '../../components/PrivateRoute';
 import AuthPage from '../AuthPage';
 import NotFoundPage from '../NotFoundPage';
@@ -20,6 +19,7 @@ import { getDataSucceeded } from './actions';
 import routes from './utils/routes';
 import { makeUniqueRoutes, createRoute } from '../SettingsPage/utils';
 
+const AuthenticatedApp = lazy(() => import('../../components/AuthenticatedApp'));
 function App(props) {
   const toggleNotification = useNotification();
   const getDataRef = useRef();
@@ -103,22 +103,24 @@ function App(props) {
   }
 
   return (
-    <Wrapper>
-      <Content>
-        <Switch>
-          {authRoutes}
-          <Route
-            path="/auth/:authType"
-            render={routerProps => (
-              <AuthPage {...routerProps} setHasAdmin={setHasAdmin} hasAdmin={hasAdmin} />
-            )}
-            exact
-          />
-          <PrivateRoute path="/" component={AuthenticatedApp} />
-          <Route path="" component={NotFoundPage} />
-        </Switch>
-      </Content>
-    </Wrapper>
+    <Suspense fallback={<LoadingIndicatorPage />}>
+      <Wrapper>
+        <Content>
+          <Switch>
+            {authRoutes}
+            <Route
+              path="/auth/:authType"
+              render={routerProps => (
+                <AuthPage {...routerProps} setHasAdmin={setHasAdmin} hasAdmin={hasAdmin} />
+              )}
+              exact
+            />
+            <PrivateRoute path="/" component={AuthenticatedApp} />
+            <Route path="" component={NotFoundPage} />
+          </Switch>
+        </Content>
+      </Wrapper>
+    </Suspense>
   );
 }
 

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

@@ -84,7 +84,7 @@ describe('ADMIN | StrapiApp', () => {
         </body>,
         "container": <div>
           <div
-            class="sc-hgKjYe bLgkBB"
+            class="sc-hZpJuv jvxjeo"
           />
           <div
             class="Loader-sc-1xt0x01-0 JXMaR"

packages/core/upload/admin/src/components/HomePageModalStepper/index.js

@@ -1,7 +1,10 @@
 import React, { useCallback, useEffect, useState, useReducer, useRef } from 'react';
 import axios from 'axios';
 import PropTypes from 'prop-types';
-import { isEqual, isEmpty, get, set } from 'lodash';
+import isEqual from 'lodash/isEqual';
+import isEmpty from 'lodash/isEmpty';
+import get from 'lodash/get';
+import set from 'lodash/set';
 import { useIntl } from 'react-intl';
 import {
   Modal,
@@ -15,12 +18,12 @@ import { Button } from '@buffetjs/core';
 import pluginId from '../../pluginId';
 import { getFilesToDownload, getTrad, getYupError, urlSchema } from '../../utils';
 import { useAppContext } from '../../hooks';
-import ModalHeader from '../../components/ModalHeader';
+import ModalHeader from '../ModalHeader';
 import stepper from './stepper';
 import init from './init';
 import reducer, { initialState } from './reducer';
 
-const ModalStepper = ({
+const HomePageModalStepper = ({
   initialFileToEdit,
   initialStep,
   isOpen,
@@ -619,7 +622,7 @@ const ModalStepper = ({
   );
 };
 
-ModalStepper.defaultProps = {
+HomePageModalStepper.defaultProps = {
   initialFileToEdit: null,
   initialStep: 'browse',
   onClosed: () => {},
@@ -627,7 +630,7 @@ ModalStepper.defaultProps = {
   onToggle: () => {},
 };
 
-ModalStepper.propTypes = {
+HomePageModalStepper.propTypes = {
   initialFileToEdit: PropTypes.object,
   initialStep: PropTypes.string,
   isOpen: PropTypes.bool.isRequired,
@@ -636,4 +639,4 @@ ModalStepper.propTypes = {
   onToggle: PropTypes.func,
 };
 
-export default ModalStepper;
+export default HomePageModalStepper;

packages/core/upload/admin/src/components/HomePageModalStepper/stepper.js

@@ -1,7 +1,7 @@
-import CheckControl from '../../components/CheckControl';
-import EditForm from '../../components/EditForm';
-import UploadForm from '../../components/UploadForm';
-import UploadList from '../../components/UploadList';
+import CheckControl from '../CheckControl';
+import EditForm from '../EditForm';
+import UploadForm from '../UploadForm';
+import UploadList from '../UploadList';
 import { getTrad } from '../../utils';
 
 const stepper = {

packages/core/upload/admin/src/components/HomePageModalStepper/tests/reducer.test.js

@@ -1,7 +1,7 @@
 import { fromJS } from 'immutable';
 import reducer from '../reducer';
 
-describe('UPLOAD | containers | ModalStepper | reducer', () => {
+describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
   describe('default action', () => {
     it('should return the initialState', () => {
       const action = {

packages/core/upload/admin/src/components/Initializer/index.js

@@ -12,6 +12,7 @@ import { request, useNotification } from '@strapi/helper-plugin';
 import pluginId from '../../pluginId';
 import { setFileModelTimestamps } from './actions';
 
+// TODO use the models API and remove this component
 const Initializer = ({ setPlugin }) => {
   const ref = useRef();
   const dispatch = useDispatch();

packages/core/upload/admin/src/components/InputMedia/index.js

@@ -11,12 +11,12 @@ import {
 import pluginPermissions from '../../permissions';
 import { getTrad, formatFileForEditing } from '../../utils';
 import CardControl from '../CardControl';
+import InputModalStepper from '../InputModalStepper';
 import CardControlWrapper from './CardControlWrapper';
 import CardPreviewWrapper from './CardPreviewWrapper';
 import EmptyInputMedia from './EmptyInputMedia';
 import EmptyText from './EmptyText';
 import InputFilePreview from './InputFilePreview';
-import InputModalStepper from '../../containers/InputModalStepper';
 import Name from './Name';
 import Wrapper from './Wrapper';
 import Input from '../Input';

packages/core/upload/admin/src/components/InputModalStepper/InputModalStepper.js

@@ -12,7 +12,7 @@ import {
 import { Button } from '@buffetjs/core';
 import { get, isEmpty, isEqual } from 'lodash';
 import { getRequestUrl, getTrad } from '../../utils';
-import ModalHeader from '../../components/ModalHeader';
+import ModalHeader from "../ModalHeader";
 import pluginId from '../../pluginId';
 import stepper from './stepper';
 import useModalContext from '../../hooks/useModalContext';

packages/core/upload/admin/src/components/InputModalStepper/index.js

@@ -4,8 +4,7 @@ import { useRBAC } from '@strapi/helper-plugin';
 import { DndProvider } from 'react-dnd';
 import HTML5Backend from 'react-dnd-html5-backend';
 import { omit } from 'lodash';
-import DragLayer from '../../components/DragLayer';
-
+import DragLayer from '../DragLayer';
 import pluginPermissions from '../../permissions';
 import InputModalStepper from './InputModalStepper';
 import InputModalStepperProvider from '../InputModalStepperProvider';

packages/core/upload/admin/src/components/InputModalStepper/stepper.js

@@ -1,10 +1,10 @@
-import CheckControl from '../../components/CheckControl';
-import EditForm from '../../components/EditForm';
+import CheckControl from '../CheckControl';
+import EditForm from '../EditForm';
 import getTrad from '../../utils/getTrad';
-import ListModal from '../../components/ListModal';
+import ListModal from '../ListModal';
 import Search from './Search';
-import UploadForm from '../../components/UploadForm';
-import UploadList from '../../components/UploadList';
+import UploadForm from '../UploadForm';
+import UploadList from '../UploadList';
 
 const stepper = {
   list: {

packages/core/upload/admin/src/components/InputModalStepperProvider/tests/reducer.test.js

@@ -1,6 +1,6 @@
 import reducer from '../reducer';
 
-describe('UPLOAD | containers | ModalStepper | reducer', () => {
+describe('UPLOAD | components | InputModalStepperProvider | reducer', () => {
   describe('ADD_FILES_TO_UPLOAD', () => {
     it('should add the files to the empty filesToUpload array and update the current step', () => {
       const action = {

packages/core/upload/admin/src/hooks/useSelectTimestamps/index.js

@@ -1,5 +1,5 @@
 import { useSelector } from 'react-redux';
-import selectFileModelTimestamps from '../../containers/Initializer/selectors';
+import selectFileModelTimestamps from '../../components/Initializer/selectors';
 
 const useSelectTimestamps = () => {
   const timestamps = useSelector(selectFileModelTimestamps);

packages/core/upload/admin/src/index.js

@@ -9,11 +9,11 @@ import { CheckPagePermissions } from '@strapi/helper-plugin';
 import pluginPkg from '../../package.json';
 import pluginLogo from './assets/images/logo.svg';
 import pluginPermissions from './permissions';
-import App from './containers/App';
-import Initializer from './containers/Initializer';
-import SettingsPage from './containers/SettingsPage';
+import Initializer from './components/Initializer';
 import InputMedia from './components/InputMedia';
-import InputModalStepper from './containers/InputModalStepper';
+import InputModalStepper from './components/InputModalStepper';
+import App from './pages/App';
+import SettingsPage from './pages/SettingsPage';
 import reducers from './reducers';
 import trads from './translations';
 import pluginId from './pluginId';

packages/core/upload/admin/src/pages/HomePage/index.js

@@ -16,7 +16,7 @@ import { formatFileForEditing, getRequestUrl, getTrad } from '../../utils';
 import { useAppContext, useSelectTimestamps } from '../../hooks';
 import Container from '../../components/Container';
 import HomePageContent from './HomePageContent';
-import ModalStepper from '../ModalStepper';
+import HomePageModalStepper from '../../components/HomePageModalStepper';
 import { generateStringFromParams, getHeaderLabel } from './utils';
 import init from './init';
 import reducer, { initialState } from './reducer';
@@ -349,7 +349,7 @@ const HomePage = () => {
     <Container>
       <Header {...headerProps} isLoading={isLoading} />
       {content}
-      <ModalStepper
+      <HomePageModalStepper
         initialFileToEdit={fileToEdit}
         initialStep={modalInitialStep}
         isOpen={isModalOpen}

packages/core/upload/admin/src/pages/HomePage/tests/reducer.test.js

@@ -1,7 +1,7 @@
 import { fromJS } from 'immutable';
 import reducer, { initialState } from '../reducer';
 
-describe('Upload | containers | HomePage | reducer', () => {
+describe('Upload | pages | HomePage | reducer', () => {
   describe('GET_DATA', () => {
     it('should set isLoading to true', () => {
       const state = fromJS({

packages/core/upload/admin/src/pages/HomePage/utils/tests/generateParamsFromQuery.test.js

@@ -1,6 +1,6 @@
 import generateParamsFromQuery from '../generateParamsFromQuery';
 
-describe('MEDIA LIBRARY | containers | HomePage | utils', () => {
+describe('MEDIA LIBRARY | pages | HomePage | utils', () => {
   describe('generateParamsFromQuery', () => {
     it('should return the initial object if search is empty', () => {
       const search = '';

packages/core/upload/admin/src/pages/HomePage/utils/tests/generateStringFromParams.test.js

@@ -1,6 +1,6 @@
 import generateStringFromParams from '../generateStringFromParams';
 
-describe('MEDIA LIBRARY | containers | HomePage | utils', () => {
+describe('MEDIA LIBRARY | pages | HomePage | utils', () => {
   describe('generateStringFromParams', () => {
     it('should return a string with query params if query is empty', () => {
       const search = '';

packages/core/upload/admin/src/pages/HomePage/utils/tests/getHeaderLabel.test.js

@@ -1,6 +1,6 @@
 import getHeaderLabel from '../getHeaderLabel';
 
-describe('MEDIA LIBRARY | containers | HomePage | utils', () => {
+describe('MEDIA LIBRARY | pages | HomePage | utils', () => {
   describe('getHeaderLabel', () => {
     it('should return the header translation with this empty suffix if count is 0', () => {
       const count = 0;

packages/core/upload/admin/src/pages/SettingsPage/tests/reducer.test.js

@@ -1,7 +1,7 @@
 import { fromJS } from 'immutable';
 import reducer from '../reducer';
 
-describe('MEDIA LIBRARY | containers | SettingsPage | reducer', () => {
+describe('MEDIA LIBRARY | pages | SettingsPage | reducer', () => {
   describe('CANCEL_CHANGES', () => {
     it('should set the modifiedData with the initialData', () => {
       const action = {

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

@@ -1,4 +1,4 @@
-import initializerReducer from './containers/Initializer/reducer';
+import initializerReducer from './components/Initializer/reducer';
 import pluginId from './pluginId';
 
 const reducers = {

packages/core/upload/admin/src/utils/tests/createNewFilesToUploadArray.test.js

@@ -1,6 +1,6 @@
 import createNewFilesToUploadArray from '../createNewFilesToUploadArray';
 
-describe('UPLOAD | containers | ModalStepper | utils', () => {
+describe('UPLOAD | utils', () => {
   describe('createNewFilesToUploadArray', () => {
     it('should create an array containing the data', () => {
       const data = {

packages/core/upload/admin/src/utils/tests/generatePageFromStart.test.js

@@ -1,6 +1,6 @@
 import generatePageFromStart from '../generatePageFromStart';
 
-describe('MEDIA LIBRARY | containers | HomePage | utils', () => {
+describe('MEDIA LIBRARY | utils', () => {
   describe('generatePageFromStart', () => {
     it('should return 1 if start is 0 and limit is 10', () => {
       const start = 0;

packages/core/upload/admin/src/utils/tests/generateStartFromPage.test.js

@@ -1,6 +1,6 @@
 import generateStartFromPage from '../generateStartFromPage';
 
-describe('MEDIA LIBRARY | containers | HomePage | utils', () => {
+describe('MEDIA LIBRARY | utils', () => {
   describe('generateStartFromPage', () => {
     it('should return 0 if page is 1 and limit is 10', () => {
       const page = 1;