diff --git a/app/assets/javascripts/admin/modules/add-another.js b/app/assets/javascripts/admin/modules/add-another.js deleted file mode 100644 index c161e6f374c..00000000000 --- a/app/assets/javascripts/admin/modules/add-another.js +++ /dev/null @@ -1,192 +0,0 @@ -'use strict' -window.GOVUK = window.GOVUK || {} -window.GOVUK.Modules = window.GOVUK.Modules || {} -;(function (Modules) { - function AddAnother(module) { - this.module = module - this.addText = this.module.dataset.addText || 'Add another' - } - - AddAnother.prototype.init = function () { - this.addButton() - this.removeButton() - } - - AddAnother.prototype.addButton = function () { - const buttonAdd = document.createElement('button') - - buttonAdd.classList.add( - 'govuk-button', - 'govuk-!-margin-bottom-0', - 'govuk-button--secondary', - 'add-another__add-button' - ) - buttonAdd.setAttribute('type', 'submit') - buttonAdd.textContent = this.addText - - this.module.append(buttonAdd) - - // Add event listeners for "add" and "remove" buttons - this.module.addEventListener( - 'click', - function (e) { - if (e.target.classList.contains('add-another__remove-button')) { - this.removeFields(e.target) - } else if (e.target.classList.contains('add-another__add-button')) { - e.preventDefault() - this.addFields(e.target) - } - }.bind(this) - ) - } - - AddAnother.prototype.addFields = function (button) { - const allFields = button.parentNode.querySelectorAll( - '.js-duplicate-fields-set' - ) - const fields = allFields[allFields.length - 1] - - // Show hidden "Remove" button - if (fields.querySelector('.add-another__remove-button')) { - fields.querySelector('.add-another__remove-button').style.display = - 'inline-block' - } - - // Clone the markup of the previous set of fields - const newFields = fields.cloneNode(true) - - // Reset values of cloned fields - newFields - .querySelectorAll('input, textarea, select') - .forEach(function (element) { - element.value = '' - }) - - // Increment values for id, for and name of cloned fields - this.setValues(newFields, null) - - // Add cloned fields to the DOM - button.before(newFields) - - // Add remove button to all fields - this.removeButton() - - // Move focus to first visible field in new set - newFields - .querySelectorAll('input:not([type="hidden"]), select, textarea')[0] - .focus() - } - - AddAnother.prototype.removeButton = function () { - const fields = this.module.querySelectorAll('.js-duplicate-fields-set') - let buttonRemove - - if (fields.length > 1) { - fields.forEach(function (field) { - if (!field.querySelector('.add-another__remove-button')) { - buttonRemove = document.createElement('button') - buttonRemove.classList.add( - 'govuk-button', - 'govuk-button--warning', - 'govuk-!-margin-bottom-6', - 'add-another__remove-button' - ) - buttonRemove.setAttribute('type', 'button') - buttonRemove.textContent = 'Delete' - - field.append(buttonRemove) - } - }) - } - } - - AddAnother.prototype.removeFields = function (button) { - const set = button.parentNode - const input = set.querySelectorAll( - 'input:not([type="hidden"]), select, textarea' - )[0] - const baseId = input.id - const baseName = input.name - - set.remove() - - const sets = this.module.querySelectorAll('.js-duplicate-fields-set') - - // Add hidden field for removed set - const hiddenField = document.createElement('input') - hiddenField.type = 'hidden' - hiddenField.classList.add('js-hidden-destroy') - hiddenField.id = baseId.replace(/_[a-zA-Z]+$/, '__destroy') - hiddenField.name = baseName.replace(/\[[_a-zA-Z]+\]$/, '[_destroy]') - hiddenField.setAttribute('value', 'true') - this.module.append(hiddenField) - - // Hide "Remove" button if only first set displayed - if (sets.length === 1) { - sets[0].querySelector('.add-another__remove-button').style.display = - 'none' - } - - // Move focus to first visible field - sets[0] - .querySelectorAll('input:not([type="hidden"]), select, textarea')[0] - .focus() - } - - // Set values for index, for and name of supplied fields - AddAnother.prototype.setValues = function (set, index) { - let num = 0 - - set - .querySelectorAll('label, input, select, textarea') - .forEach(function (element) { - const currentName = element.getAttribute('name') || null - const currentId = element.getAttribute('id') || null - const currentFor = element.getAttribute('for') || null - const arrayMatcher = /(.*)\[([0-9]+)\](.*?)$/ - const underscoreMatcher = /(.*)_([0-9]+)_(.*?)$/ - let matched - - if (currentName && arrayMatcher.exec(currentName)) { - matched = arrayMatcher.exec(currentName) - - if (index === null) { - num = parseInt(matched[2], 10) + 1 - } else { - num = index - } - - element.setAttribute( - 'name', - matched[1] + '[' + num + ']' + matched[3] - ) - } - - if (currentId && underscoreMatcher.exec(currentId)) { - matched = underscoreMatcher.exec(currentId) - - if (index === null) { - num = parseInt(matched[2], 10) + 1 - } else { - num = index - } - - element.setAttribute('id', matched[1] + '_' + num + '_' + matched[3]) - } - - if (currentFor && underscoreMatcher.exec(currentFor)) { - matched = underscoreMatcher.exec(currentFor) - - if (index === null) { - num = parseInt(matched[2], 10) + 1 - } else { - num = index - } - - element.setAttribute('for', matched[1] + '_' + num + '_' + matched[3]) - } - }) - } - - Modules.AddAnother = AddAnother -})(window.GOVUK.Modules) diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js index 151cffed3b0..b578ec86dea 100644 --- a/app/assets/javascripts/application.js +++ b/app/assets/javascripts/application.js @@ -3,6 +3,7 @@ //= require govuk_publishing_components/dependencies //= require govuk_publishing_components/analytics-ga4 //= require govuk_publishing_components/components/accordion +//= require govuk_publishing_components/components/add-another //= require govuk_publishing_components/components/copy-to-clipboard //= require govuk_publishing_components/components/govspeak //= require govuk_publishing_components/components/reorderable-list @@ -23,7 +24,6 @@ //= require admin/analytics-modules/ga4-page-view-tracking.js //= require admin/analytics-modules/ga4-paste-tracker.js -//= require admin/modules/add-another //= require admin/modules/document-history-paginator //= require admin/modules/locale-switcher //= require admin/modules/navbar-toggle diff --git a/app/assets/stylesheets/admin/views/_add-another.scss b/app/assets/stylesheets/admin/views/_add-another.scss deleted file mode 100644 index f8b2ce948b4..00000000000 --- a/app/assets/stylesheets/admin/views/_add-another.scss +++ /dev/null @@ -1,12 +0,0 @@ -.js-duplicate-fields-set { - margin-top: govuk-spacing(4); - border-bottom: 1px solid $govuk-border-colour; - - &:last-of-type { - border-bottom: none; - } - - &:first-child { - margin-top: 0; - } -} diff --git a/app/assets/stylesheets/admin/views/_contacts.scss b/app/assets/stylesheets/admin/views/_contacts.scss deleted file mode 100644 index 16abec3c720..00000000000 --- a/app/assets/stylesheets/admin/views/_contacts.scss +++ /dev/null @@ -1,22 +0,0 @@ -.app-view-contacts { - &__address { - .govuk-fieldset__legend--l { - margin-bottom: govuk-spacing(2); - } - } - - &__phone { - .govuk-fieldset__legend--l { - margin-bottom: govuk-spacing(2); - } - - .govuk-form-group { - margin-bottom: govuk-spacing(4); - } - - .add-another__remove-button { - margin-top: govuk-spacing(4); - margin-bottom: 0; - } - } -} diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss index 068bce7c472..15a3d953592 100644 --- a/app/assets/stylesheets/application.scss +++ b/app/assets/stylesheets/application.scss @@ -19,9 +19,7 @@ $govuk-page-width: 1140px; @import "./admin/views/components/worldwide_offices/index/office-summary-card-component"; -@import "./admin/views/add-another"; @import "./admin/views/audit-trail"; -@import "./admin/views/contacts"; @import "./admin/views/dashboard-index"; @import "./admin/views/document-history-tab"; @import "./admin/views/document-collection-group-memberships-index"; diff --git a/app/views/admin/contacts/_contact_number_fields.html.erb b/app/views/admin/contacts/_contact_number_fields.html.erb new file mode 100644 index 00000000000..0492782d558 --- /dev/null +++ b/app/views/admin/contacts/_contact_number_fields.html.erb @@ -0,0 +1,21 @@ +<%= contact_form.fields_for :contact_numbers, contact_number do |contact_number_form| %> + <%= render "govuk_publishing_components/components/input", { + label: { + text: "Label", + }, + name: "#{name}[contact_numbers_attributes][#{index}][label]", + id: "#{id}_contact_numbers_attributes_#{index}_label", + heading_size: "s", + value: contact_number_form.object.label, + } %> + + <%= render "govuk_publishing_components/components/input", { + label: { + text: "Number", + }, + name: "#{name}[contact_numbers_attributes][#{index}][number]", + id: "#{id}_contact_numbers_attributes_#{index}_number", + heading_size: "s", + value: contact_number_form.object.number, + } %> +<% end %> diff --git a/app/views/admin/contacts/_form_fields.html.erb b/app/views/admin/contacts/_form_fields.html.erb index 97470ab1187..cf958f3a3fa 100644 --- a/app/views/admin/contacts/_form_fields.html.erb +++ b/app/views/admin/contacts/_form_fields.html.erb @@ -101,30 +101,16 @@ heading_level: 2, heading_size: "l", } do %> -
- <%= contact_form.fields_for :contact_numbers, contact_form.object.contact_numbers do |contact_number_form| %> -
- <%= render "govuk_publishing_components/components/input", { - label: { - text: "Label", - }, - name: "#{name}[contact_numbers_attributes][#{contact_number_form.index}][label]", - id: "#{id}_contact_numbers_attributes_#{contact_number_form.index}_label", - heading_size: "m", - value: contact_number_form.object.label, - } %> - - <%= render "govuk_publishing_components/components/input", { - label: { - text: "Number", - }, - name: "#{name}[contact_numbers_attributes][#{contact_number_form.index}][number]", - id: "#{id}_contact_numbers_attributes_#{contact_number_form.index}_number", - heading_size: "m", - value: contact_number_form.object.number, - } %> -
- <% end %> -
+ <%= render "govuk_publishing_components/components/add_another", { + fieldset_legend: "Phone number", + add_button_text: "Add phone number", + items: contact_form.object.contact_numbers.each_with_index.map do |contact_number, index| + { + fields: render(partial: "contact_number_fields", locals: { contact_form:, contact_number:, index:, name:, id: }), + destroy_checkbox: render("govuk_publishing_components/components/checkboxes", { name: "#{name}[contact_numbers_attributes][#{index}][_destroy]", items: [{label: "Delete", value: "1" }]}) + } + end, + empty: render(partial: "contact_number_fields", locals: { contact_form:, contact_number: ContactNumber.new, index: contact_form.object.contact_numbers.length, name:, id: }), + } %> <% end %> diff --git a/app/views/admin/fatality_notices/_casualty_fields.html.erb b/app/views/admin/fatality_notices/_casualty_fields.html.erb new file mode 100644 index 00000000000..9758ff073f1 --- /dev/null +++ b/app/views/admin/fatality_notices/_casualty_fields.html.erb @@ -0,0 +1,12 @@ +<%= form.fields_for :fatality_notice_casualties, casualty do |fatality_form| %> + <%= render "govuk_publishing_components/components/textarea", { + label: { + text: "Personal details", + bold: true, + }, + value: fatality_form.object.personal_details, + name: "edition[fatality_notice_casualties_attributes][#{index}][personal_details]", + id: "edition_fatality_notice_casualties_#{index}_personal_details", + rows: 2, + } %> +<% end %> diff --git a/app/views/admin/fatality_notices/_form.html.erb b/app/views/admin/fatality_notices/_form.html.erb index 87b0fe8dbfb..df3195fb556 100644 --- a/app/views/admin/fatality_notices/_form.html.erb +++ b/app/views/admin/fatality_notices/_form.html.erb @@ -34,21 +34,16 @@

Casualties (required)

-
- <%= form.fields_for :fatality_notice_casualties do |fatality_form| %> -
- <%= render "govuk_publishing_components/components/textarea", { - label: { - text: "Personal details", - bold: true, - }, - value: fatality_form.object.personal_details, - name: "edition[fatality_notice_casualties_attributes][#{fatality_form.index}][personal_details]", - id: "edition_fatality_notice_casualties_#{fatality_form.index}_personal_details", - rows: 2, - } %> -
- <% end %> -
+ <%= render "govuk_publishing_components/components/add_another", { + fieldset_legend: "Person", + add_button_text: "Add another person", + items: form.object.fatality_notice_casualties.each_with_index.map do |casualty, index| + { + fields: render(partial: "casualty_fields", locals: { form:, casualty:, index: }), + destroy_checkbox: render("govuk_publishing_components/components/checkboxes", { name: "edition[fatality_notice_casualties_attributes][#{index}][_destroy]", items: [{label: "Delete", value: "1" }]}) + } + end, + empty: render(partial: "casualty_fields", locals: { form:, casualty: FatalityNoticeCasualty.new, index: form.object.fatality_notice_casualties.length }), + } %> <% end %> <% end %> diff --git a/app/views/admin/organisation_translations/edit.html.erb b/app/views/admin/organisation_translations/edit.html.erb index 91f8cf325c1..62dff781bb2 100644 --- a/app/views/admin/organisation_translations/edit.html.erb +++ b/app/views/admin/organisation_translations/edit.html.erb @@ -60,7 +60,7 @@ }, } %> - <%= render "admin/shared/featured_link_fields", form: form %> + <%= render "admin/shared/featured_links_fields", form: form %>
<%= render "govuk_publishing_components/components/button", { diff --git a/app/views/admin/organisations/_form.html.erb b/app/views/admin/organisations/_form.html.erb index a6f545ff8dd..2170c9474ab 100644 --- a/app/views/admin/organisations/_form.html.erb +++ b/app/views/admin/organisations/_form.html.erb @@ -314,7 +314,7 @@ margin_bottom: 3, } %> - <%= render "admin/shared/featured_link_fields", form: form, remove_banner: true %> + <%= render "admin/shared/featured_links_fields", form: form, remove_banner: true %>
<% end %> diff --git a/app/views/admin/promotional_feature_items/_form_fields.html.erb b/app/views/admin/promotional_feature_items/_form_fields.html.erb index f77eaf9e5ad..eea83fdd773 100644 --- a/app/views/admin/promotional_feature_items/_form_fields.html.erb +++ b/app/views/admin/promotional_feature_items/_form_fields.html.erb @@ -69,33 +69,15 @@ legend_text: "Feature item links", heading_size: "l", } do %> -
- <%= form.fields_for :links do |link_form| %> -
-
- <%= render "govuk_publishing_components/components/input", { - label: { - text: "URL", - }, - name: "#{name}[[links_attributes][#{link_form.index}][url]", - id: "#{id}_links_attributes_#{link_form.index}_url", - value: link_form.object.url, - heading_size: "m", - error_items: errors_for(link_form.object.errors, :url), - } %> - - <%= render "govuk_publishing_components/components/input", { - label: { - text: "Text", - }, - name: "#{name}[[links_attributes][#{link_form.index}][text]", - id: "#{id}_links_attributes_#{link_form.index}_text", - value: link_form.object.text, - heading_size: "m", - error_items: errors_for(link_form.object.errors, :text), - } %> -
-
- <% end %> -
+ <%= render "govuk_publishing_components/components/add_another", { + fieldset_legend: "Link", + add_button_text: "Add link", + items: form.object.links.each_with_index.map do |link, index| + { + fields: render(partial: "link_fields", locals: { form:, link:, index:, name:, id: }), + destroy_checkbox: render("govuk_publishing_components/components/checkboxes", { name: "#{name}[links_attributes][#{index}][_destroy]", items: [{label: "Delete", value: "1" }]}) + } + end, + empty: render(partial: "link_fields", locals: { form:, link: PromotionalFeatureLink.new, index: form.object.links.length, name:, id: }), + } %> <% end %> diff --git a/app/views/admin/promotional_feature_items/_link_fields.html.erb b/app/views/admin/promotional_feature_items/_link_fields.html.erb new file mode 100644 index 00000000000..ff45e18008b --- /dev/null +++ b/app/views/admin/promotional_feature_items/_link_fields.html.erb @@ -0,0 +1,23 @@ +<%= form.fields_for :links, link do |link_form| %> + <%= render "govuk_publishing_components/components/input", { + label: { + text: "URL", + }, + name: "#{name}[links_attributes][#{index}][url]", + id: "#{id}_links_attributes_#{index}_url", + value: link_form.object.url, + heading_size: "s", + error_items: errors_for(link_form.object.errors, :url), + } %> + + <%= render "govuk_publishing_components/components/input", { + label: { + text: "Text", + }, + name: "#{name}[links_attributes][#{index}][text]", + id: "#{id}_links_attributes_#{index}_text", + value: link_form.object.text, + heading_size: "s", + error_items: errors_for(link_form.object.errors, :text), + } %> +<% end %> diff --git a/app/views/admin/shared/_featured_link_fields.html.erb b/app/views/admin/shared/_featured_link_fields.html.erb index 7fbcfde4c7f..eff7d0724cc 100644 --- a/app/views/admin/shared/_featured_link_fields.html.erb +++ b/app/views/admin/shared/_featured_link_fields.html.erb @@ -1,77 +1,53 @@ -<% - featured_links = form.object.featured_links - featured_links = [LocalisedModel.new(FeaturedLink.new, I18n.default_locale)] unless featured_links.any? - model = form.object.model_name.singular +<%= form.fields_for :featured_links, featured_link do |featured_link_form| %> + <% if @translation_locale && @translation_locale.code != I18n.default_locale %> + <%= render "components/translated_input", { + input: { + label: { + text: "Title", + }, + heading_size: "s", + value: featured_link_form.object.title, + name: "#{model}[featured_links_attributes][#{index}][title]", + id: "#{model}_featured_links[#{index}]_title", + }, + details: { + text: featured_link_form.object.title, + }, + } %> - if form.object.respond_to?(:visible_featured_links_count) - visible_links = form.object.visible_featured_links_count - else - visible_links = FeaturedLink::DEFAULT_SET_SIZE - end + <%= render "components/translated_input", { + input: { + label: { + text: "URL", + }, + heading_size: "s", + value: featured_link_form.object.url, + name: "#{model}[featured_links_attributes][#{index}][url]", + id: "#{model}_featured_links[#{index}]_url", + }, + details: { + text: featured_link_form.object.url, + }, + } %> + <% else %> + <%= render "govuk_publishing_components/components/input", { + label: { + text: "Title", + }, + heading_size: "s", + value: featured_link_form.object.title, + name: "#{model}[featured_links_attributes][#{index}][title]", + id: "#{model}_featured_links[#{index}]_title", + } %> - remove_banner ||= false -%> - -<% unless remove_banner %> - <%= render "govuk_publishing_components/components/inset_text", { - text: "Only the first #{visible_links} links will be shown on the public site.", - } %> -<% end %> - -
- <%= form.fields_for :featured_links do |featured_link_form| %> -
- <% if @translation_locale && @translation_locale.code != I18n.default_locale %> - <%= render "components/translated_input", { - input: { - label: { - text: "Title", - }, - heading_size: "m", - value: featured_link_form.object.title, - name: "#{model}[featured_links_attributes][#{featured_link_form.index}][title]", - id: "#{model}_featured_links[#{featured_link_form.index}]_title", - }, - details: { - text: featured_link_form.object.title, - }, - } %> - - <%= render "components/translated_input", { - input: { - label: { - text: "URL", - }, - heading_size: "m", - value: featured_link_form.object.url, - name: "#{model}[featured_links_attributes][#{featured_link_form.index}][url]", - id: "#{model}_featured_links[#{featured_link_form.index}]_url", - }, - details: { - text: featured_link_form.object.url, - }, - } %> - <% else %> - <%= render "govuk_publishing_components/components/input", { - label: { - text: "Title", - }, - heading_size: "m", - value: featured_link_form.object.title, - name: "#{model}[featured_links_attributes][#{featured_link_form.index}][title]", - id: "#{model}_featured_links[#{featured_link_form.index}]_title", - } %> - - <%= render "govuk_publishing_components/components/input", { - label: { - text: "URL", - }, - heading_size: "m", - value: featured_link_form.object.url, - name: "#{model}[featured_links_attributes][#{featured_link_form.index}][url]", - id: "#{model}_featured_links[#{featured_link_form.index}]_url", - } %> - <% end %> -
+ <%= render "govuk_publishing_components/components/input", { + label: { + text: "URL", + }, + heading_size: "s", + value: featured_link_form.object.url, + name: "#{model}[featured_links_attributes][#{index}][url]", + id: "#{model}_featured_links[#{index}]_url", + } %> <% end %> -
+<% end %> diff --git a/app/views/admin/shared/_featured_links_fields.html.erb b/app/views/admin/shared/_featured_links_fields.html.erb new file mode 100644 index 00000000000..36502a95858 --- /dev/null +++ b/app/views/admin/shared/_featured_links_fields.html.erb @@ -0,0 +1,31 @@ +<% + featured_links = form.object.featured_links + new_featured_link = LocalisedModel.new(FeaturedLink.new, I18n.default_locale) + model = form.object.model_name.singular + + if form.object.respond_to?(:visible_featured_links_count) + visible_links = form.object.visible_featured_links_count + else + visible_links = FeaturedLink::DEFAULT_SET_SIZE + end + + remove_banner ||= false +%> + +<% unless remove_banner %> + <%= render "govuk_publishing_components/components/inset_text", { + text: "Only the first #{visible_links} links will be shown on the public site.", + } %> +<% end %> + +<%= render "govuk_publishing_components/components/add_another", { + fieldset_legend: "Featured link", + add_button_text: "Add another featured link", + items: featured_links.each_with_index.map do |featured_link, index| + { + fields: render(partial: "admin/shared/featured_link_fields", locals: { form:, featured_link:, index:, model: }), + destroy_checkbox: render("govuk_publishing_components/components/checkboxes", { name: "#{model}[featured_links_attributes][#{index}[_destroy]", items: [{label: "Delete", value: "1" }]}) + } + end, + empty: render(partial: "admin/shared/featured_link_fields", locals: { form:, featured_link: new_featured_link, index: featured_links.length, model: }), +} %> diff --git a/app/views/admin/topical_events/_form.html.erb b/app/views/admin/topical_events/_form.html.erb index 93d0debd87d..38ada250e8d 100644 --- a/app/views/admin/topical_events/_form.html.erb +++ b/app/views/admin/topical_events/_form.html.erb @@ -137,41 +137,17 @@ legend_text: "Social media accounts", heading_size: "l", } do %> -
- <%= form.fields_for :social_media_accounts do |social_media_form| %> -
-
-
- <%= render "govuk_publishing_components/components/select", { - id: "topical_event_social_media_accounts_attributes_#{social_media_form.index}_social_media_service_id", - label: "Service (required)", - name: "topical_event[social_media_accounts_attributes][#{social_media_form.index}][social_media_service_id]", - heading_size: "m", - options: [{ text: "", value: "" }] + - SocialMediaService.all.map do |social_media| - { - text: social_media.name, - value: social_media.id, - selected: social_media_form.object.social_media_service_id == social_media.id, - } - end, - full_width: true, - } %> -
- <%= render "govuk_publishing_components/components/input", { - label: { - text: "URL (required)", - }, - name: "topical_event[social_media_accounts_attributes][#{social_media_form.index}][url]", - id: "topical_event_social_media_accounts_attributes_#{social_media_form.index}_url", - value: social_media_form.object.url, - heading_size: "m", - error_items: errors_for(social_media_form.object.errors, :url), - } %> -
-
- <% end %> -
+ <%= render "govuk_publishing_components/components/add_another", { + fieldset_legend: "Account", + add_button_text: "Add account", + items: form.object.social_media_accounts.each_with_index.map do |social_media_account, index| + { + fields: render(partial: "social_media_account_fields", locals: { form:, social_media_account:, index: }), + destroy_checkbox: render("govuk_publishing_components/components/checkboxes", { name: "topical_event[social_media_accounts_attributes][#{index}][_destroy]", items: [{label: "Delete", value: "1" }]}) + } + end, + empty: render(partial: "social_media_account_fields", locals: { form:, social_media_account: SocialMediaAccount.new, index: form.object.social_media_accounts.length }), + } %> <% end %>
diff --git a/app/views/admin/topical_events/_social_media_account_fields.html.erb b/app/views/admin/topical_events/_social_media_account_fields.html.erb new file mode 100644 index 00000000000..ec285fcb628 --- /dev/null +++ b/app/views/admin/topical_events/_social_media_account_fields.html.erb @@ -0,0 +1,27 @@ +<%= form.fields_for :social_media_accounts, social_media_account do |social_media_form| %> + <%= render "govuk_publishing_components/components/select", { + id: "topical_event_social_media_accounts_attributes_#{index}_social_media_service_id", + label: "Service (required)", + name: "topical_event[social_media_accounts_attributes][#{index}][social_media_service_id]", + heading_size: "s", + options: [{ text: "", value: "" }] + + SocialMediaService.all.map do |social_media| + { + text: social_media.name, + value: social_media.id, + selected: social_media_form.object.social_media_service_id == social_media.id, + } + end, + full_width: true, + } %> + <%= render "govuk_publishing_components/components/input", { + label: { + text: "URL (required)", + }, + name: "topical_event[social_media_accounts_attributes][#{index}][url]", + id: "topical_event_social_media_accounts_attributes_#{index}_url", + value: social_media_form.object.url, + heading_size: "s", + error_items: errors_for(social_media_form.object.errors, :url), + } %> +<% end %> diff --git a/app/views/admin/world_location_news/edit.html.erb b/app/views/admin/world_location_news/edit.html.erb index bf221309b44..62fa6b5f592 100644 --- a/app/views/admin/world_location_news/edit.html.erb +++ b/app/views/admin/world_location_news/edit.html.erb @@ -71,7 +71,7 @@ font_size: "l", } %> - <%= render "admin/shared/featured_link_fields", form: form %> + <%= render "admin/shared/featured_links_fields", form: form %>
<%= render "govuk_publishing_components/components/button", { diff --git a/spec/javascripts/admin/modules/add-another.spec.js b/spec/javascripts/admin/modules/add-another.spec.js deleted file mode 100644 index 63e8356a409..00000000000 --- a/spec/javascripts/admin/modules/add-another.spec.js +++ /dev/null @@ -1,159 +0,0 @@ -describe('GOVUK.Modules.AddAnother', function () { - let fixture, addAnother, addButton, removeButton, fields, field0, field1 - - beforeEach(function () { - fixture = document.createElement('div') - fixture.setAttribute('data-module', 'AddAnother') - fixture.setAttribute('data-add-text', 'Add another thing') - fixture.innerHTML = ` -
- - - - - -
- ` - - document.body.append(fixture) - - addAnother = new GOVUK.Modules.AddAnother(fixture) - addAnother.init() - - addButton = document.querySelector('.add-another__add-button') - }) - - afterEach(function () { - fixture.innerHTML = '' - }) - - it('should add an "Add" button to the container when the component is initialised', function () { - expect(addButton).toBeTruthy() - expect(addButton.textContent).toBe('Add another thing') - }) - - it('should add new fields with the correct values when the "Add" button is clicked', function () { - window.GOVUK.triggerEvent(addButton, 'click') - - field0 = document.querySelectorAll('.js-duplicate-fields-set')[0] - field1 = document.querySelectorAll('.js-duplicate-fields-set')[1] - - expect(document.querySelectorAll('.js-duplicate-fields-set').length).toBe(2) - expect(field0.querySelector('input[type="hidden"]').value).toBe('abc') - expect(field1.querySelector('input[type="hidden"]').value).toBe('') - expect(field0.querySelector('input[type="text"]').value).toBe('def') - expect(field1.querySelector('input[type="text"]').value).toBe('') - expect(field0.querySelector('textarea').value).toBe('ghi') - expect(field1.querySelector('textarea').value).toBe('') - }) - - it('should move focus to the first relevant field in the new set when the "Add" button is clicked', function () { - window.GOVUK.triggerEvent(addButton, 'click') - - expect(document.activeElement).toBe( - document.querySelector('input[name="d[e][1][f]"]') - ) - }) - - it('should increment the id/name/for values of the added fields', function () { - window.GOVUK.triggerEvent(addButton, 'click') - - field0 = document.querySelectorAll('.js-duplicate-fields-set')[0] - field1 = document.querySelectorAll('.js-duplicate-fields-set')[1] - - expect( - field0.querySelector('input[type="hidden"]').getAttribute('name') - ).toBe('a[b][0][c]') - expect( - field1.querySelector('input[type="hidden"]').getAttribute('name') - ).toBe('a[b][1][c]') - expect(field0.querySelectorAll('label')[0].getAttribute('for')).toBe( - 'd_e_0_f' - ) - expect(field1.querySelectorAll('label')[0].getAttribute('for')).toBe( - 'd_e_1_f' - ) - expect(field0.querySelector('input[type="text"]').getAttribute('id')).toBe( - 'd_e_0_f' - ) - expect(field1.querySelector('input[type="text"]').getAttribute('id')).toBe( - 'd_e_1_f' - ) - expect( - field0.querySelector('input[type="text"]').getAttribute('name') - ).toBe('d[e][0][f]') - expect( - field1.querySelector('input[type="text"]').getAttribute('name') - ).toBe('d[e][1][f]') - expect(field0.querySelectorAll('label')[1].getAttribute('for')).toBe( - 'g_h_0_i' - ) - expect(field1.querySelectorAll('label')[1].getAttribute('for')).toBe( - 'g_h_1_i' - ) - expect(field0.querySelector('textarea').getAttribute('id')).toBe('g_h_0_i') - expect(field1.querySelector('textarea').getAttribute('id')).toBe('g_h_1_i') - expect(field0.querySelector('textarea').getAttribute('name')).toBe( - 'g[h][0][i]' - ) - expect(field1.querySelector('textarea').getAttribute('name')).toBe( - 'g[h][1][i]' - ) - }) - - it('should add a "Remove" button to each set of fields when new fields are created', function () { - window.GOVUK.triggerEvent(addButton, 'click') - - field0 = document.querySelectorAll('.js-duplicate-fields-set')[0] - field1 = document.querySelectorAll('.js-duplicate-fields-set')[1] - - expect(field0.querySelector('.add-another__remove-button')).toBeTruthy() - expect(field1.querySelector('.add-another__remove-button')).toBeTruthy() - }) - - it('should add a hidden input field with the appropriate attributes for each removed set when the "Remove" button is clicked', function () { - window.GOVUK.triggerEvent(addButton, 'click') - window.GOVUK.triggerEvent(addButton, 'click') - - removeButton = document.querySelectorAll('.add-another__remove-button')[0] - - window.GOVUK.triggerEvent(removeButton, 'click') - - const hiddenField = document.querySelector('.js-hidden-destroy') || null - - expect(hiddenField).toBeTruthy() - expect(hiddenField.id).toBe('d_e_0__destroy') - expect(hiddenField.name).toBe('d[e][0][_destroy]') - expect(hiddenField.value).toBe('true') - }) - - it('should remove the appropriate field when the "Remove" button is clicked', function () { - window.GOVUK.triggerEvent(addButton, 'click') - - fields = document.querySelectorAll('.js-duplicate-fields-set') - removeButton = fields[0].querySelector('.add-another__remove-button') - - window.GOVUK.triggerEvent(removeButton, 'click') - - field0 = document.querySelectorAll('.js-duplicate-fields-set')[0] - field1 = document.querySelectorAll('.js-duplicate-fields-set')[1] - - expect(document.querySelectorAll('.js-duplicate-fields-set').length).toBe(1) - expect(field0).toBeTruthy() - expect(field1).toBeFalsy() - }) - - // This test is not working since removing the resetting of values on remove - // Consider if it's actually required - it('should move focus to the first field when any "Remove" button is clicked', function () { - window.GOVUK.triggerEvent(addButton, 'click') - window.GOVUK.triggerEvent(addButton, 'click') - removeButton = document.querySelectorAll('.add-another__remove-button')[0] - - window.GOVUK.triggerEvent(removeButton, 'click') - - expect(document.activeElement).toBe( - document.querySelector('input[name="d[e][1][f]"]') - ) - }) -})