Multisig modal flow fix

src/components/controller/modal.ctrl.tsx

@@ -4,6 +4,7 @@ import WelcomeModal from '@/components/modals/WelcomeModal';
 import { FirstWelcomeModal } from '@/components/modals/FirstWelcomeModal';
 import { SignWithWalletModal } from '@/components/modals/SignWithWalletModal';
 import { CompleteProfileModal } from '@/components/modals/CompleteProfileModal';
+import { useIsSafeEnvironment } from '@/hooks/useSafeAutoConnect';
 import { useAppDispatch, useAppSelector } from '@/features/hooks';
 import {
 	setShowCompleteProfile,
@@ -31,6 +32,7 @@ const ModalController = () => {
 	const isRegistered = isUserRegistered(userData);
 	const { connector } = useAccount();
 	const isGSafeConnector = connector?.id === 'safe';
+	const isSafeEnv = useIsSafeEnvironment();
 
 	const dispatch = useAppDispatch();
 
@@ -50,7 +52,9 @@ const ModalController = () => {
 
 	//I think we need to handle it in better way
 	useEffect(() => {
-		if (isSignedIn && showSignWithWallet) {
+		// (Mateo): Only make it happen if it's not a gnosis safe environment
+		// we have a different logic for modal management there
+		if (isSignedIn && showSignWithWallet && !isSafeEnv) {
 			setTimeout(() => {
 				dispatch(setShowSignWithWallet(false));
 			}, 300);

src/components/controller/user.ctrl.tsx

@@ -5,15 +5,17 @@ import { setToken, setIsEnabled } from '@/features/user/user.slice';
 import StorageLabel from '@/lib/localStorage';
 import { fetchUserByAddress } from '@/features/user/user.thunks';
 import { getTokens } from '@/helpers/user';
+import { useIsSafeEnvironment } from '@/hooks/useSafeAutoConnect';
 
 const UserController = () => {
 	const { address, isConnected } = useAccount();
 	const dispatch = useAppDispatch();
+	const isSafeEnv = useIsSafeEnvironment();
 	const { connect, connectors } = useConnect();
 
 	const isMounted = useRef(false);
-
 	useEffect(() => {
+		if (isSafeEnv === null) return; // gsafe check not ready
 		if (isConnected) return;
 
 		const isPrevConnected = localStorage.getItem(
@@ -36,6 +38,7 @@ const UserController = () => {
 	}, []);
 
 	useEffect(() => {
+		if (isSafeEnv === null) return; // not ready
 		if (isMounted.current) {
 			if (!address) {
 				// Case when wallet is locked

src/components/modals/SignWithWalletModal.tsx

@@ -225,6 +225,7 @@ export const SignWithWalletModal: FC<IProps> = ({
 							if (currentMultisigSession) return closeModal();
 							return startSignature(connector, true);
 						} else if (isGSafeConnector) {
+							reset();
 							return setSafeSecondaryConnection(true);
 						}
 						await startSignature();

src/hooks/useSafeAutoConnect.tsx

@@ -24,7 +24,7 @@ function useSafeAutoConnect() {
 
 function useIsSafeEnvironment() {
 	const { connectors } = useConnect();
-	const [isSafe, setIsSafe] = useState(false);
+	const [isSafe, setIsSafe] = useState<null | Boolean>(null);
 
 	useEffect(() => {
 		setIsSafe(checkForSafeConnector(connectors));