From 0aaea2f735319d066fb190836b003b87bae53cb9 Mon Sep 17 00:00:00 2001 From: Laurent Curau Date: Tue, 28 Jan 2020 11:25:40 +0000 Subject: [PATCH 1/3] Show no deal notice with no links --- app/presenters/content_item/no_deal_notice.rb | 6 +++--- test/components/header_notice_test.rb | 7 +++++++ 2 files changed, 10 insertions(+), 3 deletions(-) diff --git a/app/presenters/content_item/no_deal_notice.rb b/app/presenters/content_item/no_deal_notice.rb index a06d70f01..fd9905f03 100644 --- a/app/presenters/content_item/no_deal_notice.rb +++ b/app/presenters/content_item/no_deal_notice.rb @@ -5,7 +5,7 @@ module NoDealNotice include ActionView::Context def has_no_deal_notice? - no_deal_notice.present? + content_item.dig("details").has_key?("brexit_no_deal_notice") end def no_deal_notice_component @@ -21,7 +21,7 @@ def no_deal_notice_component private - def no_deal_notice + def no_deal_notice_links content_item.dig("details", "brexit_no_deal_notice") end @@ -38,7 +38,7 @@ def no_deal_notice_link_intro end def no_deal_links - no_deal_notice.map do |link| + no_deal_notice_links.map do |link| { title: link["title"], href: link["href"], diff --git a/test/components/header_notice_test.rb b/test/components/header_notice_test.rb index e82daec3f..56866e697 100644 --- a/test/components/header_notice_test.rb +++ b/test/components/header_notice_test.rb @@ -29,6 +29,13 @@ def component_name assert_select "section[aria-label=notice]" end + test "renders a header notice with no link" do + render_component(title: "This is an important notice", description: "This is a description", links: []) + + assert_select ".app-c-header-notice__title", text: "This is an important notice" + assert_select ".app-c-header-notice__content p", text: "This is a description" + end + test "renders a header notice with one link" do render_component(title: "This is an important notice", description: "This is a description", links: [{ title: "test", href: "/test" }]) From 98fed4bed2222e73c8e657f01672a63f46fdda1c Mon Sep 17 00:00:00 2001 From: Vanita Barrett Date: Tue, 28 Jan 2020 11:58:29 +0000 Subject: [PATCH 2/3] Header notice component supports no links --- .../components/_header-notice.scss | 8 ++++++ app/views/components/_header-notice.html.erb | 28 +++++++++++-------- app/views/components/docs/header-notice.yml | 7 +++++ test/components/header_notice_test.rb | 3 +- 4 files changed, 33 insertions(+), 13 deletions(-) diff --git a/app/assets/stylesheets/components/_header-notice.scss b/app/assets/stylesheets/components/_header-notice.scss index 61c8a6e55..eecbc19ac 100644 --- a/app/assets/stylesheets/components/_header-notice.scss +++ b/app/assets/stylesheets/components/_header-notice.scss @@ -18,6 +18,14 @@ padding: govuk-spacing(4); } +.app-c-header-notice__description { + margin-bottom: 0; +} + +.app-c-header-notice__links { + margin-top: govuk-spacing(2); +} + .app-c-header-notice__list { margin-bottom: 0; } diff --git a/app/views/components/_header-notice.html.erb b/app/views/components/_header-notice.html.erb index d77da2fcf..ed926bfb3 100644 --- a/app/views/components/_header-notice.html.erb +++ b/app/views/components/_header-notice.html.erb @@ -11,19 +11,23 @@
-

<%= description %>

- <% if links.count == 1 %> -

- <% if link_intro %><%= link_intro %><% end %> - <%= link_to(links[0][:title], links[0][:href], data: links[0][:data_attributes], class: "app-c-header-notice__link") %> -

- <% else %> - <% if link_intro %><% end %> -
    - <% links.each do |link| %> -
  • <%= link_to(link[:title], link[:href], data: link[:data_attributes], class: "app-c-header-notice__link") %>
  • +

    <%= description %>

    + <% if links.any? %> +
