decidim-forms 0.27.6 → 0.28.0.rc4

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: fb8af1d2c76776bd4e799949d4723e998f57b4cc32ad3f021b1baff85fbd646b
-  data.tar.gz: 65f42cfd48b2b6e175dcba554014b97533a25c7b92eac8e2144d165f5bf86a42
+  metadata.gz: dd5dd73bd692f7b3831ddd2c681e809f57d93e837cf954805175a62f828d346e
+  data.tar.gz: ddd68c6abf91ff0844f9564b9d2416316be51e68ff63f897418764756d9a2145
 SHA512:
-  metadata.gz: b8a5638134be13bb12df3bc391fe1cff12314030215dde44c52ea87889946efdf7673f602ade25b7e8d87b0f973fc164649a46a97286547d754d469835891e08
-  data.tar.gz: 4e1eaebf065003acc37cd0bcb26e5549f6b32202d2edb9d96e748c32a8caf70a7b26eceda53fe447160880d1e4525038ec572b54766a52bae2e26eb20b2b15f7
+  metadata.gz: 7112f8af0871a617187b9a0de640ccc12afa2c8d1bec3548dc437a9da246509648d0e453683e008b17cdea12545c0b056cf0b4f5efdf2a3639bf8fe23067ee2a
+  data.tar.gz: 3f428f34a2676141b67a7bfa0b5838e5f6bb5c949b20f0815cac3f3e472e73b8467b74fb0d67e8d11f71f45b34a07920795784ced44e792c305d2fc39e289bb2

data/README.md

@@ -12,7 +12,7 @@ A `Decidim::Forms::Question` must be of one of the types:
 
 Here are the relations between the classes of a `Decidim::Questionnaire`:
 
-```
+```plantuml
                   1..* +----------+         1..* +--------------+
         +------------->| Question |------------->| AnswerOption |
         |              +-----+----+              +------+-------+

data/app/cells/decidim/forms/answer_readonly/show.erb

@@ -1,3 +1,3 @@
-<li class="questionnaire-question_readonly-answer">
+<li>
   <%= translated_attribute(model.body) %>
 </li>

data/app/cells/decidim/forms/matrix_readonly/show.erb

@@ -1,4 +1,4 @@
-<li class="questionnaire-question_readonly-answer">
+<li>
   <%= translated_attribute(model.body) %>
 
   (<%= answer_options %>)

data/app/cells/decidim/forms/question_readonly/show.erb

@@ -1,14 +1,14 @@
-<li class="questionnaire-question_readonly">
-  <p>
-    <%= decidim_escape_translated(model.body) %>
-    <br>
-    <em>
-      (<%= t(model.question_type, scope: "decidim.forms.question_types") %>)
-    </em>
+<li class="answer-questionnaire__question" data-question-readonly>
+  <p class="answer-questionnaire__question-label" data-answer-idx="<%= position %>">
+    <%= translated_attribute(model.body) %>
+  </p>
+
+  <p class="answer-questionnaire__question-description">
+    <em><%= t(model.question_type, scope: "decidim.forms.question_types") %></em>
   </p>
 
   <% if model.multiple_choice? %>
-    <ul class="questionnaire-question_readonly-answers <%= model.question_type %>">
+    <ul class="answer-questionnaire__question-description space-y-4">
       <% if model.matrix? %>
         <%= cell("decidim/forms/matrix_readonly", collection: model.matrix_rows) %>
       <% else %>

data/app/cells/decidim/forms/question_readonly/title_and_description.erb

@@ -0,0 +1,8 @@
+<li class="answer-questionnaire__question" data-question-readonly>
+  <div class="answer-questionnaire__step-heading">
+    <h3 class="h3"><%= translated_attribute(model.body) %></h3>
+    <p class="answer-questionnaire__question-description">
+      <em><%= t(model.question_type, scope: "decidim.forms.question_types") %></em>
+    </p>
+  </div>
+</li>

data/app/cells/decidim/forms/question_readonly_cell.rb

