Revert "fix: download button on cards opens the post page"

This reverts commit 75ccfd78ed.

src/components/LatestUpdateCard.tsx

@@ -1,10 +1,17 @@
-import { Play } from "lucide-react";
-import { Link, useNavigate } from "react-router-dom";
+import { LoaderCircle, Play } from "lucide-react";
+import { useState } from "react";
+import { Link } from "react-router-dom";
 import { FavoriteButton } from "../favorites/FavoriteButton";
 import { useI18n } from "../i18n";
 import { useLocalizedPath } from "../useLocalizedPath";
 import type { Attachment, Post } from "../types/post";
 import { DownloadCloudIcon } from "./icons/DownloadCloudIcon";
+import {
+  mediaSaveKindFromAttachment,
+  useSaveToAlbumGuide,
+} from "./SaveToAlbumGuide";
+import { useToast } from "./Toast";
+import { downloadAttachment } from "./messageStream/utils/downloadFile";
 import { fileIcon } from "./messageStream/utils/fileIcon";
 import {
   filenameWithExtension,
@@ -23,11 +30,24 @@ function LatestActions({
   attachment?: Attachment;
 }) {
   const { t } = useI18n();
-  const lp = useLocalizedPath();
-  const navigate = useNavigate();
+  const { showToast } = useToast();
+  const { showSaveToAlbumGuide } = useSaveToAlbumGuide();
+  const [isDownloading, setIsDownloading] = useState(false);
 
-  const goToPost = () => {
-    navigate(lp(`/browse?post=${encodeURIComponent(post.id)}`));
+  const handleDownload = async () => {
+    if (!attachment || isDownloading) return;
+    setIsDownloading(true);
+    try {
+      await downloadAttachment(post.id, attachment.id, attachment.filename, {
+        sizeBytes: attachment.sizeBytes,
+      });
+      const mediaKind = mediaSaveKindFromAttachment(attachment);
+      if (mediaKind) showSaveToAlbumGuide(mediaKind);
+    } catch {
+      showToast(t("downloadFail"), "error");
+    } finally {
+      setIsDownloading(false);
+    }
   };
 
   return (
@@ -39,13 +59,23 @@ function LatestActions({
           onClick={(event) => {
             event.preventDefault();
             event.stopPropagation();
-            goToPost();
+            void handleDownload();
           }}
-          aria-label={t("download")}
-          title={t("download")}
-          className="relative z-20 flex h-9 w-9 shrink-0 items-center justify-center rounded-full bg-[#191921] text-white outline-none transition hover:bg-[#22232D] focus-visible:ring-2 focus-visible:ring-ark-gold/70"
+          disabled={isDownloading}
+          aria-label={
+            isDownloading ? t("downloading") : `Download ${attachment.filename}`
+          }
+          aria-busy={isDownloading}
+          className="relative z-20 flex h-9 w-9 shrink-0 items-center justify-center rounded-full bg-[#191921] text-white outline-none transition hover:bg-[#22232D] focus-visible:ring-2 focus-visible:ring-ark-gold/70 disabled:cursor-wait"
         >
-          <DownloadCloudIcon className="h-5 w-5" />
+          {isDownloading ? (
+            <LoaderCircle
+              className="h-4 w-4 animate-spin text-[#A8A9AE]"
+              strokeWidth={2.3}
+            />
+          ) : (
+            <DownloadCloudIcon className="h-5 w-5" />
+          )}
         </button>
       ) : null}
     </div>