From 72b5120bbcfa22c67112099a18437e1e064d9983 Mon Sep 17 00:00:00 2001
From: Vladimir Volek <vladimir.volek@satoshilabs.com>
Date: Tue, 6 Nov 2018 13:15:12 +0100
Subject: [PATCH] Added image preloader

---
 src/support/ImagesPreloader.js | 25 +++++++++++++++++++++++++
 src/views/index.js             |  2 ++
 2 files changed, 27 insertions(+)
 create mode 100644 src/support/ImagesPreloader.js

diff --git a/src/support/ImagesPreloader.js b/src/support/ImagesPreloader.js
new file mode 100644
index 00000000..286c78ed
--- /dev/null
+++ b/src/support/ImagesPreloader.js
@@ -0,0 +1,25 @@
+import React, { Component } from 'react';
+import styled from 'styled-components';
+
+const Wrapper = styled.div`
+    display: none;
+`;
+
+const Img = styled.img``;
+
+class ImagesPreloader extends Component {
+    importAll(r) {
+        return r.keys().map(r);
+    }
+
+    render() {
+        const images = this.importAll(require.context('../images', false, /\.(png|jpe?g)$/));
+        return (
+            <Wrapper>
+                {images.map(image => <Img key={image} src={image} />)}
+            </Wrapper>
+        );
+    }
+}
+
+export default ImagesPreloader;
\ No newline at end of file
diff --git a/src/views/index.js b/src/views/index.js
index 36d6617f..b7477bec 100644
--- a/src/views/index.js
+++ b/src/views/index.js
@@ -6,6 +6,7 @@ import { ConnectedRouter } from 'react-router-redux';
 
 // general
 import ErrorBoundary from 'support/ErrorBoundary';
+import ImagesPreloader from 'support/ImagesPreloader';
 import { getPattern } from 'support/routes';
 
 // landing views
@@ -41,6 +42,7 @@ const App = () => (
                 <Route exact path={getPattern('landing-import')} component={ImportView} />
                 <Route>
                     <ErrorBoundary>
+                        <ImagesPreloader />
                         <WalletContainer>
                             <Route exact path={getPattern('wallet-settings')} component={WalletSettings} />
                             <Route exact path={getPattern('wallet-dashboard')} component={WalletDashboard} />