feat(ui): silme işlemini iki aşamalı onay sistemine dönüştür

Tarayıcı doğrulama penceresi yerine inline onay mekanizması eklendi.
Kullanıcı dosya silmek için "Sil" butonuna ilk tıkladığında buton kırmızıya
dönerek "Emin misiniz?" sorusunu gösterir ve ikinci tıklamada silme işlemini
gerçekleştirir. Bu yaklaşım kullanıcı deneyimini iyileştirir ve uygulama
tutarlılığını artırır.
This commit is contained in:
2026-02-02 22:49:26 +03:00
parent 2b5bb86b3e
commit 20da34beb2

View File

@@ -468,6 +468,7 @@
let pendingPlayTarget = null; let pendingPlayTarget = null;
let activeMenu = null; // Aktif menü öğesi let activeMenu = null; // Aktif menü öğesi
let menuPosition = { top: 0, left: 0 }; // Menü pozisyonu let menuPosition = { top: 0, left: 0 }; // Menü pozisyonu
let deleteConfirmPending = false; // Silme onayı beklemede mi
let showMatchModal = false; let showMatchModal = false;
let matchingFile = null; let matchingFile = null;
let matchTitle = ""; let matchTitle = "";
@@ -1444,32 +1445,24 @@
async function deleteFile(item) { async function deleteFile(item) {
if (!item) return; if (!item) return;
// Eğer onay beklemedeyse, silme işlemini gerçekleştir
if (deleteConfirmPending) {
const target = resolveDeletionTargets(item); const target = resolveDeletionTargets(item);
if (!target) { if (!target) {
closeMenu(); closeMenu();
return; return;
} }
const label =
target.type === "directory"
? target.label || item.displayName || "Klasör"
: target.label || cleanFileName(item.name);
const message =
target.type === "directory"
? `"${label}" klasörünü silmek istediğine emin misin?`
: `"${label}" dosyasını silmek istediğinizden emin misiniz?`;
if (!confirm(message)) {
closeMenu();
return;
}
const result = await performDeletion(target); const result = await performDeletion(target);
deleteConfirmPending = false; // Reset flag
if (!result.ok) { if (!result.ok) {
alert("Silme hatası: " + (result.error || "Bilinmeyen hata")); alert("Silme hatası: " + (result.error || "Bilinmeyen hata"));
closeMenu(); closeMenu();
return; return;
} }
if (item.isDirectory) { if (item.isDirectory) {
const displayKey = normalizePath( const displayKey = normalizePath(
item.displayPath || item.displayPath ||
@@ -1486,6 +1479,19 @@
[...selectedItems].filter((name) => name !== item.name), [...selectedItems].filter((name) => name !== item.name),
); );
closeMenu(); closeMenu();
return;
}
// İlk tıklama - onay moduna geç
deleteConfirmPending = true;
}
// Menü kapandığında onay durumunu resetle
function closeMenu() {
activeMenu = null;
deleteConfirmPending = false;
showMatchModal = false;
matchingFile = null;
} }
// Klasör oluşturma fonksiyonları // Klasör oluşturma fonksiyonları
@@ -2419,11 +2425,11 @@
</button> </button>
<div class="menu-divider"></div> <div class="menu-divider"></div>
<button <button
class="menu-item delete" class="menu-item delete {deleteConfirmPending ? 'confirming' : ''}"
on:click|stopPropagation={() => deleteFile(activeMenu)} on:click|stopPropagation={() => deleteFile(activeMenu)}
> >
<i class="fa-solid fa-trash"></i> <i class="fa-solid fa-trash"></i>
<span>Sil</span> <span>{deleteConfirmPending ? 'Emin misiniz?' : 'Sil'}</span>
</button> </button>
</div> </div>
{/if} {/if}
@@ -3980,6 +3986,16 @@
color: #e53935; color: #e53935;
} }
.menu-item.delete.confirming {
color: #fff;
background-color: #e53935;
font-weight: 600;
}
.menu-item.delete.confirming:hover {
background-color: #c62828;
}
.menu-item.delete:hover { .menu-item.delete:hover {
background-color: #ffebee; background-color: #ffebee;
} }