Reset Safe state when daoAddress is goes null

src/pages/DAOController.tsx

@@ -5,6 +5,7 @@ import { toast } from 'react-toastify';
 import useDAOController from '../hooks/DAO/useDAOController';
 import { useUpdateSafeData } from '../hooks/utils/useUpdateSafeData';
 import { useFractal } from '../providers/App/AppProvider';
+import { useRolesState } from '../state/useRolesState';
 import LoadingProblem from './LoadingProblem';
 
 const useTemporaryProposals = () => {
@@ -33,9 +34,12 @@ const useTemporaryProposals = () => {
 
 export default function DAOController() {
   const { errorLoading, wrongNetwork, invalidQuery } = useDAOController();
+  const { resetHatsStore } = useRolesState();
+
   useUpdateSafeData();
   const {
-    node: { daoName },
+    node: { daoName, daoAddress },
+    action,
   } = useFractal();
 
   useTemporaryProposals();
@@ -50,6 +54,16 @@ export default function DAOController() {
     };
   }, [daoName]);
 
+  // Reset Safe state when daoAddress is goes null
+  useEffect(() => {
+    console.log({daoAddress});
+
+    if (!daoAddress) {
+      action.resetSafeState();
+      resetHatsStore();
+    }
+  } ,[action, resetHatsStore, daoName, daoAddress]);
+
   let display;
 
   // the order of the if blocks of these next three error states matters

src/pages/home/HomePage.tsx

@@ -1,28 +1,12 @@
 import { Flex, Button, Text, Spacer, Hide } from '@chakra-ui/react';
-import { useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Link } from 'react-router-dom';
 import { DecentSignature } from '../../assets/theme/custom/icons/DecentSignature';
 import { BASE_ROUTES } from '../../constants/routes';
-import { useFractal } from '../../providers/App/AppProvider';
-import { useRolesState } from '../../state/useRolesState';
 import { MySafes } from './MySafes';
 
 export default function HomePage() {
-  const {
-    node: { daoAddress },
-    action,
-  } = useFractal();
-
   const { t } = useTranslation('home');
-  const { resetHatsStore } = useRolesState();
-
-  useEffect(() => {
-    if (daoAddress) {
-      action.resetSafeState();
-      resetHatsStore();
-    }
-  }, [daoAddress, action, resetHatsStore]);
 
   return (
     <Flex