+
navigator(`/assistant/${id}`)}
+ deleteConfig={props.deleteConfig}
/>
diff --git a/frontend/src/components/OrphanChat.tsx b/frontend/src/components/OrphanChat.tsx
new file mode 100644
index 00000000..1369e90e
--- /dev/null
+++ b/frontend/src/components/OrphanChat.tsx
@@ -0,0 +1,110 @@
+import { useEffect, useState } from "react";
+import { Config } from "../hooks/useConfigList";
+import { Chat } from "../types";
+import { getAssistants } from "../api/assistants";
+import { useThreadAndAssistant } from "../hooks/useThreadAndAssistant";
+
+export function OrphanChat(props: {
+ chat: Chat;
+ updateChat: (
+ name: string,
+ thread_id: string,
+ assistant_id: string | null,
+ ) => Promise
;
+}) {
+ const [newConfigId, setNewConfigId] = useState(null as string | null);
+ const [configs, setConfigs] = useState([]);
+ const { invalidateChat } = useThreadAndAssistant();
+
+ const update = async () => {
+ if (!newConfigId) {
+ alert("Please select a bot.");
+ return;
+ }
+ const updatedChat = await props.updateChat(
+ props.chat.thread_id,
+ props.chat.name,
+ newConfigId,
+ );
+ invalidateChat(updatedChat.thread_id);
+ };
+
+ const botTypeToName = (botType: string) => {
+ switch (botType) {
+ case "chatbot":
+ return "Chatbot";
+ case "chat_retrieval":
+ return "RAG";
+ case "agent":
+ return "Assistant";
+ default:
+ return botType;
+ }
+ };
+
+ useEffect(() => {
+ async function fetchConfigs() {
+ const configs = await getAssistants();
+ const suitableConfigs = configs
+ ? configs.filter(
+ (config) =>
+ config.config.configurable?.type ===
+ props.chat.metadata?.assistant_type,
+ )
+ : [];
+ setConfigs(suitableConfigs);
+ }
+
+ fetchConfigs();
+ }, [props.chat.metadata?.assistant_type]);
+
+ return (
+
+ {configs.length ? (
+
+ ) : (
+
+
+ This chat has no bot attached. To continue chatting, you need to
+ attach a bot. However, there are no suitable bots available for this
+ chat. Please create a new bot with type{" "}
+ {botTypeToName(props.chat.metadata?.assistant_type as string)} and
+ try again.
+
+
+ )}
+