gsadmin/Firelink
1
0
Fork 0
mirror of https://github.com/nimbold/Firelink.git synced 2026-08-08 10:23:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: repair download interaction flows

Browse Source
This commit is contained in:
NimBold
2026-06-19 17:25:40 +03:30
parent 85df857678
commit 3ca126e5db
12 changed files with 264 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/DeleteConfirmationModal.tsx
+30 -15
View File
@@ -1,9 +1,11 @@
import React from 'react';
import React, { useState } from 'react';
import { useDownloadStore } from '../store/useDownloadStore';
import { AlertTriangle } from 'lucide-react';
export const DeleteConfirmationModal: React.FC = () => {
const { deleteModalState, closeDeleteModal, removeDownload } = useDownloadStore();
const [errorMessage, setErrorMessage] = useState('');
const [isRemoving, setIsRemoving] = useState(false);
if (!deleteModalState.isOpen) return null;
@@ -11,58 +13,71 @@ export const DeleteConfirmationModal: React.FC = () => {
closeDeleteModal();
};
const handleRemoveFromList = () => {
const handleRemoveFromList = async () => {
if (deleteModalState.downloadId) {
removeDownload(deleteModalState.downloadId, false);
setIsRemoving(true);
try {
await removeDownload(deleteModalState.downloadId, false);
} catch (error) {
setErrorMessage(`Remove failed: ${String(error)}`);
setIsRemoving(false);
return;
}
}
closeDeleteModal();
};
const handleDeleteFile = () => {
const handleDeleteFile = async () => {
if (deleteModalState.downloadId) {
removeDownload(deleteModalState.downloadId, true);
setIsRemoving(true);
try {
await removeDownload(deleteModalState.downloadId, true);
} catch (error) {
setErrorMessage(`Delete failed: ${String(error)}`);
setIsRemoving(false);
return;
}
}
closeDeleteModal();
};
return (
<div className="fixed inset-0 bg-black/40 flex items-center justify-center z-50 animate-fade-in">
<div
<div
className="bg-bg-modal rounded-xl w-full max-w-md overflow-hidden flex flex-col shadow-2xl border border-border-modal scale-in"
onClick={(e) => e.stopPropagation()}
>
{/* Header */}
<div className="px-5 py-4 border-b border-border-modal flex items-center gap-3">
<div className="p-2 bg-red-500/10 rounded-full flex items-center justify-center">
<AlertTriangle size={20} className="text-red-400" />
</div>
<h2 className="text-lg font-semibold text-text-primary m-0">
Remove Download
</h2>
<h2 className="text-lg font-semibold text-text-primary m-0">Remove Download</h2>
</div>
{/* Body */}
<div className="px-5 py-6 flex-1 text-sm text-text-secondary leading-relaxed">
Are you sure you want to remove this item from the list? You can also choose to delete the underlying file from your hard drive.
{errorMessage && <div className="mt-3 text-xs text-red-400">{errorMessage}</div>}
</div>
{/* Footer */}
<div className="px-5 py-4 border-t border-border-modal flex justify-end gap-3 bg-bg-modal-accent">
<button
onClick={handleCancel}
className="px-4 py-2 rounded-lg text-sm font-medium transition-colors text-text-secondary hover:bg-item-hover hover:text-text-primary"
disabled={isRemoving}
className="px-4 py-2 rounded-lg text-sm font-medium transition-colors text-text-secondary hover:bg-item-hover hover:text-text-primary disabled:opacity-50"
>
Cancel
</button>
<button
onClick={handleRemoveFromList}
className="px-4 py-2 rounded-lg text-sm font-medium transition-colors bg-border-modal hover:bg-border-modal/80 text-text-primary"
disabled={isRemoving}
className="px-4 py-2 rounded-lg text-sm font-medium transition-colors bg-border-modal hover:bg-border-modal/80 text-text-primary disabled:opacity-50"
>
Remove
</button>
<button
onClick={handleDeleteFile}
className="px-4 py-2 rounded-lg text-sm font-medium transition-colors bg-red-500/20 text-red-400 hover:bg-red-500/30"
disabled={isRemoving}
className="px-4 py-2 rounded-lg text-sm font-medium transition-colors bg-red-500/20 text-red-400 hover:bg-red-500/30 disabled:opacity-50"
>
Delete file
</button>