From 030af65cd3864ce8c069b8b4a34d63c1eecabe53 Mon Sep 17 00:00:00 2001
From: Mael <mael.thomas@data.gouv.fr>
Date: Sat, 10 Nov 2018 16:02:31 +0000
Subject: [PATCH] =?UTF-8?q?Chargement=20diff=C3=A9r=C3=A9=20de=20Monaco=20?=
 =?UTF-8?q?Editor?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                         |  4 ++--
 source/components/rule/RuleSource.js | 19 +++++++++++--------
 yarn.lock                            | 23 +++++++++++++++--------
 3 files changed, 28 insertions(+), 18 deletions(-)

diff --git a/package.json b/package.json
index e37b71c3c..befea7229 100644
--- a/package.json
+++ b/package.json
@@ -32,10 +32,10 @@
 		"raven-for-redux": "^1.3.1",
 		"raven-js": "^3.26.4",
 		"rc-progress": "^2.2.6",
-		"react": "^16.5.2",
+		"react": "^16.6.1",
 		"react-addons-css-transition-group": "^15.6.2",
 		"react-color": "^2.14.0",
-		"react-dom": "^16.5.2",
+		"react-dom": "^16.6.1",
 		"react-easy-emoji": "^1.2.0",
 		"react-helmet": "^5.2.0",
 		"react-highlight-words": "^0.11.0",
diff --git a/source/components/rule/RuleSource.js b/source/components/rule/RuleSource.js
index 8037bfaaa..2326d87be 100644
--- a/source/components/rule/RuleSource.js
+++ b/source/components/rule/RuleSource.js
@@ -1,10 +1,11 @@
-import React, { Component } from 'react'
+import React, { Component, Suspense } from 'react'
 import yaml from 'js-yaml'
 import rules from 'Règles/base.yaml'
 import emoji from 'react-easy-emoji'
-import MonacoEditor from 'react-monaco-editor'
 import { buildDottedName } from 'Engine/rules'
 
+let MonacoEditor = React.lazy(() => import('react-monaco-editor'))
+
 export default class Source extends Component {
 	render() {
 		let { dottedName } = this.props,
@@ -16,12 +17,14 @@ export default class Source extends Component {
 					{emoji('⛰️ ')}
 					Source de <code>{dottedName}</code>
 				</h2>
-				<MonacoEditor
-					height="800"
-					width="1000"
-					language={'yaml'}
-					value={yaml.safeDump(source)}
-				/>
+				<Suspense fallback={<div>Chargement du code source...</div>}>
+					<MonacoEditor
+						height="800"
+						width="1000"
+						language={'yaml'}
+						value={yaml.safeDump(source)}
+					/>
+				</Suspense>
 			</div>
 		)
 	}
diff --git a/yarn.lock b/yarn.lock
index d0d5a43c0..627aba03c 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6673,14 +6673,14 @@ react-color@^2.14.0:
     reactcss "^1.2.0"
     tinycolor2 "^1.4.1"
 
-react-dom@^16.5.2:
-  version "16.6.0"
-  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.6.0.tgz#6375b8391e019a632a89a0988bce85f0cc87a92f"
+react-dom@^16.6.1:
+  version "16.6.1"
+  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.6.1.tgz#5476e08694ae504ae385a28b62ecc4fe3a29add9"
   dependencies:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
     prop-types "^15.6.2"
-    scheduler "^0.10.0"
+    scheduler "^0.11.0"
 
 react-easy-emoji@^1.2.0:
   version "1.2.0"
@@ -6872,14 +6872,14 @@ react-virtualized@^9.20.0:
     prop-types "^15.6.0"
     react-lifecycles-compat "^3.0.4"
 
-react@^16.5.2:
-  version "16.6.0"
-  resolved "https://registry.yarnpkg.com/react/-/react-16.6.0.tgz#b34761cfaf3e30f5508bc732fb4736730b7da246"
+react@^16.6.1:
+  version "16.6.1"
+  resolved "https://registry.yarnpkg.com/react/-/react-16.6.1.tgz#ee2aef4f0a09e494594882029821049772f915fe"
   dependencies:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
     prop-types "^15.6.2"
-    scheduler "^0.10.0"
+    scheduler "^0.11.0"
 
 reactcss@^1.2.0:
   version "1.2.3"
@@ -7367,6 +7367,13 @@ scheduler@^0.10.0:
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
 
+scheduler@^0.11.0:
+  version "0.11.0"
+  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.11.0.tgz#def1f1bfa6550cc57981a87106e65e8aea41a6b5"
+  dependencies:
+    loose-envify "^1.1.0"
+    object-assign "^4.1.1"
+
 schema-utils@^0.4.0, schema-utils@^0.4.4, schema-utils@^0.4.5:
   version "0.4.7"
   resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-0.4.7.tgz#ba74f597d2be2ea880131746ee17d0a093c68187"