From 7a4a4b7511593042c186aba930ad9fcdb1da256f Mon Sep 17 00:00:00 2001
From: Thibaut Boustany <thibaut@kastor.fr>
Date: Tue, 12 Jun 2018 17:58:32 +0200
Subject: [PATCH] Use a suspense-like pattern

---
 .../UpdateNotifier/UpdateInstalled.js         |  6 --
 src/components/modals/ReleaseNotes.js         | 56 ++++++++++++-------
 2 files changed, 35 insertions(+), 27 deletions(-)

diff --git a/src/components/UpdateNotifier/UpdateInstalled.js b/src/components/UpdateNotifier/UpdateInstalled.js
index 2a7077d6..b0fbcdc5 100644
--- a/src/components/UpdateNotifier/UpdateInstalled.js
+++ b/src/components/UpdateNotifier/UpdateInstalled.js
@@ -37,12 +37,6 @@ class UpdateInstalled extends PureComponent<Props> {
     }
   }
 
-  showModal = ({ data }) => {
-    const { openModal } = this.props
-
-    openModal(MODAL_RELEASES_NOTES, data)
-  }
-
   render() {
     return null
   }
diff --git a/src/components/modals/ReleaseNotes.js b/src/components/modals/ReleaseNotes.js
index f72e3ea6..62a55912 100644
--- a/src/components/modals/ReleaseNotes.js
+++ b/src/components/modals/ReleaseNotes.js
@@ -21,6 +21,7 @@ type Props = {
 
 type State = {
   markdown: ?string,
+  loading: boolean,
 }
 
 const Notes = styled(Box).attrs({
@@ -150,14 +151,11 @@ const Title = styled(Text).attrs({
 class ReleaseNotes extends PureComponent<Props, State> {
   state = {
     markdown: null,
+    loading: false,
   }
 
-  render() {
-    const { t } = this.props
-    const renderBody = ({ data, onClose }) => {
-      const version = data
-      const { markdown } = this.state
-
+  fetchNotes = version => {
+    if (!this.state.loading) {
       axios
         .get(`https://api.github.com/repos/LedgerHQ/ledger-live-desktop/releases/tags/v${version}`)
         .then(response => {
@@ -165,24 +163,40 @@ class ReleaseNotes extends PureComponent<Props, State> {
 
           this.setState({
             markdown: body,
+            loading: false,
           })
         })
+    }
+  }
 
-      const content = markdown ? (
-        <Notes>
-          <Title>{t('releaseNotes:version', { versionNb: version })}</Title>
-          <ReactMarkdown>{markdown}</ReactMarkdown>
-        </Notes>
-      ) : (
-        <Box horizontal alignItems="center">
-          <Spinner
-            size={32}
-            style={{
-              margin: 'auto',
-            }}
-          />
-        </Box>
-      )
+  render() {
+    const { t } = this.props
+    const renderBody = ({ data, onClose }) => {
+      const version = data
+      const { markdown } = this.state
+      let content
+
+      if (!markdown) {
+        this.fetchNotes(version)
+
+        content = (
+          <Box horizontal alignItems="center">
+            <Spinner
+              size={32}
+              style={{
+                margin: 'auto',
+              }}
+            />
+          </Box>
+        )
+      } else {
+        content = (
+          <Notes>
+            <Title>{t('releaseNotes:version', { versionNb: version })}</Title>
+            <ReactMarkdown>{markdown}</ReactMarkdown>
+          </Notes>
+        )
+      }
 
       return (
         <ModalBody onClose={onClose}>