diff --git a/packages/web/components/templates/NavigationLayout.tsx b/packages/web/components/templates/NavigationLayout.tsx index abfc74dcd..1ceca6440 100644 --- a/packages/web/components/templates/NavigationLayout.tsx +++ b/packages/web/components/templates/NavigationLayout.tsx @@ -22,6 +22,7 @@ import useWindowDimensions from '../../lib/hooks/useGetWindowDimensions' import { useAddItem } from '../../lib/networking/library_items/useLibraryItems' import { useHandleAddUrl } from '../../lib/hooks/useHandleAddUrl' import { useGetViewer } from '../../lib/networking/viewer/useGetViewer' +import { useQueryClient } from '@tanstack/react-query' export type NavigationSection = | 'home' @@ -45,12 +46,18 @@ type NavigationLayoutProps = { export function NavigationLayout(props: NavigationLayoutProps): JSX.Element { useApplyLocalTheme() - const { data: viewerData } = useGetViewer() const router = useRouter() + const queryClient = useQueryClient() const [showLogoutConfirmation, setShowLogoutConfirmation] = useState(false) const [showKeyboardCommandsModal, setShowKeyboardCommandsModal] = useState(false) - const addItem = useAddItem() + const { + data: viewerData, + isFetching, + isPending, + isError, + status, + } = useGetViewer() useRegisterActions(navigationCommands(router)) @@ -69,6 +76,12 @@ export function NavigationLayout(props: NavigationLayoutProps): JSX.Element { if (viewerData) { setupAnalytics(viewerData) } + if (!viewerData && !isPending) { + console.log('viewerData: ', viewerData, isFetching, isPending, status) + // there was an error loading, so lets log out + queryClient.clear() + router.push(`/login`) + } }, [viewerData]) const showLogout = useCallback(() => { diff --git a/packages/web/lib/logout.ts b/packages/web/lib/logout.ts index 2b917deea..d86c9bb6d 100644 --- a/packages/web/lib/logout.ts +++ b/packages/web/lib/logout.ts @@ -1,7 +1,9 @@ +import { useQueryClient } from '@tanstack/react-query' import { deinitAnalytics } from './analytics' import { logoutMutation } from './networking/mutations/logoutMutation' export const logout = async () => { + const queryClient = useQueryClient() await logoutMutation() try { const result = await logoutMutation() @@ -9,6 +11,7 @@ export const logout = async () => { throw new Error('Logout failed') } deinitAnalytics() + queryClient.clear() window.location.href = '/login' } catch { // TODO: display an error message instead