Packages

phoenix_live_dashboard

0.1.1
0.8.7 0.8.6 0.8.5 0.8.4 0.8.4-rc.0 0.8.3 0.8.2 0.8.1 0.8.0 0.7.2 0.7.1 0.7.0 0.6.5 0.6.4 0.6.3 0.6.2 0.6.1 0.6.0 0.5.3 0.5.2 0.5.1 0.5.0 0.4.0 0.3.6 0.3.5 0.3.4 retired 0.3.3 0.3.2 0.3.1 0.3.0 0.2.10 0.2.9 0.2.8 0.2.7 0.2.6 0.2.5 0.2.4 0.2.3 0.2.2 0.2.1 0.2.0 0.1.1 0.1.0

Real-time performance dashboard for Phoenix

HexDocs

Current section

43 Versions

Jump to
Readme
43 Versions
3 Dependencies
Dependants
Files
Activity
Hide whitespace

Compare versions

12 files changed
+49 additions
-30 deletions
  @@ -1,5 +1,12 @@
1 1 # CHANGELOG
2 2
3 - ## 0.1.0 (2020-04-16)
3 + ## v0.1.1 (2020-04-18)
4 +
5 + * Respect script_name on dashboard socket url
6 + * Add hint for Total input/output
7 + * Fix metric charts on Safari
8 + * Fix Process search for Erlang modules
9 +
10 + ## v0.1.0 (2020-04-16)
4 11
5 12 * Initial release.
  @@ -16,6 +16,8 @@ LiveDashboard provides real-time performance monitoring and debugging tools for
16 16
17 17 The dashboard also works across nodes. If your nodes are connected via Distributed Erlang, then you can access information from node B while accessing the dashboard on node A.
18 18
19 + ![screenshot](https://github.com/phoenixframework/phoenix_live_dashboard/raw/master/screenshot.png)
20 +
19 21 ## Installation
20 22
21 23 To start using LiveDashboard, you will need three steps:
  @@ -31,7 +33,7 @@ Add the following to your `mix.exs` and run `mix deps.get`:
31 33 ```elixir
32 34 def deps do
33 35 [
34 - {:phoenix_live_dashboard, github: "phoenixframework/phoenix_live_dashboard"}
36 + {:phoenix_live_dashboard, "~> 0.1"}
35 37 ]
36 38 end
37 39 ```
  @@ -45,13 +47,16 @@ This guide only covers the minimum steps necessary for the LiveDashboard itself
45 47
46 48 First, update your endpoint's configuration to include a signing salt. You can generate a signing salt by running `mix phx.gen.secret 32` (note Phoenix v1.5+ apps already have this configuration):
47 49
48 - # config/config.exs
49 - config :my_app, MyAppWeb.Endpoint,
50 - live_view: [signing_salt: "SECRET_SALT"]
51 -
50 + ```elixir
51 + # config/config.exs
52 + config :my_app, MyAppWeb.Endpoint,
53 + live_view: [signing_salt: "SECRET_SALT"]
54 + ```
52 55 Then add the `Phoenix.LiveView.Socket` declaration to your endpoint:
53 56
54 - socket "/live", Phoenix.LiveView.Socket
57 + ```elixir
58 + socket "/live", Phoenix.LiveView.Socket
59 + ```
55 60
56 61 And you are good to go!
57 62
  @@ -104,6 +109,7 @@ end
104 109
105 110 For those planning to contribute to this project, you can run a dev version of the dashboard with the following commands:
106 111
112 + $ mix deps.get
107 113 $ npm install --prefix assets
108 114 $ mix run --no-halt dev.exs
109 115
  @@ -111,4 +117,4 @@ Alternatively, run `iex -S mix run dev.exs` if you also want a shell.
111 117
112 118 ## License
113 119
114 - MIT License. Copyright (c) 2019 Michael Crumm, Chris McCord, José Valim.
\ No newline at end of file
120 + MIT License. Copyright (c) 2019 Michael Crumm, Chris McCord, José Valim.
  @@ -1,6 +1,6 @@
1 1 {<<"app">>,<<"phoenix_live_dashboard">>}.
2 2 {<<"build_tools">>,[<<"mix">>]}.
3 - {<<"description">>,<<"Real-time performance monitor and tracer for Phoenix">>}.
3 + {<<"description">>,<<"Real-time performance dashboard for Phoenix">>}.
4 4 {<<"elixir">>,<<"~> 1.7">>}.
5 5 {<<"files">>,
6 6 [<<"lib">>,<<"lib/phoenix">>,<<"lib/phoenix/live_dashboard">>,
  @@ -54,4 +54,4 @@
54 54 {<<"optional">>,false},
55 55 {<<"repository">>,<<"hexpm">>},
56 56 {<<"requirement">>,<<"~> 2.14.1 or ~> 2.15">>}]]}.
57 - {<<"version">>,<<"0.1.0">>}.
57 + {<<"version">>,<<"0.1.1">>}.
  @@ -13,4 +13,8 @@ defmodule Phoenix.LiveDashboard.LayoutView do
13 13
14 14 def render("app.js", _), do: @app_js
15 15 def render("app.css", _), do: @app_css
16 +
17 + def live_socket_path(conn) do
18 + [Enum.map(conn.script_name, &["/" | &1]) | "/live"]
19 + end
16 20 end
  @@ -82,14 +82,24 @@ defmodule Phoenix.LiveDashboard.HomeLive do
82 82
83 83 <div class="col-lg-4 mb-4">
84 84 <div class="banner-card">
85 - <h6 class="banner-card-title">Total input</h6>
85 + <h6 class="banner-card-title">
86 + Total input
87 + <%= hint do %>
88 + The total number of bytes received through ports/sockets.
89 + <% end %>
90 + </h6>
86 91 <div class="banner-card-value"><%= SystemInfo.format_bytes(@system_usage.io |> elem(0)) %></div>
87 92 </div>
88 93 </div>
89 94
90 95 <div class="col-lg-4 mb-4">
91 96 <div class="banner-card">
92 - <h6 class="banner-card-title">Total output</h6>
97 + <h6 class="banner-card-title">
98 + Total output
99 + <%= hint do %>
100 + The total number of bytes output to ports/sockets.
101 + <% end %>
102 + </h6>
93 103 <div class="banner-card-value"><%= SystemInfo.format_bytes(@system_usage.io |> elem(1)) %></div>
94 104 </div>
95 105 </div>
Loading more files…