12 changed files with 116 additions and 56 deletions
@ -1,17 +0,0 @@ |
|||||||
<nav class="app-<%= level %>-navigation" aria-label="<%= level %>"> |
|
||||||
<div class="govuk-width-container"> |
|
||||||
<ul class="app-<%= level %>-navigation__list"> |
|
||||||
<% items.each do |item| %> |
|
||||||
<% if item.current %> |
|
||||||
<li class="app-<%= level %>-navigation__item app-<%= level %>-navigation__item--current"> |
|
||||||
<%= govuk_link_to item[:text], item[:href], class: "app-#{level}-navigation__link", aria: { current: "page" } %> |
|
||||||
</li> |
|
||||||
<% else %> |
|
||||||
<li class="app-<%= level %>-navigation__item"> |
|
||||||
<%= govuk_link_to item[:text], item[:href], class: "app-#{level}-navigation__link" %> |
|
||||||
</li> |
|
||||||
<% end %> |
|
||||||
<% end %> |
|
||||||
</ul> |
|
||||||
</div> |
|
||||||
</nav> |
|
@ -1,13 +0,0 @@ |
|||||||
class NavigationComponent < ViewComponent::Base |
|
||||||
attr_reader :items, :level |
|
||||||
|
|
||||||
def initialize(items:, level: "primary") |
|
||||||
@items = items |
|
||||||
@level = level |
|
||||||
super |
|
||||||
end |
|
||||||
|
|
||||||
def highlighted_tab?(item, _path) |
|
||||||
item[:current] |
|
||||||
end |
|
||||||
end |
|
@ -0,0 +1,17 @@ |
|||||||
|
<nav class="app-primary-navigation" aria-label="primary"> |
||||||
|
<div class="govuk-width-container"> |
||||||
|
<ul class="app-primary-navigation__list"> |
||||||
|
<% items.each do |item| %> |
||||||
|
<% if item.current %> |
||||||
|
<li class="app-primary-navigation__item app-primary-navigation__item--current"> |
||||||
|
<%= govuk_link_to item[:text], item[:href], class: "app-primary-navigation__link", aria: { current: "page" } %> |
||||||
|
</li> |
||||||
|
<% else %> |
||||||
|
<li class="app-primary-navigation__item"> |
||||||
|
<%= govuk_link_to item[:text], item[:href], class: "app-primary-navigation__link" %> |
||||||
|
</li> |
||||||
|
<% end %> |
||||||
|
<% end %> |
||||||
|
</ul> |
||||||
|
</div> |
||||||
|
</nav> |
@ -0,0 +1,12 @@ |
|||||||
|
class PrimaryNavigationComponent < ViewComponent::Base |
||||||
|
attr_reader :items |
||||||
|
|
||||||
|
def initialize(items:) |
||||||
|
@items = items |
||||||
|
super |
||||||
|
end |
||||||
|
|
||||||
|
def highlighted_item?(item, _path) |
||||||
|
item[:current] |
||||||
|
end |
||||||
|
end |
@ -0,0 +1,15 @@ |
|||||||
|
<nav class="app-sub-navigation" aria-label="secondary"> |
||||||
|
<ul class="app-sub-navigation__list"> |
||||||
|
<% items.each do |item| %> |
||||||
|
<% if item.current %> |
||||||
|
<li class="app-sub-navigation__item app-sub-navigation__item--current"> |
||||||
|
<%= govuk_link_to item[:text], item[:href], class: "app-sub-navigation__link", aria: { current: "page" } %> |
||||||
|
</li> |
||||||
|
<% else %> |
||||||
|
<li class="app-sub-navigation__item"> |
||||||
|
<%= govuk_link_to item[:text], item[:href], class: "app-sub-navigation__link" %> |
||||||
|
</li> |
||||||
|
<% end %> |
||||||
|
<% end %> |
||||||
|
</ul> |
||||||
|
</nav> |
@ -0,0 +1,12 @@ |
|||||||
|
class SubNavigationComponent < ViewComponent::Base |
||||||
|
attr_reader :items |
||||||
|
|
||||||
|
def initialize(items:) |
||||||
|
@items = items |
||||||
|
super |
||||||
|
end |
||||||
|
|
||||||
|
def highlighted_item?(item, _path) |
||||||
|
item[:current] |
||||||
|
end |
||||||
|
end |
@ -0,0 +1,39 @@ |
|||||||
|
require "rails_helper" |
||||||
|
|
||||||
|
RSpec.describe SubNavigationComponent, type: :component do |
||||||
|
let(:items) do |
||||||
|
[ |
||||||
|
NavigationItemsHelper::NavigationItem.new("Organisations", "/organisations", true), |
||||||
|
NavigationItemsHelper::NavigationItem.new("Users", "/users", false), |
||||||
|
NavigationItemsHelper::NavigationItem.new("Logs ", "/logs", false), |
||||||
|
] |
||||||
|
end |
||||||
|
|
||||||
|
context "when the item is 'current' in nav items" do |
||||||
|
it "then that tab appears as selected" do |
||||||
|
result = render_inline(described_class.new(items:)) |
||||||
|
|
||||||
|
expect(result.css('.app-sub-navigation__link[aria-current="page"]').text).to include("Organisations") |
||||||
|
end |
||||||
|
end |
||||||
|
|
||||||
|
context "when the current page is sub-page" do |
||||||
|
it "highlights the correct tab" do |
||||||
|
navigation_panel = described_class.new(items:) |
||||||
|
|
||||||
|
expect(navigation_panel).to be_highlighted_item(items[0], "/something-else") |
||||||
|
expect(navigation_panel).not_to be_highlighted_item(items[1], "/something-else") |
||||||
|
expect(navigation_panel).not_to be_highlighted_item(items[2], "/something-else") |
||||||
|
end |
||||||
|
end |
||||||
|
|
||||||
|
context "when rendering items" do |
||||||
|
it "all of the nav items specified in the items hash are passed to it" do |
||||||
|
result = render_inline(described_class.new(items:)) |
||||||
|
|
||||||
|
expect(result.text).to include("Organisations") |
||||||
|
expect(result.text).to include("Users") |
||||||
|
expect(result.text).to include("Logs") |
||||||
|
end |
||||||
|
end |
||||||
|
end |
Loading…
Reference in new issue