Best way to handle LiveView upload "direct to S3" errors

Phoenix Forum Questions / Help
, , ,
1

Hi, please forgive me if I am missing something obvious, I am relatively new to Elixir and Phoenix.

I am wondering if there isn official way of handling errors, e.g. cancelling failed uploads.

I am following the example in the official guide: External Uploads — Phoenix LiveView v0.15.4

From what I can gather, there is a list of entries for the uploading files @uploads.file.entries, and a list of errors @uploads.file.errors that is populated when an error occurs, but there isn’t really a connection between the two apart from them sharing the “ref”.

I’m finding that I have to do something like this:

<%= for entry <- @uploads.file.entries do %>
    <%= entry.client_name %> - <%= entry.progress %>%

    <%= if @uploads.file.errors |> Enum.into(%{}) |> Map.has_key?(entry.ref) do %>
        <span phx-click="clear-failed-upload" phx-value-ref="<%= entry.ref %>">Clear</span>
    <% end %>
<% end %>

I’m rather new to Phoenix, so I don’t really have a frame of reference to know if this is a typical pattern, but my initial reaction is that this seems a bit contrived for what I would image is a common use case.

Would anyone be able to shed some light on this?

Thanks

2

Hi @soulpoint! You can use upload_errors/2 to get the error for a specific upload entry - here’s an example from the docs:

# You define this helper function in your code
def error_to_string(:too_large), do: "Too large"
def error_to_string(:too_many_files), do: "You have selected too many files"
def error_to_string(:not_accepted), do: "You have selected an unacceptable file type"

# Then you can use upload_errors/2 in your LV template
<%= for entry <- @uploads.avatar.entries do %>
  <%= for err <- upload_errors(@uploads.avatar, entry) do %>
    <div class="alert alert-danger">
      <%= error_to_string(err) %>
    </div>
  <% end %>
<% end %>

In your example, if you only want to show the Clear link on error, you could do something like this:

<%= for entry <- @uploads.file.entries do %>
  <% errors = upload_errors(@uploads.file, entry) %>
  <%= if errors != [] do %>
    <span phx-click="clear-failed-upload" phx-value-ref="<%= entry.ref %>">Clear</span>
  <% end %>
  <%= for err <- errors do %>
    <div class="alert alert-danger">
      <%= error_to_string(err) %>
    </div>
  <% end %>
<% end %>
3 Likes
3

I didn’t realise that function existed, that’s awesome!

Thanks @mcrumm!

1 Like