@@ -4,11 +4,18 @@ module Decidim
   module Forms
     # This cell renders a question (readonly) of a questionnaire
     class QuestionReadonlyCell < Decidim::ViewModel
+      include Decidim::SanitizeHelper
+
       def show
         return if model.separator?
+        return render :title_and_description if model.title_and_description?
 
         render :show
       end
+
+      def position
+        options[:indexed_items].index(model.id) + 1
+      end
     end
   end
 end

data/app/cells/decidim/forms/step_navigation/show.erb

@@ -1,35 +1,22 @@
-<div class="button--double form-general-submit answer-questionnaire__submit">
-  <% if first_step? %>
-    <a></a>
-  <% else %>
-    <%= link_to(
-      icon("caret-left", class: "icon--small", role: "img", "aria-hidden": true) + " " + t("decidim.forms.step_navigation.show.back"),
-      "#",
-      class: "hollow secondary",
-      data: {
-        toggle: [previous_step_dom_id, current_step_dom_id].join(" ")
-      }
-    ) %>
+<div class="form-general-submit answer-questionnaire__submit">
+  <% if !first_step? %>
+    <button type="button" class="button button__sm button__text-secondary" data-toggle="<%= [previous_step_dom_id, current_step_dom_id].join(" ") %>">
+      <%= icon "arrow-left-line", class: "fill-current" %>
+      <%= t("decidim.forms.step_navigation.show.back") %>
+    </button>
   <% end %>
 
   <% if last_step? %>
     <%= form.submit(
-      t("decidim.forms.step_navigation.show.submit"),
-      class: "button button--sc",
+      "#{t("decidim.forms.step_navigation.show.submit")}#{icon "mail-send-line", class: "fill-current"}".html_safe,
+      class: "button button__sm button__secondary",
       disabled: button_disabled?,
-      data: {
-        confirm: t("decidim.forms.step_navigation.show.are_you_sure"),
-        disable: true
-      }
+      **confirm_data
     ) %>
   <% else %>
-    <%= link_to(
-      t("decidim.forms.step_navigation.show.continue"),
-      "#",
-      class: "button button--sc",
-      data: {
-        toggle: [next_step_dom_id, current_step_dom_id].join(" ")
-      }
-    ) %>
+    <button type="button" class="button button__sm button__secondary" data-toggle="<%= [next_step_dom_id, current_step_dom_id].join(" ") %>">
+      <%= t("decidim.forms.step_navigation.show.continue") %>
+      <%= icon "arrow-right-line", class: "fill-current" %>
+    </button>
   <% end %>
 </div>

data/app/cells/decidim/forms/step_navigation_cell.rb

@@ -41,6 +41,13 @@ module Decidim
       def current_step_dom_id
         "step-#{current_step_index}"
       end
+
+      def confirm_data
+        { data: {
+          confirm: t("decidim.forms.step_navigation.show.are_you_sure"),
+          disable: true
+        } }
+      end
     end
   end
 end

data/app/commands/decidim/forms/answer_questionnaire.rb

@@ -22,7 +22,9 @@ module Decidim
       def call
         return broadcast(:invalid) if @form.invalid? || user_already_answered?
 
-        answer_questionnaire
+        with_events do
+          answer_questionnaire
+        end
 
         if @errors
           reset_form_attachments
@@ -36,7 +38,18 @@ module Decidim
 
       private
 
-      # This method will add an error to the `add_documents` field only if there's
+      def event_arguments
+        {
+          resource: questionnaire,
+          extra: {
+            session_token: form.context.session_token,
+            questionnaire:,
+            event_author: current_user
+          }
+        }
+      end
+
+      # This method will add an error to the `add_documents` field only if there is
       # any error in any other field or an error in another answer in the
       # questionnaire. This is needed because when the form has
       # an error, the attachments are lost, so we need a way to inform the user
@@ -47,6 +60,21 @@ module Decidim
         end
       end
 
