Add wrapper for garnish/2 for phx event

lib/outlook/internal_tree.ex

@@ -27,6 +27,16 @@ defmodule Outlook.InternalTree do
     |> RawInternalBasic.partition_to_tunits()
   end
 
+  def add_phx_click_event(tree, opts) do
+    phx_opts = %{
+      "phx-click": Keyword.get(opts, :click),
+      "phx-target": Keyword.get(opts, :target) |> to_string,
+      "phx-value-nid": fn n -> n.nid end
+    }
+    options = Map.put(%{}, Keyword.get(opts, :nodes, :elements), phx_opts)
+    garnish(tree, options)
+  end
+
   def garnish(tree, options) do
     options = Enum.reduce(
       ~w(el_ids el_names tu_ids)a,

lib/outlook_web/live/translation_live/form_component.ex

@@ -141,8 +141,10 @@ defmodule OutlookWeb.TranslationLive.FormComponent do
      socket
      |> assign(
       :article_tree,
-      InternalTree.garnish(translation.article.content,
+      InternalTree.add_phx_click_event(translation.article.content,
-        %{tunits: %{phx: %{click: "select_current_tunit", target: socket.assigns.myself}}}))
+        nodes: :tunits,
+        click: "select_current_tunit",
+        target: socket.assigns.myself))
   end
 
   defp update_translation_with_current_tunit(socket, nil), do: socket