From b14872436b1bb6edd6ade3b7a634c401121b576e Mon Sep 17 00:00:00 2001 From: Daniel Gomez de Souza Date: Tue, 28 Sep 2021 09:43:34 -0300 Subject: [PATCH 01/14] Extract function components --- .../live/console_live/sidebar_component.ex | 56 +++++++++++++++++++ .../console_live/sidebar_component.html.heex | 40 ++----------- 2 files changed, 60 insertions(+), 36 deletions(-) diff --git a/lib/elixir_console_web/live/console_live/sidebar_component.ex b/lib/elixir_console_web/live/console_live/sidebar_component.ex index 3887016..5625f0d 100644 --- a/lib/elixir_console_web/live/console_live/sidebar_component.ex +++ b/lib/elixir_console_web/live/console_live/sidebar_component.ex @@ -6,4 +6,60 @@ defmodule ElixirConsoleWeb.ConsoleLive.SidebarComponent do """ use Phoenix.LiveComponent + + def bindings(assigns) do + ~H""" +
+

Current Bindings

+ +
+ """ + end + + def suggestions(assigns) do + ~H""" +

Suggestions:

+ + """ + end + + def contextual_help(assigns) do + ~H""" +
+ + <%= @func_name %> + + <%= @header %> + <%= Phoenix.HTML.raw @doc %> +
+ """ + end + + def instructions(assigns) do + ~H""" +

INSTRUCTIONS

+

[UP] [DOWN]: Navigate through commands history

+

[TAB]: Get suggestions or autocomplete while typing

+

You can see the history panel that includes all your commands and their output. + Click on any Elixir function to see here the corresponding documentation.

+

ABOUT SECURITY

+

Please note some features of the language are not safe to run in a shared environment like this console. + If you are interested in knowing more about the limitations, you must read here.

+

Please report any security vulnerabilities to + elixir-console-security@wyeworks.com. +

