Merge pull request #2490 from alphagov/497_Edit-page_Related-external…

…-links

497 edit page related external links

app/assets/javascripts/application.js

@@ -2,5 +2,6 @@
 
 //= require govuk_publishing_components/dependencies
 //= require govuk_publishing_components/lib
+//= require govuk_publishing_components/components/add-another
 //= require govuk_publishing_components/components/govspeak
 //= require govuk_publishing_components/components/table

app/assets/stylesheets/application.scss

@@ -4,6 +4,11 @@ $govuk-page-width: 1140px;
 @import 'govuk_publishing_components/govuk_frontend_support';
 @import 'govuk_publishing_components/component_support';
 @import 'govuk_publishing_components/components/button';
+// The import for the "add-another" stylesheet is listed out of (alphabetical) order to prevent its styles being over-written by the "button" component stylesheet
+// An issue has been opened for this here: https://github.com/alphagov/govuk_publishing_components/issues/4548
+// When this is resolved the components can be reordered to the preferred alphabetical lsiting. 
+// There is a card for this work here: https://trello.com/c/doZRh9Gi/587-list-imported-add-another-component-stylesheet-correctly
+@import 'govuk_publishing_components/components/add-another';
 @import 'govuk_publishing_components/components/checkboxes';
 @import 'govuk_publishing_components/components/date-input';
 @import 'govuk_publishing_components/components/details';

app/controllers/editions_controller.rb

@@ -79,10 +79,28 @@ def history
     render action: "show"
   end
 
-  def linking
+  def related_external_links
     render action: "show"
   end
 
+  def update_related_external_links
+    artefact = resource.artefact
+
+    if params.key?("artefact")
+      artefact.assign_attributes(permitted_external_links_params)
+
+      if artefact.save
+        flash[:success] = "Related links updated."
+      else
+        flash[:danger] = artefact.errors.full_messages.join("\n")
+      end
+    else
+      flash[:danger] = "There aren't any external related links yet"
+    end
+
+    redirect_to related_external_links_edition_path(@resource.id)
+  end
+
   def confirm_unpublish
     if redirect_url.blank? || validate_redirect(redirect_url)
       render "secondary_nav_tabs/confirm_unpublish"
@@ -217,6 +235,10 @@ def permitted_update_params
     params.require(:edition).permit(%i[title overview in_beta body major_change change_note])
   end
 
+  def permitted_external_links_params
+    params.require(:artefact).permit(external_links_attributes: %i[title url id _destroy])
+  end
+
   def require_destroyable
     return if @resource.can_destroy?
 

app/helpers/tabbed_nav_helper.rb

@@ -23,6 +23,8 @@ def current_tab_name
       "unpublish"
     when "admin"
       "admin"
+    when "related_external_links"
+      "related_external_links"
     else
       "temp_nav_text"
     end

app/views/editions/secondary_nav_tabs/_related_external_links.html.erb

@@ -0,0 +1,40 @@
+<div class="govuk-grid-row">
+  <div class="govuk-grid-column-two-thirds">
+    <%= header_for("Related external links") %>
+
+    <%= form_for @edition.artefact, url: update_related_external_links_edition_path(@resource) do %>
+      <%
+        if @edition.artefact.external_links.count == 0
+          items = [{
+            fields: render(partial: "secondary_nav_tabs/related_external_links/add-another_fieldset", locals: { index: 0, id: nil }),
+            destroy_checkbox: render(partial: "secondary_nav_tabs/related_external_links/add-another_checkbox", locals: {index: 0}),
+          }]
+          empty = render(partial: "secondary_nav_tabs/related_external_links/add-another_fieldset", locals: { index: 1, id: nil })
+        else
+          items = @edition.artefact.external_links.each_with_index.map do | external_link, index |
+            {
+              fields: render(partial: "secondary_nav_tabs/related_external_links/add-another_fieldset", locals: { index:, id: external_link.id }),
+              destroy_checkbox: render(partial: "secondary_nav_tabs/related_external_links/add-another_checkbox", locals: {index: index}),
+            }
+          end
+          empty = render(partial: "secondary_nav_tabs/related_external_links/add-another_fieldset", locals: { index: @edition.artefact.external_links.count, id: nil })
+        end
+      %>
+
+      <%= render "govuk_publishing_components/components/add_another", {
+        fieldset_legend: "Link",
+        add_button_text: "Add another link",
+        items: items,
+        empty: empty,
+      } %>
+
+      <%= render "govuk_publishing_components/components/inset_text", {
+        text: "After saving, changes to related external links will be visible on the site the next time this publication is published.",
+      } %>
+
+      <%= render "govuk_publishing_components/components/button", {
+        text: "Save",
+      } %>
+    <% end %>
+  </div>
+</div>

