Hi guys!
I want to save the user interface settings (like sidebar state and audio on/off) when the user clicks the links on the site.

For example in app.html.heex:

<div class=“w-screen flex flex-row relative”>
<aside class=“fixed inset-y-0 left-0 z-50 flex-none w-64 h-screen” id=“sidebar”>
…
</aside>

<main class=“ml-64 flex flex-col flex-1” id=“content”>
…
</main>
</div>

Is it correct to add a variable, such as @sidebar, and use it when rendering the page? At the same time, it must somehow be preserved in session cookies when the function is triggered.

I use this function for toggle sidebar in core_component.ex:

def toggle_sidebar(display) do
JS.toggle(%JS{},
to: “#sidebar”,
in: {“ease-out duration-150”, “-translate-x-full”, “translate-x-0”},
out: {“ease-in duration-150”, “translate-x-0”, “-translate-x-full”},
display: display,
time: 150
)
|> JS.remove_class(
“ml-64”,
to: “#content.ml-64”
)
|> JS.add_class(
“ml-64”,
to: “#content:not(.ml-64)”
)
end

Are session cookies a good choise or maybe there is some other way to store UI settings?