+      def build_choices(answer, form_answer)
+        use_position = form_answer.sorting?
+
+        form_answer.selected_choices.each_with_index do |choice, idx|
+          choice_position = use_position ? choice.position.presence || idx : choice.position
+          answer.choices.build(
+            body: choice.body,
+            custom_body: choice.custom_body,
+            decidim_answer_option_id: choice.answer_option_id,
+            decidim_question_matrix_row_id: choice.matrix_row_id,
+            position: choice_position
+          )
+        end
+      end
+
       def answer_questionnaire
         @main_form = @form
         @errors = nil
@@ -62,15 +90,7 @@ module Decidim
               ip_hash: form.context.ip_hash
             )
 
-            form_answer.selected_choices.each do |choice|
-              answer.choices.build(
-                body: choice.body,
-                custom_body: choice.custom_body,
-                decidim_answer_option_id: choice.answer_option_id,
-                decidim_question_matrix_row_id: choice.matrix_row_id,
-                position: choice.position
-              )
-            end
+            build_choices(answer, form_answer)
 
             answer.save!
 

data/app/controllers/decidim/forms/admin/concerns/has_questionnaire.rb

@@ -20,7 +20,7 @@ module Decidim
             helper_method :questionnaire_for, :questionnaire, :blank_question, :blank_answer_option, :blank_matrix_row,
                           :blank_display_condition, :question_types, :display_condition_types, :update_url, :public_url, :answer_options_url, :edit_questionnaire_title
 
-            if defined?(Decidim::Templates::Admin::Concerns::Templatable)
+            if defined? Decidim::Templates::Admin
               include Decidim::Templates::Admin::Concerns::Templatable
               helper Decidim::DatalistSelectHelper
 
@@ -34,7 +34,7 @@ module Decidim
             end
 
             def edit
-              enforce_permission_to :update, :questionnaire, questionnaire: questionnaire
+              enforce_permission_to(:update, :questionnaire, questionnaire:)
 
               @form = form(Admin::QuestionnaireForm).from_model(questionnaire)
 
@@ -42,7 +42,7 @@ module Decidim
             end
 
             def update
-              enforce_permission_to :update, :questionnaire, questionnaire: questionnaire
+              enforce_permission_to(:update, :questionnaire, questionnaire:)
 
               params["published_at"] = Time.current if params.has_key? "save_and_publish"
               @form = form(Admin::QuestionnaireForm).from_params(params)
@@ -115,7 +115,7 @@ module Decidim
             end
 
             def questionnaire
-              @questionnaire ||= Questionnaire.find_by(questionnaire_for: questionnaire_for)
+              @questionnaire ||= Questionnaire.find_by(questionnaire_for:)
             end
 
             def blank_question

data/app/controllers/decidim/forms/admin/concerns/has_questionnaire_answers.rb

@@ -71,7 +71,7 @@ module Decidim
             end
 
             def questionnaire
-              @questionnaire ||= Questionnaire.find_by(questionnaire_for: questionnaire_for)
+              @questionnaire ||= Questionnaire.find_by(questionnaire_for:)
             end
 
             def participants_query

data/app/controllers/decidim/forms/concerns/has_questionnaire.rb

@@ -28,7 +28,7 @@ module Decidim
           def answer
             enforce_permission_to_answer_questionnaire
 
-            @form = form(Decidim::Forms::QuestionnaireForm).from_params(params, session_token: session_token, ip_hash: ip_hash)
+            @form = form(Decidim::Forms::QuestionnaireForm).from_params(params, session_token:, ip_hash:)
 
             Decidim::Forms::AnswerQuestionnaire.call(@form, current_user, questionnaire) do
               on(:ok) do
@@ -103,7 +103,7 @@ module Decidim
           end
 
           def questionnaire
-            @questionnaire ||= Questionnaire.includes(questions: :answer_options).find_by(questionnaire_for: questionnaire_for)
+            @questionnaire ||= Questionnaire.includes(questions: :answer_options).find_by(questionnaire_for:)
           end
 
           def spam_detected
@@ -138,7 +138,7 @@ module Decidim
           end
 
           def tokenize(id, length: 10)
