diff --git a/src/interface/web/app/components/chatHistory/chatHistory.tsx b/src/interface/web/app/components/chatHistory/chatHistory.tsx
index 802bc30a..1a7c90c0 100644
--- a/src/interface/web/app/components/chatHistory/chatHistory.tsx
+++ b/src/interface/web/app/components/chatHistory/chatHistory.tsx
@@ -233,18 +233,19 @@ export default function ChatHistory(props: ChatHistoryProps) {
     };
 
     function constructAgentLink() {
-        if (!data || !data.agent || !data.agent.slug) return `/agents`;
-        return `/agents?agent=${data.agent.slug}`;
+        if (!data || !data.agent || !data.agent?.slug) return `/agents`;
+        return `/agents?agent=${data.agent?.slug}`;
     }
 
     function constructAgentName() {
-        if (!data || !data.agent || !data.agent.name) return `Agent`;
-        return data.agent.name;
+        if (!data || !data.agent || !data.agent?.name) return `Agent`;
+        return data.agent?.name;
     }
 
     function constructAgentPersona() {
-        if (!data || !data.agent || !data.agent.persona) return ``;
-        return data.agent.persona;
+        if (!data || !data.agent || !data.agent?.persona)
+            return `Your agent is no longer available. You will be reset to the default agent.`;
+        return data.agent?.persona;
     }
 
     if (!props.conversationId && !props.publicConversationSlug) {
@@ -279,7 +280,7 @@ export default function ChatHistory(props: ChatHistoryProps) {
                                 isMobileWidth={isMobileWidth}
                                 chatMessage={chatMessage}
                                 customClassName="fullHistory"
-                                borderLeftColor={`${data?.agent.color}-500`}
+                                borderLeftColor={`${data?.agent?.color}-500`}
                                 isLastMessage={index === data.chat.length - 1}
                             />
                         ))}
@@ -300,13 +301,13 @@ export default function ChatHistory(props: ChatHistoryProps) {
                                             uploadedImageData: message.uploadedImageData,
                                         }}
                                         customClassName="fullHistory"
-                                        borderLeftColor={`${data?.agent.color}-500`}
+                                        borderLeftColor={`${data?.agent?.color}-500`}
                                     />
                                     {message.trainOfThought &&
                                         constructTrainOfThought(
                                             message.trainOfThought,
                                             index === incompleteIncomingMessageIndex,
-                                            data?.agent.color || "orange",
+                                            data?.agent?.color || "orange",
                                             `${index}trainOfThought`,
                                             message.completed,
                                         )}
@@ -323,7 +324,7 @@ export default function ChatHistory(props: ChatHistoryProps) {
                                             rawQuery: message.rawQuery,
                                         }}
                                         customClassName="fullHistory"
-                                        borderLeftColor={`${data?.agent.color}-500`}
+                                        borderLeftColor={`${data?.agent?.color}-500`}
                                         isLastMessage={true}
                                     />
                                 </React.Fragment>
@@ -343,7 +344,7 @@ export default function ChatHistory(props: ChatHistoryProps) {
                                 uploadedImageData: props.pendingMessage,
                             }}
                             customClassName="fullHistory"
-                            borderLeftColor={`${data?.agent.color}-500`}
+                            borderLeftColor={`${data?.agent?.color}-500`}
                             isLastMessage={true}
                         />
                     )}
@@ -354,9 +355,10 @@ export default function ChatHistory(props: ChatHistoryProps) {
                                     name={constructAgentName()}
                                     link={constructAgentLink()}
                                     avatar={
-                                        getIconFromIconName(data.agent.icon, data.agent.color) || (
-                                            <Lightbulb />
-                                        )
+                                        getIconFromIconName(
+                                            data.agent?.icon,
+                                            data.agent?.color,
+                                        ) || <Lightbulb />
                                     }
                                     description={constructAgentPersona()}
                                 />