mix dala.gen.live_screen (dala_dev v0.0.10)

Generates a paired Dala.Spark.Dsl screen and Phoenix LiveView for LiveView mode apps.

Usage

mix dala.gen.live_screen NAME [PATH]

NAME is the LiveView module name (PascalCase). PATH is the URL path (defaults to /name derived from NAME).

Examples

mix dala.gen.live_screen Dashboard
# → lib/<app>_web/live/dashboard_live.ex  (LiveView)
# → lib/<app>/screens/dashboard_screen.ex (Dala.Spark.Dsl screen)

mix dala.gen.live_screen Settings /preferences
# → path override: /preferences

What gets generated

LiveView (lib/<app>_web/live/<name>_live.ex)

defmodule MyAppWeb.DashboardLive do
  use MyAppWeb, :live_view
  use Dala.Platform.LiveView

  def mount(_params, _session, socket) do
    {:ok, socket}
  end

  def render(assigns) do
    ~H"""
    <div>
      <h1>Dashboard</h1>
    </div>
    """
  end

  # Receive messages from the native layer:
  #   window.dala.send({ type: "back" })
  def handle_event("dala_message", _data, socket) do
    {:noreply, socket}
  end

  # Push messages to the native layer JS:
  #   push_event(socket, "dala_push", %{type: "haptic"})
end

Dala.Spark.Dsl screen (lib/<app>/screens/<name>_screen.ex)

defmodule MyApp.DashboardScreen do
  use Dala.Spark.Dsl

  dala do
    screen do
      name :dashboard
      webview url: Dala.Platform.LiveView.local_url("/dashboard"), show_url: false
    end
  end

  def handle_event(event, _params, socket) do
    {:noreply, socket}
  end
end

Router note

Add the LiveView to your Phoenix router:

live "/dashboard", DashboardLive

Then navigate to the screen from Elixir:

Dala.Ui.Socket.navigate(socket, {:push, MyApp.DashboardScreen})