diff --git a/app/assets/stylesheets/sdg/goals/targets.scss b/app/assets/stylesheets/sdg/goals/targets.scss new file mode 100644 index 000000000..f4b061462 --- /dev/null +++ b/app/assets/stylesheets/sdg/goals/targets.scss @@ -0,0 +1,18 @@ +.sdg-goal-show .targets { + dt, + dd { + display: inline; + } + + dd { + + &::after { + content: ""; + display: block; + } + + &:not(:last-child)::after { + margin-bottom: $line-height / 2; + } + } +} diff --git a/app/components/sdg/goals/show_component.html.erb b/app/components/sdg/goals/show_component.html.erb index f1511ef83..fcc731887 100644 --- a/app/components/sdg/goals/show_component.html.erb +++ b/app/components/sdg/goals/show_component.html.erb @@ -34,4 +34,6 @@ <%= render ::Widget::Feeds::FeedComponent.new(processes_feed) %> <% end %> + + <%= render SDG::Goals::TargetsComponent.new(goal) %> diff --git a/app/components/sdg/goals/targets_component.html.erb b/app/components/sdg/goals/targets_component.html.erb new file mode 100644 index 000000000..d6030e8c6 --- /dev/null +++ b/app/components/sdg/goals/targets_component.html.erb @@ -0,0 +1,28 @@ +
+ + +
+ <% [global_targets, local_targets].each do |targets| %> +
+ <% if targets.blank? %> +
+ <%= t("sdg.goals.show.targets.no_local_targets") %> +
+ <% else %> +
+ <% targets.sort.each do |target| %> +
<%= target.code %>
+
<%= target.title %>
+ <% end %> +
+ <% end %> +
+ <% end %> +
+
diff --git a/app/components/sdg/goals/targets_component.rb b/app/components/sdg/goals/targets_component.rb new file mode 100644 index 000000000..c17ea97db --- /dev/null +++ b/app/components/sdg/goals/targets_component.rb @@ -0,0 +1,37 @@ +class SDG::Goals::TargetsComponent < ApplicationComponent + attr_reader :goal + + def initialize(goal) + @goal = goal + end + + def render? + feature?("sdg") + end + + private + + def global_targets + goal.targets + end + + def local_targets + goal.local_targets + end + + def type(targets) + if targets.model.name == "SDG::Target" + "global" + else + "local" + end + end + + def active(targets) + "is-active" if targets.model.name == "SDG::Target" + end + + def title(targets) + targets.model.model_name.human(count: :other).upcase_first + end +end diff --git a/config/locales/en/sdg.yml b/config/locales/en/sdg.yml index ba5861cb0..9ce18e282 100644 --- a/config/locales/en/sdg.yml +++ b/config/locales/en/sdg.yml @@ -444,6 +444,8 @@ en: show: read_more: "Read more about %{goal}" read_less: "Read less about %{goal}" + targets: + no_local_targets: This goal has no local targets title: "Sustainable Development Goals" filter: heading: "Filters by SDG" diff --git a/config/locales/es/sdg.yml b/config/locales/es/sdg.yml index 2dcf27e08..7c864ce93 100644 --- a/config/locales/es/sdg.yml +++ b/config/locales/es/sdg.yml @@ -444,6 +444,8 @@ es: show: read_more: "Leer más sobre %{goal}" read_less: "Leer menos sobre %{goal}" + targets: + no_local_targets: Este objetivo no tiene metas localizadas title: "Objetivos de Desarrollo Sostenible" filter: heading: "Filtros por ODS" diff --git a/spec/components/sdg/goals/targets_component_spec.rb b/spec/components/sdg/goals/targets_component_spec.rb new file mode 100644 index 000000000..b172c0acb --- /dev/null +++ b/spec/components/sdg/goals/targets_component_spec.rb @@ -0,0 +1,39 @@ +require "rails_helper" + +describe SDG::Goals::TargetsComponent, type: :component do + let(:goal) { SDG::Goal[1] } + let(:component) { SDG::Goals::TargetsComponent.new(goal) } + + before do + Setting["feature.sdg"] = 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 ".targets" + expect(page).not_to have_css "#target_tabs" + expect(page).not_to have_css ".tabs-content" + end + + it "renders tabs panel" do + render_inline component + + expect(page).to have_css ".targets" + expect(page).to have_css "#target_tabs" + expect(page).to have_css "li", count: 2 + expect(page).to have_content "Targets" + expect(page).to have_content "Local targets" + expect(page).to have_css ".tabs-content" + expect(page).to have_css "#tab_global_targets" + end + + it "renders code and title for each target" do + render_inline component + + expect(page).to have_content "1.1" + expect(page).to have_content "By 2030, eradicate extreme poverty for all people everywhere" + end +end diff --git a/spec/system/sdg/goals_spec.rb b/spec/system/sdg/goals_spec.rb index efbe28ab9..edf0f7e6b 100644 --- a/spec/system/sdg/goals_spec.rb +++ b/spec/system/sdg/goals_spec.rb @@ -117,5 +117,27 @@ describe "SDG Goals", :js do expect(page).to have_css("div.read-more a", text: "Read more about Life on Land", visible: :hidden) expect(page).to have_css("div.read-more a", text: "Read less about Life on Land") end + + scenario "has tab target section" do + create(:sdg_local_target, code: "15.1.1", title: "SDG local target sample text") + visit sdg_goal_path(15) + + within "#target_tabs" do + expect(page).to have_content "Targets" + expect(page).to have_content "Local targets" + end + + within ".tabs-content" do + expect(page).to have_content "15.1 By 2020, ensure the conservation, restoration and sustainable" + expect(page).not_to have_content "15.1.1 SDG local target sample text" + end + + click_link "Local targets" + + within ".tabs-content" do + expect(page).to have_content "15.1.1 SDG local target sample text" + expect(page).not_to have_content "15.1 By 2020, ensure the conservation, restoration and sustainable" + end + end end end