Merge branch 'develop' into feature/main_ctas_sticky_buttons

decidim-admin/spec/system/admin_manages_more_locales_spec.rb

@@ -22,6 +22,8 @@
   end
 
   after do
+    Decidim.available_locales = %w(en ca es)
+    I18n.available_locales = %w(en ca es)
     Decidim::Admin.send(:remove_const, :StaticPageForm)
     load "#{Decidim::Admin::Engine.root}/app/forms/decidim/admin/static_page_form.rb"
   end

decidim-admin/spec/system/admin_manages_organization_spec.rb

@@ -17,7 +17,7 @@
     it "updates the values from the form" do
       visit decidim_admin.edit_organization_path
 
-      fill_in "Name", with: "My super-uber organization"
+      fill_in_i18n :organization_name, "#organization-name-tabs", en: "My super-uber organization"
 
       %w(X Facebook Instagram YouTube GitHub).each do |network|
         within "#organization_social_handlers" do
@@ -467,7 +467,7 @@
         let(:parsed_content) do
           cnt = <<~HTML
             <p>testing</p>
-            <p><strong>foo</strong><br><a target="_blank" href="https://www.decidim.org/"><u>link</u></a></p>
+            <p><strong>foo</strong><br><a target="_blank" href="https://www.decidim.org/">link</a></p>
             <p><br></p>
           HTML
 

decidim-budgets/spec/system/orders_spec.rb

@@ -671,14 +671,14 @@
         end
       end
 
-      context "with supports enabled" do
+      context "with votes enabled" do
         let(:proposal_component) do
           create(:proposal_component, :with_votes_enabled, participatory_space: project.component.participatory_space)
         end
 
         let(:proposals) { create_list(:proposal, 1, :with_votes, component: proposal_component) }
 
-        it "does not show the amount of supports" do
+        it "does not show the amount of votes" do
           visit_budget
           click_on translated(project.title)
 

decidim-comments/spec/system/search_comments_spec.rb

@@ -9,10 +9,13 @@
   let(:manifest_name) { "dummy" }
   let!(:commentable) { create(:dummy_resource, component:) }
   let!(:searchables) { create_list(:comment, 3, commentable:) }
-  let!(:term) { strip_tags(translated(searchables.first.body)).split.last }
+  let!(:term) { "FooBar" }
   let(:hashtag) { "#decidim" }
 
   before do
+    comment = create(:comment, body: "FooBar", commentable:)
+    searchables << comment
+
     hashtag_comment = create(:comment, body: "A comment with a hashtag #{hashtag}", commentable:)
     searchables << hashtag_comment
   end

decidim-core/README.md

