Add Explore Tags for Signed-In Users (#11022) [deploy]

* Adds an Explore Tag section for logged in users
  - Logged in users who follow no tags are shown Explore Tags
  - Links to the /tags page
  - Shows top 5 tags below Explore Tags header

* WIP: Adds a test around logged in users who do not follow tags

* Refactors spec to test Explore Tags functionality and adjusts id in _sidebar_nav

* Replaces cog svg with linked header

* Implements design suggestions for Explore and adjusts test
This commit is contained in:
Julianna Tetreault 2020-10-23 09:06:41 -06:00 committed by GitHub
parent d008f89399
commit 8fb1a3824a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 48 additions and 14 deletions

View file

@ -45,7 +45,8 @@
</nav>
<nav class="mb-6" aria-label="Secondary sidebar nav">
<% if user_signed_in? %>
<nav class="mb-6" aria-label="Secondary sidebar nav">
<% if user_signed_in? && current_user.following_tags_count.positive? %>
<header class="p-2 pr-0 flex items-center justify-between">
<h3 class="crayons-subtitle-3">My Tags</h3>
<a href="/dashboard/following_tags" class="crayons-btn crayons-btn--icon crayons-btn--ghost-dimmed" aria-label="Customize tag priority" title="Customize tag priority">
@ -53,21 +54,42 @@
</a>
</header>
<div id="sidebar-nav-followed-tags" class="overflow-y-auto mb-2" style="max-height: 42vh;"></div>
<% else %>
<h3 class="crayons-subtitle-3 p-2">Popular Tags</h3>
<div id="sidebar-nav-default-tags" class="overflow-y-auto" style="max-height: 42vh">
<% Tag.where(supported: true).order(hotness_score: :desc).limit(30).pluck(:id, :name).each do |tag_array| %>
<div class="sidebar-nav-element" id="default-sidebar-element-<%= tag_array.second %>">
<a class="crayons-link crayons-link--block py-2 px-2" href="<%= tag_path(tag_array.second) %>">
#<%= tag_array.second %>
</a>
<a class="follow-action-button sidebar-nav-link-follow crayons-btn crayons-btn--s"
href="#" id="sidebar-nav-link-follow-<%= tag_array.second %>"
data-info='{"id":<%= tag_array.first %>,"className":"Tag"}'>
Follow
</a>
<% elsif user_signed_in? %>
<header class="p-2 pr-0 flex items-center justify-between">
<h3 class="crayons-subtitle-3">Explore</h3>
<a href="<%= tags_path %>" class="fs-s crayons-link crayons-link--brand pr-2" title="Browse all tags">
All tags
</a>
</header>
<div id="sidebar-nav-explore-tags" class="overflow-y-auto" style="max-height: 42vh">
<% Tag.where(supported: true).order(hotness_score: :desc).limit(5).pluck(:id, :name).each do |tag_array| %>
<div class="sidebar-nav-element" id="default-sidebar-element-<%= tag_array.second %>">
<a class="crayons-link crayons-link--block py-2 px-2" href="<%= tag_path(tag_array.second) %>">
#<%= tag_array.second %>
</a>
<a class="follow-action-button sidebar-nav-link-follow crayons-btn crayons-btn--s"
href="#" id="sidebar-nav-link-follow-<%= tag_array.second %>"
data-info='{"id":<%= tag_array.first %>,"className":"Tag"}'>
Follow
</a>
</div>
<% end %>
</div>
<% else %>
<h3 class="crayons-subtitle-3 p-2">Popular Tags</h3>
<div id="sidebar-nav-default-tags" class="overflow-y-auto" style="max-height: 42vh">
<% Tag.where(supported: true).order(hotness_score: :desc).limit(30).pluck(:id, :name).each do |tag_array| %>
<div class="sidebar-nav-element" id="default-sidebar-element-<%= tag_array.second %>">
<a class="crayons-link crayons-link--block py-2 px-2" href="<%= tag_path(tag_array.second) %>">
#<%= tag_array.second %>
</a>
<a class="follow-action-button sidebar-nav-link-follow crayons-btn crayons-btn--s"
href="#" id="sidebar-nav-link-follow-<%= tag_array.second %>"
data-info='{"id":<%= tag_array.first %>,"className":"Tag"}'>
Follow
</a>
</div>
<% end %>
</div>
<% end %>
</nav>

View file

@ -87,6 +87,7 @@ RSpec.describe "User visits a homepage", type: :system do
user.follows.create!(followable: ruby_tag)
user.follows.create!(followable: create(:tag, name: "go", hotness_score: 99))
user.follows.create!(followable: create(:tag, name: "javascript"), points: 3)
user.update!(following_tags_count: 3)
visit "/"
end
@ -112,6 +113,17 @@ RSpec.describe "User visits a homepage", type: :system do
end
end
context "when user does not follow tags" do
before do
visit "/"
end
it "shows 'Explore Tags' and links to /tags", js: true do
expect(page).to have_text("Explore")
expect(page).to have_selector(:css, 'a[href="/tags"]')
end
end
context "when rendering < 5 navigation links" do
let!(:navigation_link_1) do
create(:navigation_link,