-            tokenizer = Decidim::Tokenizer.new(salt: questionnaire.salt || questionnaire.id, length: length)
+            tokenizer = Decidim::Tokenizer.new(salt: questionnaire.salt || questionnaire.id, length:)
             tokenizer.int_digest(id).to_s
           end
         end

data/app/forms/decidim/forms/answer_form.rb

@@ -18,7 +18,7 @@ module Decidim
       validates :selected_choices, presence: true, if: :mandatory_choices?
 
       validate :max_choices, if: -> { question.max_choices }
-      validate :all_choices, if: -> { question.sorting? && question.mandatory? }
+      validate :all_choices, if: :sorting?
       validate :min_choices, if: -> { question.matrix? && question.mandatory? }
       validate :documents_present, if: -> { question.question_type == "files" && question.mandatory? }
       validate :max_characters, if: -> { question.max_characters.positive? }
@@ -31,8 +31,8 @@ module Decidim
         @question ||= Decidim::Forms::Question.find(question_id)
       end
 
-      def label(idx)
-        base = "#{idx + 1}. #{translated_attribute(question.body)}"
+      def label
+        base = translated_attribute(question.body)
         base += " #{mandatory_label}" if question.mandatory?
         base += " (#{max_choices_label})" if question.max_choices
         base
@@ -88,6 +88,10 @@ module Decidim
         errors[:add_documents].present?
       end
 
+      def sorting?
+        question.question_type == "sorting"
+      end
+
       private
 
       def mandatory_body?

data/app/forms/decidim/forms/questionnaire_form.rb

@@ -24,7 +24,7 @@ module Decidim
       # Returns nothing.
       def map_model(model)
         self.responses = model.questions.map do |question|
-          AnswerForm.from_model(Decidim::Forms::Answer.new(question: question))
+          AnswerForm.from_model(Decidim::Forms::Answer.new(question:))
         end
       end
 

data/app/helpers/decidim/forms/admin/application_helper.rb

@@ -31,7 +31,7 @@ module Decidim
             "placeholder" => options[:placeholder],
             "locale" => I18n.locale
           }
-          tag.span(class: options[:class], data: data) do
+          tag.span(class: options[:class], data:) do
             truncate translated_attribute(title), length: options[:max_length], omission: options[:omission]
           end
         end

data/app/helpers/decidim/forms/admin/concerns/has_questionnaire_answers_url_helper.rb

@@ -27,11 +27,11 @@ module Decidim
           # You can implement this method in your controller to change the URL
           # where the user's questionnaire answers will be shown.
           def questionnaire_participant_answers_url(session_token)
-            url_for([:show, questionnaire.questionnaire_for, { session_token: session_token }])
+            url_for([:show, questionnaire.questionnaire_for, { session_token: }])
           end
 
           def questionnaire_export_response_url(session_token)
-            url_for([:export_response, questionnaire.questionnaire_for, { session_token: session_token, format: "pdf" }])
+            url_for([:export_response, questionnaire.questionnaire_for, { session_token:, format: "pdf" }])
           end
         end
       end

data/app/models/decidim/forms/answer.rb

@@ -33,7 +33,7 @@ module Decidim
       end
 
       def self.newsletter_participant_ids(component)
-        surveys = Decidim::Surveys::Survey.joins(:component, :questionnaire).where(component: component)
+        surveys = Decidim::Surveys::Survey.joins(:component, :questionnaire).where(component:)
         questionnaires = Decidim::Forms::Questionnaire.includes(:questionnaire_for)
                                                       .where(questionnaire_for_type: Decidim::Surveys::Survey.name, questionnaire_for_id: surveys.pluck(:id))
 

data/app/models/decidim/forms/display_condition.rb

@@ -39,11 +39,11 @@ module Decidim
 
       def to_html_data
         {
-          id: id,
+          id:,
           type: condition_type,
           condition: decidim_condition_question_id,
           option: decidim_answer_option_id,
-          mandatory: mandatory,
+          mandatory:,
           value: condition_value&.dig(I18n.locale.to_s)
         }.compact
       end

