feat: add download button

This commit is contained in:
Li Xin 2025-04-19 22:18:19 +08:00
parent 2f06f0c433
commit c57fa8fdd8

View File

@ -376,8 +376,8 @@ function PodcastCard({
const data = useMemo(() => { const data = useMemo(() => {
return parse(message.content ?? ""); return parse(message.content ?? "");
}, [message.content]); }, [message.content]);
const title = useMemo(() => data?.title, [data]); const title = useMemo<string | undefined>(() => data?.title, [data]);
const audioUrl = useMemo(() => data?.audioUrl, [data]); const audioUrl = useMemo<string | undefined>(() => data?.audioUrl, [data]);
const isGenerating = useMemo(() => { const isGenerating = useMemo(() => {
return message.isStreaming; return message.isStreaming;
}, [message.isStreaming]); }, [message.isStreaming]);
@ -396,16 +396,23 @@ function PodcastCard({
: "Podcast"} : "Podcast"}
</RainbowText> </RainbowText>
</div> </div>
{!isGenerating && (
<div className="flex"> <div className="flex">
<Tooltip> <Tooltip>
<TooltipTrigger asChild> <TooltipTrigger asChild>
<Button variant="ghost" size="icon"> <Button variant="ghost" size="icon" asChild>
<a
href={audioUrl}
download={`${(title ?? "podcast").replaceAll(" ", "-")}.mp3`}
>
<DownloadOutlined /> <DownloadOutlined />
</a>
</Button> </Button>
</TooltipTrigger> </TooltipTrigger>
<TooltipContent>Download podcast</TooltipContent> <TooltipContent>Download podcast</TooltipContent>
</Tooltip> </Tooltip>
</div> </div>
)}
</div> </div>
<CardTitle> <CardTitle>
<div className="text-lg font-medium"> <div className="text-lg font-medium">