How do I make a dynamic navbar LiveView that is on every page?

I want to have a dynamic LiveView Navbar that is included on every page. I can’t include it in the root because I will need it to be dynamic and update and get events, so it needs to be a LiveView. But, it’s state will be completely separate from the pages the user is visiting. Does that means I need to include a ‘NavBar’ component in every page with live_render?

<%= live_render(@socket, MyApp.NarBar, id: "navbar") %>

And if I do this, does that mean that the NavBar LiveView will re-render/mount on every change between pages with live_redirect or live_patch?

Look into putting in the live.html.heex like they do in live beats. I recently tried every which way of doing it and settled in doing it in the same fashion. With on_mount hooks it is clean.

Your options are: a sticky live view, a non sticky live view, a live component or function component you include on every page, or in the template.


Thank you! That is super helpful. I keep forgetting to go to live_beats for reference.