Fix: always redirect index route to accounts page when there are safe…

…s in localstorage (#3399)

* fix:index  redirect happens before checking localstorage for safes

* fix: access local safes directly from localstorage to have value on initial render

* fix: incorrect redirect after adding and then removing a safe

* use local storage service to access added safes

* add to do to use localstorage hook

* use existing localstorage key for added safes

src/pages/index.tsx

@@ -2,25 +2,28 @@ import { useEffect } from 'react'
 import type { NextPage } from 'next'
 import { useRouter } from 'next/router'
 import { AppRoutes } from '@/config/routes'
-import { useHasSafes } from '@/components/welcome/MyAccounts/useAllSafes'
+import { isEmpty } from 'lodash'
+import local from '@/services/local-storage/local'
+import { addedSafesSlice, type AddedSafesState } from '@/store/addedSafesSlice'
 
 const IndexPage: NextPage = () => {
   const router = useRouter()
   const { chain } = router.query
-  const { hasSafes } = useHasSafes()
 
   useEffect(() => {
     if (!router.isReady || router.pathname !== AppRoutes.index) {
       return
     }
-
-    const pathname = hasSafes ? AppRoutes.welcome.accounts : AppRoutes.welcome.index
+    // TODO: Replace with useLocalStorage. For now read directly from localstorage so we have value on first render
+    const addedSafes = local.getItem<AddedSafesState>(addedSafesSlice.name)
+    const hasAddedSafes = addedSafes !== null && !isEmpty(addedSafes)
+    const pathname = hasAddedSafes ? AppRoutes.welcome.accounts : AppRoutes.welcome.index
 
     router.replace({
       pathname,
       query: chain ? { chain } : undefined,
     })
-  }, [router, chain, hasSafes])
+  }, [router, chain])
 
   return <></>
 }