app/views/editions/secondary_nav_tabs/related_external_links/_add-another_checkbox.html.erb

@@ -0,0 +1,5 @@
+<%= render "govuk_publishing_components/components/checkboxes", { 
+  name: "artefact[external_links_attributes][#{index}][_destroy]",
+  id: "artefact_external_links_attributes_#{index}__destroy",
+  items: [{label: "Delete", value: "1" }],
+} %>

app/views/editions/secondary_nav_tabs/related_external_links/_add-another_fieldset.html.erb

@@ -0,0 +1,24 @@
+<% if id %>
+  <%= hidden_field_tag "artefact[external_links_attributes][#{index}][id]", id %>
+<% end %>
+
+<%= render "govuk_publishing_components/components/input", {
+  label: {
+    text: "Title",
+    bold: true,
+  },
+  name: "artefact[external_links_attributes][#{index}][title]",
+  id: "artefact_external_links_attributes_#{index}_title",
+  value: @edition.artefact.external_links[index].present? ? @edition.artefact.external_links[index].title : "",
+} %>
+
+<%= render "govuk_publishing_components/components/input", {
+  label: {
+    text: "URL",
+    bold: true,
+  },
+  name: "artefact[external_links_attributes][#{index}][url]",
+  id: "artefact_external_links_attributes_#{index}_url",
+  value: @edition.artefact.external_links[index].present? ? @edition.artefact.external_links[index].url : "",
+  hint: "Example: https://gov.uk",
+} %>

config/routes.rb

@@ -23,7 +23,8 @@
         get "history"
         get "admin"
         post "duplicate"
-        get "related_external_links", to: "editions#linking"
+        get "related_external_links"
+        patch "update_related_external_links"
         get "tagging", to: "editions#linking"
         get "unpublish"
         get "unpublish/confirm-unpublish", to: "editions#confirm_unpublish", as: "confirm_unpublish"

test/functional/editions_controller_test.rb

@@ -56,7 +56,7 @@ class EditionsControllerTest < ActionController::TestCase
       test_strategy.switch!(:restrict_access_by_org, true)
     end
 
-    %i[show metadata history admin linking unpublish].each do |action|
+    %i[show metadata history admin related_external_links unpublish].each do |action|
       context "##{action}" do
         setup do
           @edition = FactoryBot.create(:edition, owning_org_content_ids: %w[org-two])
@@ -74,7 +74,7 @@ class EditionsControllerTest < ActionController::TestCase
   end
 
   context "when 'restrict_access_by_org' feature toggle is enabled" do
-    %i[show metadata history admin linking unpublish].each do |action|
+    %i[show metadata history admin related_external_links unpublish].each do |action|
       context "##{action}" do
         setup do
           @edition = FactoryBot.create(:edition, owning_org_content_ids: %w[org-two])
@@ -625,6 +625,62 @@ class EditionsControllerTest < ActionController::TestCase
     end
   end
 
