Unable to submit form with invalid uploads

[ademenev]

Environment

• Elixir version (elixir -v): Erlang/OTP 26 [erts-14.1] [source] [64-bit] [smp:10:10] [ds:10:10:10] [async-threads:1] [jit] Elixir 1.15.6 (compiled with Erlang/OTP 26)

• Phoenix version (mix deps): locked at 1.7.14 (phoenix) c7859bc5

• Phoenix LiveView version (mix deps): locked at 1.0.0-rc.6 (phoenix_live_view) e56e4f16

• Operating system: MacOS 13.6

• Browsers you attempted to reproduce this bug on (the more the merrier): Chrome Version 127.0.6533.89 (Official Build) (arm64)

• Does the problem persist after removing "assets/node_modules" and trying again? Yes/no: Yes

Issue description

When submitting a form, all form controls are disabled, and liveliew client code waits for preflighted uploads to match done uploads. When some uploads contain invalid entries, the only way to make the form to actually trigger the submit event is to cancel the entries with errors. Here come 2 issues:

1. Since all form controls are disabled, if the "cancel upload" buttons are inside the form, it is not possible to click them, and the whole form becomes useless
2. Even if the "cancel upload" buttons are outside the form and are not disabled, it is not intuitive for the user that they have to cancel failed uploads. And in most cases the user would expect that they can retry failed uploads, but the form gets submitted as soon as invalid entries are removed.

All this may be not a big deal if the sole purpose of the form is uploading files, like in examples in the documentation, but in real use cases files are often uploaded with other data, and the user may end up submitting records with fewer files than intended.

Expected behaviour

Submitting the form with invalid uploads should trigger "validate" and/or "save" event, giving the code a chance to present a message to the user telling to remove and possibly retry failed uploads.

A workaround could be to just disable the submit button when there are invalid uploads, but for better UX upload errors should be treated the same as other validation errors.