aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app/components/loading.js
diff options
context:
space:
mode:
authorAlexander Tseung <alextsg@gmail.com>2017-10-20 12:06:14 +0800
committerAlexander Tseung <alextsg@gmail.com>2017-10-20 12:06:14 +0800
commit5a93ec02523e8b54222cc44cba5b80dcf8f07a7a (patch)
treefc15a146111c5081fcfe8787fb12b8b66f5a2ee9 /ui/app/components/loading.js
parent79be956be9f5297d6d601941e50d5ae4eca58560 (diff)
downloadtangerine-wallet-browser-5a93ec02523e8b54222cc44cba5b80dcf8f07a7a.tar.gz
tangerine-wallet-browser-5a93ec02523e8b54222cc44cba5b80dcf8f07a7a.tar.zst
tangerine-wallet-browser-5a93ec02523e8b54222cc44cba5b80dcf8f07a7a.zip
Fix loading animation not showing on network change
Diffstat (limited to 'ui/app/components/loading.js')
-rw-r--r--ui/app/components/loading.js75
1 files changed, 34 insertions, 41 deletions
diff --git a/ui/app/components/loading.js b/ui/app/components/loading.js
index 163792584..e6d841aa0 100644
--- a/ui/app/components/loading.js
+++ b/ui/app/components/loading.js
@@ -1,45 +1,38 @@
-const inherits = require('util').inherits
-const Component = require('react').Component
+const { Component } = require('react')
const h = require('react-hyperscript')
-
-inherits(LoadingIndicator, Component)
-module.exports = LoadingIndicator
-
-function LoadingIndicator () {
- Component.call(this)
-}
-
-LoadingIndicator.prototype.render = function () {
- const { isLoading, loadingMessage } = this.props
-
- return (
- isLoading ? h('.full-flex-height', {
- style: {
- left: '0px',
- zIndex: 10,
- position: 'absolute',
- flexDirection: 'column',
- display: 'flex',
- justifyContent: 'center',
- alignItems: 'center',
- height: '100%',
- width: '100%',
- background: 'rgba(255, 255, 255, 0.8)',
- },
- }, [
- h('img', {
- src: 'images/loading.svg',
- }),
-
- h('br'),
-
- showMessageIfAny(loadingMessage),
- ]) : null
- )
+class LoadingIndicator extends Component {
+ renderMessage () {
+ const { loadingMessage } = this.props
+ return loadingMessage && h('span', loadingMessage)
+ }
+
+ render () {
+ return (
+ h('.full-flex-height', {
+ style: {
+ left: '0px',
+ zIndex: 50,
+ position: 'absolute',
+ flexDirection: 'column',
+ display: 'flex',
+ justifyContent: 'center',
+ alignItems: 'center',
+ height: '100%',
+ width: '100%',
+ background: 'rgba(255, 255, 255, 0.8)',
+ },
+ }, [
+ h('img', {
+ src: 'images/loading.svg',
+ }),
+
+ h('br'),
+
+ this.renderMessage(),
+ ])
+ )
+ }
}
-function showMessageIfAny (loadingMessage) {
- if (!loadingMessage) return null
- return h('span', loadingMessage)
-}
+module.exports = LoadingIndicator