Fix secrets form (#1379)

* Fix secrets form

* Update lib/livebook_web/live/session_live/secrets_component.ex

Co-authored-by: Jonatan Kłosko <jonatanklosko@gmail.com>

* Applying suggestions

Co-authored-by: Jonatan Kłosko <jonatanklosko@gmail.com>

lib/livebook/runtime/evaluator/default_formatter.ex

@@ -129,6 +129,8 @@ defmodule Livebook.Runtime.Evaluator.DefaultFormatter do
     IO.ANSI.format([:red, string], true)
   end
 
-  defp error_type(%System.EnvError{env: "LB_" <> secret}), do: {:missing_secret, secret}
+  defp error_type(%System.EnvError{env: "LB_" <> secret_label}),
+    do: {:missing_secret, secret_label}
+
   defp error_type(_), do: :other
 end

lib/livebook_web/live/output.ex

@@ -235,11 +235,11 @@ defmodule LivebookWeb.Output do
     )
   end
 
-  defp render_output({:error, formatted, {:missing_secret, secret}}, %{
+  defp render_output({:error, formatted, {:missing_secret, secret_label}}, %{
          socket: socket,
          session_id: session_id
        }) do
-    assigns = %{message: formatted, secret: secret}
+    assigns = %{message: formatted, secret_label: secret_label}
 
     ~H"""
     <div class="-m-4 space-x-4 py-4">
@@ -249,9 +249,9 @@ defmodule LivebookWeb.Output do
       >
         <div class="flex space-x-2">
           <.remix_icon icon="close-circle-line" />
-          <span>Missing secret <%= inspect(@secret) %></span>
+          <span>Missing secret <%= inspect(@secret_label) %></span>
         </div>
-        <%= live_patch to: Routes.session_path(socket, :secrets, session_id, secret: secret),
+        <%= live_patch to: Routes.session_path(socket, :secrets, session_id, secret_label: secret_label),
             class: "button-base button-gray",
             aria_label: "add secret",
             role: "button" do %>

lib/livebook_web/live/session_live.ex

@@ -404,7 +404,7 @@ defmodule LivebookWeb.SessionLive do
           module={LivebookWeb.SessionLive.SecretsComponent}
           id="secrets"
           session={@session}
-          secret={@secret}
+          prefill_secret_label={@prefill_secret_label}
           return_to={@self_path}
         />
       </.modal>
@@ -749,8 +749,7 @@ defmodule LivebookWeb.SessionLive do
 
   def handle_params(params, _url, socket)
       when socket.assigns.live_action == :secrets do
-    label = Map.get(params, "secret", "")
+    {:noreply, assign(socket, prefill_secret_label: Map.get(params, "secret_label", ""))}
-    {:noreply, assign(socket, secret: %{"label" => label, "value" => ""})}
   end
 
   def handle_params(_params, _url, socket) do

lib/livebook_web/live/session_live/secrets_component.ex

@@ -1,6 +1,20 @@
 defmodule LivebookWeb.SessionLive.SecretsComponent do
   use LivebookWeb, :live_component
 
+  @impl true
+  def update(assigns, socket) do
+    socket = assign(socket, assigns)
+
+    socket =
+      if socket.assigns[:data] do
+        socket
+      else
+        assign(socket, data: %{"label" => assigns.prefill_secret_label, "value" => ""})
+      end
+
+    {:ok, socket}
+  end
+
   @impl true
   def render(assigns) do
     ~H"""
@@ -13,7 +27,7 @@ defmodule LivebookWeb.SessionLive.SecretsComponent do
       </p>
       <.form
         let={f}
-        for={:secret}
+        for={:data}
         phx-submit="save"
         phx-change="validate"
         autocomplete="off"
@@ -25,7 +39,7 @@ defmodule LivebookWeb.SessionLive.SecretsComponent do
               Label <span class="text-xs text-gray-500">(alphanumeric and underscore)</span>
             </div>
             <%= text_input(f, :label,
-              value: @secret["label"],
+              value: @data["label"],
               class: "input",
               placeholder: "secret label",
               autofocus: true,
@@ -36,7 +50,7 @@ defmodule LivebookWeb.SessionLive.SecretsComponent do
           <div>
             <div class="input-label">Value</div>
             <%= text_input(f, :value,
-              value: @secret["value"],
+              value: @data["value"],
               class: "input",
               placeholder: "secret value",
               aria_labelledby: "secret-value",
@@ -44,7 +58,7 @@ defmodule LivebookWeb.SessionLive.SecretsComponent do
             ) %>
           </div>
           <div class="flex space-x-2">
-            <button class="button-base button-blue" type="submit" disabled={not valid?(@secret)}>
+            <button class="button-base button-blue" type="submit" disabled={not data_valid?(@data)}>
               Save
             </button>
             <%= live_patch("Cancel", to: @return_to, class: "button-base button-outlined-gray") %>
@@ -56,17 +70,17 @@ defmodule LivebookWeb.SessionLive.SecretsComponent do
   end
 
   @impl true
-  def handle_event("save", %{"secret" => secret}, socket) do
+  def handle_event("save", %{"data" => data}, socket) do
-    secret = %{label: String.upcase(secret["label"]), value: secret["value"]}
+    secret = %{label: String.upcase(data["label"]), value: data["value"]}
     Livebook.Session.put_secret(socket.assigns.session.pid, secret)
-    {:noreply, assign(socket, secret: %{"label" => "", "value" => ""})}
+    {:noreply, assign(socket, data: %{"label" => "", "value" => ""})}
   end
 
-  def handle_event("validate", %{"secret" => secret}, socket) do
+  def handle_event("validate", %{"data" => data}, socket) do
-    {:noreply, assign(socket, secret: secret)}
+    {:noreply, assign(socket, data: data)}
   end
 
-  defp valid?(secret) do
+  defp data_valid?(data) do
-    String.match?(secret["label"], ~r/^\w+$/) and secret["value"] != ""
+    String.match?(data["label"], ~r/^\w+$/) and data["value"] != ""
   end
 end

test/livebook_web/live/session_live_test.exs

@@ -919,7 +919,7 @@ defmodule LivebookWeb.SessionLiveTest do
 
       view
       |> element(~s{form[phx-submit="save"]})
-      |> render_submit(%{secret: %{label: "foo", value: "123"}})
+      |> render_submit(%{data: %{label: "foo", value: "123"}})
 
       assert %{secrets: [%{label: "FOO", value: "123"}]} = Session.get_data(session.pid)
     end