From fed8c6b0ea1f6e15c3c748828c15d9758846340b Mon Sep 17 00:00:00 2001
From: Lukas Martinelli <me@lukasmartinelli.ch>
Date: Thu, 22 Dec 2016 14:21:53 +0100
Subject: [PATCH] Delay modal rendering until open

---
 src/components/Toolbar.jsx | 35 +++++++++++++++++++----------------
 1 file changed, 19 insertions(+), 16 deletions(-)

diff --git a/src/components/Toolbar.jsx b/src/components/Toolbar.jsx
index 1c63828..462328d 100644
--- a/src/components/Toolbar.jsx
+++ b/src/components/Toolbar.jsx
@@ -121,22 +121,25 @@ export default class Toolbar extends React.Component {
       top: 0,
       backgroundColor: colors.black
     }}>
-      <SettingsModal
-        mapStyle={this.props.mapStyle}
-        onStyleChanged={this.props.onStyleChanged}
-        isOpen={this.state.openSettingsModal}
-        toggle={() => this.toggleSettings.bind(this)}
-      />
-      <OpenModal
-        isOpen={this.state.openOpenModal}
-        toggle={() => this.toggleOpen.bind(this)}
-      />
-      <SourcesModal
-        mapStyle={this.props.mapStyle}
-        onStyleChanged={this.props.onStyleChanged}
-        isOpen={this.state.openSourcesModal}
-        toggle={() => this.toggleSources.bind(this)}
-      />
+      {this.state.openSettingsModal && <SettingsModal
+          mapStyle={this.props.mapStyle}
+          onStyleChanged={this.props.onStyleChanged}
+          isOpen={this.state.openSettingsModal}
+          toggle={() => this.toggleSettings.bind(this)}
+        />
+      }
+      {this.state.openOpenModal &&<OpenModal
+          isOpen={this.state.openOpenModal}
+          toggle={() => this.toggleOpen.bind(this)}
+        />
+      }
+      {this.state.openSourcesModal && <SourcesModal
+          mapStyle={this.props.mapStyle}
+          onStyleChanged={this.props.onStyleChanged}
+          isOpen={this.state.openSourcesModal}
+          toggle={() => this.toggleSources.bind(this)}
+        />
+      }
       <ToolbarAction style={{
         width: 180,
         textAlign: 'left',