From ff93fc01c8db1e44997118d3493952e4dc95fdc9 Mon Sep 17 00:00:00 2001 From: Vladimir Volek Date: Wed, 31 Oct 2018 12:31:43 +0100 Subject: [PATCH] Added loading state for content --- src/views/Wallet/components/Content/index.js | 27 +++++++++++++++++++- 1 file changed, 26 insertions(+), 1 deletion(-) diff --git a/src/views/Wallet/components/Content/index.js b/src/views/Wallet/components/Content/index.js index 1b2ef54e..b9304072 100644 --- a/src/views/Wallet/components/Content/index.js +++ b/src/views/Wallet/components/Content/index.js @@ -1,6 +1,9 @@ import React from 'react'; import PropTypes from 'prop-types'; import styled from 'styled-components'; +import Loader from 'components/Loader'; +import { FONT_SIZE } from 'config/variables'; +import colors from 'config/colors'; const Wrapper = styled.div` display: flex; @@ -9,16 +12,38 @@ const Wrapper = styled.div` padding: 40px 35px 40px 35px; `; +const Loading = styled.div` + display: flex; + flex: 1; + align-items: center; + justify-content: center; + flex-direction: row; +`; + +const Text = styled.div` + font-size: ${FONT_SIZE.BIG}; + color: ${colors.TEXT_SECONDARY}; + margin-left: 10px; +`; + const Content = ({ children, + isLoading = false, }) => ( - {children} + {!isLoading && children} + {isLoading && ( + + + Initializing accounts + + )} ); Content.propTypes = { children: PropTypes.element, + isLoading: PropTypes.bool, }; export default Content;