diff --git a/app/soapbox/contexts/chat-context.tsx b/app/soapbox/contexts/chat-context.tsx
index 35c3f9cf4..5b72207c1 100644
--- a/app/soapbox/contexts/chat-context.tsx
+++ b/app/soapbox/contexts/chat-context.tsx
@@ -1,4 +1,4 @@
-import React, { createContext, useContext, useMemo, useState } from 'react';
+import React, { createContext, useContext, useEffect, useMemo, useState } from 'react';
 import { useDispatch } from 'react-redux';
 import { useHistory, useParams } from 'react-router-dom';
 
@@ -31,9 +31,9 @@ const ChatProvider: React.FC = ({ children }) => {
   const { chatId } = useParams<{ chatId: string }>();
 
   const [screen, setScreen] = useState<ChatWidgetScreens>(ChatWidgetScreens.INBOX);
-  const [currentChatId, setCurrentChatId] = useState<null | string>(null);
+  const [currentChatId, setCurrentChatId] = useState<null | string>(chatId);
 
-  const { data: chat } = useChat(currentChatId || chatId as string);
+  const { data: chat } = useChat(currentChatId as string);
 
   const mainWindowState = settings.getIn(['chats', 'mainWindow']) as WindowState;
   const needsAcceptance = !chat?.accepted && chat?.created_by_account !== account?.id;
@@ -57,6 +57,14 @@ const ChatProvider: React.FC = ({ children }) => {
     currentChatId,
   }), [chat, currentChatId, needsAcceptance, isUsingMainChatPage, isOpen, screen, changeScreen]);
 
+  useEffect(() => {
+    if (chatId) {
+      setCurrentChatId(chatId);
+    } else {
+      setCurrentChatId(null);
+    }
+  }, [chatId]);
+
   return (
     <ChatContext.Provider value={value}>
       {children}
diff --git a/app/soapbox/features/chats/components/chat-page/components/chat-page-main.tsx b/app/soapbox/features/chats/components/chat-page/components/chat-page-main.tsx
index 11d82632d..d69f8a3d7 100644
--- a/app/soapbox/features/chats/components/chat-page/components/chat-page-main.tsx
+++ b/app/soapbox/features/chats/components/chat-page/components/chat-page-main.tsx
@@ -7,6 +7,7 @@ import { openModal } from 'soapbox/actions/modals';
 import List, { ListItem } from 'soapbox/components/list';
 import { Avatar, HStack, Icon, IconButton, Menu, MenuButton, MenuItem, MenuList, Stack, Text } from 'soapbox/components/ui';
 import VerificationBadge from 'soapbox/components/verification_badge';
+import { useChatContext } from 'soapbox/contexts/chat-context';
 import { useAppDispatch, useAppSelector, useFeatures } from 'soapbox/hooks';
 import { MessageExpirationValues, useChat, useChatActions } from 'soapbox/queries/chats';
 import { secondsToDays } from 'soapbox/utils/numbers';
@@ -47,6 +48,7 @@ const ChatPageMain = () => {
   const { chatId } = useParams<{ chatId: string }>();
 
   const { data: chat } = useChat(chatId);
+  const { currentChatId } = useChatContext();
 
   const inputRef = useRef<HTMLTextAreaElement | null>(null);
 
@@ -92,10 +94,14 @@ const ChatPageMain = () => {
     }));
   };
 
-  if (!chat) {
+  if (!currentChatId) {
     return <Blankslate />;
   }
 
+  if (!chat) {
+    return null;
+  }
+
   return (
     <Stack className='h-full overflow-hidden'>
       <HStack alignItems='center' justifyContent='between' space={2} className='px-4 py-4 w-full'>