data/app/models/decidim/forms/question.rb

@@ -70,10 +70,6 @@ module Decidim
         mandatory? && !multiple_choice? && !has_attachments?
       end
 
-      def sorting?
-        question_type == "sorting"
-      end
-
       def mandatory_choices?
         mandatory? && multiple_choice? && !has_attachments?
       end

data/app/models/decidim/forms/questionnaire.rb

@@ -27,7 +27,7 @@ module Decidim
 
       # Public: returns whether the questionnaire is answered by the user or not.
       def answered_by?(user)
-        query = user.is_a?(String) ? { session_token: user } : { user: user }
+        query = user.is_a?(String) ? { session_token: user } : { user: }
         answers.where(query).any? if questions.present?
       end
 

data/app/packs/entrypoints/decidim_forms.js

@@ -1,4 +1,8 @@
 import "src/decidim/forms/forms"
 
+// CSS
+import "stylesheets/decidim/forms/forms.scss"
+import "stylesheets/decidim/forms/questionnaire-answers-pdf.scss"
+
 // Images
 require.context("../images", true)

data/app/packs/src/decidim/forms/admin/collapsible_questions.js

@@ -1,13 +1,19 @@
 (() => {
+  const getButtons = document.querySelectorAll("button.question--collapse");
+
+  setTimeout(() => {
+    [...getButtons].forEach((button) => {
+      if (button.classList.contains("question-error")) {
+        button.click()
+      }
+    })
+  }, 100)
+
   $("button.collapse-all").on("click", () => {
-    $(".collapsible").addClass("hide");
-    $(".question--collapse .icon-expand").removeClass("hide");
-    $(".question--collapse .icon-collapse").addClass("hide");
+    $("[id$=field]").find("button.question--collapse[aria-expanded='true']").click()
   });
 
   $("button.expand-all").on("click", () => {
-    $(".collapsible").removeClass("hide");
-    $(".question--collapse .icon-expand").addClass("hide");
-    $(".question--collapse .icon-collapse").removeClass("hide");
+    $("[id$=field]").find("button.question--collapse[aria-expanded='false']").click()
   });
 })(window);

data/app/packs/src/decidim/forms/admin/forms.js

@@ -10,7 +10,6 @@ import AutoLabelByPositionComponent from "src/decidim/admin/auto_label_by_positi
 import createSortList from "src/decidim/admin/sort_list.component"
 import createDynamicFields from "src/decidim/admin/dynamic_fields.component"
 import createFieldDependentInputs from "src/decidim/admin/field_dependent_inputs.component"
