display loader on initial load when loadingg defaultSafe

src/routes/index.js

@@ -1,8 +1,9 @@
 // @flow
-import React from 'react'
+import React, { useState } from 'react'
 import { connect } from 'react-redux'
 import { Switch, Redirect, Route } from 'react-router-dom'
 import { defaultSafeSelector } from '~/routes/safeList/store/selectors'
+import Loader from '~/components/Loader'
 import Welcome from './welcome/container'
 import {
   SAFELIST_ADDRESS,
@@ -29,18 +30,28 @@ type RoutesProps = {
   defaultSafe?: string,
 }
 
-const Routes = ({ defaultSafe }: RoutesProps) => (
+const Routes = ({ defaultSafe }: RoutesProps) => {
+  const [isInitialLoad, setIniitialLoad] = useState<boolean>(true)
+
+  return (
     <Switch>
       <Route
         exact
         path="/"
         render={() => {
-        if (typeof defaultSafe === 'undefined') {
-          return 'Loading...'
+          if (!isInitialLoad) {
+            return <Redirect to={WELCOME_ADDRESS} />
           }
+
+          if (typeof defaultSafe === 'undefined') {
+            return <Loader />
+          }
+
+          setIniitialLoad(false)
           if (defaultSafe) {
             return <Redirect to={`${SAFELIST_ADDRESS}/${defaultSafe}`} />
           }
+
           return <Redirect to={WELCOME_ADDRESS} />
         }}
       />
@@ -51,7 +62,8 @@ const Routes = ({ defaultSafe }: RoutesProps) => (
       <Route exact path={OPENING_ADDRESS} component={Opening} />
       <Route exact path={LOAD_ADDRESS} component={Load} />
     </Switch>
-)
+  )
+}
 
 export default connect<Object, Object, ?Function, ?Object>(
   // $FlowFixMe