diff --git a/app/assets/stylesheets/participation.scss b/app/assets/stylesheets/participation.scss index 5290d20c8..dbcea6600 100644 --- a/app/assets/stylesheets/participation.scss +++ b/app/assets/stylesheets/participation.scss @@ -488,6 +488,10 @@ .tags { @extend %tags; + } + + .tags, + .sdg-target-tag-list { a { margin-right: rem-calc(6); @@ -673,7 +677,10 @@ .tags { @extend %tags; + } + .tags, + .sdg-target-tag-list { a { font-size: $tiny-font-size; } diff --git a/app/assets/stylesheets/sdg/tag_list.scss b/app/assets/stylesheets/sdg/tag_list.scss index b6f8c45ef..f242300df 100644 --- a/app/assets/stylesheets/sdg/tag_list.scss +++ b/app/assets/stylesheets/sdg/tag_list.scss @@ -7,4 +7,22 @@ @extend %tag; } } + + .sdg-target-tag-list { + @extend %tags; + + a:not(.more-targets) { + color: $white; + } + + @each $code, $color in $sdg-colors { + [data-code^="#{$code}"] { + background-color: $color; + + &:hover { + background-color: darken($color, 10%); + } + } + } + } } diff --git a/app/components/sdg/tag_list_component.html.erb b/app/components/sdg/tag_list_component.html.erb index 2cc4a4d06..54f477b4c 100644 --- a/app/components/sdg/tag_list_component.html.erb +++ b/app/components/sdg/tag_list_component.html.erb @@ -1,3 +1,4 @@
<%= render SDG::Goals::TagListComponent.new(record, limit: limit) %> + <%= render SDG::Targets::TagListComponent.new(record, limit: limit) %>
diff --git a/app/components/sdg/targets/tag_list_component.html.erb b/app/components/sdg/targets/tag_list_component.html.erb new file mode 100644 index 000000000..1c97ade36 --- /dev/null +++ b/app/components/sdg/targets/tag_list_component.html.erb @@ -0,0 +1 @@ +<%= link_list(*links, class: "sdg-target-tag-list") %> diff --git a/app/components/sdg/targets/tag_list_component.rb b/app/components/sdg/targets/tag_list_component.rb new file mode 100644 index 000000000..cb79f80b6 --- /dev/null +++ b/app/components/sdg/targets/tag_list_component.rb @@ -0,0 +1,36 @@ +class SDG::Targets::TagListComponent < ApplicationComponent + include SDG::TagList + + private + + def record + record_or_name + end + + def links + [*target_links, see_more_link(targets)] + end + + def target_links + targets.sort[0..(limit.to_i - 1)].map do |target| + [ + "#{SDG::Target.model_name.human} #{target.code}", + index_by_target(target), + title: filter_text(target), + data: { code: target.code } + ] + end + end + + def targets + record.sdg_targets + end + + def index_by_target(target) + index_by(target: target.code) + end + + def i18n_namespace + "targets" + end +end diff --git a/config/i18n-tasks.yml b/config/i18n-tasks.yml index 95818bc30..37a8abda1 100644 --- a/config/i18n-tasks.yml +++ b/config/i18n-tasks.yml @@ -219,6 +219,7 @@ ignore_unused: - "seeds.settings.*" - "dashboard.polls.*.submit" - "sdg.goals.goal_*" + - "sdg.*.filter.more.*" - "sdg_management.relations.index.filter*" #### ## Exclude these keys from the `i18n-tasks eq-base" report: diff --git a/config/locales/en/sdg.yml b/config/locales/en/sdg.yml index 3984e8896..0303521cc 100644 --- a/config/locales/en/sdg.yml +++ b/config/locales/en/sdg.yml @@ -439,3 +439,9 @@ en: hint: "You can introduce the code of a specific goal/target or a text to find one" placeholder: "Write a goal or target code or description" remove_tag: "Remove" + targets: + filter: + link: "See all %{resources} related to target %{code}" + more: + one: "One more target" + other: "%{count} more targets" diff --git a/config/locales/es/sdg.yml b/config/locales/es/sdg.yml index bc416222a..59d7060d0 100644 --- a/config/locales/es/sdg.yml +++ b/config/locales/es/sdg.yml @@ -439,3 +439,9 @@ es: hint: "Puedes introducir el código de un objetivo/meta específico o un texto para encontrar uno" placeholder: "Escribe las etiquetas que desees" remove_tag: "Eliminar" + targets: + filter: + link: "Ver %{resources} de la meta %{code}" + more: + one: "Una meta más" + other: "%{count} metas más" diff --git a/spec/components/sdg/targets/tag_list_component_spec.rb b/spec/components/sdg/targets/tag_list_component_spec.rb new file mode 100644 index 000000000..18f65cd03 --- /dev/null +++ b/spec/components/sdg/targets/tag_list_component_spec.rb @@ -0,0 +1,70 @@ +require "rails_helper" + +describe SDG::Targets::TagListComponent, type: :component do + let(:debate) do + create(:debate, + sdg_targets: [SDG::Target[1.1], SDG::Target[3.2], create(:sdg_local_target, code: "3.2.1")] + ) + end + let(:component) { SDG::Targets::TagListComponent.new(debate) } + + before do + Setting["feature.sdg"] = true + Setting["sdg.process.debates"] = true + end + + it "does not render when the feature is disabled" do + Setting["feature.sdg"] = false + + render_inline component + + expect(page).not_to have_css "li" + end + + it "does not render when the SDG process feature is disabled" do + Setting["sdg.process.debates"] = false + + render_inline component + + expect(page).not_to have_css "li" + end + + it "renders a list of targets" do + render_inline component + + expect(page).to have_css "li", count: 3 + end + + it "renders links for each target" do + render_inline component + + expect(page).to have_css "li", count: 3 + expect(page).to have_link "target 1.1", + title: "See all Debates related to target 1.1", + href: "/debates?advanced_search#{CGI.escape("[target]")}=1.1" + expect(page).to have_link "target 3.2", + title: "See all Debates related to target 3.2", + href: "/debates?advanced_search#{CGI.escape("[target]")}=3.2" + expect(page).to have_link "target 3.2.1", + title: "See all Debates related to target 3.2.1", + href: "/debates?advanced_search#{CGI.escape("[target]")}=3.2.1" + end + + it "orders targets by code" do + render_inline component + + expect(page.first("a")[:title]).to end_with "target 1.1" + end + + it "renders a link for more targets when out of limit" do + component = SDG::Targets::TagListComponent.new(debate, limit: 1) + + render_inline component + + expect(page).to have_selector "a", count: 2 + expect(page).to have_link "target 1.1" + expect(page).to have_link "2+", + title: "2 more targets", + href: "/debates/#{debate.to_param}" + end +end