-import createQuillEditor from "src/decidim/editor"
 import initLanguageChangeSelect from "src/decidim/admin/choose_language"
 
 export default function createEditableForm() {
@@ -132,8 +131,10 @@ export default function createEditableForm() {
     const $collapsible = $target.find(".collapsible");
     if ($collapsible.length > 0) {
       const collapsibleId = $collapsible.attr("id").replace("-question-card", "");
-      const toggleAttr = `${collapsibleId}-question-card button--collapse-question-${collapsibleId} button--expand-question-${collapsibleId}`;
-      $target.find(".question--collapse").data("toggle", toggleAttr);
+      const toggleAttr = `${collapsibleId}-question-card`;
+
+      // we need to update the DOM, not just the dataset
+      $target.find(".question--collapse").attr("data-controls", toggleAttr);
     }
   };
 
@@ -387,14 +388,13 @@ export default function createEditableForm() {
       setupInitialQuestionAttributes($field);
       createSortableList();
 
-      $field.find(".editor-container").each((idx, el) => {
-        createQuillEditor(el);
-      });
-
       autoLabelByPosition.run();
       autoButtonsByPosition.run();
 
       initLanguageChangeSelect($field.find("select.language-change").toArray());
+
+      // instead of initialize specific stuff, we send an event, with the DOM fragment we wanna update/refresh/bind
+      document.dispatchEvent(new CustomEvent("ajax:loaded", { detail: $field[0] }));
     },
     onRemoveField: ($field) => {
       autoLabelByPosition.run();

data/app/packs/src/decidim/forms/display_conditions.component.js

@@ -1,4 +1,4 @@
-/* eslint-disable no-ternary, no-plusplus, require-jsdoc */
+/* eslint-disable no-plusplus, require-jsdoc */
 
 class DisplayCondition {
   constructor(options = {}) {
@@ -27,7 +27,7 @@ class DisplayCondition {
 
     let multipleInput = [];
 
-    $conditionWrapperField.find(".radio-button-collection, .check-box-collection").find(".collection-input").each((idx, el) => {
+    $conditionWrapperField.find(".js-radio-button-collection, .js-check-box-collection").find(".js-collection-input").each((idx, el) => {
       const $input = $(el).find("input[name$=\\[body\\]]");
       const checked = $input.is(":checked");
 
@@ -51,7 +51,7 @@ class DisplayCondition {
       return $textInput;
     }
 
-    return $conditionWrapperField.find(".collection-input").find("input:not([type='hidden'])");
+    return $conditionWrapperField.find(".js-collection-input").find("input:not([type='hidden'])");
   }
 
   checkAnsweredCondition(value) {

data/app/packs/src/decidim/forms/forms.js

@@ -1,12 +1,19 @@
 /* eslint-disable require-jsdoc */
 
+/**
+ * Since the ["drag-on-drop"](https://github.com/schne324/dragon-drop) dependency is just an A11Y wrapper,
+ * its core is actually using the ["dragula"](https://github.com/bevacqua/dragula) resource,
+ * therefore the styles must be imported from the original library.
+ */
+import DragonDrop from "drag-on-drop";
+import "dragula/dist/dragula.css";
+
 import createOptionAttachedInputs from "src/decidim/forms/option_attached_inputs.component"
-import createAutosortableCheckboxes from "src/decidim/forms/autosortable_checkboxes.component"
 import createDisplayConditions from "src/decidim/forms/display_conditions.component"
 import createMaxChoicesAlertComponent from "src/decidim/forms/max_choices_alert.component"
 
 $(() => {
-  $(".radio-button-collection, .check-box-collection").each((idx, el) => {
+  $(".js-radio-button-collection, .js-check-box-collection").each((idx, el) => {
     createOptionAttachedInputs({
       wrapperField: $(el),
       controllerFieldSelector: "input[type=radio], input[type=checkbox]",
@@ -14,24 +21,23 @@ $(() => {
     });
   });
 
-  $.unique($(".check-box-collection").parents(".answer")).each((idx, el) => {
+  $.unique($(".js-check-box-collection").parents(".answer")).each((idx, el) => {
     const maxChoices = $(el).data("max-choices");
     if (maxChoices) {
       createMaxChoicesAlertComponent({
         wrapperField: $(el),
         controllerFieldSelector: "input[type=checkbox]",
-        controllerCollectionSelector: ".check-box-collection",
+        controllerCollectionSelector: ".js-check-box-collection",
         alertElement: $(el).find(".max-choices-alert"),
         maxChoices: maxChoices
       });
     }
   });
 
-  $(".sortable-check-box-collection").each((idx, el) => {
-    createAutosortableCheckboxes({
-      wrapperField: $(el)
-    })
-  });
+  document.querySelectorAll(".js-sortable-check-box-collection").forEach((el) => new DragonDrop(el, {
+    handle: false,
+    item: ".js-collection-input"
+  }));
 
   $(".answer-questionnaire .question[data-conditioned='true']").each((idx, el) => {
     createDisplayConditions({

data/app/packs/src/decidim/forms/option_attached_inputs.component.js

@@ -15,7 +15,7 @@ class OptionAttachedInputsComponent {
       const $field = $(el);
       const enabled = $field.is(":checked");
 
-      $field.parents("div.collection-input").find(this.dependentInputSelector).prop("disabled", !enabled);
+      $field.parents("div.js-collection-input").find(this.dependentInputSelector).prop("disabled", !enabled);
     });
   }