+  context "#update_related_external_links" do
+    should "display an error message when the title is blank" do
+      patch :update_related_external_links, params: {
+        id: @edition.id,
+        artefact: {
+          external_links_attributes: [{ title: "", url: "http://foo-bar.com", _destroy: false }],
+        },
+      }
+
+      assert_equal "External links is invalid", flash[:danger]
+    end
+
+    should "display an error message when the url is blank" do
+      patch :update_related_external_links, params: {
+        id: @edition.id,
+        artefact: {
+          external_links_attributes: [{ title: "foo", url: "", _destroy: false }],
+        },
+      }
+
+      assert_equal "External links is invalid", flash[:danger]
+    end
+
+    should "display an error message when the url is invalid" do
+      patch :update_related_external_links, params: {
+        id: @edition.id,
+        artefact: {
+          external_links_attributes: [{ title: "foo", url: "an-invalid-url", _destroy: false }],
+        },
+      }
+
+      assert_equal "External links is invalid", flash[:danger]
+    end
+
+    should "update related external links and display a success message when successfully saved" do
+      patch :update_related_external_links, params: {
+        id: @edition.id,
+        artefact: {
+          external_links_attributes: [{ title: "foo", url: "https://foo-bar.com", _destroy: false }],
+        },
+      }
+
+      assert_equal "Related links updated.", flash[:success]
+      assert_equal "foo", @edition.artefact.external_links[0].title
+      assert_equal "https://foo-bar.com", @edition.artefact.external_links[0].url
+    end
+
+    should "display an error message when there are no external links to save" do
+      patch :update_related_external_links, params: {
+        id: @edition.id,
+      }
+
+      assert_equal "There aren't any external related links yet", flash[:danger]
+    end
+  end
+
 private
 
   def description(edition)

test/integration/edition_edit_test.rb

@@ -585,6 +585,130 @@ class EditionEditTest < IntegrationTest
     end
   end
 
