Refactor: add live_debugger_web to project structure

README.md

@@ -91,9 +91,9 @@ In `router.ex` of your Phoenix app, make sure your locally running Phoenix app c
 config :live_debugger,
   ip: {127, 0, 0, 1}, # IP on which LiveDebugger will be hosted
   port: 4007, # Port on which LiveDebugger will be hosted
-  secret_key_base: "YOUR_SECRET_KEY_BASE", # Secret key used for LiveDebugger.Endpoint
-  signing_salt: "your_signing_salt", # Signing salt used for LiveDebugger.Endpoint
-  adapter: Bandit.PhoenixAdapter, # Adapter used in LiveDebugger.Endpoint
+  secret_key_base: "YOUR_SECRET_KEY_BASE", # Secret key used for LiveDebuggerWeb.Endpoint
+  signing_salt: "your_signing_salt", # Signing salt used for LiveDebuggerWeb.Endpoint
+  adapter: Bandit.PhoenixAdapter, # Adapter used in LiveDebuggerWeb.Endpoint
   tracing_setup_delay: 0 # Time in ms after tracing will be initialized. Useful in case multi-nodes envs
 ```
 

config/config.exs

@@ -47,6 +47,8 @@ if config_env() == :dev do
       ]
     ]
 
+  config :live_debugger, LiveDebuggerWeb.Endpoint, debug_errors: true
+
   config :live_debugger, experimental_features: :all
 end
 

lib/live_debugger.ex

@@ -21,7 +21,7 @@ defmodule LiveDebugger do
 
     children = [
       {Phoenix.PubSub, name: LiveDebugger.PubSub},
-      {LiveDebugger.Endpoint,
+      {LiveDebuggerWeb.Endpoint,
        [
          check_origin: false,
          pubsub_server: LiveDebugger.PubSub
@@ -61,7 +61,7 @@ defmodule LiveDebugger do
         live_reload: Keyword.get(config, :live_reload, [])
       ]
 
-    Application.put_env(@app_name, LiveDebugger.Endpoint, endpoint_config)
+    Application.put_env(@app_name, LiveDebuggerWeb.Endpoint, endpoint_config)
   end
 
   defp put_live_debugger_tags(config) do
@@ -83,7 +83,7 @@ defmodule LiveDebugger do
       highlighting?: highlighting?
     }
 
-    tags = LiveDebugger.Components.Config.live_debugger_tags(assigns)
+    tags = LiveDebuggerWeb.Components.Config.live_debugger_tags(assigns)
     Application.put_env(@app_name, :live_debugger_tags, tags)
   end
 end

lib/live_debugger/services/module_discovery_service.ex

@@ -57,7 +57,11 @@ defmodule LiveDebugger.Services.ModuleDiscoveryService do
   defp debugger?(module) do
     stringified_module = Atom.to_string(module)
 
-    String.starts_with?(stringified_module, "LiveDebugger.") or
-      String.starts_with?(stringified_module, "Elixir.LiveDebugger.")
+    String.starts_with?(stringified_module, [
+      "Elixir.LiveDebugger.",
+      "Elixir.LiveDebuggerWeb.",
+      "LiveDebugger.",
+      "LiveDebuggerWeb."
+    ])
   end
 end

lib/live_debugger/structs/lv_process.ex

@@ -37,7 +37,7 @@ defmodule LiveDebugger.Structs.LvProcess do
     debugger? =
       socket.view
       |> Atom.to_string()
-      |> String.starts_with?("Elixir.LiveDebugger.")
+      |> String.starts_with?(["Elixir.LiveDebugger.", "Elixir.LiveDebuggerWeb."])
 
     embedded? = socket.host_uri == :not_mounted_at_router
 

lib/live_debugger_web.ex

@@ -4,14 +4,14 @@ defmodule LiveDebuggerWeb do
   def live_view do
     quote do
       use Phoenix.LiveView,
-        layout: {LiveDebugger.Layout, :app}
+        layout: {LiveDebuggerWeb.Layout, :app}
 
-      on_mount({LiveDebugger.Flash, :add_hook})
+      on_mount({LiveDebuggerWeb.Hooks.Flash, :add_hook})
 
       import Phoenix.HTML
       import LiveDebuggerWeb.Helpers
-      import LiveDebugger.Components
-      import LiveDebugger.Flash, only: [push_flash: 2, push_flash: 3]
+      import LiveDebuggerWeb.Components
+      import LiveDebuggerWeb.Hooks.Flash, only: [push_flash: 2, push_flash: 3]
     end
   end
 
@@ -21,8 +21,8 @@ defmodule LiveDebuggerWeb do
 
       import Phoenix.HTML
       import LiveDebuggerWeb.Helpers
-      import LiveDebugger.Components
-      import LiveDebugger.Flash, only: [push_flash: 2, push_flash: 3]
+      import LiveDebuggerWeb.Components
+      import LiveDebuggerWeb.Hooks.Flash, only: [push_flash: 2, push_flash: 3]
     end
   end
 
@@ -32,7 +32,7 @@ defmodule LiveDebuggerWeb do
 
       import Phoenix.HTML
       import LiveDebuggerWeb.Helpers
-      import LiveDebugger.Components
+      import LiveDebuggerWeb.Components
     end
   end
 

lib/live_debugger/components.ex → lib/live_debugger_web/components.ex

@@ -1,12 +1,12 @@
-defmodule LiveDebugger.Components do
+defmodule LiveDebuggerWeb.Components do
   @moduledoc """
   This module provides reusable components for LiveDebugger.
   """
 
   use Phoenix.Component
 
   alias Phoenix.LiveView.JS
-  alias LiveDebugger.LiveHelpers.Routes
+  alias LiveDebuggerWeb.Helpers.RoutesHelper
 
   @report_issue_url "https://github.com/software-mansion/live-debugger/issues/new/choose"
 
@@ -553,7 +553,7 @@ defmodule LiveDebugger.Components do
   def navbar(assigns) do
     ~H"""
     <navbar class="w-full h-12 shrink-0 py-auto px-4 flex items-center gap-2 bg-navbar-bg text-navbar-logo border-b border-navbar-border">
-      <.link :if={@return_link?} patch={Routes.live_views_dashboard()}>
+      <.link :if={@return_link?} patch={RoutesHelper.live_views_dashboard()}>
         <.nav_icon icon="icon-arrow-left" />
       </.link>
 

lib/live_debugger/components/config.ex → lib/live_debugger_web/components/config.ex

@@ -1,4 +1,4 @@
-defmodule LiveDebugger.Components.Config do
+defmodule LiveDebuggerWeb.Components.Config do
   @moduledoc """
   Renders the LiveDebugger config meta tag and the browser features script.
   It is meant to be injected to the debugged application layout.

lib/live_debugger/components/elixir_display.ex → lib/live_debugger_web/components/elixir_display.ex

@@ -1,4 +1,4 @@
-defmodule LiveDebugger.Components.ElixirDisplay do
+defmodule LiveDebuggerWeb.Components.ElixirDisplay do
   @moduledoc """
   This module provides a component to display a tree of terms.
   Check LiveDebugger.Utils.TermParser.

lib/live_debugger/components/error.ex → lib/live_debugger_web/components/error.ex

@@ -1,4 +1,4 @@
-defmodule LiveDebugger.Components.Error do
+defmodule LiveDebuggerWeb.Components.Error do
   @moduledoc false
 
   use LiveDebuggerWeb, :component
@@ -14,7 +14,7 @@ defmodule LiveDebugger.Components.Error do
         <%= render_slot(@heading) %>
       </div>
       <p class="mb-4"><%= render_slot(@description) %></p>
-      <.link navigate={LiveDebugger.LiveHelpers.Routes.live_views_dashboard()}>
+      <.link navigate={LiveDebuggerWeb.Helpers.RoutesHelper.live_views_dashboard()}>
         <.button>
           See active LiveViews
         </.button>

lib/live_debugger/components/links.ex → lib/live_debugger_web/components/links.ex

@@ -1,12 +1,12 @@
-defmodule LiveDebugger.Components.Links do
+defmodule LiveDebuggerWeb.Components.Links do
   @moduledoc """
   Adds styling for links.
   """
   use LiveDebuggerWeb, :component
 
   alias LiveDebugger.Structs.LvProcess
   alias LiveDebugger.Utils.Parsers
-  alias LiveDebugger.LiveHelpers.Routes
+  alias LiveDebuggerWeb.Helpers.RoutesHelper
 
   attr(:lv_process, LvProcess, required: true)
   attr(:id, :string, required: true)
@@ -17,7 +17,7 @@ defmodule LiveDebugger.Components.Links do
 
     ~H"""
     <.link
-      href={Routes.channel_dashboard(@lv_process.socket_id, @lv_process.transport_pid)}
+      href={RoutesHelper.channel_dashboard(@lv_process.socket_id, @lv_process.transport_pid)}
       class="w-full flex gap-1 text-primary-text"
     >
       <.icon :if={@icon} name={@icon} class="w-4 h-4 shrink-0 text-link-primary" />

lib/live_debugger/components/traces.ex → lib/live_debugger_web/components/traces.ex

@@ -1,12 +1,12 @@
-defmodule LiveDebugger.Components.Traces do
+defmodule LiveDebuggerWeb.Components.Traces do
   @moduledoc """
   UI components for the TracesLive module.
   """
 
   use LiveDebuggerWeb, :live_component
 
   alias LiveDebugger.Structs.Trace
-  alias LiveDebugger.Components.ElixirDisplay
+  alias LiveDebuggerWeb.Components.ElixirDisplay
   alias LiveDebugger.Utils.TermParser
   alias LiveDebugger.Utils.Parsers
 

lib/live_debugger/components/tree.ex → lib/live_debugger_web/components/tree.ex

@@ -1,4 +1,4 @@
-defmodule LiveDebugger.Components.Tree do
+defmodule LiveDebuggerWeb.Components.Tree do
   @moduledoc """
   Tree component which show nested tree of live view and live components.
   """

lib/live_debugger/endpoint.ex → lib/live_debugger_web/endpoint.ex

@@ -1,4 +1,4 @@
-defmodule LiveDebugger.Endpoint do
+defmodule LiveDebuggerWeb.Endpoint do
   use Phoenix.Endpoint, otp_app: :live_debugger
 
   @session_options [
@@ -39,5 +39,5 @@ defmodule LiveDebugger.Endpoint do
   plug(Plug.Session, @session_options)
 
   plug(Plug.RequestId)
-  plug(LiveDebugger.Router)
+  plug(LiveDebuggerWeb.Router)
 end

lib/live_debugger/error_view.ex → lib/live_debugger_web/error_view.ex

@@ -1,4 +1,4 @@
-defmodule LiveDebugger.ErrorView do
+defmodule LiveDebuggerWeb.ErrorView do
   @moduledoc false
 
   def render(template, _), do: Phoenix.Controller.status_message_from_template(template)

lib/live_debugger/live_helpers/routes.ex → lib/live_debugger_web/helpers/routes_helper.ex

@@ -1,9 +1,9 @@
-defmodule LiveDebugger.LiveHelpers.Routes do
+defmodule LiveDebuggerWeb.Helpers.RoutesHelper do
   @moduledoc """
   Helper module to generate url routes for the LiveDebugger application.
   """
 
-  use Phoenix.VerifiedRoutes, endpoint: LiveDebugger.Endpoint, router: LiveDebugger.Router
+  use Phoenix.VerifiedRoutes, endpoint: LiveDebuggerWeb.Endpoint, router: LiveDebuggerWeb.Router
 
   alias LiveDebugger.Utils.Parsers
 

lib/live_debugger/flash.ex → lib/live_debugger_web/hooks/flash.ex

@@ -1,4 +1,4 @@
-defmodule LiveDebugger.Flash do
+defmodule LiveDebuggerWeb.Hooks.Flash do
   @moduledoc """
   Functionalities to make flash messages work inside LiveComponents
   See: https://sevenseacat.net/posts/2023/flash-messages-in-phoenix-liveview-components/

lib/live_debugger/layout.ex → lib/live_debugger_web/layout.ex

@@ -1,4 +1,4 @@
-defmodule LiveDebugger.Layout do
+defmodule LiveDebuggerWeb.Layout do
   @moduledoc """
   Inspiration was taken from Phoenix LiveDashboard
   https://github.com/phoenixframework/phoenix_live_dashboard/blob/main/lib/phoenix/live_dashboard/layout_view.ex
@@ -7,7 +7,7 @@ defmodule LiveDebugger.Layout do
 
   use Phoenix.Component
 
-  import LiveDebugger.Components
+  import LiveDebuggerWeb.Components
 
   @doc false
   def render(template, assigns)

lib/live_debugger/live_views/channel_dashboard_live.ex → lib/live_debugger_web/live/channel_dashboard_live.ex

@@ -1,4 +1,4 @@
-defmodule LiveDebugger.LiveViews.ChannelDashboardLive do
+defmodule LiveDebuggerWeb.ChannelDashboardLive do
   @moduledoc false
 
   use LiveDebuggerWeb, :live_view
@@ -10,15 +10,15 @@ defmodule LiveDebugger.LiveViews.ChannelDashboardLive do
   alias LiveDebugger.Utils.URL
   alias Phoenix.LiveView.AsyncResult
 
-  alias LiveDebugger.Components.Error
+  alias LiveDebuggerWeb.Components.Error
   alias LiveDebugger.Structs.TreeNode
   alias LiveDebugger.Services.LiveViewDiscoveryService
   alias LiveDebugger.Utils.Parsers
-  alias LiveDebugger.LiveHelpers.Routes
+  alias LiveDebuggerWeb.Helpers.RoutesHelper
 
-  alias LiveDebugger.LiveViews.StateLive
-  alias LiveDebugger.LiveViews.TracesLive
-  alias LiveDebugger.LiveViews.SidebarLive
+  alias LiveDebuggerWeb.StateLive
+  alias LiveDebuggerWeb.TracesLive
+  alias LiveDebuggerWeb.SidebarLive
   alias LiveDebugger.Utils.PubSub, as: PubSubUtils
 
   @impl true
@@ -102,7 +102,7 @@ defmodule LiveDebugger.LiveViews.ChannelDashboardLive do
          %LvProcess{socket_id: socket_id, transport_pid: transport_pid} <-
            LiveViewDiscoveryService.successor_lv_process(module) do
       socket
-      |> push_navigate(to: Routes.channel_dashboard(socket_id, transport_pid))
+      |> push_navigate(to: RoutesHelper.channel_dashboard(socket_id, transport_pid))
       |> noreply()
     else
       _ ->
@@ -210,7 +210,7 @@ defmodule LiveDebugger.LiveViews.ChannelDashboardLive do
   end
 
   defp patch_transport_pid(socket, lv_process) do
-    path = Routes.channel_dashboard(lv_process.socket_id, lv_process.transport_pid)
+    path = RoutesHelper.channel_dashboard(lv_process.socket_id, lv_process.transport_pid)
     url = URL.update_path(socket.assigns.url, path)
 
     push_patch(socket, to: url)

lib/live_debugger/live_views/live_views_dashboard_live.ex → lib/live_debugger_web/live/live_views_dashboard_live.ex

@@ -1,4 +1,4 @@
-defmodule LiveDebugger.LiveViews.LiveViewsDashboardLive do
+defmodule LiveDebuggerWeb.LiveViewsDashboardLive do
   @moduledoc """
   It displays all active LiveView sessions in the debugged application.
   """
@@ -8,7 +8,7 @@ defmodule LiveDebugger.LiveViews.LiveViewsDashboardLive do
   alias Phoenix.LiveView.AsyncResult
   alias LiveDebugger.Services.LiveViewDiscoveryService
   alias LiveDebugger.Utils.Parsers
-  alias LiveDebugger.LiveHelpers.Routes
+  alias LiveDebuggerWeb.Helpers.RoutesHelper
 
   @impl true
   def handle_params(_unsigned_params, _uri, socket) do
@@ -121,7 +121,7 @@ defmodule LiveDebugger.LiveViews.LiveViewsDashboardLive do
   defp list_element(assigns) do
     ~H"""
     <.link
-      navigate={Routes.channel_dashboard(@lv_process.socket_id, @lv_process.transport_pid)}
+      navigate={RoutesHelper.channel_dashboard(@lv_process.socket_id, @lv_process.transport_pid)}
       class="flex justify-between items-center h-full w-full text-xs p-1.5 hover:bg-surface-0-bg-hover rounded-sm"
     >
       <div class="flex flex-col gap-1">

lib/live_debugger/live_views/sidebar_live.ex → lib/live_debugger_web/live/sidebar_live.ex

@@ -1,4 +1,4 @@
-defmodule LiveDebugger.LiveViews.SidebarLive do
+defmodule LiveDebuggerWeb.SidebarLive do
   @moduledoc """
   This live view is responsible for displaying the sidebar of the LiveDebugger.
   It receives events from the `ChannelDashboardLive` live to open the mobile sidebar.
@@ -11,12 +11,12 @@ defmodule LiveDebugger.LiveViews.SidebarLive do
   alias LiveDebugger.Structs.LvProcess
   alias LiveDebugger.Structs.Trace
   alias LiveDebugger.Utils.Parsers
-  alias LiveDebugger.Components.Tree
-  alias LiveDebugger.Components.Links
+  alias LiveDebuggerWeb.Components.Tree
+  alias LiveDebuggerWeb.Components.Links
   alias LiveDebugger.Services.ChannelService
   alias Phoenix.Socket.Message
   alias LiveDebugger.Utils.URL
-  alias LiveDebugger.LiveComponents.NestedLiveViewsLinks
+  alias LiveDebuggerWeb.LiveComponents.NestedLiveViewsLinks
   alias LiveDebugger.Utils.PubSub, as: PubSubUtils
 
   attr(:socket, :map, required: true)

lib/live_debugger/live_views/state_live.ex → lib/live_debugger_web/live/state_live.ex

@@ -1,4 +1,4 @@
-defmodule LiveDebugger.LiveViews.StateLive do
+defmodule LiveDebuggerWeb.StateLive do
   @moduledoc """
   This nested live view displays the state of a LiveView.
   """
@@ -7,7 +7,7 @@ defmodule LiveDebugger.LiveViews.StateLive do
 
   alias Phoenix.LiveView.AsyncResult
 
-  alias LiveDebugger.Components.ElixirDisplay
+  alias LiveDebuggerWeb.Components.ElixirDisplay
   alias LiveDebugger.Utils.Parsers
   alias LiveDebugger.Structs.TreeNode
   alias LiveDebugger.Services.ChannelService