tmjoen
I was noticing when moving my app from Surface to LiveView 0.17 that it is a little harder to quickly scan the element tree when glancing at the source code when using <.live_component> mixed in with function components.
For instance:
<.fieldset heading="Project">
<.live_component module={Input.RichText} form={@form} field={:title} id={"#{field.id}-title"} />
<Input.slug form={@form} field={:slug} from={:title} />
<.live_component module={Input.Image} id={"#{field.id}-image"} form={@form} field={:slug} />
<Input.text form={@form} field={:meta_title} />
<Input.text_area form={@form} field={:meta_description} />
<!-- etc etc -->
<./fieldset>
I forked phoenix_live_view and added a little helper to the use Phoenix.LiveComponent logic
def live_component(assigns) do
assigns
|> assign(:module, __MODULE__)
|> Phoenix.LiveView.Helpers.live_component()
end
So now my code can look like this:
<.fieldset heading="Project">
<Input.RichText.live_component form={@form} field={:title} id={"#{field.id}-title"} />
<Input.slug form={@form} field={:slug} from={:title} />
<Input.Image.live_component id={"#{field.id}-image"} form={@form} field={:slug} />
<Input.text form={@form} field={:meta_title} />
<Input.text_area form={@form} field={:meta_description} />
<!-- etc etc -->
<./fieldset>
Much easier to scan imo.
I have a PR ready if the Phoenix Live View team thinks this is worth having ![]()
(thanks to lostkobrakai and jonr for the idea!)
Trending in Questions
I’m working on a project that simulates the bumbl example in the programming phoenix book. It acts almost like an email client. We have a...
New
Hello,
I know there is an approach for handling lists that allows for optimized traversal, but I can’t recall the specific method (somet...
New
Hi everyone,
I am toying with the idea of building a “match maker” for giving personal help to people that wants to start coding.
I sta...
New
Documentation
While reading the Scoped Routes section, I noticed that the documentation currently refers to a problem without explainin...
New
So my question is quite simple and i have found no conclusive answer on forum, google or AI.
Should we use :erlang.float for Integer to ...
New
I recently noticed that Elixir’s Logger defaults its primary log level to :debug when no :logger, :level application configuration is pre...
New
I’m new to elixir and just tried to install the elixirLS extension for VScode(ium) and it is throwing some errors that I would like help ...
New
Other Trending Topics
Edit: 2026 May 15 - This post is archived.
Mob is alive!!
Main docs: mob v0.7.11 — Documentation
A bit of explanation for the slightly c...
New
Hey, I’m Jesse and I’m the main contributor behind Dexter, a full-featured, lightning-fast Elixir LSP optimized for large codebases. It s...
New
I am happy to introduce the very α version of the new programming language compiled to BEAM.
Welcome Cure.
It has literally three kille...
New
Hi there! We created Gust: A task orchestrator inspired by Airflow.
For those who have never heard about Aiflow, it’s a Python-based wor...
New
Hi everyone!
The first release candidate for the Expert language server project is now available!
We’ve published a press release detai...
New
Beam Bots (or just BB for short) is a framework for building fault-tolerant robotics applications in Elixir using familiar OTP patterns. ...
New
Categories:
Sub Categories:
Forums
Popular Tags
- #ecto
- #liveview
- #troubleshooting
- #learning-elixir
- #library
- #deployment
- #erlang
- #testing
- #genserver
- #mix
- #absinthe
- #remote-other
- #otp
- #plug
- #how-to-question
- #macros
- #postgres
- #elixirconf
- #channels
- #exunit
- #discussion
- #code-sync
- #podcasts
- #javascript
- #onsite
- #dialyzer
- #docker
- #authentication
- #umbrella
- #full-time-contract
- #podcasts-by-brainlid
- #ecto-query
- #ai
- #elixirconf-us
- #blog-post
- #elixir-ls
- #phoenix_html
- #iex
- #graphql
- #genstage
- #websockets
- #supervisor
- #advent-of-code
- #distillery
- #processes
- #api
- #forms
- #elixirconf-eu
- #metaprogramming
- #hex









