Improve admin UI

Author: AjaiKN

lib/password_example_web/live/admin_live.ex

@@ -10,10 +10,18 @@ defmodule PasswordExampleWeb.AdminLive do
   end
 
   @impl true
-  def handle_event("change_hash_type", %{"value" => hash_type}, socket) do
-    hash_type = String.to_atom(hash_type)
+  def handle_event("change_hash_type", %{"change_hash_type" => %{"hash_type" => hash_type_str}}, socket) do
+    hash_type = String.to_atom(hash_type_str)
     HashingAlgorithmChoice.set(hash_type)
+    socket = socket
+      |> assign(hash_type: hash_type)
+      |> put_flash(:info, "Changed hash type to " <> hash_type_str)
+    {:noreply, socket}
+  end
+
+  @impl true
+  def handle_event("delete_all_users", _, socket) do
     User.delete_all()
-    {:noreply, assign(socket, hash_type: hash_type)}
+    {:noreply, socket}
   end
 end

lib/password_example_web/live/admin_live.html.leex

@@ -1,6 +1,15 @@
 <h1>Admin</h1>
 
-<%= select :hash_type, :hash_type, HashingAlgorithmChoice.choices, value: @hash_type, phx_blur: "change_hash_type" %>
-<button type="button">Delete Users and Change Hash Type</button>
+<%= f = form_for :change_hash_type, "#", [phx_submit: "change_hash_type", style: "display: flex; gap: 1rem"] %>
+	<label>
+		Current hash type:
+		<%= select f, :hash_type, HashingAlgorithmChoice.choices, value: @hash_type %>
+	</label>
+	<%= submit "Change hash type" %>
+</form>
+
+<%= form_for :delete_all_users, "#", [phx_submit: "delete_all_users"] %>
+	<%= submit "Delete all users" %>
+</form>
 
 <%= live_component @socket, UsersTableComponent, id: :users_table %>