Remove activity indicator on review item download button

This commit is contained in:
Josh Hawkins 2024-11-11 19:11:13 -06:00
parent c79fa41be2
commit 0c07fdf04a

View File

@ -1,7 +1,5 @@
import { useState } from "react";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { toast } from "sonner"; import { toast } from "sonner";
import ActivityIndicator from "../indicators/activity-indicator";
import { FaDownload } from "react-icons/fa"; import { FaDownload } from "react-icons/fa";
import { formatUnixTimestampToDateTime } from "@/utils/dateUtil"; import { formatUnixTimestampToDateTime } from "@/utils/dateUtil";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
@ -19,8 +17,6 @@ export function DownloadVideoButton({
startTime, startTime,
className, className,
}: DownloadVideoButtonProps) { }: DownloadVideoButtonProps) {
const [isDownloading, setIsDownloading] = useState(false);
const formattedDate = formatUnixTimestampToDateTime(startTime, { const formattedDate = formatUnixTimestampToDateTime(startTime, {
strftime_fmt: "%D-%T", strftime_fmt: "%D-%T",
time_style: "medium", time_style: "medium",
@ -29,7 +25,6 @@ export function DownloadVideoButton({
const filename = `${camera}_${formattedDate}.mp4`; const filename = `${camera}_${formattedDate}.mp4`;
const handleDownloadStart = () => { const handleDownloadStart = () => {
setIsDownloading(true);
toast.success("Your review item video has started downloading.", { toast.success("Your review item video has started downloading.", {
position: "top-center", position: "top-center",
}); });
@ -39,19 +34,14 @@ export function DownloadVideoButton({
<div className="flex justify-center"> <div className="flex justify-center">
<Button <Button
asChild asChild
disabled={isDownloading}
className="flex items-center gap-2" className="flex items-center gap-2"
size="sm" size="sm"
aria-label="Download Video" aria-label="Download Video"
> >
<a href={source} download={filename} onClick={handleDownloadStart}> <a href={source} download={filename} onClick={handleDownloadStart}>
{isDownloading ? ( <FaDownload
<ActivityIndicator className="size-4" /> className={cn("size-4 text-secondary-foreground", className)}
) : ( />
<FaDownload
className={cn("size-4 text-secondary-foreground", className)}
/>
)}
</a> </a>
</Button> </Button>
</div> </div>