Pro Generators

Generators

Generators

mix petal.gen.live

This produces the same files as Phoenix’s mix phx.gen.live (docs). The only difference is that the templates use Tailwind and Petal Components. You can try it out with:

shell
mix petal.gen.live Todos Todo todos label:string is_done:boolean

ℹ️ Information: The default implementation uses the Table component and Streams. The following variation will generate an alternate template using the Data Table component (without Streams): ``shell mix petal.gen.live Todos Todo todos label:string is_done:boolean --data-table ``

Add the routes from the output.

ℹ️ Information: If you're wondering where to put the routes, you can search in the router file for the text "Add live authenticated routes here", and add them straight after that line.

```elixir defPetalProWeb.Routerdo ... scope "/",PetalProWebdo pipe_through [ :browser, :require_authenticated_user, :kick_user_if_suspended_or_deleted, :onboard_new_users ] live_session :require_authenticated_user, on_mount:{PetalProWeb.UserOnMountHooks,:require_authenticated_user}do ... # Add live authenticated routes here live "/todos",TodoLive.Index,:index live "/todos/new",TodoLive.Index,:new live "/todos/:id/edit",TodoLive.Index,:edit live "/todos/:id",TodoLive.Show,:show live "/todos/:id/show/edit",TodoLive.Show,:edit end end ... end ``` ![](/images/petal_pro_docs/generators/generators-img-04.png)

After running the generator: the "index" screen

![](/images/petal_pro_docs/generators/generators-img-01.png)

The "new todo" screen

![](/images/petal_pro_docs/generators/generators-img-03.png)

After creating a new todo

![](/images/petal_pro_docs/generators/generators-img-02.png)

The "show" page

### mix petal.gen.html Same file output as `phx.gen.html` ([docs](https://hexdocs.pm/phoenix/Mix.Tasks.Phx.Gen.Html.html)), but uses Petal Components and a layout from Pro. Example: ```shell mix petal.gen.html Todos Todo todos label:string is_done:boolean ```