From c19d6abf65e715b323553c6639cf30d620510c34 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Andr=C3=A9s=20Pereira=20de=20Lucena?= Date: Mon, 18 Dec 2023 08:51:23 +0100 Subject: [PATCH] Change the strings and colors in the proposals answers states (#121) * Change the strings in the proposals answers states For the Metadecidim feature proposals process, we need to change some of the words that use in the answers: - "Accepted" becomes "Finished" - "Evaluating" becomes "Accepted / In progress" * Change the colors in the proposals answers states - The "warning" label changes to green - The "success" label changes to purple * Add spec * Override the CSS classes in ProposalsHelper and ProposalMetadataCell * Fix colors and use variables in CSS * Add translations for proposals answers announcements * Fix specs * Tune a bit the background of the progressing flash * Lock ChromeDriver to 119.0.6045.105 --- .github/workflows/decidim_ci.yml | 3 + .../decidim/decidim_application.scss | 27 ++++ .../metadecidim_proposals_states.rb | 50 +++++++ config/locales/proposals.ca.yml | 50 +++++++ config/locales/proposals.en.yml | 50 +++++++ config/locales/proposals.es.yml | 50 +++++++ spec/features/proposals_answers_spec.rb | 122 ++++++++++++++++++ 7 files changed, 352 insertions(+) create mode 100644 app/packs/stylesheets/decidim/decidim_application.scss create mode 100644 config/initializers/metadecidim_proposals_states.rb create mode 100644 config/locales/proposals.ca.yml create mode 100644 config/locales/proposals.en.yml create mode 100644 config/locales/proposals.es.yml create mode 100644 spec/features/proposals_answers_spec.rb diff --git a/.github/workflows/decidim_ci.yml b/.github/workflows/decidim_ci.yml index 3575b9a..147455f 100644 --- a/.github/workflows/decidim_ci.yml +++ b/.github/workflows/decidim_ci.yml @@ -35,6 +35,9 @@ jobs: with: ruby-version: ${{ env.RUBY_VERSION }} bundler-cache: true + - uses: nanasess/setup-chromedriver@v2 + with: + chromedriver-version: 119.0.6045.105 - uses: actions/setup-node@v2 with: node-version: ${{ env.NODE_VERSION }} diff --git a/app/packs/stylesheets/decidim/decidim_application.scss b/app/packs/stylesheets/decidim/decidim_application.scss new file mode 100644 index 0000000..47e5116 --- /dev/null +++ b/app/packs/stylesheets/decidim/decidim_application.scss @@ -0,0 +1,27 @@ +:root { + --finished: #6639ba; + --bg-finished: #f6f5fc; + --progressing: #165922; + --bg-progressing: #c4ecd0; + --bg-progressing-2: #f6fdf9; +} + +span.label.finished { + background-color: var(--bg-finished); + color: var(--finished); +} + +span.label.progressing { + background-color: var(--bg-progressing); + color: var(--progressing); +} + +div.flash.finished { + background-color: var(--bg-finished); + border-color: var(--finished); +} + +div.flash.progressing { + background-color: var(--bg-progressing-2); + border-color: var(--progressing); +} diff --git a/config/initializers/metadecidim_proposals_states.rb b/config/initializers/metadecidim_proposals_states.rb new file mode 100644 index 0000000..4113a00 --- /dev/null +++ b/config/initializers/metadecidim_proposals_states.rb @@ -0,0 +1,50 @@ +# frozen_string_literal: true + +# Monkey patch to have a custom announcement color in proposals answers +Rails.application.config.to_prepare do + Decidim::Proposals::ProposalsHelper.module_eval do + def proposal_reason_callout_class + case @proposal.state + when "accepted" + "finished" + when "evaluating" + "progressing" + when "rejected" + "alert" + else + "" + end + end + + def proposal_reason_callout_title + i18n_key = case @proposal.state + when "evaluating" + "proposal_in_evaluation_reason" + else + "proposal_#{@proposal.state}_reason" + end + + t(i18n_key, scope: "decidim.proposals.proposals.show") + end + end +end + +# Monkey patch to have a custom label color in proposals metadata (i.e. in index lists) +Rails.application.config.to_prepare do + Decidim::Proposals::ProposalMetadataCell.class_eval do + private + + def state_class + case state + when "accepted" + "finished" + when "rejected", "withdrawn" + "alert" + when "evaluating" + "progressing" + else + "muted" + end + end + end +end diff --git a/config/locales/proposals.ca.yml b/config/locales/proposals.ca.yml new file mode 100644 index 0000000..baf76f4 --- /dev/null +++ b/config/locales/proposals.ca.yml @@ -0,0 +1,50 @@ +ca: + decidim: + admin: + filters: + proposals: + state_eq: + values: + accepted: Finalitzada + evaluating: Acceptada / En curs + events: + proposals: + proposal_accepted: + affected_user: + email_intro: 'El desenvolupament de la teva proposta "%{resource_title}" s''ha completat. Pots llegir la resposta en aquesta pàgina:' + email_outro: Has rebut aquesta notificació perquè ets autora de "%{resource_title}". + email_subject: S'ha completat el desenvolupament de la teva proposta + notification_title: El desenvolupament de la teva proposta %{resource_title} s'ha completat. + follower: + email_intro: 'El desenvolupament de la proposta "%{resource_title}" s''ha completat. Pots llegir la resposta des d''aquesta pàgina:' + email_outro: Has rebut aquesta notificació perquè que segueixes "%{resource_title}". El pots deixar de seguir al link anterior. + email_subject: S'ha completat el desenvolupament d'una proposta que segueixes + notification_title: El desenvolupament de la proposta %{resource_title} s'ha completat. + proposal_evaluating: + affected_user: + email_intro: 'La teva proposta "%{resource_title}" s''ha acceptat. Pots consultar la resposta en aquesta pàgina:' + email_outro: Has rebut aquesta notificació perquè ets autora de "%{resource_title}". + email_subject: La teva proposta s'ha acceptat + notification_title: La teva proposta %{resource_title} s'ha acceptat. + follower: + email_intro: 'La proposta "%{resource_title}" s''ha acceptat. Pots consultar una resposta en aquesta pàgina:' + email_outro: Has rebut aquesta notificació perquè que segueixes "%{resource_title}". El pots deixar de seguir al link anterior. + email_subject: S'ha acceptat una proposta que segueixes + notification_title: La proposta %{resource_title} s'ha acceptat. + proposals: + admin: + proposal_answers: + form: + accepted: Finalitzada + evaluating: Acceptada / En curs + answers: + accepted: Finalitzada + evaluating: Acceptada / En curs + application_helper: + filter_state_values: + accepted: Finalitzada + evaluating: Acceptada / En curs + proposals: + show: + proposal_accepted_reason: Aquesta proposta ha sigut implementada + proposal_in_evaluation_reason: Aquesta proposta ha sigut acceptada diff --git a/config/locales/proposals.en.yml b/config/locales/proposals.en.yml new file mode 100644 index 0000000..e32f7e8 --- /dev/null +++ b/config/locales/proposals.en.yml @@ -0,0 +1,50 @@ +en: + decidim: + admin: + filters: + proposals: + state_eq: + values: + accepted: Finished + evaluating: Accepted / In progress + events: + proposals: + proposal_accepted: + affected_user: + email_intro: 'The development of your proposal "%{resource_title}" is complete. You can read the answer in this page:' + email_outro: You have received this notification because you are an author of "%{resource_title}". + email_subject: The development of your proposal is complete + notification_title: The development of your proposal %{resource_title} is complete. + follower: + email_intro: 'The development of the proposal "%{resource_title}" is complete. You can read the answer in this page:' + email_outro: You have received this notification because you are following "%{resource_title}". You can unfollow it from the previous link. + email_subject: The development of a proposal you are following is complete + notification_title: The development of the proposal %{resource_title} is complete. + proposal_evaluating: + affected_user: + email_intro: 'Your proposal "%{resource_title}" has been accepted. You can check for an answer in this page:' + email_outro: You have received this notification because you are an author of "%{resource_title}". + email_subject: Your proposal has been accepted + notification_title: Your proposal %{resource_title} has been accepted and is in progress. + follower: + email_intro: 'The proposal "%{resource_title}" has been accepted. You can check for an answer in this page:' + email_outro: You have received this notification because you are following "%{resource_title}". You can unfollow it from the previous link. + email_subject: A proposal you are following has been accepted + notification_title: The proposal %{resource_title} has been accepted. + proposals: + admin: + proposal_answers: + form: + accepted: Finished + evaluating: Accepted / In progress + answers: + accepted: Finished + evaluating: Accepted / In progress + application_helper: + filter_state_values: + accepted: Finished + evaluating: Accepted / In progress + proposals: + show: + proposal_accepted_reason: This proposal has been implemented + proposal_in_evaluation_reason: This proposal has been accepted diff --git a/config/locales/proposals.es.yml b/config/locales/proposals.es.yml new file mode 100644 index 0000000..197661c --- /dev/null +++ b/config/locales/proposals.es.yml @@ -0,0 +1,50 @@ +es: + decidim: + admin: + filters: + proposals: + state_eq: + values: + accepted: Finalizada + evaluating: Aceptada / En curso + events: + proposals: + proposal_accepted: + affected_user: + email_intro: 'El desarrollo de tu propuesta "%{resource_title}" se ha completado. Puedes leer la respuesta en esta página:' + email_outro: Has recibido esta notificación porque eres autora de "%{resource_title}". + email_subject: Se ha completado el desarrollo de tu propuesta + notification_title: El desarrollo de tu propuesta %{resource_title} se ha completado. + follower: + email_intro: 'El desarrollo de la propuesta "%{resource_title}" se ha completado. Puedes leer la respuesta en esta página:' + email_outro: Has recibido esta notificación porque sigues "%{resource_title}". Puedes dejar de seguirlo en el enlace anterior. + email_subject: Se ha completado el desarrollo de una propuesta que estás siguiendo + notification_title: El desarrollo de la propuesta %{resource_title} se ha completado. + proposal_evaluating: + affected_user: + email_intro: 'Tu propuesta "%{resource_title}" se ha aceptado. Puedes consultar la respuesta en esta página:' + email_outro: Has recibido esta notificación porque eres autora de "%{resource_title}". + email_subject: Tu propuesta se ha aceptado + notification_title: Tu propuesta %{resource_title} se ha aceptado. + follower: + email_intro: 'La propuesta "%{resource_title}" se ha aceptado. Puedes encontrar la respuesta en esta página:' + email_outro: Has recibido esta notificación porque sigues "%{resource_title}". Puedes dejar de seguirlo en el enlace anterior. + email_subject: Se ha aceptado una propuesta que estás siguiendo + notification_title: La propuesta %{resource_title} se ha aceptado. + proposals: + admin: + proposal_answers: + form: + accepted: Finalizada + evaluating: Aceptada / En curso + answers: + accepted: Finalizada + evaluating: Aceptada / En curso + application_helper: + filter_state_values: + accepted: Finalizada + evaluating: Aceptada / En curso + proposals: + show: + proposal_accepted_reason: Esta propuesta ha sido implementada + proposal_in_evaluation_reason: Esta propuesta ha sido aceptada diff --git a/spec/features/proposals_answers_spec.rb b/spec/features/proposals_answers_spec.rb new file mode 100644 index 0000000..73cf0ff --- /dev/null +++ b/spec/features/proposals_answers_spec.rb @@ -0,0 +1,122 @@ +# frozen_string_literal: true + +require "rails_helper" +require "decidim/proposals/test/factories" + +describe "Views the proposals answers overrides", type: :system do + let!(:finished_proposal) { create :proposal, :accepted, component:, title: { en: "This proposal has finished" } } + let!(:progressing_proposal) { create :proposal, :evaluating, component:, title: { en: "This proposal is in progress" } } + + include_context "with a component" + let(:manifest_name) { "proposals" } + + describe "index" do + before do + visit_component + end + + it "views the overrided colors" do + within "main" do + # Capybara understands rgba instead of hexadecimal colors + expect(page.find("span.label.finished")).to match_style("background-color" => "rgba(246, 245, 252, 1)") + expect(page.find("span.label.finished")).to match_style("color" => "rgba(102, 57, 186, 1)") + expect(page.find("span.label.progressing")).to match_style("background-color" => "rgba(196, 236, 208, 1)") + expect(page.find("span.label.progressing")).to match_style("color" => "rgba(22, 89, 34, 1)") + end + end + + context "with the english locale" do + it "views the overrided strings" do + within "main" do + expect(page).to have_content("Finished") + expect(page).to have_content("Accepted / In progress") + end + end + end + + context "with another locale" do + before do + within_language_menu do + click_link "Català" + end + end + + it "views the overrided strings" do + within "main" do + expect(page).to have_content("Finalitzada") + expect(page).to have_content("Acceptada / En curs") + end + end + end + end + + describe "show" do + before do + visit Decidim::EngineRouter.main_proxy(component).proposal_path(proposal) + end + + context "with the finished proposal" do + let(:proposal) { finished_proposal } + + it "views the overrided colors" do + within "main" do + # Capybara understands rgba instead of hexadecimal colors + expect(page.find("div.flash.finished")).to match_style("background-color" => "rgba(246, 245, 252, 1)") + expect(page.find("div.flash.finished")).to match_style("border-color" => "rgb(102, 57, 186)") + end + end + + it "views the overrided strings" do + within "main div.flash.finished" do + expect(page).to have_content("This proposal has been implemented") + end + end + + context "with another locale" do + before do + within_language_menu do + click_link "Castellano" + end + end + + it "views the overrided strings" do + within "main div.flash.finished" do + expect(page).to have_content("Esta propuesta ha sido implementada") + end + end + end + end + + context "with the progressing proposal" do + let(:proposal) { progressing_proposal } + + it "views the overrided colors" do + within "main" do + # Capybara understands rgba instead of hexadecimal colors + expect(page.find("div.flash.progressing")).to match_style("background-color" => "rgba(246, 253, 249, 1)") + expect(page.find("div.flash.progressing")).to match_style("border-color" => "rgb(22, 89, 34)") + end + end + + it "views the overrided strings" do + within "main div.flash.progressing" do + expect(page).to have_content("This proposal has been accepted") + end + end + + context "with another locale" do + before do + within_language_menu do + click_link "Català" + end + end + + it "views the overrided strings" do + within "main div.flash.progressing" do + expect(page).to have_content("Aquesta proposta ha sigut acceptada") + end + end + end + end + end +end