Current section
43 Versions
Jump to
Current section
43 Versions
Compare versions
24
files changed
+301
additions
-185
deletions
| @@ -2,7 +2,7 @@ | |
| 2 2 | [{<<"github">>, |
| 3 3 | <<"https://github.com/phoenixframework/phoenix_live_dashboard">>}]}. |
| 4 4 | {<<"name">>,<<"phoenix_live_dashboard">>}. |
| 5 | - {<<"version">>,<<"0.8.1">>}. |
| 5 | + {<<"version">>,<<"0.8.2">>}. |
| 6 6 | {<<"description">>,<<"Real-time performance dashboard for Phoenix">>}. |
| 7 7 | {<<"elixir">>,<<"~> 1.12">>}. |
| 8 8 | {<<"app">>,<<"phoenix_live_dashboard">>}. |
| @@ -63,7 +63,7 @@ | |
| 63 63 | [{<<"name">>,<<"phoenix_live_view">>}, |
| 64 64 | {<<"app">>,<<"phoenix_live_view">>}, |
| 65 65 | {<<"optional">>,false}, |
| 66 | - {<<"requirement">>,<<"~> 0.19.0">>}, |
| 66 | + {<<"requirement">>,<<"~> 0.19 or ~> 1.0">>}, |
| 67 67 | {<<"repository">>,<<"hexpm">>}], |
| 68 68 | [{<<"name">>,<<"telemetry_metrics">>}, |
| 69 69 | {<<"app">>,<<"telemetry_metrics">>}, |
| @@ -52,17 +52,18 @@ defmodule Phoenix.LiveDashboard.ChartComponent do | |
| 52 52 | <div phx-hook="PhxChartComponent" id={"chart-#{@id}-datasets"} hidden> |
| 53 53 | <span :for={{_id, {x, y, z}} <- @streams.data} data-x={x} data-y={y} data-z={z}></span> |
| 54 54 | </div> |
| 55 | - <div class="chart" |
| 56 | - id={"chart-ignore-#{@id}"} |
| 57 | - phx-update="ignore" |
| 58 | - data-label={@label} |
| 59 | - data-metric={@kind} |
| 60 | - data-title={@title} |
| 61 | - data-tags={Enum.join(@tags, "-")} |
| 62 | - data-unit={@unit} |
| 63 | - data-prune-threshold={@prune_threshold} |
| 64 | - {bucket_size(@bucket_size)} |
| 65 | - > |
| 55 | + <div |
| 56 | + class="chart" |
| 57 | + id={"chart-ignore-#{@id}"} |
| 58 | + phx-update="ignore" |
| 59 | + data-label={@label} |
| 60 | + data-metric={@kind} |
| 61 | + data-title={@title} |
| 62 | + data-tags={Enum.join(@tags, "-")} |
| 63 | + data-unit={@unit} |
| 64 | + data-prune-threshold={@prune_threshold} |
| 65 | + {bucket_size(@bucket_size)} |
| 66 | + > |
| 66 67 | </div> |
| 67 68 | </div> |
| 68 69 | <Phoenix.LiveDashboard.PageBuilder.hint :if={@hint} text={@hint} /> |
| @@ -97,12 +97,21 @@ defmodule Phoenix.LiveDashboard.LayeredGraphComponent do | |
| 97 97 | <Phoenix.LiveDashboard.PageBuilder.card_title title={@title} hint={@hint} /> |
| 98 98 | <div class="card layered-graph"> |
| 99 99 | <div class="card-body"> |
| 100 | - <svg |
| 101 | - xmlns="http://www.w3.org/2000/svg" |
| 102 | - viewBox={"0 0 #{@view_box_width} #{@view_box_height}"} |
| 103 | - style={"width: #{if @scale_up, do: @scale_up, else: 100}%;"}> |
| 100 | + <svg |
| 101 | + xmlns="http://www.w3.org/2000/svg" |
| 102 | + viewBox={"0 0 #{@view_box_width} #{@view_box_height}"} |
| 103 | + style={"width: #{if @scale_up, do: @scale_up, else: 100}%;"} |
| 104 | + > |
| 104 105 | <defs> |
| 105 | - <marker id="arrow" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth"> |
| 106 | + <marker |
| 107 | + id="arrow" |
| 108 | + markerWidth="10" |
| 109 | + markerHeight="10" |
| 110 | + refX="0" |
| 111 | + refY="3" |
| 112 | + orient="auto" |
| 113 | + markerUnits="strokeWidth" |
| 114 | + > |
| 106 115 | <path d="M0,0 L0,6 L9,3 z" class="connection-line" /> |
| 107 116 | </marker> |
| 108 117 | |
| @@ -118,18 +127,29 @@ defmodule Phoenix.LiveDashboard.LayeredGraphComponent do | |
| 118 127 | <rect :if={@show_grid?} width="100%" height="100%" fill="url(#grid)" /> |
| 119 128 | |
| 120 129 | <%= for arrow <- @arrows do %> |
| 121 | - <line x1={arrow.x1} y1={arrow.y1} x2={arrow.x2} y2={arrow.y2} class="connection-line" marker-end="url(#arrow)"/> |
| 130 | + <line |
| 131 | + x1={arrow.x1} |
| 132 | + y1={arrow.y1} |
| 133 | + x2={arrow.x2} |
| 134 | + y2={arrow.y2} |
| 135 | + class="connection-line" |
| 136 | + marker-end="url(#arrow)" |
| 137 | + /> |
| 122 138 | <% end %> |
| 123 139 | <%= for circle <- @circles do %> |
| 124 | - <g> |
| 125 | - <circle fill={circle.bg} cx={circle.x} cy={circle.y} r={@radius} class="node" /> |
| 126 | - <%= if circle.show_detail? do %> |
| 127 | - <text x={circle.x} y={circle.y} class="node-label"><%= circle.label %></text> |
| 128 | - <text x={circle.x} y={circle.y + @y_detail_offset} class="node-detail"><%= circle.detail %></text> |
| 129 | - <% else %> |
| 130 | - <text x={circle.x} y={circle.y + @y_label_offset} class="node-label"><%= circle.label %></text> |
| 131 | - <% end %> |
| 132 | - </g> |
| 140 | + <g> |
| 141 | + <circle fill={circle.bg} cx={circle.x} cy={circle.y} r={@radius} class="node" /> |
| 142 | + <%= if circle.show_detail? do %> |
| 143 | + <text x={circle.x} y={circle.y} class="node-label"><%= circle.label %></text> |
| 144 | + <text x={circle.x} y={circle.y + @y_detail_offset} class="node-detail"> |
| 145 | + <%= circle.detail %> |
| 146 | + </text> |
| 147 | + <% else %> |
| 148 | + <text x={circle.x} y={circle.y + @y_label_offset} class="node-label"> |
| 149 | + <%= circle.label %> |
| 150 | + </text> |
| 151 | + <% end %> |
| 152 | + </g> |
| 133 153 | <% end %> |
| 134 154 | </svg> |
| 135 155 | </div> |
| @@ -140,7 +140,10 @@ defmodule Phoenix.LiveDashboard.NavBarComponent do | |
| 140 140 | <div class="container"> |
| 141 141 | <ul class={"nav nav-#{@style} mt-n2 mb-4"}> |
| 142 142 | <li :for={item <- @items} class="nav-item"> |
| 143 | - <.link {item_link_href(@socket, @page, item, @nav_param, @extra_params)} class={item_link_class(item, @current)}> |
| 143 | + <.link |
| 144 | + {item_link_href(@socket, @page, item, @nav_param, @extra_params)} |
| 145 | + class={item_link_class(item, @current)} |
| 146 | + > |
| 144 147 | <%= item_label(item) %> |
| 145 148 | </.link> |
| 146 149 | </li> |
| @@ -158,7 +158,14 @@ defmodule Phoenix.LiveDashboard.TableComponent do | |
| 158 158 | <form phx-change="search" phx-submit="search" phx-target={@myself} class="form-inline"> |
| 159 159 | <div class="form-row align-items-center"> |
| 160 160 | <div class="col-auto"> |
| 161 | - <input type="search" name="search" class="form-control form-control-sm" value={@table_params.search} placeholder="Search" phx-debounce="300"> |
| 161 | + <input |
| 162 | + type="search" |
| 163 | + name="search" |
| 164 | + class="form-control form-control-sm" |
| 165 | + value={@table_params.search} |
| 166 | + placeholder="Search" |
| 167 | + phx-debounce="300" |
| 168 | + /> |
| 162 169 | </div> |
| 163 170 | </div> |
| 164 171 | </form> |
| @@ -194,7 +201,12 @@ defmodule Phoenix.LiveDashboard.TableComponent do | |
| 194 201 | <tr> |
| 195 202 | <th :for={column <- @columns} class={col_class(@dom_id, column)}> |
| 196 203 | <%= if column[:sortable] do %> |
| 197 | - <.sort_link socket={@socket} page={@page} table_params={@table_params} column={column}/> |
| 204 | + <.sort_link |
| 205 | + socket={@socket} |
| 206 | + page={@page} |
| 207 | + table_params={@table_params} |
| 208 | + column={column} |
| 209 | + /> |
| 198 210 | <% else %> |
| 199 211 | <%= column[:header] || column[:field] %> |
| 200 212 | <% end %> |
| @@ -208,7 +220,7 @@ defmodule Phoenix.LiveDashboard.TableComponent do | |
| 208 220 | <%= render_slot(column, row) %> |
| 209 221 | <% else %> |
| 210 222 | <%= row[column.field] |> to_string() %> |
| 211 | - <% end %> |
| 223 | + <% end %> |
| 212 224 | </td> |
| 213 225 | </tr> |
| 214 226 | </tbody> |
| @@ -252,14 +264,16 @@ defmodule Phoenix.LiveDashboard.TableComponent do | |
| 252 264 | defp sort_link(assigns) do |
| 253 265 | if assigns.table_params.sort_by == assigns.column.field do |
| 254 266 | ~H""" |
| 255 | - <.link patch={PageBuilder.live_dashboard_path(@socket, @page, reverse_sort_dir(@table_params))} > |
| 267 | + <.link patch={PageBuilder.live_dashboard_path(@socket, @page, reverse_sort_dir(@table_params))}> |
| 256 268 | <%= column_header(@column) %> |
| 257 269 | <.sort_link_icon dir={@table_params.sort_dir} /> |
| 258 270 | </.link> |
| 259 271 | """ |
| 260 272 | else |
| 261 273 | ~H""" |
| 262 | - <.link patch={PageBuilder.live_dashboard_path(@socket, @page, replace_sort_dir(@table_params, @column))} > |
| 274 | + <.link patch={ |
| 275 | + PageBuilder.live_dashboard_path(@socket, @page, replace_sort_dir(@table_params, @column)) |
| 276 | + }> |
| 263 277 | <%= column_header(@column) %> |
| 264 278 | </.link> |
| 265 279 | """ |
Loading more files…