Added loading state for content

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,
 }) => (
     <Wrapper>
-        {children}
+        {!isLoading && children}
+        {isLoading && (
+            <Loading>
+                <Loader size={30} />
+                <Text>Initializing accounts</Text>
+            </Loading>
+        )}
     </Wrapper>
 );
 
 Content.propTypes = {
     children: PropTypes.element,
+    isLoading: PropTypes.bool,
 };
 
 export default Content;