refactor: simplify audio component by removing dropdown menu and integrating download button directly

This commit is contained in:
Anish Sarkar 2026-03-23 03:39:08 +05:30
parent fed3a3b436
commit 009e89e5cd

View file

@ -2,7 +2,6 @@
import { import {
DownloadIcon, DownloadIcon,
EllipsisVerticalIcon,
PauseIcon, PauseIcon,
PlayIcon, PlayIcon,
Volume2Icon, Volume2Icon,
@ -10,12 +9,6 @@ import {
} from "lucide-react"; } from "lucide-react";
import { useCallback, useEffect, useRef, useState } from "react"; import { useCallback, useEffect, useRef, useState } from "react";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
import { Slider } from "@/components/ui/slider"; import { Slider } from "@/components/ui/slider";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
@ -189,23 +182,15 @@ export function Audio({ id, src, title, durationMs, className }: AudioProps) {
<div className="flex items-start gap-2 px-5 pt-5 pb-4"> <div className="flex items-start gap-2 px-5 pt-5 pb-4">
<p className="text-sm font-semibold text-foreground line-clamp-2 flex-1 min-w-0">{title}</p> <p className="text-sm font-semibold text-foreground line-clamp-2 flex-1 min-w-0">{title}</p>
<DropdownMenu> <Button
<DropdownMenuTrigger asChild> variant="ghost"
<Button size="icon"
variant="ghost" onClick={handleDownload}
size="icon" className="size-7 shrink-0 -mt-0.5 -mr-2 text-muted-foreground"
className="size-7 shrink-0 -mt-0.5 -mr-2 text-muted-foreground" aria-label="Download audio"
> >
<EllipsisVerticalIcon className="size-4" /> <DownloadIcon className="size-4" />
</Button> </Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuItem onClick={handleDownload}>
<DownloadIcon className="size-4" />
Download
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</div> </div>
<div className="mx-5 h-px bg-border/50" /> <div className="mx-5 h-px bg-border/50" />