Upload improvements

lib/livebook_web/components/form_components.ex

@@ -609,6 +609,7 @@ defmodule LivebookWeb.FormComponents do
               type="button"
               class="ml-1 text-gray-500 hover:text-gray-900"
               phx-click={@on_clear}
+              phx-value-ref={entry.ref}
               tabindex="-1"
             >
               <.remix_icon icon="close-line" />

lib/livebook_web/live/open_live/upload_component.ex

@@ -6,7 +6,7 @@ defmodule LivebookWeb.OpenLive.UploadComponent do
     {:ok,
      socket
      |> assign(:error, false)
-     |> allow_upload(:notebook, accept: ~w(.livemd), max_entries: 1)}
+     |> allow_upload(:file, accept: ~w(.livemd), max_entries: 1)}
   end
 
   @impl true
@@ -19,7 +19,7 @@ defmodule LivebookWeb.OpenLive.UploadComponent do
       <form id="upload-file-form" phx-submit="save" phx-change="validate" phx-target={@myself}>
         <div class="flex flex-col space-y-4">
           <.file_drop_input
-            upload={@uploads.notebook}
+            upload={@uploads.file}
             label="Notebook"
             on_clear={JS.push("clear_file", target: @myself)}
           />
@@ -32,7 +32,7 @@ defmodule LivebookWeb.OpenLive.UploadComponent do
         <button
           type="submit"
           class="mt-5 button-base button-blue"
-          disabled={@error or upload_disabled?(@uploads.notebook)}
+          disabled={@error or upload_disabled?(@uploads.file)}
         >
           Import
         </button>
@@ -43,18 +43,20 @@ defmodule LivebookWeb.OpenLive.UploadComponent do
 
   @impl true
   def handle_event("validate", _params, socket) do
-    has_error? = Enum.any?(socket.assigns.uploads.notebook.entries, &(not &1.valid?))
+    has_error? = Enum.any?(socket.assigns.uploads.file.entries, &(not &1.valid?))
 
     {:noreply, assign(socket, error: has_error?)}
   end
 
-  def handle_event("clear_file", _params, socket) do
-    {socket, _entries} = Phoenix.LiveView.Upload.maybe_cancel_uploads(socket)
-    {:noreply, assign(socket, error: false)}
+  def handle_event("clear_file", %{"ref" => ref}, socket) do
+    {:noreply,
+     socket
+     |> cancel_upload(:file, ref)
+     |> assign(error: false)}
   end
 
   def handle_event("save", _params, socket) do
