livebook-dev/livebook
1
1
Fork 0
mirror of https://github.com/livebook-dev/livebook.git synced 2025-09-06 21:14:26 +08:00
Code Issues Projects Releases Packages Wiki Activity

Show progress in file input upload (#2785)

Browse source
This commit is contained in:
Jonatan Kłosko 2024-09-16 20:19:43 +02:00 • committed by GitHub
parent a976781b69
commit acf494a024
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 8 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
lib/livebook_web/live/output/file_input_component.ex
View file

@ -43,7 +43,7 @@ defmodule LivebookWeb.Output.FileInputComponent do
~H""" ~H"""
<form id={"#{@id}-root"} phx-change="validate" phx-target={@myself}> <form id={"#{@id}-root"} phx-change="validate" phx-target={@myself}>
<label <label
class="inline-flex flex-col gap-4 p-4 border-2 border-dashed border-gray-200 rounded-lg cursor-pointer" class="min-w-[50%] inline-flex flex-col gap-4 p-4 border-2 border-dashed border-gray-200 rounded-lg cursor-pointer"
phx-drop-target={@uploads.file.ref} phx-drop-target={@uploads.file.ref}
phx-hook="Dropzone" phx-hook="Dropzone"
id={"#{@id}-upload-dropzone"} id={"#{@id}-upload-dropzone"}
@ -56,6 +56,9 @@ defmodule LivebookWeb.Output.FileInputComponent do
<% end %> <% end %>
</div> </div>
<.live_file_input upload={@uploads.file} class="hidden" accept={@accept} /> <.live_file_input upload={@uploads.file} class="hidden" accept={@accept} />
<div :for={entry <- @uploads.file.entries} class="delay-200 flex flex-col gap-1">
<.file_entry name="File" entry={entry} on_clear={JS.push("clear_file", target: @myself)} />
</div>
</label> </label>
<p <p
:for={msg <- LivebookWeb.HTMLHelpers.upload_error_messages(@uploads.file)} :for={msg <- LivebookWeb.HTMLHelpers.upload_error_messages(@uploads.file)}
@ -72,6 +75,10 @@ defmodule LivebookWeb.Output.FileInputComponent do
{:noreply, socket} {:noreply, socket}
end end
def handle_event("clear_file", %{"ref" => ref}, socket) do
{:noreply, cancel_upload(socket, :file, ref)}
end
defp handle_progress(:file, entry, socket) do defp handle_progress(:file, entry, socket) do
if entry.done? do if entry.done? do
{file_ref, client_name} = {file_ref, client_name} =