+ """ + end end diff --git a/lib/elixir_console_web/live/console_live/sidebar_component.html.heex b/lib/elixir_console_web/live/console_live/sidebar_component.html.heex index fbe80a7..16d568a 100644 --- a/lib/elixir_console_web/live/console_live/sidebar_component.html.heex +++ b/lib/elixir_console_web/live/console_live/sidebar_component.html.heex @@ -1,46 +1,14 @@
-
-

Current Bindings

-
    - <%= if length(@sandbox.bindings) > 0 do %> - <%= for {key, value} <- @sandbox.bindings do %> -
  • <%= key %>: <%= inspect(value) %>
    • - <% end %> - <% else %> - No bindings yet! - <% end %> -
-
+ <.bindings bindings={@sandbox.bindings} />
<%= if @suggestions != [] do %> -

Suggestions:

+ <.suggestions suggestions={@suggestions}/> <% else %> <%= if @contextual_help do %> -
- - <%= @contextual_help[:func_name] %> - - <%= @contextual_help[:header] %> - <%= Phoenix.HTML.raw @contextual_help[:doc] %> -
+ <.contextual_help {@contextual_help} /> <% else %> -

INSTRUCTIONS

-

[UP] [DOWN]: Navigate through commands history

-

[TAB]: Get suggestions or autocomplete while typing

-

You can see the history panel that includes all your commands and their output. - Click on any Elixir function to see here the corresponding documentation.

-

ABOUT SECURITY

-

Please note some features of the language are not safe to run in a shared environment like this console. - If you are interested in knowing more about the limitations, you must read here.

-

Please report any security vulnerabilities to - elixir-console-security@wyeworks.com. -

+ <.instructions /> <% end %> <% end %> -
    - <%= for suggestion <- @suggestions do %> -
  • <%= suggestion %>
    • - <% end %> -
From b49ba5ec7db4bb827d82a262bae9408f90cd2e70 Mon Sep 17 00:00:00 2001 From: Daniel Gomez de Souza Date: Thu, 30 Sep 2021 13:39:42 -0300 Subject: [PATCH 02/14] Inline template --- .../live/console_live/sidebar_component.ex | 19 +++++++++++++++++++ .../console_live/sidebar_component.html.heex | 14 -------------- 2 files changed, 19 insertions(+), 14 deletions(-) delete mode 100644 lib/elixir_console_web/live/console_live/sidebar_component.html.heex diff --git a/lib/elixir_console_web/live/console_live/sidebar_component.ex b/lib/elixir_console_web/live/console_live/sidebar_component.ex index 5625f0d..f870ec0 100644 --- a/lib/elixir_console_web/live/console_live/sidebar_component.ex +++ b/lib/elixir_console_web/live/console_live/sidebar_component.ex @@ -7,6 +7,25 @@ defmodule ElixirConsoleWeb.ConsoleLive.SidebarComponent do use Phoenix.LiveComponent + def render(assigns) do + ~H""" +
+ <.bindings bindings={@sandbox.bindings} /> +
+ <%= if @suggestions != [] do %> + <.suggestions suggestions={@suggestions}/> + <% else %> + <%= if @contextual_help do %> + <.contextual_help {@contextual_help} /> + <% else %> + <.instructions /> + <% end %> + <% end %> +
+
+ """ + end + def bindings(assigns) do ~H"""
diff --git a/lib/elixir_console_web/live/console_live/sidebar_component.html.heex b/lib/elixir_console_web/live/console_live/sidebar_component.html.heex deleted file mode 100644 index 16d568a..0000000 --- a/lib/elixir_console_web/live/console_live/sidebar_component.html.heex +++ /dev/null @@ -1,14 +0,0 @@ -
- <.bindings bindings={@sandbox.bindings} /> -
- <%= if @suggestions != [] do %> - <.suggestions suggestions={@suggestions}/> - <% else %> - <%= if @contextual_help do %> - <.contextual_help {@contextual_help} /> - <% else %> - <.instructions /> - <% end %> - <% end %> -
-
From f6bd42702adeec80f7694ba6282b7705680c138f Mon Sep 17 00:00:00 2001 From: Daniel Gomez de Souza Date: Mon, 11 Oct 2021 18:35:43 -0300 Subject: [PATCH 03/14] Use cond instead of nested if-else --- .../live/console_live/sidebar_component.ex | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/lib/elixir_console_web/live/console_live/sidebar_component.ex b/lib/elixir_console_web/live/console_live/sidebar_component.ex index f870ec0..8a7f14e 100644 --- a/lib/elixir_console_web/live/console_live/sidebar_component.ex +++ b/lib/elixir_console_web/live/console_live/sidebar_component.ex @@ -12,14 +12,13 @@ defmodule ElixirConsoleWeb.ConsoleLive.SidebarComponent do
<.bindings bindings={@sandbox.bindings} />
- <%= if @suggestions != [] do %> - <.suggestions suggestions={@suggestions}/> - <% else %> - <%= if @contextual_help do %> + <%= cond do %> + <% @suggestions != [] -> %> + <.suggestions suggestions={@suggestions}/> + <% @contextual_help -> %> <.contextual_help {@contextual_help} /> - <% else %> + <% true -> %> <.instructions /> - <% end %> <% end %>
From 94cfea46bb8bfd844f7b1f962094120b598eb8bb Mon Sep 17 00:00:00 2001 From: Daniel Gomez de Souza Date: Fri, 15 Oct 2021 17:47:36 -0300 Subject: [PATCH 04/14] Add package --- mix.exs | 1 + mix.lock | 1 + 2 files changed, 2 insertions(+) diff --git a/mix.exs b/mix.exs index 7927512..d0d5f97 100644 --- a/mix.exs +++ b/mix.exs @@ -41,6 +41,7 @@ defmodule ElixirConsole.MixProject do {:earmark, "~> 1.4.0"}, {:floki, "~> 0.31.0", only: :test}, {:sentry, "~> 7.0"}, + {:surface, "~> 0.5.2"}, {:wallaby, "~> 0.28", only: :test, runtime: false} ] end diff --git a/mix.lock b/mix.lock index e8f43f1..635493d 100644 --- a/mix.lock +++ b/mix.lock @@ -28,6 +28,7 @@ "ranch": {:hex, :ranch, "1.8.0", "8c7a100a139fd57f17327b6413e4167ac559fbc04ca7448e9be9057311597a1d", [:make, :rebar3], [], "hexpm", "49fbcfd3682fab1f5d109351b61257676da1a2fdbe295904176d5e521a2ddfe5"}, "sentry": {:hex, :sentry, "7.2.1", "ea6a5d26c4afef97bf21e09612ebe8d97b525b7822429092926377cd82c08f9e", [:mix], [{:hackney, "~> 1.8 or 1.6.5", [hex: :hackney, repo: "hexpm", optional: false]}, {:jason, "~> 1.1", [hex: :jason, repo: "hexpm", optional: true]}, {:phoenix, "~> 1.3", [hex: :phoenix, repo: "hexpm", optional: true]}, {:plug, "~> 1.6", [hex: :plug, repo: "hexpm", optional: true]}, {:plug_cowboy, "~> 1.0 or ~> 2.0", [hex: :plug_cowboy, repo: "hexpm", optional: true]}], "hexpm", "8d1a9469095a83ff8575d16dc1b4d73f5444f3da1ded89a44ce8b85481180089"}, "ssl_verify_fun": {:hex, :ssl_verify_fun, "1.1.6", "cf344f5692c82d2cd7554f5ec8fd961548d4fd09e7d22f5b62482e5aeaebd4b0", [:make, :mix, :rebar3], [], "hexpm", "bdb0d2471f453c88ff3908e7686f86f9be327d065cc1ec16fa4540197ea04680"}, + "surface": {:hex, :surface, "0.5.2", "905e90a348eb788732adc474d88cce5627f8a202227492498b296d230b5f4f9c", [:mix], [{:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: false]}, {:phoenix_live_view, "~> 0.15", [hex: :phoenix_live_view, repo: "hexpm", optional: false]}], "hexpm", "c98562ee29323a906b2715059fbaf9bd566674fce19dd0ca71e2a51c457a80dd"}, "telemetry": {:hex, :telemetry, "1.0.0", "0f453a102cdf13d506b7c0ab158324c337c41f1cc7548f0bc0e130bbf0ae9452", [:rebar3], [], "hexpm", "73bc09fa59b4a0284efb4624335583c528e07ec9ae76aca96ea0673850aec57a"}, "tesla": {:hex, :tesla, "1.4.3", "f5a494e08fb1abe4fd9c28abb17f3d9b62b8f6fc492860baa91efb1aab61c8a0", [:mix], [{:castore, "~> 0.1", [hex: :castore, repo: "hexpm", optional: true]}, {:exjsx, ">= 3.0.0", [hex: :exjsx, repo: "hexpm", optional: true]}, {:finch, "~> 0.3", [hex: :finch, repo: "hexpm", optional: true]}, {:fuse, "~> 2.4", [hex: :fuse, repo: "hexpm", optional: true]}, {:gun, "~> 1.3", [hex: :gun, repo: "hexpm", optional: true]}, {:hackney, "~> 1.6", [hex: :hackney, repo: "hexpm", optional: true]}, {:ibrowse, "4.4.0", [hex: :ibrowse, repo: "hexpm", optional: true]}, {:jason, ">= 1.0.0", [hex: :jason, repo: "hexpm", optional: true]}, {:mime, "~> 1.0", [hex: :mime, repo: "hexpm", optional: false]}, {:mint, "~> 1.0", [hex: :mint, repo: "hexpm", optional: true]}, {:poison, ">= 1.0.0", [hex: :poison, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: true]}], "hexpm", "e0755bb664bf4d664af72931f320c97adbf89da4586670f4864bf259b5750386"}, "unicode_util_compat": {:hex, :unicode_util_compat, "0.7.0", "bc84380c9ab48177092f43ac89e4dfa2c6d62b40b8bd132b1059ecc7232f9a78", [:rebar3], [], "hexpm", "25eee6d67df61960cf6a794239566599b09e17e668d3700247bc498638152521"}, From 1a8f0df4f984ae40b5505139ff99930dd5186ca3 Mon Sep 17 00:00:00 2001 From: Daniel Gomez de Souza Date: Fri, 15 Oct 2021 17:52:47 -0300 Subject: [PATCH 05/14] Configure formatter and live reload --- .formatter.exs | 5 +++-- config/dev.exs | 3 ++- 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/.formatter.exs b/.formatter.exs index 4761678..50d7a54 100644 --- a/.formatter.exs +++ b/.formatter.exs @@ -1,4 +1,5 @@ [ - import_deps: [:phoenix], - inputs: ["*.{ex,exs}", "{config,lib,test}/**/*.{ex,exs}"] + import_deps: [:phoenix, :surface], + inputs: ["*.{ex,exs}", "{config,lib,test}/**/*.{ex,exs}"], + surface_inputs: ["{lib,test}/**/*.{ex,exs,sface}"] ] diff --git a/config/dev.exs b/config/dev.exs index eec1ee8..83e21e0 100644 --- a/config/dev.exs +++ b/config/dev.exs @@ -51,7 +51,8 @@ config :elixir_console, ElixirConsoleWeb.Endpoint, patterns: [ ~r"priv/static/.*(js|css|png|jpeg|jpg|gif|svg)$", ~r"lib/elixir_console_web/(live|views)/.*(ex)$", - ~r"lib/elixir_console_web/templates/.*(eex)$" + ~r"lib/elixir_console_web/templates/.*(eex)$", + ~r"lib/elixir_console_web/live/.*(sface)$" ] ] From 7887d649eedfe93519d52585f5cc763b96d47316 Mon Sep 17 00:00:00 2001 From: Daniel Gomez de Souza Date: Fri, 15 Oct 2021 18:50:50 -0300 Subject: [PATCH 06/14] Convert function components to surface components --- .../live/console_live/bindings.ex | 23 ++++++ .../live/console_live/contextual_help.ex | 27 +++++++ .../live/console_live/instructions.ex | 19 +++++ .../live/console_live/sidebar_component.ex | 79 +++---------------- .../live/console_live/suggestions.ex | 17 ++++ 5 files changed, 98 insertions(+), 67 deletions(-) create mode 100644 lib/elixir_console_web/live/console_live/bindings.ex create mode 100644 lib/elixir_console_web/live/console_live/contextual_help.ex create mode 100644 lib/elixir_console_web/live/console_live/instructions.ex create mode 100644 lib/elixir_console_web/live/console_live/suggestions.ex diff --git a/lib/elixir_console_web/live/console_live/bindings.ex b/lib/elixir_console_web/live/console_live/bindings.ex new file mode 100644 index 0000000..8f0b42b --- /dev/null +++ b/lib/elixir_console_web/live/console_live/bindings.ex @@ -0,0 +1,23 @@ +defmodule ElixirConsoleWeb.ConsoleLive.Bindings do + use Surface.Component + + @doc "Keyword list of bindings" + prop bindings, :keyword + + def render(assigns) do + ~F""" +
+

Current Bindings

+
    + {#if length(@bindings) > 0} + {#for {key, value} <- @bindings} +
  • {key}: {inspect(value)}
    • + {/for} + {#else} + No bindings yet! + {/if} +
+
+ """ + end +end diff --git a/lib/elixir_console_web/live/console_live/contextual_help.ex b/lib/elixir_console_web/live/console_live/contextual_help.ex new file mode 100644 index 0000000..b2421dc --- /dev/null +++ b/lib/elixir_console_web/live/console_live/contextual_help.ex @@ -0,0 +1,27 @@ +defmodule ElixirConsoleWeb.ConsoleLive.ContextualHelp do + use Surface.Component + + @doc "Link to documentation in hexdocs.pm" + prop link, :string + + @doc "Name of the function" + prop func_name, :string + + @doc "Header of the documentation" + prop header, :string + + @doc "Body of the documentation" + prop doc, :string + + def render(assigns) do + ~F""" +
+ + {@func_name} + + {@header} + {Phoenix.HTML.raw @doc} +
+ """ + end +end diff --git a/lib/elixir_console_web/live/console_live/instructions.ex b/lib/elixir_console_web/live/console_live/instructions.ex new file mode 100644 index 0000000..4818fbe --- /dev/null +++ b/lib/elixir_console_web/live/console_live/instructions.ex @@ -0,0 +1,19 @@ +defmodule ElixirConsoleWeb.ConsoleLive.Instructions do + use Surface.Component + + def render(assigns) do + ~F""" +

INSTRUCTIONS

+

[UP] [DOWN]: Navigate through commands history

+

[TAB]: Get suggestions or autocomplete while typing

+

You can see the history panel that includes all your commands and their output. + Click on any Elixir function to see here the corresponding documentation.

+

ABOUT SECURITY

+

Please note some features of the language are not safe to run in a shared environment like this console. + If you are interested in knowing more about the limitations, you must read here.

+

Please report any security vulnerabilities to + elixir-console-security@wyeworks.com. +

+ """ + end +end diff --git a/lib/elixir_console_web/live/console_live/sidebar_component.ex b/lib/elixir_console_web/live/console_live/sidebar_component.ex index 8a7f14e..d31183d 100644 --- a/lib/elixir_console_web/live/console_live/sidebar_component.ex +++ b/lib/elixir_console_web/live/console_live/sidebar_component.ex @@ -5,79 +5,24 @@ defmodule ElixirConsoleWeb.ConsoleLive.SidebarComponent do information. """ - use Phoenix.LiveComponent + use Surface.Component + + alias ElixirConsoleWeb.ConsoleLive.{Bindings, Suggestions, ContextualHelp, Instructions} def render(assigns) do - ~H""" + ~F"""
- <.bindings bindings={@sandbox.bindings} /> +
- <%= cond do %> - <% @suggestions != [] -> %> - <.suggestions suggestions={@suggestions}/> - <% @contextual_help -> %> - <.contextual_help {@contextual_help} /> - <% true -> %> - <.instructions /> - <% end %> + {#if @suggestions != []} + + {#elseif @contextual_help} + + {#else} + + {/if}
""" end - - def bindings(assigns) do - ~H""" -
-

Current Bindings

-
    - <%= if length(@bindings) > 0 do %> - <%= for {key, value} <- @bindings do %> -
  • <%= key %>: <%= inspect(value) %>
    • - <% end %> - <% else %> - No bindings yet! - <% end %> -
-
- """ - end - - def suggestions(assigns) do - ~H""" -

Suggestions:

-
    - <%= for suggestion <- @suggestions do %> -
  • <%= suggestion %>
    • - <% end %> -
- """ - end - - def contextual_help(assigns) do - ~H""" -
- - <%= @func_name %> - - <%= @header %> - <%= Phoenix.HTML.raw @doc %> -
- """ - end - - def instructions(assigns) do - ~H""" -

INSTRUCTIONS

-

[UP] [DOWN]: Navigate through commands history

-

[TAB]: Get suggestions or autocomplete while typing

-

You can see the history panel that includes all your commands and their output. - Click on any Elixir function to see here the corresponding documentation.

-

ABOUT SECURITY

-

Please note some features of the language are not safe to run in a shared environment like this console. - If you are interested in knowing more about the limitations, you must read here.

-

Please report any security vulnerabilities to - elixir-console-security@wyeworks.com. -

- """ - end end diff --git a/lib/elixir_console_web/live/console_live/suggestions.ex b/lib/elixir_console_web/live/console_live/suggestions.ex new file mode 100644 index 0000000..8b289f2 --- /dev/null +++ b/lib/elixir_console_web/live/console_live/suggestions.ex @@ -0,0 +1,17 @@ +defmodule ElixirConsoleWeb.ConsoleLive.Suggestions do + use Surface.Component + + @doc "List of suggestions" + prop suggestions, :list + + def render(assigns) do + ~F""" +

Suggestions:

+
    + {#for suggestion <- @suggestions} +
  • {suggestion}
    • + {/for} +
+ """ + end +end From 6e86e39c94f17ec43ef12c9a8bd68c2c0b7ac9c1 Mon Sep 17 00:00:00 2001 From: Daniel Gomez de Souza Date: Fri, 15 Oct 2021 19:00:52 -0300 Subject: [PATCH 07/14] Use for/else --- lib/elixir_console_web/live/console_live/bindings.ex | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/lib/elixir_console_web/live/console_live/bindings.ex b/lib/elixir_console_web/live/console_live/bindings.ex index 8f0b42b..4f21907 100644 --- a/lib/elixir_console_web/live/console_live/bindings.ex +++ b/lib/elixir_console_web/live/console_live/bindings.ex @@ -9,13 +9,11 @@ defmodule ElixirConsoleWeb.ConsoleLive.Bindings do

