diff --git a/app/assets/stylesheets/modules/org.css b/app/assets/stylesheets/modules/org.css index 80f47a7bb2c..e3a33d64b54 100644 --- a/app/assets/stylesheets/modules/org.css +++ b/app/assets/stylesheets/modules/org.css @@ -194,9 +194,27 @@ text-align: right; } } @media (min-width: 780px) { .profile__downloads-wrap { - padding-top: 32px; } } + padding-top: 32px; + } + .profile__downloads-wrap form { + align-items: flex-end; + } +} + +.profile__downloads-wrap form { + display: flex; + flex-direction: column; +} +.profile__downloads-wrap form label:first-child, +.profile__downloads-wrap form select{ + margin-bottom: 0.5rem; +} +.profile__downloads-wrap form select, +.profile__downloads-wrap form button { + width: fit-content; +} /* Dashboard Gems and Subscriptions */ diff --git a/app/controllers/profiles_controller.rb b/app/controllers/profiles_controller.rb index 6c3c98521dc..60c240b90c1 100644 --- a/app/controllers/profiles_controller.rb +++ b/app/controllers/profiles_controller.rb @@ -9,9 +9,13 @@ class ProfilesController < ApplicationController def show @user = User.find_by_slug!(params[:id]) - rubygems = @user.rubygems_downloaded - @rubygems = rubygems.slice!(0, 10) - @extra_rubygems = rubygems + rubygems = @user.rubygems + @rubygems = case params[:sort_by] + when "name" + rubygems.reorder(:name) + else + rubygems.by_downloads + end end def me diff --git a/app/javascript/controllers/gem_sort_controller.js b/app/javascript/controllers/gem_sort_controller.js new file mode 100644 index 00000000000..5bdd33165d2 --- /dev/null +++ b/app/javascript/controllers/gem_sort_controller.js @@ -0,0 +1,13 @@ +import { Controller } from "@hotwired/stimulus" + +// Connects to data-controller="gem-sort" +export default class extends Controller { + static targets = ["form", "select"] + connect() { + this.selectTarget.onchange = () => this.formSubmit(); + } + + formSubmit = () => { + this.formTarget.submit(); + } +} diff --git a/app/views/profiles/_sort_form.html.erb b/app/views/profiles/_sort_form.html.erb new file mode 100644 index 00000000000..7d3def170a0 --- /dev/null +++ b/app/views/profiles/_sort_form.html.erb @@ -0,0 +1,23 @@ +<%= + form_with( + data: { + "controller": "gem-sort", + "gem-sort-target": "form", + }, + method: :get, + url: profile_path(@user&.handle) + ) do |f| +%> + <%= f.label :sort_by, class: "t-text--s"%> + <%= + select_tag :sort_by, + options_for_select( + [ + ["Name", "name"], + ["Downloads", "downloads"] + ], + params[:sort_by] || "downloads" + ), + data: { "gem-sort-target" => "select" } + %> +<% end %> \ No newline at end of file diff --git a/app/views/profiles/show.html.erb b/app/views/profiles/show.html.erb index bb74725481d..cd8c9a66e1e 100644 --- a/app/views/profiles/show.html.erb +++ b/app/views/profiles/show.html.erb @@ -113,6 +113,8 @@

<%= number_with_delimiter(@user.total_downloads_count) %>

+ + <%= render partial: "sort_form" %> <% end %> @@ -123,7 +125,7 @@ <%= render( partial: 'rubygem', - collection: @rubygems + @extra_rubygems, + collection: @rubygems, locals: {graph: false} ) %> diff --git a/test/integration/profile_test.rb b/test/integration/profile_test.rb index eb907abdbf2..92c61b6efe1 100644 --- a/test/integration/profile_test.rb +++ b/test/integration/profile_test.rb @@ -177,4 +177,19 @@ def sign_out assert page.has_content? "special note" assert page.has_content? "request note" end + + test "sort gems alphabetically in profile" do + alphabetical_first = FactoryBot.create(:rubygem, name: "AGem", owners: [@user], downloads: 1) + alphabetical_last = FactoryBot.create(:rubygem, name: "ZGem", owners: [@user], downloads: 999) + + visit profile_path(@user.handle) + dropdown = find(:element, "data-gem-sort-target": "select") + form = find(:element, "data-gem-sort-target": "form") + dropdown.select("Name") + # Submit form without button + Capybara::RackTest::Form.new(form.base.driver, form.native).submit({}) + rubygem_links = page.all(:element, "a", class: "gems__gem__name") + assert rubygem_links.first.text == alphabetical_first.name + assert rubygem_links.last.text == alphabetical_last.name + end end