Move other search over to new markup

app/controllers/assignments_controller.rb

@@ -144,13 +144,6 @@ def set_filter_options
 
     @current_sort_mode = params[:sort_by] || @assignment_sort_modes.keys.first
     @query = params[:query]
-
-    @assignment_sort_modes_links = @assignment_sort_modes.keys.map do |mode|
-      organization_assignment_path(
-        sort_by: mode,
-        query: @query
-      )
-    end
   end
 
   def deadline_param

app/controllers/group_assignments_controller.rb

@@ -159,15 +159,6 @@ def set_filter_options
 
     @current_sort_mode = params[:sort_by] || @assignment_sort_modes.keys.first
     @query = params[:query]
-
-    @assignment_sort_modes_links = @assignment_sort_modes.keys.map do |mode|
-      organization_group_assignment_path(
-        sort_by: mode,
-        query: @query
-      )
-    end
-
-    @current_sort_mode = params[:sort_by] || @assignment_sort_modes.keys.first
   end
 
   def set_pagination_key

app/views/assignments/_filterable_assignment_roster_list.html.erb

@@ -11,7 +11,6 @@
   search_placeholder: placeholder,
   query: @query,
   options: @assignment_sort_modes.keys,
-  option_links: @assignment_sort_modes_links,
   selected_option: @current_sort_mode
 } %>
 

app/views/group_assignments/_filterable_group_assignment_repo_list.html.erb

@@ -4,7 +4,6 @@
   search_placeholder: "Search group assignments by team name...",
   query: @query,
   options: @assignment_sort_modes.keys,
-  option_links: @assignment_sort_modes_links,
   selected_option: @current_sort_mode
 } %>
 

app/views/organizations/_organization_filters.html.erb

@@ -1,12 +1,7 @@
 <% submit_url = local_assigns.fetch(:submit_url) %>
 <% query = local_assigns.fetch(:query, nil) %>
-<% search_placeholder = local_assigns.fetch(:search_placeholder, "Search...") %>
-<% sort_menu_title = local_assigns.fetch(:sort_menu_title, "Sort by:") %>
-<% view_menu_title = local_assigns.fetch(:view_menu_title, "View:") %>
 <% sort_options = local_assigns.fetch(:sort_options, []) %>
 <% view_options = local_assigns.fetch(:view_options, []) %>
-<% sort_option_links = local_assigns.fetch(:sort_option_links, []) %>
-<% view_option_links = local_assigns.fetch(:view_option_links, []) %>
 <% active_sort_option = local_assigns.fetch(:active_sort_option, sort_options.first) %>
 <% active_view_option = local_assigns.fetch(:active_view_option, view_options.first) %>
 

app/views/shared/_search_and_sort.html.erb

@@ -1,29 +1,46 @@
 <% submit_url = local_assigns.fetch(:submit_url) %>
 <% query = local_assigns.fetch(:query, nil) %>
 <% search_placeholder = local_assigns.fetch(:search_placeholder, "Search...") %>
-<% select_menu_title = local_assigns.fetch(:select_menu_title, "Sort by:") %>
-<% options = local_assigns.fetch(:options, []) %>
-<% option_links = local_assigns.fetch(:option_links, []) %>
+<% title = local_assigns.fetch(:select_menu_title, "Sort by:") %>
 <% selected_option = local_assigns.fetch(:selected_option, options.first) %>
+<% options = local_assigns.fetch(:options, []) %>
 
-<div class="TableObject" id="js-search-and-sort-component" >
-  <div class="TableObject-item TableObject-item--primary">
-    <%= form_tag submit_url, id: "search-form", method: :get, remote: true do %>
-      <%= text_field_tag :query, query, class: "input-block form-control", placeholder: search_placeholder, autofocus: true, autocomplete: :off, id: "search-query-field" %>
-      <%= hidden_field_tag :sort_by, @current_sort_mode, id: "sort-mode-field" %>
-    <% end %>
+<%= form_tag submit_url, method: :get, remote: :true, role: "search", id: "js-filtering-form", class: "d-block d-sm-flex" do %>
+  <div class="mb-3 mb-sm-0 mr-sm-3 flex-auto">
+    <input type="search" id="your-classrooms-filter" name="query"
+           class="form-control width-full"
+           placeholder="<%= search_placeholder %>"
+           aria-label="<%= search_placeholder %>"
+           value="<%= query %>">
   </div>
-  <div class="TableObject-item">
-    <div id="select-menu-container">
-      <%= render partial: "shared/select_menu",
-          locals: {
-            title: select_menu_title,
-            options: options,
-            option_links: option_links,
-            selected_option: selected_option,
-            remote: true
-          }
-      %>
-    </div>
+
+  <div class="d-flex">
+    <details class="details-reset details-overlay position-relative mr-2" id="sort-options">
+      <summary class="btn">
+        <i><%= title %></i>
+        <span data-menu-button>
+          <%= selected_option %>
+        </span>
+        <span class="dropdown-caret"></span>
+      </summary>
+
+      <details-menu class="SelectMenu right-md-0">
+        <div class="SelectMenu-modal">
+          <header class="SelectMenu-header">
+            <span class="SelectMenu-title">Sort by:</span>
+            <button class="SelectMenu-closeButton" type="button" data-toggle-for="sort-options"><%= octicon("x", :"aria-label" => "Close menu") %></button>
+          </header>
+          <div class="SelectMenu-list">
+            <% options.each do |name, value| %>
+              <label class="SelectMenu-item" role="menuitemradio" aria-checked="<%= selected_option == name %>" tabindex="0">
+                <%= radio_button_tag "sort_by", name, selected_option == name, "hidden": "true", "data-autosubmit": "true" %>
+                <%= octicon("check", class: "SelectMenu-icon") %>
+                <span class="text-normal" data-menu-button-text><%= name %></span>
+              </label>
+            <% end %>
+          </div>
+        </div>
+      </details-menu>
+    </details>
   </div>
-</div>
+<% end %>