mirror of
https://github.com/truewhile/MeBox.git
synced 2026-09-29 11:36:36 +08:00
Remove unused recycle bin and add optional local file delete (#26)
Soft-delete restore/purge/list and the recycle_purge job are gone. Admin delete now removes library index rows, with an optional delete_files query that also deletes local media + sidecar NFO. UI copy is renamed from 移入回收站 to 删除, with a confirm checkbox. Co-authored-by: Cursor Agent <cursoragent@cursor.com> Co-authored-by: truewhile <truewhile@users.noreply.github.com>
This commit is contained in:
@@ -1,3 +1,4 @@
|
||||
import { useState } from 'react'
|
||||
import { AlertTriangle } from 'lucide-react'
|
||||
|
||||
export type ConfirmOptions = {
|
||||
@@ -6,6 +7,13 @@ export type ConfirmOptions = {
|
||||
confirmText?: string
|
||||
cancelText?: string
|
||||
danger?: boolean
|
||||
checkboxLabel?: string
|
||||
checkboxDefaultChecked?: boolean
|
||||
}
|
||||
|
||||
export type ConfirmResult = {
|
||||
confirmed: boolean
|
||||
checked: boolean
|
||||
}
|
||||
|
||||
export function ConfirmDialog({
|
||||
@@ -13,13 +21,15 @@ export function ConfirmDialog({
|
||||
onClose,
|
||||
}: {
|
||||
options: ConfirmOptions
|
||||
onClose: (value: boolean) => void
|
||||
onClose: (value: ConfirmResult) => void
|
||||
}) {
|
||||
const danger = options.danger ?? true
|
||||
const hasCheckbox = Boolean(options.checkboxLabel)
|
||||
const [checked, setChecked] = useState(Boolean(options.checkboxDefaultChecked))
|
||||
return (
|
||||
<div
|
||||
className="fixed inset-0 z-[100] flex items-center justify-center bg-black/35 p-4 backdrop-blur-sm"
|
||||
onClick={() => onClose(false)}
|
||||
onClick={() => onClose({ confirmed: false, checked })}
|
||||
>
|
||||
<div
|
||||
role="dialog"
|
||||
@@ -40,20 +50,31 @@ export function ConfirmDialog({
|
||||
<h3 className="font-display text-lg font-bold text-ink-600">
|
||||
{options.title || '确认操作'}
|
||||
</h3>
|
||||
<p className="mt-2 text-sm leading-6 text-ink-50">{options.message}</p>
|
||||
<p className="mt-2 whitespace-pre-line text-sm leading-6 text-ink-50">{options.message}</p>
|
||||
{hasCheckbox ? (
|
||||
<label className="mt-4 flex cursor-pointer items-start gap-2.5 text-sm text-ink-100">
|
||||
<input
|
||||
type="checkbox"
|
||||
className="mt-0.5 h-4 w-4 rounded border-gray-300 text-red-500 focus:ring-red-400"
|
||||
checked={checked}
|
||||
onChange={(event) => setChecked(event.target.checked)}
|
||||
/>
|
||||
<span>{options.checkboxLabel}</span>
|
||||
</label>
|
||||
) : null}
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex justify-end gap-2 border-t border-gray-100 bg-gray-50/80 px-5 py-4">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => onClose(false)}
|
||||
onClick={() => onClose({ confirmed: false, checked })}
|
||||
className="rounded-xl border border-gray-200 bg-white px-4 py-2 text-sm font-semibold text-ink-100 hover:bg-gray-50"
|
||||
>
|
||||
{options.cancelText || '取消'}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => onClose(true)}
|
||||
onClick={() => onClose({ confirmed: true, checked })}
|
||||
className={
|
||||
'rounded-xl px-4 py-2 text-sm font-semibold text-white shadow-sm transition ' +
|
||||
(danger ? 'bg-red-500 hover:bg-red-600' : 'bg-brand-500 hover:bg-brand-600')
|
||||
|
||||
@@ -1,13 +1,17 @@
|
||||
import { createRoot } from 'react-dom/client'
|
||||
|
||||
import { ConfirmDialog, type ConfirmOptions } from './ConfirmDialog'
|
||||
import { ConfirmDialog, type ConfirmOptions, type ConfirmResult } from './ConfirmDialog'
|
||||
|
||||
export function confirmAction(options: ConfirmOptions): Promise<boolean> {
|
||||
return confirmActionResult(options).then((result) => result.confirmed)
|
||||
}
|
||||
|
||||
export function confirmActionResult(options: ConfirmOptions): Promise<ConfirmResult> {
|
||||
return new Promise((resolve) => {
|
||||
const host = document.createElement('div')
|
||||
document.body.appendChild(host)
|
||||
const root = createRoot(host)
|
||||
const close = (value: boolean) => {
|
||||
const close = (value: ConfirmResult) => {
|
||||
root.unmount()
|
||||
host.remove()
|
||||
resolve(value)
|
||||
|
||||
Reference in New Issue
Block a user