[LC-1467] - fix: Logout Behavior (#880)

* close all modals on logout

* fix weird redirect on logout

* potentially fix hard refresh

* Create quick-mangos-peel.md

Author: gerardopar

.changeset/quick-mangos-peel.md

@@ -0,0 +1,6 @@
+---
+"learn-card-app": patch
+"learn-card-base": patch
+---
+
+fix: Logout Behavior

apps/learn-card-app/src/components/learncard/MyLearnCardModal.tsx

@@ -496,7 +496,9 @@ const MyLearnCardModal: React.FC<MyLearnCardModalProps> = ({
 
                         {!hideLogout && (
                             <button
-                                onClick={() => handleLogout(branding)}
+                                onClick={() =>
+                                    handleLogout(branding, { overrideRedirectUrl: '/login' })
+                                }
                                 className="flex items-center justify-center gap-[5px] py-[10px] text-grayscale-900 font-notoSans text-[20px] disabled:opacity-60"
                                 disabled={isLoggingOut}
                             >

apps/learn-card-app/src/hooks/useLogout.tsx

@@ -1,25 +1,37 @@
-import React, { useEffect, useState } from 'react';
-import { FirebaseAuthentication } from '@capacitor-firebase/authentication';
+import { useState } from 'react';
 import { Capacitor } from '@capacitor/core';
-import authStore from 'learn-card-base/stores/authStore';
-import { SocialLoginTypes } from 'learn-card-base/hooks/useSocialLogins';
-import { LOGIN_REDIRECTS } from 'learn-card-base/constants/redirects';
-import { BrandingEnum } from 'learn-card-base';
-import { pushUtilities } from 'learn-card-base';
+import { useHistory } from 'react-router-dom';
+import { FirebaseAuthentication } from '@capacitor-firebase/authentication';
+
 import { auth } from '../firebase/firebase';
-import { useWeb3AuthSFA, useWallet, useToast, ToastTypeEnum } from 'learn-card-base';
-import useSQLiteStorage from 'learn-card-base/hooks/useSQLiteStorage';
+import authStore from 'learn-card-base/stores/authStore';
+
+import {
+    useModal,
+    BrandingEnum,
+    pushUtilities,
+    LOGIN_REDIRECTS,
+    SocialLoginTypes,
+    useWeb3AuthSFA,
+    useToast,
+    useWallet,
+    ToastTypeEnum,
+    useSQLiteStorage,
+} from 'learn-card-base';
 import { useQueryClient } from '@tanstack/react-query';
-import { IonLoading } from '@ionic/react';
 
 const useLogout = () => {
-    const [isLoggingOut, setIsLoggingOut] = useState<boolean>(false);
-    const { logout, loggingOut: web3AuthLoggingOut } = useWeb3AuthSFA();
-    const { clearDB } = useSQLiteStorage();
     const firebaseAuth = auth();
+    const history = useHistory();
     const { initWallet } = useWallet();
-    const { presentToast } = useToast();
     const queryClient = useQueryClient();
+    const { clearDB } = useSQLiteStorage();
+    const { logout, loggingOut: web3AuthLoggingOut } = useWeb3AuthSFA();
+
+    const { closeAllModals } = useModal();
+    const { presentToast } = useToast();
+
+    const [isLoggingOut, setIsLoggingOut] = useState<boolean>(false);
 
     const handleLogout = async (
         branding: BrandingEnum,
@@ -82,7 +94,12 @@ const useLogout = () => {
                     console.error(e);
                 }
 
-                await logout(redirectUrl);
+                closeAllModals();
+
+                await logout();
+
+                // handle redirect from within LCA over web3Auth redirect
+                history.push(redirectUrl);
             } catch (e) {
                 console.error('There was an issue logging out', e);
                 setIsLoggingOut(false);

packages/learn-card-base/src/hooks/useWeb3AuthSFA.ts

@@ -212,7 +212,7 @@ export const useWeb3AuthSFA = () => {
     };
 
     const logout = async (
-        redirectUrl: string = 'https://learncard.app/',
+        redirectUrl?: string,
         _branding: BrandingEnum = BrandingEnum.learncard
     ) => {
         try {