Add use podcasts

Author: CREDO23

surfsense_web/components/chat/ChatInterface.tsx

@@ -10,6 +10,7 @@ import { ChatInputUI } from "@/components/chat/ChatInputGroup";
 import { ChatMessagesUI } from "@/components/chat/ChatMessages";
 import { useChatAPI } from "@/hooks/use-chat";
 import type { Document } from "@/hooks/use-documents";
+import { usePodcast } from "@/hooks/use-podcast";
 import { ChatPanelContainer } from "./ChatPanel/ChatPanelContainer";
 
 interface ChatInterfaceProps {
@@ -59,11 +60,21 @@ export default function ChatInterface({
 		chatDetails,
 	};
 
+	const { getPodcastByChatId } = usePodcast();
+
 	const { fetchChatDetails } = useChatAPI({
 		token: localStorage.getItem("surfsense_bearer_token"),
 		search_space_id: search_space_id as string,
 	});
 
+	const getPodcast = useCallback(
+		async (id: string) => {
+			const podcast = await getPodcastByChatId(Number(id));
+			setPodcast(podcast);
+		},
+		[getPodcastByChatId]
+	);
+
 	const getChat = useCallback(
 		async (id: string) => {
 			const chat = await fetchChatDetails(id);
@@ -76,6 +87,7 @@ export default function ChatInterface({
 		const id = typeof chat_id === "string" ? chat_id : chat_id ? chat_id[0] : "";
 		if (!id) return;
 		getChat(id);
+		getPodcast(id);
 	}, [chat_id, search_space_id]);
 
 	return (

surfsense_web/components/chat/ChatPanel/ConfigModal.tsx

@@ -39,7 +39,7 @@ export function ConfigModal(props: ConfigModalProps) {
 			>
 				<Pencil strokeWidth={1} className="h-4 w-4" />
 			</PopoverTrigger>
-			<PopoverContent align="end" className="bg-sidebar w-96 ">
+			<PopoverContent onClick={(e) => e.stopPropagation()} align="end" className="bg-sidebar w-96 ">
 				<form className="flex flex-col gap-3 w-full">
 					<label className="text-sm font-medium" htmlFor="prompt">
 						What subjects should the AI cover in this podcast ?

surfsense_web/hooks/use-podcast.ts

@@ -0,0 +1,30 @@
+import { useCallback } from "react";
+import type { PodcastItem } from "@/app/dashboard/[search_space_id]/podcasts/podcasts-client";
+
+export function usePodcast() {
+	const getPodcastByChatId = useCallback(async (chatId: number) => {
+		try {
+			const response = await fetch(
+				`${process.env.NEXT_PUBLIC_FASTAPI_BACKEND_URL}/api/v1/podcasts/by-chat/${chatId}`,
+				{
+					headers: {
+						Authorization: `Bearer ${localStorage.getItem("surfsense_bearer_token")}`,
+					},
+					method: "GET",
+				}
+			);
+
+			if (!response.ok) {
+				const errorData = await response.json().catch(() => ({}));
+				throw new Error(errorData.detail || "Failed to fetch podcast");
+			}
+
+			return (await response.json()) as PodcastItem;
+		} catch (err: any) {
+			console.error("Error fetching podcast:", err);
+			throw err;
+		}
+	}, []);
+
+	return { getPodcastByChatId };
+}