Update LV, run formatter

.formatter.exs

@@ -6,6 +6,7 @@ locals_without_parens = [
 
 [
   import_deps: [:phoenix],
+  plugins: [Phoenix.LiveView.HTMLFormatter],
   inputs: ["*.{ex,exs}", "{config,lib,test}/**/*.{ex,exs}"],
   locals_without_parens: locals_without_parens,
   export: [locals_without_parens: locals_without_parens]

lib/phoenix/live_dashboard/components/chart_component.ex

@@ -52,17 +52,18 @@ defmodule Phoenix.LiveDashboard.ChartComponent do
           <div phx-hook="PhxChartComponent" id={"chart-#{@id}-datasets"} hidden>
             <span :for={{_id, {x, y, z}} <- @streams.data} data-x={x} data-y={y} data-z={z}></span>
           </div>
-          <div class="chart"
-              id={"chart-ignore-#{@id}"}
-              phx-update="ignore"
-              data-label={@label}
-              data-metric={@kind}
-              data-title={@title}
-              data-tags={Enum.join(@tags, "-")}
-              data-unit={@unit}
-              data-prune-threshold={@prune_threshold}
-              {bucket_size(@bucket_size)}
-            >
+          <div
+            class="chart"
+            id={"chart-ignore-#{@id}"}
+            phx-update="ignore"
+            data-label={@label}
+            data-metric={@kind}
+            data-title={@title}
+            data-tags={Enum.join(@tags, "-")}
+            data-unit={@unit}
+            data-prune-threshold={@prune_threshold}
+            {bucket_size(@bucket_size)}
+          >
           </div>
         </div>
         <Phoenix.LiveDashboard.PageBuilder.hint :if={@hint} text={@hint} />

lib/phoenix/live_dashboard/components/layered_graph_component.ex

@@ -97,12 +97,21 @@ defmodule Phoenix.LiveDashboard.LayeredGraphComponent do
       <Phoenix.LiveDashboard.PageBuilder.card_title title={@title} hint={@hint} />
       <div class="card layered-graph">
         <div class="card-body">
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          viewBox={"0 0 #{@view_box_width} #{@view_box_height}"}
-          style={"width: #{if @scale_up, do: @scale_up, else: 100}%;"}>
+          <svg
+            xmlns="http://www.w3.org/2000/svg"
+            viewBox={"0 0 #{@view_box_width} #{@view_box_height}"}
+            style={"width: #{if @scale_up, do: @scale_up, else: 100}%;"}
+          >
             <defs>
-              <marker id="arrow" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">
+              <marker
+                id="arrow"
+                markerWidth="10"
+                markerHeight="10"
+                refX="0"
+                refY="3"
+                orient="auto"
+                markerUnits="strokeWidth"
+              >
                 <path d="M0,0 L0,6 L9,3 z" class="connection-line" />
               </marker>
 
@@ -118,18 +127,29 @@ defmodule Phoenix.LiveDashboard.LayeredGraphComponent do
             <rect :if={@show_grid?} width="100%" height="100%" fill="url(#grid)" />
 
             <%= for arrow <- @arrows do %>
-              <line x1={arrow.x1} y1={arrow.y1} x2={arrow.x2} y2={arrow.y2} class="connection-line" marker-end="url(#arrow)"/>
+              <line
+                x1={arrow.x1}
+                y1={arrow.y1}
+                x2={arrow.x2}
+                y2={arrow.y2}
+                class="connection-line"
+                marker-end="url(#arrow)"
+              />
             <% end %>
             <%= for circle <- @circles do %>
-             <g>
-              <circle fill={circle.bg} cx={circle.x} cy={circle.y} r={@radius} class="node" />
-              <%= if circle.show_detail? do %>
-                <text x={circle.x} y={circle.y} class="node-label"><%= circle.label %></text>
-                <text x={circle.x} y={circle.y + @y_detail_offset} class="node-detail"><%= circle.detail %></text>
-              <% else %>
-                <text x={circle.x} y={circle.y + @y_label_offset} class="node-label"><%= circle.label %></text>
-              <% end %>
-             </g>
+              <g>
+                <circle fill={circle.bg} cx={circle.x} cy={circle.y} r={@radius} class="node" />
+                <%= if circle.show_detail? do %>
+                  <text x={circle.x} y={circle.y} class="node-label"><%= circle.label %></text>
+                  <text x={circle.x} y={circle.y + @y_detail_offset} class="node-detail">
+                    <%= circle.detail %>
+                  </text>
+                <% else %>
+                  <text x={circle.x} y={circle.y + @y_label_offset} class="node-label">
+                    <%= circle.label %>
+                  </text>
+                <% end %>
+              </g>
             <% end %>
           </svg>
         </div>

lib/phoenix/live_dashboard/components/nav_bar_component.ex

@@ -140,7 +140,10 @@ defmodule Phoenix.LiveDashboard.NavBarComponent do
         <div class="container">
           <ul class={"nav nav-#{@style} mt-n2 mb-4"}>
             <li :for={item <- @items} class="nav-item">
-              <.link {item_link_href(@socket, @page, item, @nav_param, @extra_params)} class={item_link_class(item, @current)}>
+              <.link
+                {item_link_href(@socket, @page, item, @nav_param, @extra_params)}
+                class={item_link_class(item, @current)}
+              >
                 <%= item_label(item) %>
               </.link>
             </li>

lib/phoenix/live_dashboard/components/table_component.ex

@@ -158,7 +158,14 @@ defmodule Phoenix.LiveDashboard.TableComponent do
         <form phx-change="search" phx-submit="search" phx-target={@myself} class="form-inline">
           <div class="form-row align-items-center">
             <div class="col-auto">
-              <input type="search" name="search" class="form-control form-control-sm" value={@table_params.search} placeholder="Search" phx-debounce="300">
+              <input
+                type="search"
+                name="search"
+                class="form-control form-control-sm"
+                value={@table_params.search}
+                placeholder="Search"
+                phx-debounce="300"
+              />
             </div>
           </div>
         </form>
@@ -194,7 +201,12 @@ defmodule Phoenix.LiveDashboard.TableComponent do
                 <tr>
                   <th :for={column <- @columns} class={col_class(@dom_id, column)}>
                     <%= if column[:sortable] do %>
-                      <.sort_link socket={@socket} page={@page} table_params={@table_params} column={column}/>
+                      <.sort_link
+                        socket={@socket}
+                        page={@page}
+                        table_params={@table_params}
+                        column={column}
+                      />
                     <% else %>
                       <%= column[:header] || column[:field] %>
                     <% end %>
@@ -208,7 +220,7 @@ defmodule Phoenix.LiveDashboard.TableComponent do
                       <%= render_slot(column, row) %>
                     <% else %>
                       <%= row[column.field] |> to_string() %>
-                  <% end %>
+                    <% end %>
                   </td>
                 </tr>
               </tbody>
@@ -252,14 +264,16 @@ defmodule Phoenix.LiveDashboard.TableComponent do
   defp sort_link(assigns) do
     if assigns.table_params.sort_by == assigns.column.field do
       ~H"""
-      <.link patch={PageBuilder.live_dashboard_path(@socket, @page, reverse_sort_dir(@table_params))} >
+      <.link patch={PageBuilder.live_dashboard_path(@socket, @page, reverse_sort_dir(@table_params))}>
         <%= column_header(@column) %>
         <.sort_link_icon dir={@table_params.sort_dir} />
       </.link>
       """
     else
       ~H"""
-      <.link patch={PageBuilder.live_dashboard_path(@socket, @page, replace_sort_dir(@table_params, @column))} >
+      <.link patch={
+        PageBuilder.live_dashboard_path(@socket, @page, replace_sort_dir(@table_params, @column))
+      }>
         <%= column_header(@column) %>
       </.link>
       """

lib/phoenix/live_dashboard/components/title_bar_component.ex

@@ -12,15 +12,17 @@ defmodule Phoenix.LiveDashboard.TitleBarComponent do
         <div class="d-flex justify-content-between">
           <%= render_slot(@inner_block) %>
         </div>
-        <style nonce={@csp_nonces.style}>#<%= "#{@dom_id}-progress" %>{width:<%= @percent %>%}</style>
+        <style nonce={@csp_nonces.style}>
+          #<%= "#{@dom_id}-progress" %>{width:<%= @percent %>%}
+        </style>
         <div class="progress flex-grow-1 mt-2">
           <div
-          class={"progress-bar bg-#{@color}"}
-          role="progressbar"
-          aria-valuenow={@percent}
-          aria-valuemin="0"
-          aria-valuemax="100"
-          id={"#{@dom_id}-progress"}
+            class={"progress-bar bg-#{@color}"}
+            role="progressbar"
+            aria-valuenow={@percent}
+            aria-valuemin="0"
+            aria-valuemax="100"
+            id={"#{@dom_id}-progress"}
           >
           </div>
         </div>

lib/phoenix/live_dashboard/info/app_info_component.ex

@@ -8,11 +8,26 @@ defmodule Phoenix.LiveDashboard.AppInfoComponent do
     ~H"""
     <div class="app-info">
       <%= if @alive do %>
-        <svg width={@width} height={@height} id="tree" class="tree" >
+        <svg width={@width} height={@height} id="tree" class="tree">
           <%= for node <- @nodes do %>
-            <rect x={node.x} y={node.y} rx="10" ry="10" width={node.width} height={node.height}
-            class="node" phx-click="show_info" phx-value-info={node_encoded_pid(node.value)} phx-page-loading />
-            <text class="tree-node-text" x={node.x + 10} y={node.y + div(node.height, 2)} dominant-baseline="central">
+            <rect
+              x={node.x}
+              y={node.y}
+              rx="10"
+              ry="10"
+              width={node.width}
+              height={node.height}
+              class="node"
+              phx-click="show_info"
+              phx-value-info={node_encoded_pid(node.value)}
+              phx-page-loading
+            />
+            <text
+              class="tree-node-text"
+              x={node.x + 10}
+              y={node.y + div(node.height, 2)}
+              dominant-baseline="central"
+            >
               <%= node.label %>
             </text>
           <% end %>

lib/phoenix/live_dashboard/info/modal_component.ex

@@ -18,25 +18,34 @@ defmodule Phoenix.LiveDashboard.ModalComponent do
 
   def render(assigns) do
     ~H"""
-    <div id={@id} class="dash-modal modal"
+    <div
+      id={@id}
+      class="dash-modal modal"
       tabindex="-1"
       phx-capture-click="close"
       phx-window-keydown="close"
       phx-key="escape"
       phx-target={"##{@id}"}
-      phx-page-loading>
+      phx-page-loading
+    >
       <div class="modal-dialog modal-lg" id="modal-container">
         <div class="modal-content">
           <div class="modal-header">
-            <h6 class="modal-title"><%=@title %></h6>
+            <h6 class="modal-title"><%= @title %></h6>
             <div class="modal-action">
               <span phx-click={enable_fullscreen()} class="modal-action-item mr-3" id="fullscreen-on">
                 &square;
               </span>
-              <span phx-click={disable_fullscreen()} class="modal-action-item mr-3 modal-action-hidden" id="fullscreen-off">
+              <span
+                phx-click={disable_fullscreen()}
+                class="modal-action-item mr-3 modal-action-hidden"
+                id="fullscreen-off"
+              >
                 &minus;
               </span>
-              <.link patch={@return_to} class="modal-action-item mt-n1" id="modal-close">&times;</.link>
+              <.link patch={@return_to} class="modal-action-item mt-n1" id="modal-close">
+                &times;
+              </.link>
             </div>
           </div>
           <div class="modal-body">

lib/phoenix/live_dashboard/info/port_info_component.ex

@@ -70,7 +70,9 @@ defmodule Phoenix.LiveDashboard.PortInfoComponent do
 
   defp info(%{links: links} = assigns) when is_list(links) do
     ~H"""
-    <%= for info <- @links do %><%= info %><% end %>
+    <%= for info <- @links do %>
+      <%= info %>
+    <% end %>
     """
   end
 

lib/phoenix/live_dashboard/info/process_info_component.ex

@@ -118,7 +118,9 @@ defmodule Phoenix.LiveDashboard.ProcessInfoComponent do
 
   defp info(%{links: links} = assigns) when is_list(links) do
     ~H"""
-    <%= for info <- @links do %><%= info %><% end %>
+    <%= for info <- @links do %>
+      <%= info %>
+    <% end %>
     """
   end