# `mix dala.gen.live_screen`
[🔗](https://github.com/manhvu/dala_dev/blob/main/lib/mix/tasks/dala.gen.live_screen.ex#L1)

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})

---

*Consult [api-reference.md](api-reference.md) for complete listing*