fix: download bunny materials through academy

components/MaterialCard.tsx

@@ -13,6 +13,7 @@ import {
 } from 'lucide-react';
 import { Attachment, AttachmentType } from '../types';
 import { useToast } from '../context/ToastContext';
+import { downloadCourseAsset } from '../services/api';
 
 interface MaterialCardProps {
   attachment: Attachment;
@@ -67,32 +68,29 @@ export const MaterialCard: React.FC<MaterialCardProps> = ({
   const { showDownloadToast, showToast } = useToast();
   const badge = getAttachmentBadge(attachment.type);
 
-  const handleAction = (e: React.MouseEvent) => {
-    setDownloaded(true);
+  const handleAction = async () => {
     if (attachment.type === 'link') {
       showToast(`Acessando link "${attachment.name}"`, 'info');
-    } else {
-      showDownloadToast(attachment.name, attachment.size);
+      window.open(attachment.url, '_blank', 'noopener,noreferrer');
+      return;
     }
 
-    if (onDownload) {
-      onDownload(attachment);
-    }
-    // If it has a real URL that is not '#', let the default anchor do its work
-    if (!attachment.url || attachment.url === '#') {
-      e.preventDefault();
-      // Trigger a synthetic download notification reset
-      setTimeout(() => setDownloaded(false), 3000);
+    try {
+      await downloadCourseAsset(attachment.id, attachment.name);
+      setDownloaded(true);
+      showDownloadToast(attachment.name, attachment.size);
+      onDownload?.(attachment);
+      window.setTimeout(() => setDownloaded(false), 3000);
+    } catch (error) {
+      showToast(error instanceof Error ? error.message : 'Não foi possível baixar este material.', 'error');
     }
   };
 
   if (compact) {
     return (
-      <a
-        href={attachment.url || '#'}
-        target={attachment.type === 'link' ? '_blank' : '_self'}
-        rel="noreferrer"
-        onClick={handleAction}
+      <button
+        type="button"
+        onClick={() => void handleAction()}
         className="flex items-center justify-between p-3.5 rounded-xl bg-zinc-900/90 hover:bg-zinc-800/90 transition-all duration-200 group shadow-sm"
       >
         <div className="flex items-center gap-3.5 min-w-0 pr-3">
@@ -119,8 +117,7 @@ export const MaterialCard: React.FC<MaterialCardProps> = ({
               Baixado
             </span>
           ) : (
-            <button
-              type="button"
+            <span
               className="flex items-center gap-1.5 text-xs font-semibold bg-white/10 hover:bg-orange-500 hover:text-white text-gray-200 px-3.5 py-1.5 rounded-lg transition-all active:scale-95"
             >
               {attachment.type === 'link' ? (
@@ -134,10 +131,10 @@ export const MaterialCard: React.FC<MaterialCardProps> = ({
                   Baixar
                 </>
               )}
-            </button>
+            </span>
           )}
         </div>
-      </a>
+      </button>
     );
   }
 
@@ -169,11 +166,9 @@ export const MaterialCard: React.FC<MaterialCardProps> = ({
           {attachment.size || 'Disponível'}
         </span>
 
-        <a
-          href={attachment.url || '#'}
-          target={attachment.type === 'link' ? '_blank' : '_self'}
-          rel="noreferrer"
-          onClick={handleAction}
+        <button
+          type="button"
+          onClick={() => void handleAction()}
           className="inline-flex items-center gap-2 text-xs font-bold text-black bg-white hover:bg-orange-500 hover:text-white px-4 py-2 rounded-xl transition-all duration-200 active:scale-95 shadow-md"
         >
           {attachment.type === 'link' ? (
@@ -187,7 +182,7 @@ export const MaterialCard: React.FC<MaterialCardProps> = ({
               Baixar Arquivo
             </>
           )}
-        </a>
+        </button>
       </div>
     </div>
   );