lazy load some stuff

[alttp.git] / resources / js / components / techniques / Dialog.js

diff --git a/resources/js/components/techniques/Dialog.js b/resources/js/components/techniques/Dialog.js
index 96eaba5bea842bf2d8155927b7739084caf972d1..eefa9d7fba92bd1599cbf7cbd65fdf7316a764aa 100644 (file)
--- a/resources/js/components/techniques/Dialog.js
+++ b/resources/js/components/techniques/Dialog.js
@@ -3,8 +3,10 @@ import React from 'react';
 import { Modal } from 'react-bootstrap';
 import { useTranslation } from 'react-i18next';
 
-import Form from './Form';
-import LanguageSwitcher from '../app/LanguageSwitcher';
+import Loading from '../common/Loading';
+import LanguageSwitcher from '../../app/LanguageSwitcher';
+
+const Form = React.lazy(() => import('./Form'));
 
 const Dialog = ({
        content,
@@ -24,12 +26,14 @@ const Dialog = ({
                                <LanguageSwitcher />
                        </div>
                </Modal.Header>
-               <Form
-                       content={content}
-                       language={language}
-                       onCancel={onHide}
-                       onSubmit={onSubmit}
-               />
+               <React.Suspense fallback={<Loading />}>
+                       <Form
+                               content={content}
+                               language={language}
+                               onCancel={onHide}
+                               onSubmit={onSubmit}
+                       />
+               </React.Suspense>
        </Modal>;
 };