scinote-web/app/views/projects/show/_header.html.erb

<div class="content-header sticky-header">
  <div class="title-row">
    <h1 class="project-name">
      <% if @inline_editable_title_config.present? %>
              <%= render partial: "shared/inline_editing",
                         locals: {
                            initial_value: @project.name,
                            config: @inline_editable_title_config
                         } %>
      <% else %>
        <% if action_name == 'experiment_archive' %>
          <i class="fas fa-archive"></i>
        <% end %>
        <%= @project.name %>
      <% end %>
    </h1>
    <div class="sci-btn-group header-actions">
      <!-- View switch dropdown -->
      <%= render layout: 'shared/view_switch', locals: { disabled: false } do %>
        <li class="view-switch-cards cards-switch active">
          <i class="fas fa-th-large button-icon"></i> <%= t('experiments.header.cards') %>
        </li>

        <li class="view-switch-list cards-switch ">
          <i class="fas fa-list button-icon"></i> <%= t('experiments.header.table') %>
        </li>

        <div role="separator" class="divider"></div>
        <li class="view-switch-active archive-switch" data-view-mode="archived" data-url="<%= project_path(@project) %>">
          <i class="fas fa-rocket button-icon"></i> <%= t('experiments.header.active_experiments') %>
        </li>

        <li class="view-switch-archived archive-switch" data-view-mode="active" data-url="<%= project_path(@project, view_mode: 'archived') %>">
          <i class="fas fa-archive button-icon"></i> <%= t('experiments.header.archived_experiments') %>
        </li>
      <% end %>
      <!-- TODO: add filters dropdown -->
      <div class="filter-container dropdown">
        <button class="btn btn-light icon-btn filter-button" data-toggle="dropdown"><i class="fas fa-filter"></i></button>
      </div>
      <!-- Sort menu dropdown -->
      <div class="dropdown sort-menu">
        <button class="btn btn-light icon-btn dropdown-toggle" type="button" id="sortMenu" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
          <i class="fas fa-sort-amount-up"></i>
        </button>
        <ul class="dropdown-menu dropdown-menu-right" aria-labelledby="sortMenu">
          <% ["new", "old", "atoz", "ztoa", "archived_new", "archived_old"].each_with_index do |sort, i| %>
            <% unless action_name != 'experiment_archive' && sort.include?('arch') %>
              <% if i.even? && i.positive? %>
                <li class="divider"></li>
              <% end %>
              <li>
                <a class="<%= 'selected' if @current_sort == sort %>" href="?<%= {sort: sort}.reject{|v| v.to_s == "0"}.to_query %>"><%= t("general.sort.#{sort}_html") %></a>
              </li>
            <% end %>
          <% end %>
        </ul>
      </div>
    </div>
  </div>
  <div id="toolbarWrapper" class="toolbar-row">
    <%= render partial: 'projects/show/toolbar' %>
  </div>
</div>