Current Bindings

    - {#if length(@bindings) > 0} - {#for {key, value} <- @bindings} -
  • {key}: {inspect(value)}
    • - {/for} + {#for {key, value} <- @bindings} +
  • {key}: {inspect(value)}
    • {#else} No bindings yet! - {/if} + {/for}
""" From 3f5873616f0e7f3691cc097e7f6c259f10b00a7b Mon Sep 17 00:00:00 2001 From: Daniel Gomez de Souza Date: Fri, 15 Oct 2021 19:01:05 -0300 Subject: [PATCH 08/14] Declare props to remove warnings --- .../live/console_live/sidebar_component.ex | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/lib/elixir_console_web/live/console_live/sidebar_component.ex b/lib/elixir_console_web/live/console_live/sidebar_component.ex index d31183d..b572b48 100644 --- a/lib/elixir_console_web/live/console_live/sidebar_component.ex +++ b/lib/elixir_console_web/live/console_live/sidebar_component.ex @@ -9,6 +9,12 @@ defmodule ElixirConsoleWeb.ConsoleLive.SidebarComponent do alias ElixirConsoleWeb.ConsoleLive.{Bindings, Suggestions, ContextualHelp, Instructions} + prop sandbox, :map + + prop suggestions, :list + + prop contextual_help, :map + def render(assigns) do ~F"""
From debfcc7380a319d97c2b7b2394c940bc401e60e2 Mon Sep 17 00:00:00 2001 From: Daniel Gomez de Souza Date: Fri, 15 Oct 2021 19:12:49 -0300 Subject: [PATCH 09/14] Inline command_input_component template --- .../console_live/command_input_component.ex | 21 +++++++++++++++++++ .../command_input_component.html.heex | 16 -------------- 2 files changed, 21 insertions(+), 16 deletions(-) delete mode 100644 lib/elixir_console_web/live/console_live/command_input_component.html.heex diff --git a/lib/elixir_console_web/live/console_live/command_input_component.ex b/lib/elixir_console_web/live/console_live/command_input_component.ex index 1284905..3bc92ba 100644 --- a/lib/elixir_console_web/live/console_live/command_input_component.ex +++ b/lib/elixir_console_web/live/console_live/command_input_component.ex @@ -19,6 +19,27 @@ defmodule ElixirConsoleWeb.ConsoleLive.CommandInputComponent do )} end + def render(assigns) do + ~H""" +
+
+ <%= print_prompt() %> + +
+
+ """ + end + defp ensure_number(value) when is_number(value), do: value diff --git a/lib/elixir_console_web/live/console_live/command_input_component.html.heex b/lib/elixir_console_web/live/console_live/command_input_component.html.heex deleted file mode 100644 index 2e4e54a..0000000 --- a/lib/elixir_console_web/live/console_live/command_input_component.html.heex +++ /dev/null @@ -1,16 +0,0 @@ -
-
- <%= print_prompt() %> - -
-
From 05d03ef22f7971b723b93b7e23c429c94cd19f79 Mon Sep 17 00:00:00 2001 From: Daniel Gomez de Souza Date: Fri, 15 Oct 2021 19:14:17 -0300 Subject: [PATCH 10/14] Inline history_component template --- .../live/console_live/history_component.ex | 23 +++++++++++++++++++ .../console_live/history_component.html.heex | 18 --------------- 2 files changed, 23 insertions(+), 18 deletions(-) delete mode 100644 lib/elixir_console_web/live/console_live/history_component.html.heex diff --git a/lib/elixir_console_web/live/console_live/history_component.ex b/lib/elixir_console_web/live/console_live/history_component.ex index 8e1205f..5d578f6 100644 --- a/lib/elixir_console_web/live/console_live/history_component.ex +++ b/lib/elixir_console_web/live/console_live/history_component.ex @@ -9,6 +9,29 @@ defmodule ElixirConsoleWeb.ConsoleLive.HistoryComponent do import ElixirConsoleWeb.ConsoleLive.Helpers alias ElixirConsole.ContextualHelp + def render(assigns) do + ~H""" +
+
+

Elixir <%= System.version() %>/OTP <%= System.otp_release() %>

+
+ <%= for output <- @output do %> +
+ <%= print_prompt() %><%= format_command(output.command) %> +
+
+ <%= output.result %> + <%= if output.error do %> + + <%= output.error %> + + <% end %> +
+ <% end %> +
+ """ + end + def handle_event( "function_link_clicked", %{"func_name" => func_name, "header" => header, "doc" => doc, "link" => link}, diff --git a/lib/elixir_console_web/live/console_live/history_component.html.heex b/lib/elixir_console_web/live/console_live/history_component.html.heex deleted file mode 100644 index cdf668a..0000000 --- a/lib/elixir_console_web/live/console_live/history_component.html.heex +++ /dev/null @@ -1,18 +0,0 @@ -
-
-

Elixir <%= System.version() %>/OTP <%= System.otp_release() %>

-
- <%= for output <- @output do %> -
- <%= print_prompt() %><%= format_command(output.command) %> -
-
- <%= output.result %> - <%= if output.error do %> - - <%= output.error %> - - <% end %> -
- <% end %> -
From a954f94634555b58ec90c8c1845b08894c29b23c Mon Sep 17 00:00:00 2001 From: Daniel Gomez de Souza Date: Fri, 15 Oct 2021 19:17:09 -0300 Subject: [PATCH 11/14] Inline console_live template --- lib/elixir_console_web/live/console_live.ex | 21 +++++++++++++++++++ .../live/console_live.html.heex | 16 -------------- 2 files changed, 21 insertions(+), 16 deletions(-) delete mode 100644 lib/elixir_console_web/live/console_live.html.heex diff --git a/lib/elixir_console_web/live/console_live.ex b/lib/elixir_console_web/live/console_live.ex index 6ef5f20..97e7fb8 100644 --- a/lib/elixir_console_web/live/console_live.ex +++ b/lib/elixir_console_web/live/console_live.ex @@ -36,6 +36,27 @@ defmodule ElixirConsoleWeb.ConsoleLive do Sandbox.terminate(sandbox) end + def render(assigns) do + ~H""" +
+
+
+
+
+
+ <%= live_component(HistoryComponent, output: @output, id: :history) %> + <%= live_component(CommandInputComponent, history: @history, bindings: @sandbox.bindings, id: :command_input) %> +
+
+
+
+ <%= live_component(SidebarComponent, + sandbox: @sandbox, contextual_help: @contextual_help, suggestions: @suggestions) + %> +
+ """ + end + # This event comes from HistoryComponent @impl true def handle_info({:show_function_docs, contextual_help}, socket) do diff --git a/lib/elixir_console_web/live/console_live.html.heex b/lib/elixir_console_web/live/console_live.html.heex deleted file mode 100644 index a74f11c..0000000 --- a/lib/elixir_console_web/live/console_live.html.heex +++ /dev/null @@ -1,16 +0,0 @@ -
-
-
-
-
-
- <%= live_component(HistoryComponent, output: @output, id: :history) %> - <%= live_component(CommandInputComponent, history: @history, bindings: @sandbox.bindings, id: :command_input) %> -
-
-
-
- <%= live_component(SidebarComponent, - sandbox: @sandbox, contextual_help: @contextual_help, suggestions: @suggestions) - %> -
From 826d3ff86c665f3ebfc64ac4c1805425491dedd9 Mon Sep 17 00:00:00 2001 From: Daniel Gomez de Souza Date: Fri, 15 Oct 2021 19:30:42 -0300 Subject: [PATCH 12/14] Fixup inline template console_live --- lib/elixir_console_web/live/console_live.ex | 1 + 1 file changed, 1 insertion(+) diff --git a/lib/elixir_console_web/live/console_live.ex b/lib/elixir_console_web/live/console_live.ex index 97e7fb8..6125c72 100644 --- a/lib/elixir_console_web/live/console_live.ex +++ b/lib/elixir_console_web/live/console_live.ex @@ -36,6 +36,7 @@ defmodule ElixirConsoleWeb.ConsoleLive do Sandbox.terminate(sandbox) end + @impl true def render(assigns) do ~H"""
From ecfe96784a64c9ca6464c674828e56474210db69 Mon Sep 17 00:00:00 2001 From: Daniel Gomez de Souza Date: Fri, 15 Oct 2021 19:31:22 -0300 Subject: [PATCH 13/14] Convert history component to surface --- .../live/console_live/history_component.ex | 24 +++++++++++-------- 1 file changed, 14 insertions(+), 10 deletions(-) diff --git a/lib/elixir_console_web/live/console_live/history_component.ex b/lib/elixir_console_web/live/console_live/history_component.ex index 5d578f6..ba7c1cb 100644 --- a/lib/elixir_console_web/live/console_live/history_component.ex +++ b/lib/elixir_console_web/live/console_live/history_component.ex @@ -4,34 +4,38 @@ defmodule ElixirConsoleWeb.ConsoleLive.HistoryComponent do commands and results are displayed. """ - use Phoenix.LiveComponent + use Surface.LiveComponent import Phoenix.HTML, only: [sigil_e: 2] import ElixirConsoleWeb.ConsoleLive.Helpers alias ElixirConsole.ContextualHelp + prop output, :keyword + + @impl true def render(assigns) do - ~H""" + ~F"""
-

Elixir <%= System.version() %>/OTP <%= System.otp_release() %>

+

Elixir {System.version()}/OTP {System.otp_release()}

- <%= for output <- @output do %> + {#for output <- @output}
- <%= print_prompt() %><%= format_command(output.command) %> + {print_prompt()}{format_command(output.command)}
- <%= output.result %> - <%= if output.error do %> + {output.result} + {#if output.error} - <%= output.error %> + {output.error} - <% end %> + {/if}
- <% end %> + {/for}
""" end + @impl true def handle_event( "function_link_clicked", %{"func_name" => func_name, "header" => header, "doc" => doc, "link" => link}, From 350c4b574aafebb1aebfe52c40b564bd57132b6d Mon Sep 17 00:00:00 2001 From: Daniel Gomez de Souza Date: Fri, 15 Oct 2021 19:34:30 -0300 Subject: [PATCH 14/14] Convert command_input_component to surface --- .../live/console_live/command_input_component.ex | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/lib/elixir_console_web/live/console_live/command_input_component.ex b/lib/elixir_console_web/live/console_live/command_input_component.ex index 3bc92ba..d7378f6 100644 --- a/lib/elixir_console_web/live/console_live/command_input_component.ex +++ b/lib/elixir_console_web/live/console_live/command_input_component.ex @@ -5,10 +5,13 @@ defmodule ElixirConsoleWeb.ConsoleLive.CommandInputComponent do user experience. """ - use Phoenix.LiveComponent + use Surface.Component import ElixirConsoleWeb.ConsoleLive.Helpers alias ElixirConsole.Autocomplete + prop input_value, :string + prop caret_position, :integer + def mount(socket) do {:ok, assign( @@ -20,10 +23,10 @@ defmodule ElixirConsoleWeb.ConsoleLive.CommandInputComponent do end def render(assigns) do - ~H""" + ~F"""
- <%= print_prompt() %> + {print_prompt()}