+
<% end %> diff --git a/app/views/components/docs/header-notice.yml b/app/views/components/docs/header-notice.yml index b013d7de9..223d1fc06 100644 --- a/app/views/components/docs/header-notice.yml +++ b/app/views/components/docs/header-notice.yml @@ -21,4 +21,11 @@ examples: href: "/this-is-a-link" - title: "This is a second link" href: "/this-is-a-link" + without_links: + description: The link intro does not render if there are no links, even if it has been provided + data: + title: "This is an important notice" + description: "Here is a message about this notice" + link_intro: "Look at these links: " + diff --git a/test/components/header_notice_test.rb b/test/components/header_notice_test.rb index 56866e697..93a0309eb 100644 --- a/test/components/header_notice_test.rb +++ b/test/components/header_notice_test.rb @@ -30,10 +30,11 @@ def component_name end test "renders a header notice with no link" do - render_component(title: "This is an important notice", description: "This is a description", links: []) + render_component(title: "This is an important notice", description: "This is a description", link_intro: "This should not be shown", links: []) assert_select ".app-c-header-notice__title", text: "This is an important notice" assert_select ".app-c-header-notice__content p", text: "This is a description" + assert_select ".app-c-header-notice__link-intro", false, "A link intro shouldn't be shown when no links are provided" end test "renders a header notice with one link" do From 3e9b4eb37ddfee7768dd7e7e9168558cc5ca868e Mon Sep 17 00:00:00 2001 From: Vanita Barrett Date: Tue, 28 Jan 2020 13:23:25 +0000 Subject: [PATCH 3/3] Add new content and featured link --- .../stylesheets/components/_header-notice.scss | 9 +++++---- app/presenters/content_item/no_deal_notice.rb | 17 ++++++++++++++++- app/views/components/_header-notice.html.erb | 7 ++++++- app/views/components/docs/header-notice.yml | 3 +++ 4 files changed, 30 insertions(+), 6 deletions(-) diff --git a/app/assets/stylesheets/components/_header-notice.scss b/app/assets/stylesheets/components/_header-notice.scss index eecbc19ac..aa47791d9 100644 --- a/app/assets/stylesheets/components/_header-notice.scss +++ b/app/assets/stylesheets/components/_header-notice.scss @@ -18,20 +18,21 @@ padding: govuk-spacing(4); } -.app-c-header-notice__description { - margin-bottom: 0; +.app-c-header-notice__text { + margin-bottom: govuk-spacing(2); } .app-c-header-notice__links { - margin-top: govuk-spacing(2); + margin-bottom: govuk-spacing(2); } .app-c-header-notice__list { + margin-top: -5px; margin-bottom: 0; } .app-c-header-notice__link-intro { - margin-bottom: govuk-spacing(1); + margin-bottom: govuk-spacing(2); } .app-c-header-notice__link { diff --git a/app/presenters/content_item/no_deal_notice.rb b/app/presenters/content_item/no_deal_notice.rb index fd9905f03..e3beca5b1 100644 --- a/app/presenters/content_item/no_deal_notice.rb +++ b/app/presenters/content_item/no_deal_notice.rb @@ -15,6 +15,7 @@ def no_deal_notice_component description: no_deal_notice_description, link_intro: no_deal_notice_link_intro, links: no_deal_links, + featured_link: no_deal_landing_page_cta, } end end @@ -30,13 +31,27 @@ def no_deal_notice_title end def no_deal_notice_description - "This page tells you what you will need to do from January 2021. Sign up for email alerts to find out when it is updated.".html_safe + "This page tells you what you'll need to do from 1 January 2021. It'll be updated if anything changes. " end def no_deal_notice_link_intro "For current information, read: " end + def no_deal_landing_page_cta + data_attributes = { + "module": "track-click", + "track-category": "no_deal_notice", + "track-action": "/transition", + "track-label": "the transition period", + } + + featured_link = link_to("the transition period", "/transition", data: data_attributes, class: "govuk-link") + featured_link_intro = no_deal_notice_links.any? ? "You can also read about" : "You can read about" + + (featured_link_intro + " " + featured_link + ".").html_safe + end + def no_deal_links no_deal_notice_links.map do |link| { diff --git a/app/views/components/_header-notice.html.erb b/app/views/components/_header-notice.html.erb index ed926bfb3..3b5c2a62c 100644 --- a/app/views/components/_header-notice.html.erb +++ b/app/views/components/_header-notice.html.erb @@ -3,6 +3,7 @@ description ||= false link_intro ||= false links ||= [] + featured_link ||= false %> <% if title && description %>
@@ -11,7 +12,7 @@
-

<%= description %>

+

<%= description %>

<% if links.any? %> <% end %> + + <% if featured_link %> +

<%= featured_link %>

+ <% end %>
<% end %> diff --git a/app/views/components/docs/header-notice.yml b/app/views/components/docs/header-notice.yml index 223d1fc06..853b999e1 100644 --- a/app/views/components/docs/header-notice.yml +++ b/app/views/components/docs/header-notice.yml @@ -7,6 +7,7 @@ examples: data: title: "This is an important notice" description: "Here is a message about this notice" + featured_link: "You can also read about the transition period" link_intro: "Look at these links: " links: - title: "This is a link" @@ -15,6 +16,7 @@ examples: data: title: "This is an important notice" description: "Here is a message about this notice" + featured_link: "You can also read about the transition period" link_intro: "Look at these links: " links: - title: "This is a link" @@ -27,5 +29,6 @@ examples: title: "This is an important notice" description: "Here is a message about this notice" link_intro: "Look at these links: " + featured_link: "You can also read about the transition period"