From ee843357aded342cb5268f94a24f31e381fe3077 Mon Sep 17 00:00:00 2001
From: Chika <djchikalkin@gmail.com>
Date: Wed, 14 Oct 2020 13:04:51 +0300
Subject: [PATCH] remove unnecessary lazy loading

---
 src/client/Components/Result.jsx            |  9 +++++++
 src/client/Components/Result/NotFound.js    |  1 -
 src/client/Components/Result/ServerError.js |  1 -
 src/client/Components/Result/index.jsx      | 10 --------
 src/client/Components/Spinner.jsx           | 11 ++++++++
 src/client/Containers/Calculation/index.jsx | 28 +++++++--------------
 src/client/Layout/index.jsx                 |  4 +--
 src/client/common/paths.js                  |  6 ++++-
 8 files changed, 36 insertions(+), 34 deletions(-)
 create mode 100644 src/client/Components/Result.jsx
 delete mode 100644 src/client/Components/Result/NotFound.js
 delete mode 100644 src/client/Components/Result/ServerError.js
 delete mode 100644 src/client/Components/Result/index.jsx
 create mode 100644 src/client/Components/Spinner.jsx

diff --git a/src/client/Components/Result.jsx b/src/client/Components/Result.jsx
new file mode 100644
index 0000000..2b6ed63
--- /dev/null
+++ b/src/client/Components/Result.jsx
@@ -0,0 +1,9 @@
+import { Result } from 'antd';
+import React from 'react';
+
+export default {
+  404: () => <Result status="404" title="404" subTitle="Ой! Тут ничего нет." />,
+  500: () => (
+    <Result status="500" title="500" subTitle={'Ой! Что-то сломалось.'} />
+  ),
+};
diff --git a/src/client/Components/Result/NotFound.js b/src/client/Components/Result/NotFound.js
deleted file mode 100644
index 661cffc..0000000
--- a/src/client/Components/Result/NotFound.js
+++ /dev/null
@@ -1 +0,0 @@
-export { NotFound as default } from '.';
diff --git a/src/client/Components/Result/ServerError.js b/src/client/Components/Result/ServerError.js
deleted file mode 100644
index a8fb54f..0000000
--- a/src/client/Components/Result/ServerError.js
+++ /dev/null
@@ -1 +0,0 @@
-export { ServerError as default } from '.';
diff --git a/src/client/Components/Result/index.jsx b/src/client/Components/Result/index.jsx
deleted file mode 100644
index fd883dd..0000000
--- a/src/client/Components/Result/index.jsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import React from 'react';
-import { Result, Button } from 'antd';
-
-export const NotFound = () => (
-  <Result status="404" title="404" subTitle="Ой! Тут ничего нет." />
-);
-
-export const ServerError = () => (
-  <Result status="500" title="500" subTitle={'Ой! Что-то сломалось.'} />
-);
diff --git a/src/client/Components/Spinner.jsx b/src/client/Components/Spinner.jsx
new file mode 100644
index 0000000..65238a4
--- /dev/null
+++ b/src/client/Components/Spinner.jsx
@@ -0,0 +1,11 @@
+import React from 'react';
+import { Box, Flex } from 'client/UIKit/grid';
+import { Spin } from 'antd';
+
+export default () => (
+  <Box height="100%" py="10px">
+    <Flex justifyContent="center" alignItems="center">
+      <Spin />
+    </Flex>
+  </Box>
+);
diff --git a/src/client/Containers/Calculation/index.jsx b/src/client/Containers/Calculation/index.jsx
index e5eb53a..12d5448 100644
--- a/src/client/Containers/Calculation/index.jsx
+++ b/src/client/Containers/Calculation/index.jsx
@@ -1,16 +1,16 @@
-import { Spin } from 'antd';
 import { LoadingStatus } from 'client/common/loadingStatus';
+import Spinner from 'client/Components/Spinner';
 import { withStoreModal } from 'client/hocs/withStore';
 import { useStores } from 'client/hooks/useStores';
 import CalculationService from 'client/services/CalculationService';
 import { Box, Flex } from 'client/UIKit/grid';
 import initialOptionsMap from 'core/Data/initialOptionsMap';
 import staticEntitiesList from 'core/Data/staticEntitiesList';
-import React, { lazy, Suspense, useEffect, useState } from 'react';
-const Results = lazy(() => import('./Results'));
-const Sections = lazy(() => import('./Sections'));
-const ServerError = lazy(() => import('client/Components/Result/ServerError'));
-const Modal = lazy(() => import('client/Elements/Modal'));
+import React, { useEffect, useState } from 'react';
+import Result from 'client/Components/Result';
+import Modal from 'client/Elements/Modal';
+import Results from './Results';
+import Sections from './Sections';
 
 const Calculation = () => {
   const [status, setStatus] = useState(LoadingStatus.loading);
@@ -45,28 +45,18 @@ const Calculation = () => {
         },
       )
       .catch(err => {
-        console.log('Calculation -> err', err);
         setStatus(LoadingStatus.error);
         throw err;
       });
   }, []);
 
   if (status === LoadingStatus.loading) {
-    return (
-      <Box height="100%" py="10px">
-        <Flex justifyContent="center" alignItems="center">
-          <Spin />
-        </Flex>
-      </Box>
-    );
+    return <Spinner />;
   }
 
   if (status === LoadingStatus.error) {
-    return (
-      <Suspense>
-        <ServerError />
-      </Suspense>
-    );
+    const ServerError = Result[500];
+    return <ServerError />;
   }
 
   const ModalComponent = withStoreModal(Modal);
diff --git a/src/client/Layout/index.jsx b/src/client/Layout/index.jsx
index 6e1bb8b..a99a13f 100644
--- a/src/client/Layout/index.jsx
+++ b/src/client/Layout/index.jsx
@@ -6,6 +6,7 @@ import React, { Suspense } from 'react';
 import { Route, Switch } from 'react-router-dom';
 import styled from 'styled-components';
 import Logo from './Logo';
+import Spinner from 'client/Components/Spinner';
 
 const HeaderContent = styled(Flex)`
   background: ${`linear-gradient(90deg,
@@ -58,10 +59,9 @@ const Header = () => (
   </header>
 );
 
-//TODO: fallback
 const Content = () => (
   <Box style={styles.root}>
-    <Suspense fallback={null}>
+    <Suspense fallback={<Spinner />}>
       <Switch>
         {paths.map((path, i) => (
           <Route
diff --git a/src/client/common/paths.js b/src/client/common/paths.js
index 3d9b0b0..6117d13 100644
--- a/src/client/common/paths.js
+++ b/src/client/common/paths.js
@@ -1,6 +1,10 @@
 import React from 'react';
 
-const NotFound = React.lazy(() => import('client/Components/Result/NotFound'));
+const NotFound = React.lazy(() =>
+  import('client/Components/Result').then(module => ({
+    default: module.default[404],
+  })),
+);
 const Calculation = React.lazy(() => import('client/Containers/Calculation'));
 
 const paths = [