cannery/lib/cannery_web/live/component/topbar.html.leex

<header class="mb-8 px-8 py-4 w-full bg-primary-400">
  <nav role="navigation">
    <div class="flex flex-row justify-between items-center space-x-4">
      <div class="flex flex-row justify-start items-center space-x-2">
        <%= link to: Routes.page_path(CanneryWeb.Endpoint, :index) do %>
          <h1 class="leading-5 text-xl text-white hover:underline">Cannery</h1>
        <% end %>
        
        <%= if @title_content do %>
          <span>|</span>
          <%= @title_content %>
        <% end %>
      </div>
    
      <ul class="flex flex-row flex-wrap justify-center items-center
        text-lg space-x-4 text-lg text-white">
        <%# user settings %>
        <%= if @current_user do %>
          <li>
            <%= link "Tags", class: "hover:underline",
              to: Routes.tag_index_path(CanneryWeb.Endpoint, :index) %>
          </li>
          <li>
            <%= link "Containers", class: "hover:underline",
              to: Routes.container_index_path(CanneryWeb.Endpoint, :index) %>
          </li>
          <li>
            <%= link "Ammo", class: "hover:underline",
              to: Routes.ammo_type_index_path(CanneryWeb.Endpoint, :index) %>
          </li>
          <li>
            <%= link "Manage", class: "hover:underline",
              to: Routes.ammo_group_index_path(CanneryWeb.Endpoint, :index) %>
          </li>
        
          <%# search %>
          <form phx-change="suggest" phx-submit="search">
            <input type="text" name="q" class="input input-primary"
              placeholder="Search" list="results" autocomplete="off"/>
            <datalist id="results">
              <%= for {app, _vsn} <- @results do %>
                <option value="<%= app %>"><%= app %></option>
              <% end %>
            </datalist>
          </form>
        
          <li>
            <%= link @current_user.email, class: "hover:underline",
              to: Routes.user_settings_path(CanneryWeb.Endpoint, :edit) %>
          </li>
          <li>
            <%= link to: Routes.user_session_path(CanneryWeb.Endpoint, :delete), method: :delete do %>
              <i class="fas fa-sign-out-alt"></i>
            <% end %>
          </li>

          <%= if function_exported?(Routes, :live_dashboard_path, 2) do %>
            <li>
              <%= link to: Routes.live_dashboard_path(CanneryWeb.Endpoint, :home) do %>
                <i class="fas fa-tachometer-alt"></i>
              <% end %>
            </li>
          <% end %>
        <% else %>
          <li>
            <%= link "Register", class: "hover:underline",
              to: Routes.user_registration_path(CanneryWeb.Endpoint, :new) %>
          </li>
          <li>
            <%= link "Log in", class: "hover:underline",
              to: Routes.user_session_path(CanneryWeb.Endpoint, :new) %>
          </li>
        <% end %>
      </ul>
    </div>
  </nav>

  <%= if live_flash(@flash, :info) do %>
    <p class="alert alert-info" role="alert"
      phx-click="lv:clear-flash" phx-value-key="info">
      <%= live_flash(@flash, :info) %>
    </p>
  <% end %>

  <%= if live_flash(@flash, :error) do %>
    <p class="alert alert-danger" role="alert"
      phx-click="lv:clear-flash" phx-value-key="error">
      <%= live_flash(@flash, :error) %>
    </p>
  <% end %>
</header>