+  context "Related external links tab" do
+    setup do
+      visit_draft_edition
+      click_link "Related external links"
+    end
+
+    should "render 'Related external links' header, inset text and save button" do
+      assert page.has_css?("h2", text: "Related external links")
+      assert page.has_css?("div.gem-c-inset-text", text: "After saving, changes to related external links will be visible on the site the next time this publication is published.")
+      assert page.has_css?("button.gem-c-button", text: "Save")
+    end
+
+    context "Document has no external links when page loads" do
+      setup do
+        visit_draft_edition
+        click_link "Related external links"
+      end
+
+      should "render an empty 'Add another' form" do
+        # Link 1
+        assert page.has_css?("legend", text: "Link 1")
+        assert page.has_css?("input[name='artefact[external_links_attributes][0][_destroy]']")
+        assert_equal "Title", page.find("label[for='artefact_external_links_attributes_0_title']").text
+        assert_equal "URL", page.find("label[for='artefact_external_links_attributes_0_url']").text
+        assert_equal "", page.find("input[name='artefact[external_links_attributes][0][title]']").value
+        assert_equal "", page.find("input[name='artefact[external_links_attributes][0][url]']").value
+
+        # Link 2 (empty fields)
+        assert page.has_css?("legend", text: "Link 2")
+        assert_equal "Title", page.find("label[for='artefact_external_links_attributes_1_title']").text
+        assert_equal "URL", page.find("label[for='artefact_external_links_attributes_1_url']").text
+        assert_equal "", page.find("input[name='artefact[external_links_attributes][1][title]']").value
+        assert_equal "", page.find("input[name='artefact[external_links_attributes][1][url]']").value
+      end
+    end
+
+    context "Document already has external links when page loads" do
+      setup do
+        visit_draft_edition
+        @draft_edition.artefact.external_links = [{ title: "Link One", url: "https://gov.uk" }]
+        click_link "Related external links"
+      end
+
+      should "render a pre-populated 'Add another' form" do
+        # Link 1
+        assert page.has_css?("legend", text: "Link 1")
+        assert page.has_css?("input[name='artefact[external_links_attributes][0][_destroy]']")
+        assert_equal "Title", page.find("label[for='artefact_external_links_attributes_0_title']").text
+        assert_equal "URL", page.find("label[for='artefact_external_links_attributes_0_url']").text
+        assert_equal "Link One", page.find("input[name='artefact[external_links_attributes][0][title]']").value
+        assert_equal "https://gov.uk", page.find("input[name='artefact[external_links_attributes][0][url]']").value
+
+        # Link 2 (empty fields)
+        assert page.has_css?("legend", text: "Link 2")
+        assert_equal "Title", page.find("label[for='artefact_external_links_attributes_1_title']").text
+        assert_equal "URL", page.find("label[for='artefact_external_links_attributes_1_url']").text
+        assert_equal "", page.find("input[name='artefact[external_links_attributes][1][title]']").value
+        assert_equal "", page.find("input[name='artefact[external_links_attributes][1][url]']").value
+      end
+    end
+
+    context "User adds a new external link and saves" do
+      setup do
+        visit_draft_edition
+        click_link "Related external links"
+      end
+
+      should "render a pre-populated 'Add another' form" do
+        within :css, ".gem-c-add-another .js-add-another__fieldset:first-of-type" do
+          fill_in "Title", with: "A new external link"
+          fill_in "URL", with: "https://foo.com"
+        end
+
+        click_button("Save")
+
+        # Link 1
+        assert page.has_css?("legend", text: "Link 1")
+        assert page.has_css?("input[name='artefact[external_links_attributes][0][_destroy]']")
+        assert_equal "Title", page.find("label[for='artefact_external_links_attributes_0_title']").text
+        assert_equal "URL", page.find("label[for='artefact_external_links_attributes_0_url']").text
+        assert_equal "A new external link", page.find("input[name='artefact[external_links_attributes][0][title]']").value
+        assert_equal "https://foo.com", page.find("input[name='artefact[external_links_attributes][0][url]']").value
+
+        # Link 2 (empty fields)
+        assert page.has_css?("legend", text: "Link 2")
+        assert_equal "Title", page.find("label[for='artefact_external_links_attributes_1_title']").text
+        assert_equal "URL", page.find("label[for='artefact_external_links_attributes_1_url']").text
+        assert_equal "", page.find("input[name='artefact[external_links_attributes][1][title]']").value
+        assert_equal "", page.find("input[name='artefact[external_links_attributes][1][url]']").value
+      end
+    end
+
+    context "User deletes an external link and saves" do
+      setup do
+        visit_draft_edition
+        @draft_edition.artefact.external_links = [{ title: "Link One", url: "https://gov.uk" }]
+        click_link "Related external links"
+      end
+
+      should "render an empty 'Add another' form" do
+        within :css, ".gem-c-add-another .js-add-another__fieldset:first-of-type" do
+          check("Delete")
+        end
+
+        click_button("Save")
+
+        # Link 1
+        assert page.has_css?("legend", text: "Link 1")
+        assert page.has_css?("input[name='artefact[external_links_attributes][0][_destroy]']")
+        assert_equal "Title", page.find("label[for='artefact_external_links_attributes_0_title']").text
+        assert_equal "URL", page.find("label[for='artefact_external_links_attributes_0_url']").text
+        assert_equal "", page.find("input[name='artefact[external_links_attributes][0][title]']").value
+        assert_equal "", page.find("input[name='artefact[external_links_attributes][0][url]']").value
+
+        # Link 2
+        assert page.has_css?("legend", text: "Link 2")
+        assert_equal "Title", page.find("label[for='artefact_external_links_attributes_1_title']").text
+        assert_equal "URL", page.find("label[for='artefact_external_links_attributes_1_url']").text
+        assert_equal "", page.find("input[name='artefact[external_links_attributes][1][title]']").value
+        assert_equal "", page.find("input[name='artefact[external_links_attributes][1][url]']").value
+      end
+    end
+  end
+
 private
 
   def visit_draft_edition