@@ -28,7 +28,7 @@ User authentication is set up with [`Devise`](https://github.com/plataformatec/d
 
 Core implements an Amendment feature that can be activated in the components. As of now, it is only implemented in the proposal component.
 
-This feature makes it possible for anyone to edit the text of an amendable resource and create a child resource as an amendment. This child resource may receive support and the author of the amendable resource may accept or reject the amendment (or child proposal). In case of rejection, the author of the rejected emendation may raise the child resource to an independent resource.
+This feature makes it possible for anyone to edit the text of an amendable resource and create a child resource as an amendment. This child resource may receive votes and the author of the amendable resource may accept or reject the amendment (or child proposal). In case of rejection, the author of the rejected emendation may raise the child resource to an independent resource.
 
 ### Key artifacts for Amendments
 

decidim-core/app/cells/decidim/card/show.erb

@@ -1,5 +1,5 @@
 <div class="py-4 space-y-2">
-  <a href="" class="text-lg text-secondary font-semibold hover:underline"><%= title %></a>
+  <a href="" class="text-lg text-secondary font-semibold hover:underline"><%= decidim_html_escape(title) %></a>
   <div class="flex items-center divide-x divide-gray-3">
    <% metadata.first(4).each do |item| %>
     <div class="flex items-center gap-1 px-4 lg:px-6 first:pl-0 last:pr-0 max-w-xs">

decidim-core/app/commands/decidim/amendable/withdraw.rb

@@ -18,7 +18,7 @@ def initialize(amendment, current_user)
       # Executes the command. Broadcasts these events:
       #
       # - :ok when everything is valid, together with the resource.
-      # - :invalid if the resource already has supports or does not belong to current user.
+      # - :invalid if the resource already has votes or does not belong to current user.
       #
       # Returns nothing.
       def call

decidim-core/app/packs/src/decidim/abide_form_validator_fixer.js

@@ -0,0 +1,44 @@
+/**
+ * This script modifies the behavior of Abide form validation to address the issue of form validation errors
+ * appearing prematurely in input fields.
+ *
+ * The primary goal is to hide error messages until the input field loses focus.
+ */
+
+class AbideFormValidatorFixer {
+  initialize() {
+    const forms = document.querySelectorAll("main [data-live-validate='true']");
+
+    forms.forEach((form) => {
+      if (this.isElementVisible(form)) {
+        this.setupForm(form);
+      }
+    });
+  }
+
+  isElementVisible(element) {
+    return element.offsetParent !== null && getComputedStyle(element).display !== "none";
+  }
+
+  setupForm(form) {
+    const inputs = form.querySelectorAll("input");
+
+    inputs.forEach((input) => {
+      const errorElement = input.closest("label")?.querySelector(".form-error") || input.parentElement.querySelector(".form-error");
+      if (!errorElement) {
+        return;
+      }
+      form.removeAttribute("data-live-validate");
+      input.addEventListener("input", this.hideErrorElement.bind(this, errorElement));
+    });
+  }
+
+  hideErrorElement(errorElement) {
+    errorElement.classList.remove("is-visible");
+  }
+}
+
+document.addEventListener("DOMContentLoaded", () => {
+  const validatorFixer = new AbideFormValidatorFixer();
+  validatorFixer.initialize();
+});

decidim-core/app/packs/src/decidim/datepicker/generate_datepicker.js

@@ -17,6 +17,7 @@ export default function generateDatePicker(input, row, formats) {
   const calendar = document.createElement("button");
   calendar.innerHTML = icon("calendar-line");
   calendar.setAttribute("class", "datepicker__calendar-button");
+  calendar.setAttribute("type", "button");
 
   dateColumn.appendChild(date);
   dateColumn.appendChild(calendar);
@@ -35,11 +36,13 @@ export default function generateDatePicker(input, row, formats) {
   const closeCalendar = document.createElement("button");
   closeCalendar.innerText = i18n.close;
   closeCalendar.setAttribute("class", "datepicker__close-calendar button button__transparent-secondary button__xs");
+  closeCalendar.setAttribute("type", "button");
 
   const pickCalendar = document.createElement("button");
   pickCalendar.innerText = i18n.select;
   pickCalendar.setAttribute("class", "datepicker__pick-calendar button button__secondary button__xs");
   pickCalendar.setAttribute("disabled", true);
+  pickCalendar.setAttribute("type", "button");
 
   datePickerContainer.appendChild(pickCalendar);
   datePickerContainer.appendChild(closeCalendar);

decidim-core/app/packs/src/decidim/datepicker/generate_timepicker.js

@@ -17,6 +17,7 @@ export default function generateTimePicker(input, row, formats) {
   const clock = document.createElement("button");
   clock.innerHTML = icon("time-line")
   clock.setAttribute("class", "datepicker__clock-button");
+  clock.setAttribute("type", "button");
 
   timeColumn.appendChild(time);
   timeColumn.appendChild(clock);
@@ -34,10 +35,12 @@ export default function generateTimePicker(input, row, formats) {
   const hourUp = document.createElement("button");
   hourUp.setAttribute("class", "datepicker__hour-up");
   hourUp.innerHTML = icon("arrow-drop-up-line", {class: "w-10 h-6 pr-1"});
+  hourUp.setAttribute("type", "button");
 
   const hourDown = document.createElement("button");
   hourDown.setAttribute("class", "datepicker__hour-down");
   hourDown.innerHTML = icon("arrow-drop-down-line", {class: "w-10 h-6 pr-1"});
+  hourDown.setAttribute("type", "button");
 
   hourColumn.appendChild(hours);
   hourColumn.appendChild(hourUp);
@@ -54,10 +57,12 @@ export default function generateTimePicker(input, row, formats) {
   const minuteUp = document.createElement("button");
   minuteUp.setAttribute("class", "datepicker__minute-up");
   minuteUp.innerHTML = icon("arrow-drop-up-line", {class: "w-10 h-6 pr-1"});
+  minuteUp.setAttribute("type", "button");
 
   const minuteDown = document.createElement("button");
   minuteDown.setAttribute("class", "datepicker__minute-down");
   minuteDown.innerHTML = icon("arrow-drop-down-line", {class: "w-10 h-6 pr-1"});
+  minuteDown.setAttribute("type", "button");
 
   minuteColumn.appendChild(minutes);
   minuteColumn.appendChild(minuteUp);
@@ -140,14 +145,17 @@ export default function generateTimePicker(input, row, formats) {
   const closeClock = document.createElement("button");
   closeClock.innerText = i18n.close;
   closeClock.setAttribute("class", "datepicker__close-clock button button__transparent-secondary button__xs");
+  closeClock.setAttribute("type", "button");
 
   const resetClock = document.createElement("button");
   resetClock.innerText = i18n.reset;
   resetClock.setAttribute("class", "datepicker__reset-clock button button__xs button__text-secondary");
+  resetClock.setAttribute("type", "button");
 
   const selectClock = document.createElement("button");
   selectClock.innerText = i18n.select;
   selectClock.setAttribute("class", "datepicker__select-clock button button__secondary button__xs");
+  selectClock.setAttribute("type", "button");
 
   timePicker.appendChild(resetClock);
   timePicker.appendChild(selectClock);

decidim-core/app/packs/src/decidim/index.js

@@ -47,6 +47,7 @@ import "src/decidim/impersonation"
 import "src/decidim/gallery"
 import "src/decidim/direct_uploads/upload_field"
 import "src/decidim/data_consent"
+import "src/decidim/abide_form_validator_fixer"
 import "src/decidim/sw"
 import "src/decidim/sticky_header"
 

decidim-core/app/packs/src/decidim/sticky_header.js

@@ -1,18 +1,25 @@
+// This script implements a sticky header that hides when participants scroll down and shows when they scroll up.
+// Sticky headers allow users to quickly access the navigation, search, and utility-navigation elements without scrolling up to the top of the page.
+// They increase the discoverability of the elements in the header.
 let prevScroll = window.scrollY;
-const stickyHeader = document.getElementById("sticky-header");
+const stickyHeader = document.querySelector("[data-sticky-header]");
 
 if (stickyHeader) {
   document.addEventListener("scroll", () => {
     // if a subelement is not visible it has no offsetParent
     const header = document.getElementById("main-bar").offsetParent;
     if (header) {
       let currentScroll = window.scrollY;
-      if (prevScroll > currentScroll || currentScroll < stickyHeader.offsetHeight) {
-        stickyHeader.style.top = 0;
-      } else {
-        stickyHeader.style.top = `-${stickyHeader.offsetHeight}px`;
+      let goingDown = prevScroll > currentScroll;
+      let change = Math.abs(prevScroll - currentScroll);
+      if (change > 5) {
+        if (goingDown || currentScroll < stickyHeader.offsetHeight) {
+          stickyHeader.style.top = 0;
+        } else {
+          stickyHeader.style.top = `-${stickyHeader.offsetHeight}px`;
+        }
+        prevScroll = currentScroll;
       }
-      prevScroll = currentScroll;
     }
   });
 };

decidim-core/app/packs/stylesheets/decidim/_forms.scss

@@ -1,8 +1,8 @@
 #form-search-mobile {
-  @apply py-1.5 px-4 bg-gray-6 rounded-sm;
+  @apply py-1.5 px-4 bg-gray-5 rounded-sm;
 
   input[type="text"] {
-    @apply bg-gray-6;
+    @apply bg-gray-5;
   }
 }
 

decidim-core/app/packs/stylesheets/decidim/_header.scss

@@ -38,10 +38,8 @@ header {
     }
   }
 
-  #sticky-header {
-    @apply fixed w-full top-0 shadow-lg z-40 bg-white md:relative;
-
-    transition: top 0.3s;
+  #sticky-header-container {
+    @apply fixed w-full top-0 shadow-lg z-40 bg-white md:relative transition-top duration-300;
   }
 
   .main-bar {
@@ -56,11 +54,11 @@ header {
     }
 
     &__logo-desktop {
-      @apply md:hidden lg:block;
+      @apply hidden lg:block;
+    }
 
-      @media screen and (max-width: 768px) {
-        display: none;
-      }
+    &__logo-mobile {
+      @apply lg:hidden;
     }
 
     &__search {
@@ -93,6 +91,10 @@ header {
         &-wrapper {
           @apply flex gap-x-4 xl:gap-x-6;
         }
+
+        &-account {
+          @apply w-6 h-6 flex items-center justify-center bg-secondary text-white rounded-full text-xs font-bold mr-2;
+        }
       }
 
       /* overwrite default dropdown styles */

decidim-core/app/presenters/decidim/home_stats_presenter.rb

@@ -45,7 +45,7 @@ def component_stats(conditions)
       stats = {}
       Decidim.component_manifests.flat_map do |component|
         component
-          .stats.except([:supports_count])
+          .stats.except([:votes_count])
           .filter(conditions)
           .with_context(published_components)
           .each do |name, data|

decidim-core/app/views/layouts/decidim/_logo_mobile.html.erb

@@ -1,6 +1,6 @@
 <% if organization %>
   <%= link_to decidim.root_url(host: organization.host), "aria-label": t("front_page_link", scope: "decidim.accessibility") do %>
-    <% if organization.logo.attached? %>
+    <% if organization.favicon.attached? %>
       <%= image_tag organization.attached_uploader(:favicon).variant_path(:medium), alt: t("logo", scope: "decidim.accessibility", organization: current_organization_name) %>
     <% else %>
       <span><%= current_organization_name %></span>

decidim-core/app/views/layouts/decidim/_wrapper.html.erb

@@ -12,7 +12,7 @@ end
 
 <div class="layout-container">
   <header <%= "class=with-admin-bar" if current_user&.admin %>>
-    <div id="sticky-header">
+    <div id="sticky-header-container" data-sticky-header>
       <%= render partial: "layouts/decidim/admin_links" if current_user&.admin %>
       <%= render partial: "layouts/decidim/header/main" %>
     </div>

decidim-core/app/views/layouts/decidim/header/_main.html.erb

@@ -4,7 +4,7 @@
       <div class="main-bar__logo-desktop">
         <%= render partial: "layouts/decidim/logo", locals: { organization: current_organization } %>
       </div>
-      <div class="lg:hidden">
+      <div class="main-bar__logo-mobile">
         <%= render partial: "layouts/decidim/logo_mobile", locals: { organization: current_organization } %>
       </div>
     </div>
@@ -36,7 +36,6 @@
       </div>
 
       <%# Overlay menus mobile %>
-      <%= render partial: "layouts/decidim/header/main_links_mobile_search" %>
       <%= render partial: "layouts/decidim/header/main_links_mobile_account" if current_user %>
     </div>
   </div>

decidim-core/app/views/layouts/decidim/header/_main_links_desktop.html.erb

@@ -39,9 +39,8 @@
           </span>
         </span>
       <% else %>
-        <span class="main-bar__links-desktop__item">
-          <%= icon "user-smile-line" %>
-          <span><%= t("layouts.decidim.user_profile.account") %></span>
+        <span class="main-bar__links-desktop__item-account">
+          <%= text_initials(current_user.name) %>
         </span>
       <% end %>
     </button>

decidim-core/app/views/layouts/decidim/header/_main_links_mobile_account.html.erb

@@ -4,7 +4,7 @@
       <div class="main-bar__logo-desktop">
         <%= render partial: "layouts/decidim/logo", locals: { organization: current_organization } %>
       </div>
-      <div class="lg:hidden">
+      <div class="main-bar__logo-mobile">
         <%= render partial: "layouts/decidim/logo_mobile", locals: { organization: current_organization } %>
       </div>
     </div>

decidim-core/app/views/layouts/decidim/header/_main_links_mobile_search.html.erb

@@ -11,3 +11,4 @@
     </div>
   </div>
 </div>
+

decidim-core/app/views/layouts/decidim/header/_mobile_language_choose.html.erb

@@ -12,7 +12,7 @@
                 <% end %>
             </span>
     </button>
-    <div id="dropdown-menu-language-chooser-mobile" class="bg-gray-7 relative" aria-hidden="true">
+    <div id="dropdown-menu-language-chooser-mobile" class="bg-gray-5 relative" aria-hidden="true">
         <ul class="menu-bar__language-chooser" role="menu">
         <% (available_locales - [I18n.locale.to_s]).each do |locale| %>
             <li class="text-black text-xs hover:bg-secondary hover:text-white transition" role="presentation">

decidim-core/lib/decidim/assets/tailwind/tailwind.config.js.erb

@@ -76,6 +76,11 @@ module.exports = {
       "3xl": ["32px", "40px"],
       "4xl": ["36px", "45px"],
       "5xl": ["48px", "60px"]
+    },
+    extend: {
+      transitionProperty: {
+        'top': 'top',
+      }
     }
   },
   plugins: [require("@tailwindcss/typography")]