Confirm Delete for Files

[MentalGear]

Initial checklist

• I understand this is a feature request and questions should be posted in the Community Forum
• I searched issues and couldn’t find anything (or linked relevant results below)

Problem

I find the delete buttons dangerously exposed, especially when people scroll on touch devices.

It would be great, if we could control this with an optional confirm dialog.

Solution

Provide a new event "before-file-remove" that allows to cancel the delete if necessary by custom UI action.

Alternatives

As a workaround I use the following for now (posting it for others to use as well):

    function injectConfirmDialogForDeletion(e) {
        const deleteUploadBtn = ".uppy-Dashboard-Item-action--remove"
        const target = e.target?.closest(deleteUploadBtn)
        // console.log(target)

        if (!target) return

        if (target) {
            const out = confirm("Delete this uploaded file?")
            if (!out) {
                e.preventDefault()
                e.stopPropagation()
            }
        }
    }


    uppyContainer.addEventListener(
        "click",
        injectConfirmDialogForDeletion,
        { capture: true } // prioritizes this event listener
    )