Beginner dabbling in LiveView.
I have been experimenting with LiveView of late, and how to implement a sidebar menu structure in conjunction with the LiveView @inner_content. The sidebar would need to be a LiveView, as well as the @inner_content. This is what a menu item would look like:
<li>
<a href="javascript:;.html" class="menu <%= if @mainmenu == "basedata", do: "menu--active" %>">
<div class="menu__icon"> <i data-feather="edit"></i> </div>
<div class="menu__title"> Base data <i data-feather="chevron-down" class="menu__sub-icon"></i> </div>
</a>
<ul class="<%= if @mainmenu == "basedata", do: "menu__sub-open" %>">
<li>
<a href="/languages" class="menu <%= if @submenu == "basedata.languages", do: "menu--active" %>">
<div class="menu__icon"> <i data-feather="activity"></i> </div>
<div class="menu__title"> Languages </div>
</a>
</li>
<li>
<a href="/countries" class="menu <%= if @submenu == "basedata.countries", do: "menu--active" %>">
<div class="menu__icon"> <i data-feather="activity"></i> </div>
<div class="menu__title"> Countries </div>
</a>
</li>
</ul>
</li>
The menu–active marks the menu as current, while the menu__sub-open drops down the sub menu items. This can be implemented in LiveView so that clicks on the menu items either drop down/up sub menu items, or clicks on a menu item open the respective LivView @inner_content .
Where I am struggling to understand is how to structure the menu in a manner that it is outside of the @inner_content block, but that the menu is still a LiveView. I do not want the menu to redraw each time I navigate to a new page, but still want the menu to be a dynamic LiveView object. The menu must just be told how to change, and then the diff can be sent to the browser to re-display the menu to the current URL. A user might have access rights to a menu item revoked by an administrator, and the menu then needs to updated based on an action on the server side, but this can probably be done using PubSub.
Is anyone aware of a blog that covers a similar topic, or could someone perhaps lay out some breadcrumbs for me so that I can read up on topics that might help me understand how such workflows need to be structured? Or does what I am trying to explain not make any sense? The hope on my side is that I can program the menus as LiveViews, and loosly coupled have the inner content as a LiveView as well, and the menu does not need to be rebuilt for each new route.
Any help appreciated.