-    consume_uploaded_entries(socket, :notebook, fn %{path: path}, _entry ->
+    consume_uploaded_entries(socket, :file, fn %{path: path}, _entry ->
       content = File.read!(path)
 
       send(self(), {:import_source, content, []})

lib/livebook_web/live/session_live/add_file_entry_upload_component.ex

@@ -81,9 +81,11 @@ defmodule LivebookWeb.SessionLive.AddFileEntryUploadComponent do
     {:noreply, assign(socket, changeset: changeset)}
   end
 
-  def handle_event("clear_file", _params, socket) do
-    {socket, _entries} = Phoenix.LiveView.Upload.maybe_cancel_uploads(socket)
-    {:noreply, assign(socket, error_message: nil)}
+  def handle_event("clear_file", %{"ref" => ref}, socket) do
+    {:noreply,
+     socket
+     |> cancel_upload(:file, ref)
+     |> assign(error_message: nil)}
   end
 
   def handle_event("add", %{"data" => data}, socket) do

lib/livebook_web/live/session_live/insert_image_component.ex

@@ -93,9 +93,11 @@ defmodule LivebookWeb.SessionLive.InsertImageComponent do
     {:noreply, assign(socket, changeset: changeset)}
   end
 
-  def handle_event("clear_file", _params, socket) do
-    {socket, _entries} = Phoenix.LiveView.Upload.maybe_cancel_uploads(socket)
-    {:noreply, assign(socket, error_message: nil)}
+  def handle_event("clear_file", %{"ref" => ref}, socket) do
+    {:noreply,
+     socket
+     |> cancel_upload(:image, ref)
+     |> assign(error_message: nil)}
   end
 
   def handle_event("save", %{"data" => data}, socket) do

mix.lock

@@ -24,7 +24,7 @@
   "phoenix_html": {:hex, :phoenix_html, "3.3.1", "4788757e804a30baac6b3fc9695bf5562465dd3f1da8eb8460ad5b404d9a2178", [:mix], [{:plug, "~> 1.5", [hex: :plug, repo: "hexpm", optional: true]}], "hexpm", "bed1906edd4906a15fd7b412b85b05e521e1f67c9a85418c55999277e553d0d3"},
   "phoenix_live_dashboard": {:hex, :phoenix_live_dashboard, "0.8.0", "0b3158b5b198aa444473c91d23d79f52fb077e807ffad80dacf88ce078fa8df2", [:mix], [{:ecto, "~> 3.6.2 or ~> 3.7", [hex: :ecto, repo: "hexpm", optional: true]}, {:ecto_mysql_extras, "~> 0.5", [hex: :ecto_mysql_extras, repo: "hexpm", optional: true]}, {:ecto_psql_extras, "~> 0.7", [hex: :ecto_psql_extras, repo: "hexpm", optional: true]}, {:ecto_sqlite3_extras, "~> 1.1.7", [hex: :ecto_sqlite3_extras, repo: "hexpm", optional: true]}, {:mime, "~> 1.6 or ~> 2.0", [hex: :mime, repo: "hexpm", optional: false]}, {:phoenix_live_view, "~> 0.19.0", [hex: :phoenix_live_view, repo: "hexpm", optional: false]}, {:telemetry_metrics, "~> 0.6 or ~> 1.0", [hex: :telemetry_metrics, repo: "hexpm", optional: false]}], "hexpm", "87785a54474fed91a67a1227a741097eb1a42c2e49d3c0d098b588af65cd410d"},
   "phoenix_live_reload": {:hex, :phoenix_live_reload, "1.4.1", "2aff698f5e47369decde4357ba91fc9c37c6487a512b41732818f2204a8ef1d3", [:mix], [{:file_system, "~> 0.2.1 or ~> 0.3", [hex: :file_system, repo: "hexpm", optional: false]}, {:phoenix, "~> 1.4", [hex: :phoenix, repo: "hexpm", optional: false]}], "hexpm", "9bffb834e7ddf08467fe54ae58b5785507aaba6255568ae22b4d46e2bb3615ab"},
-  "phoenix_live_view": {:hex, :phoenix_live_view, "0.19.3", "3918c1b34df8ac71a9a636806ba5b7f053349a0392b312e16f35b0bf4d070aab", [:mix], [{:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:phoenix, "~> 1.6.15 or ~> 1.7.0", [hex: :phoenix, repo: "hexpm", optional: false]}, {:phoenix_html, "~> 3.3", [hex: :phoenix_html, repo: "hexpm", optional: false]}, {:phoenix_template, "~> 1.0", [hex: :phoenix_template, repo: "hexpm", optional: false]}, {:phoenix_view, "~> 2.0", [hex: :phoenix_view, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4.2 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "545626887948495fd8ea23d83b75bd7aaf9dc4221563e158d2c4b52ea1dd7e00"},
+  "phoenix_live_view": {:hex, :phoenix_live_view, "0.19.4", "dd9ffe3ca0683bdef4f340bcdd2c35a6ee0d581a2696033fc25f52e742618bdc", [:mix], [{:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:phoenix, "~> 1.6.15 or ~> 1.7.0", [hex: :phoenix, repo: "hexpm", optional: false]}, {:phoenix_html, "~> 3.3", [hex: :phoenix_html, repo: "hexpm", optional: false]}, {:phoenix_template, "~> 1.0", [hex: :phoenix_template, repo: "hexpm", optional: false]}, {:phoenix_view, "~> 2.0", [hex: :phoenix_view, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4.2 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "fd2c666d227476d63af7b8c20e6e61d16f07eb49f924cf4198fca7668156f15b"},
   "phoenix_pubsub": {:hex, :phoenix_pubsub, "2.1.3", "3168d78ba41835aecad272d5e8cd51aa87a7ac9eb836eabc42f6e57538e3731d", [:mix], [], "hexpm", "bba06bc1dcfd8cb086759f0edc94a8ba2bc8896d5331a1e2c2902bf8e36ee502"},
   "phoenix_template": {:hex, :phoenix_template, "1.0.1", "85f79e3ad1b0180abb43f9725973e3b8c2c3354a87245f91431eec60553ed3ef", [:mix], [{:phoenix_html, "~> 2.14.2 or ~> 3.0", [hex: :phoenix_html, repo: "hexpm", optional: true]}], "hexpm", "157dc078f6226334c91cb32c1865bf3911686f8bcd6bcff86736f6253e6993ee"},
   "plug": {:hex, :plug, "1.14.2", "cff7d4ec45b4ae176a227acd94a7ab536d9b37b942c8e8fa6dfc0fff98ff4d80", [:mix], [{:mime, "~> 1.0 or ~> 2.0", [hex: :mime, repo: "hexpm", optional: false]}, {:plug_crypto, "~> 1.1.1 or ~> 1.2", [hex: :plug_crypto, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4.3 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "842fc50187e13cf4ac3b253d47d9474ed6c296a8732752835ce4a86acdf68d13"},

test/livebook_web/live/open_live_test.exs

@@ -200,7 +200,7 @@ defmodule LivebookWeb.OpenLiveTest do
       {:ok, view, _} = live(conn, ~p"/open/upload")
 
       view
-      |> file_input("#upload-file-form", :notebook, [
+      |> file_input("#upload-file-form", :file, [
         %{
           last_modified: 1_594_171_879_000,
           name: "notebook.livemd",