decidim-templates 0.30.4 → 0.31.0.rc1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 10d4da0023442625706fbcdf93bec3b6ec4a633fb750ec8aaafd6ce61a1ec37a
-  data.tar.gz: a91568c0049ebf6aba323bb790ab77f7a5ab02efad653be9dfca43397955d94f
+  metadata.gz: 23045fbf6edd8834dd2b174468b6282e229c82950a5b71b9e74b47c0d5f2876c
+  data.tar.gz: f872a1eb4ca2528a683546ebde5696cedcc52d39f8b84c0df55e6b36521c41b0
 SHA512:
-  metadata.gz: 0a854295b654e4fb58c8a14afbd094d5e7ab82ba194f8bbe727a3285e5301c33b5bb16b1c16bb5e96d975b870691ac4797eed61861b1e80e892bb87899100f74
-  data.tar.gz: 94e4841977fac79107a87c5e3e343516ea8c8b3a818c40366e03006ebc6a212ee825a6bce16f606462a040fb0a25fa79ea9c9cfcb49779bddf2d5b3040daf8c9
+  metadata.gz: 38bfd0a16891454d57219b2063eb2e01b4b9be2045b95fb89923aa0a0ea40e3e04fbc73b9498c8ae4d150f8197e2f7477128e95dbedc2d6a7227364d8924fd30
+  data.tar.gz: 28c997805937ea1cdcc4ad7268eb14b6146640f4de613436894b7cbf8ce50769d0c0d4b092340850e7bd2a8386cc64e994cc39f2da79e55c364cf717d6b99508

data/app/commands/decidim/templates/admin/questionnaire_copier.rb

@@ -7,18 +7,18 @@ module Decidim
       module QuestionnaireCopier
         def copy_questionnaire_questions(original_questionnaire, new_questionnaire)
           # start by copying the questions so that they already exist when cross referencing them in the conditions
-          original_questionnaire.reload.questions.includes(:answer_options, :matrix_rows, :display_conditions)
+          original_questionnaire.reload.questions.includes(:response_options, :matrix_rows, :display_conditions)
           original_questionnaire.questions.each do |original_question|
             new_question = original_question.dup
             new_question.questionnaire = new_questionnaire
             new_question.assign_attributes(
-              answer_options_count: 0,
+              response_options_count: 0,
               matrix_rows_count: 0,
               display_conditions_count: 0,
               display_conditions_for_other_questions_count: 0
             )
             new_question.save!
-            copy_questionnaire_answer_options(original_question, new_question)
+            copy_questionnaire_response_options(original_question, new_question)
             copy_questionnaire_matrix_rows(original_question, new_question)
           end
           # once all questions are copied, copy display conditions
@@ -27,11 +27,11 @@ module Decidim
           end
         end
 
-        def copy_questionnaire_answer_options(original_question, new_question)
-          original_question.answer_options.each do |original_answer_option|
-            new_answer_option = original_answer_option.dup
-            new_answer_option.question = new_question
-            new_answer_option.save!
+        def copy_questionnaire_response_options(original_question, new_question)
+          original_question.response_options.each do |original_response_option|
+            new_response_option = original_response_option.dup
+            new_response_option.question = new_question
+            new_response_option.save!
           end
         end
 
@@ -51,8 +51,9 @@ module Decidim
             destination_question_to_be_checked = find_question_by_position(destination_question.questionnaire.questions, original_display_condition.condition_question.position)
             new_display_condition.condition_question = destination_question_to_be_checked
 
-            if original_display_condition.answer_option
-              new_display_condition.answer_option = find_answer_option_by_body(destination_question_to_be_checked.answer_options, original_display_condition.answer_option.body)
+            if original_display_condition.response_option
+              new_display_condition.response_option = find_response_option_by_body(destination_question_to_be_checked.response_options,
+                                                                                   original_display_condition.response_option.body)
             end
             new_display_condition.save!
             destination_question.display_conditions << new_display_condition
@@ -63,8 +64,8 @@ module Decidim
           questions.to_a.find { |q| q.position == position }
         end
 
-        def find_answer_option_by_body(answer_options, body)
-          answer_options.to_a.find { |ao| ao.body == body }
+        def find_response_option_by_body(response_options, body)
+          response_options.to_a.find { |ao| ao.body == body }
         end
       end
     end

data/app/controllers/decidim/templates/admin/block_user_templates_controller.rb

@@ -62,7 +62,7 @@ module Decidim
             on(:invalid) do |template|
               @template = template
               flash.now[:error] = I18n.t("templates.update.error", scope: "decidim.admin")
-              render action: :edit
+              render action: :edit, status: :unprocessable_entity
             end
           end
         end
@@ -85,7 +85,7 @@ module Decidim
 
             on(:invalid) do
               flash.now[:alert] = I18n.t("templates.create.error", scope: "decidim.admin")
-              render :new
+              render :new, status: :unprocessable_entity
             end
           end
         end

data/app/controllers/decidim/templates/admin/proposal_answer_templates_controller.rb

@@ -39,7 +39,7 @@ module Decidim
 
             on(:invalid) do
               flash.now[:alert] = I18n.t("templates.create.error", scope: "decidim.admin")
-              render :new
+              render :new, status: :unprocessable_entity
             end
           end
         end
@@ -86,7 +86,7 @@ module Decidim
             on(:invalid) do |template|
               @template = template
               flash.now[:error] = I18n.t("templates.update.error", scope: "decidim.admin")
-              render action: :edit
+              render action: :edit, status: :unprocessable_entity
             end
           end
         end

data/app/controllers/decidim/templates/admin/questionnaire_templates_controller.rb

@@ -48,7 +48,7 @@ module Decidim
 
             on(:invalid) do
               flash.now[:alert] = I18n.t("templates.create.error", scope: "decidim.admin")
-              render :new
+              render :new, status: :unprocessable_entity
             end
           end
         end
@@ -87,7 +87,7 @@ module Decidim
             on(:invalid) do |template|
               @template = template
               flash.now[:error] = I18n.t("templates.update.error", scope: "decidim.admin")
-              render action: :edit
+              render action: :edit, status: :unprocessable_entity
             end
           end
         end

data/app/packs/entrypoints/decidim_templates.scss

@@ -1 +1 @@
-@import "stylesheets/decidim/templates/templates";
+@use "stylesheets/decidim/templates/templates";

data/app/packs/src/decidim/templates/admin/block_user_template_chooser.js

@@ -1,5 +1,5 @@
 // Choose a Block User Message template, get it by AJAX and add the Template in the justification textarea
-document.addEventListener("DOMContentLoaded", () => {
+document.addEventListener("turbo:load", () => {
   const blockTemplateChooser = document.getElementById("block_template_chooser");
   if (blockTemplateChooser) {
     blockTemplateChooser.addEventListener("change", () => {

data/app/packs/src/decidim/templates/admin/choose_template.js

@@ -1,13 +1,63 @@
 import { datalistSelect } from "src/decidim/datalist_select";
 
-$(() => {
-  const wrapper = document.querySelector("#choose-template");
-  if (!wrapper) {
+document.addEventListener("turbo:load", () => {
+  const chooseTemplateForm = document.querySelector("[data-choose-questionnaire-templates]");
+  if (!chooseTemplateForm) {
     return;
   }
 
+  const chooseTemplateWrapper = document.querySelector("#choose-template");
+  if (!chooseTemplateWrapper) {
+    return;
+  }
+
+  const createNewFormButton = document.querySelector("[data-create-new-form-button]");
+  const withTemplateButton = document.querySelector("[data-with-template-button]");
+  const disabledContinueButton = document.querySelector("[data-disabled-button]");
+  const questionnaireTemplatePreview = document.querySelector("[data-questionnaire-template-preview]");
+
+  const toggleElementsOnChange = () => {
+    const radios = document.querySelectorAll("input[name='template']");
+
+    radios.forEach((radio) => {
+      radio.addEventListener("change", function() {
+        switch (radio.value) {
+        case "create_new_form":
+          disabledContinueButton.classList.add("!hidden");
+          withTemplateButton.classList.add("!hidden");
+          createNewFormButton.classList.remove("!hidden");
+
+          chooseTemplateWrapper.classList.add("hidden");
+
+          questionnaireTemplatePreview.classList.add("hidden");
+          break;
+
+        case "select_template":
+          disabledContinueButton.classList.remove("!hidden");
+          createNewFormButton.classList.add("!hidden");
+
+          chooseTemplateWrapper.classList.remove("hidden");
+          questionnaireTemplatePreview.classList.remove("hidden");
+
+          // Clean-up old values in case the admin is changing between the options after filling 'Select template'
+          // chooseTemplateWrapper.classList.add("hide");
+          document.querySelector("#questionnaire_questionnaire_template_id").value = "";
+          document.querySelector("input[name=select-template]").value = "";
+          document.querySelector("[data-template-name]").innerHTML = "";
+          document.querySelector("[data-template-description]").innerHTML = "";
+          document.querySelector("[data-choose-template-preview]").innerHTML = "";
+
+          break;
+
+        default:
+          console.error("Unknown template type for choosing a questionnaire template");
+        }
+      });
+    });
+  }
+
   const preview = (id) => {
-    const options = wrapper.dataset;
+    const options = chooseTemplateWrapper.dataset;
     const previewURL = options.previewurl;
     if (!previewURL) {
       return;
@@ -18,7 +68,11 @@ $(() => {
       type: "GET",
       error: (data) => (console.error(data))
     });
+
+    disabledContinueButton.classList.add("!hidden");
+    withTemplateButton.classList.remove("!hidden");
   }
 
-  datalistSelect(wrapper, preview)
+  datalistSelect(chooseTemplateWrapper, preview)
+  toggleElementsOnChange();
 })

data/app/packs/src/decidim/templates/admin/proposal_answer_template_chooser.js

@@ -1,5 +1,5 @@
 // Choose a Proposal Answer template, get it by AJAX and add the Template in the Proposal Answer textarea
-document.addEventListener("DOMContentLoaded", () => {
+document.addEventListener("turbo:load", () => {
   const proposalAnswerTemplateChooser = document.getElementById("proposal_answer_template_chooser");
   if (proposalAnswerTemplateChooser) {
     proposalAnswerTemplateChooser.addEventListener("change", () => {

data/app/packs/stylesheets/decidim/templates/templates.scss

@@ -1,5 +1,9 @@
-.questionnaire-template-preview {
-  .card {
-    @apply w-full m-auto border-0;
+.questionnaire-template__form {
+  .form__wrapper input[type="radio"] {
+    @apply mt-0;
+  }
+
+  &-card {
+    @apply p-4 block border border-background rounded-lg cursor-pointer has-[:checked]:border-secondary has-[:checked]:border-2;
   }
 }

data/app/views/decidim/templates/admin/block_user_templates/index.html.erb

@@ -9,31 +9,65 @@
     </h1>
   </div>
   <% if @templates.any? %>
-    <div class="table-scroll">
+    <div class="table-stacked">
       <table class="table-list user_block-templates">
         <thead>
         <tr>
           <th><%= t("template.name", scope: "decidim.models") %></th>
           <th><%= t("template.fields.created_at", scope: "decidim.models") %></th>
-          <th></th>
+          <th><%= t("decidim.admin.actions.actions") %></th>
         </tr>
         </thead>
         <tbody>
         <% @templates.each do |template| %>
           <tr data-questionnaire_template-id="<%= template.id %>">
-            <td><%= link_to translated_attribute(template.name), edit_block_user_template_path(template) %></td>
-            <td><%= l template.created_at, format: :long %></td>
-            <td class="table-list__actions">
-              <% if allowed_to?(:update, :template, questionnaire_template: template) %>
-                <%= icon_link_to "pencil-line", edit_block_user_template_path(template), t("actions.edit", scope: "decidim.admin"), class: "edit" %>
-              <% end %>
-              <% if allowed_to?(:copy, :template, questionnaire_template: template) %>
-                <%= icon_link_to "file-copy-line", copy_block_user_template_path(template), t("actions.duplicate", scope: "decidim.admin"), method: :post %>
-              <% end %>
-              <% if allowed_to?(:destroy, :template, questionnaire_template: template) %>
-                <%= icon_link_to "delete-bin-line", block_user_template_path(template), t("actions.destroy", scope: "decidim.admin"), method: :delete, data: { confirm: t(".confirm_delete") }, class: "action-icon--remove" %>
-              <% end %>
+            <td data-label="<%= t("template.name", scope: "decidim.models") %>">
+              <%= link_to translated_attribute(template.name), edit_block_user_template_path(template) %>
             </td>
+            <td data-label="<%= t("template.fields.created_at", scope: "decidim.models") %>">
+              <%= l template.created_at, format: :long %>
+            </td>
+            <td data-label="<%= t("decidim.admin.actions.actions") %>" class="table-list__actions">
+              <button type="button" data-controller="dropdown" data-target="actions-block-user-template-<%= template.id %>" aria-label="<%= t("decidim.admin.actions.actions_label", resource: template.name) %>">
+                <%= icon "more-fill", class: "text-secondary" %>
+              </button>
+
+              <div class="inline-block relative">
+                <ul id="actions-block-user-template-<%= template.id %>" class="dropdown dropdown__action" aria-hidden="true">
+                  <% if allowed_to?(:update, :template, questionnaire_template: template) %>
+                    <li class="dropdown__item">
+                      <%= link_to edit_block_user_template_path(template), class: "dropdown__button edit" do %>
+                        <%= icon "pencil-line" %>
+                        <%= t("actions.edit", scope: "decidim.admin") %>
+                      <% end %>
+                    </li>
+
+                    <hr>
+                  <% end %>
+
+                  <% if allowed_to?(:copy, :template, questionnaire_template: template) %>
+                    <li class="dropdown__item">
+                      <%= link_to copy_block_user_template_path(template), method: :post, class: "dropdown__button" do %>
+                        <%= icon "file-copy-line" %>
+                        <%= t("actions.duplicate", scope: "decidim.admin") %>
+                      <% end %>
+                    </li>
+
+                    <hr>
+                  <% end %>
+
+                  <% if allowed_to?(:destroy, :template, questionnaire_template: template) %>
+                    <li class="dropdown__item">
+                      <%= link_to block_user_template_path(template), method: :delete, data: { confirm: t(".confirm_delete") }, class: "dropdown__button" do %>
+                        <%= icon "delete-bin-line" %>
+                        <%= t("actions.destroy", scope: "decidim.admin") %>
+                      <% end %>
+                    </li>
+                  <% end %>
+                </ul>
+              </div>
+            </td>
+
           </tr>
         <% end %>
         </tbody>

data/app/views/decidim/templates/admin/proposal_answer_templates/index.html.erb

@@ -10,7 +10,7 @@
     </h1>
   </div>
   <% if @templates.any? %>
-    <div class="table-scroll">
+    <div class="table-stacked">
       <table class="table-list">
         <thead>
           <tr>
@@ -18,28 +18,65 @@
             <th><%= t(".proposal_state_id") %></th>
             <th><%= t(".component_constraint") %></th>
             <th><%= t("template.fields.created_at", scope: "decidim.models") %></th>
-            <th></th>
+            <th><%= t("decidim.admin.actions.actions") %></th>
           </tr>
         </thead>
         <tbody>
           <% @templates.each do |template| %>
             <tr data-proposal_answer-id="<%= template.id %>">
-              <td><%= link_to_if allowed_to?(:update, :template, template:) , translated_attribute(template.name), edit_proposal_answer_template_path(template) %></td>
-              <td> <%= proposal_state(template) %></td>
-              <td><%= availability_option_as_text(template) %></td>
-              <td><%= l template.created_at, format: :long %></td>
+              <td data-label="<%= t("template.name", scope: "decidim.models") %>">
+                <%= link_to_if allowed_to?(:update, :template, template: template), translated_attribute(template.name), edit_proposal_answer_template_path(template) %>
+              </td>
+              <td data-label="<%= t(".proposal_state_id") %>">
+                <%= proposal_state(template) %>
+              </td>
+              <td data-label="<%= t(".component_constraint") %>">
+                <%= availability_option_as_text(template) %>
+              </td>
+              <td data-label="<%= t("template.fields.created_at", scope: "decidim.models") %>">
+                <%= l template.created_at, format: :long %>
+              </td>
+              <td data-label="<%= t("decidim.admin.actions.actions") %>" class="table-list__actions">
+                <button type="button" data-controller="dropdown" data-target="actions-proposal-answer-template-<%= template.id %>" aria-label="<%= t("decidim.admin.actions.actions_label", resource: template.name) %>">
+                  <%= icon "more-fill", class: "text-secondary" %>
+                </button>
+
+                <div class="inline-block relative">
+                  <ul id="actions-proposal-answer-template-<%= template.id %>" class="dropdown dropdown__action" aria-hidden="true">
+                    <% if allowed_to?(:update, :template, template: template) %>
+                      <li class="dropdown__item">
+                        <%= link_to edit_proposal_answer_template_path(template), class: "dropdown__button edit" do %>
+                          <%= icon "pencil-line" %>
+                          <%= t("actions.edit", scope: "decidim.admin") %>
+                        <% end %>
+                      </li>
 
-              <td class="table-list__actions">
-                <% if allowed_to?(:update, :template, template:) %>
-                  <%= icon_link_to "pencil-line", edit_proposal_answer_template_path(template), t("actions.edit", scope: "decidim.admin"), class: "edit" %>
-                <% end %>
-                <% if allowed_to?(:copy, :template, template:) %>
-                  <%= icon_link_to "file-copy-line", copy_proposal_answer_template_path(template), t("actions.duplicate", scope: "decidim.admin"), method: :post %>
-                <% end %>
-                <% if allowed_to?(:destroy, :template, template:) %>
-                  <%= icon_link_to "delete-bin-line", proposal_answer_template_path(template), t("actions.destroy", scope: "decidim.admin"), method: :delete, data: { confirm: t(".confirm_delete") }, class: "action-icon--remove" %>
-                <% end %>
+                      <hr>
+                    <% end %>
+
+                    <% if allowed_to?(:copy, :template, template: template) %>
+                      <li class="dropdown__item">
+                        <%= link_to copy_proposal_answer_template_path(template), method: :post, class: "dropdown__button" do %>
+                          <%= icon "file-copy-line" %>
+                          <%= t("actions.duplicate", scope: "decidim.admin") %>
+                        <% end %>
+                      </li>
+
+                      <hr>
+                    <% end %>
+
+                    <% if allowed_to?(:destroy, :template, template: template) %>
+                      <li class="dropdown__item">
+                        <%= link_to proposal_answer_template_path(template), method: :delete, data: { confirm: t(".confirm_delete") }, class: "dropdown__button" do %>
+                          <%= icon "delete-bin-line" %>
+                          <%= t("actions.destroy", scope: "decidim.admin") %>
+                        <% end %>
+                      </li>
+                    <% end %>
+                  </ul>
+                </div>
               </td>
+
             </tr>
           <% end %>
         </tbody>

data/app/views/decidim/templates/admin/questionnaire_templates/_choose.html.erb

@@ -1,42 +1,61 @@
 <div class="item_show__header">
   <h1 class="item_show__header-title">
     <%= form_title %>
-    <div class="ml-auto">
-      <%= link_to t(".skip_template"), decidim_admin_templates.skip_questionnaire_templates_path(questionnaire_id: questionnaire, url: request.url), class: "button button__sm button__secondary", method: :post %>
-    </div>
   </h1>
+
+  <% if show_buttons %>
+    <%= button_tag t("continue", scope: "decidim.templates.admin.questionnaire_templates.choose"), class: "main-tabs-menu__cta-button disabled", data: { disabled_button: true } %>
+    <%= link_to t("continue", scope: "decidim.templates.admin.questionnaire_templates.choose"), decidim_admin_templates.skip_questionnaire_templates_path(questionnaire_id: questionnaire, url: request.url), class: "main-tabs-menu__cta-button hidden", data: { create_new_form_button: true }, method: :post %>
+    <%= button_tag t("continue", scope: "decidim.templates.admin.questionnaire_templates.choose"), class: "main-tabs-menu__cta-button hidden", data: { with_template_button: true }, form: "choose-template-form" %>
+  <% end %>
 </div>
-<div class="item__edit item__edit-1col">
-  <div class="item__edit-form">
-    <%= decidim_form_for([questionnaire], url: decidim_admin_templates.apply_questionnaire_templates_url(questionnaire_id: questionnaire, url: request.url), method: :post, html: { class: "form form-defaults choose_questionnaire_templates" }) do |form| %>
+
+<div class="grid-cols-1">
+  <div class="item__edit-form questionnaire-template__form">
+    <%= decidim_form_for([questionnaire], url: decidim_admin_templates.apply_questionnaire_templates_url(questionnaire_id: questionnaire, url: request.url),
+                                          method: :post,
+                                          html: { id: "choose-template-form", class: "form form-defaults choose_questionnaire_templates", "data-choose-questionnaire-templates": true }) do |form| %>
       <div class="form__wrapper">
-        <div class="card p-4">
+        <div class="p-4 ">
           <%= t(".description") %>
+
+          <div class="grid grid-cols-2 gap-4 my-4">
+            <%= label_tag :template_create_new_form, class: "questionnaire-template__form-card" do %>
+              <%= radio_button_tag :template, :create_new_form, false, class: "hidden peer" %>
+              <span class="text-lg font-normal">
+                <%= t(".options.create_new_form") %>
+              </span>
+            <% end %>
+
+            <%= label_tag :template_select_template, class: "questionnaire-template__form-card" do %>
+              <%= radio_button_tag :template, :select_template, false, class: "hidden peer" %>
+              <span class="text-lg font-normal">
+                <%= t(".options.select_template") %>
+              </span>
+            <% end %>
+          </div>
+
           <%= datalist_select(templates,
                               {
                                 id: "choose-template",
                                 list: "template-list",
                                 label: t(".label"),
                                 name: "select-template",
+                                class: "hidden",
                                 placeholder: t("placeholder", scope: "decidim.templates.admin.questionnaire_templates.choose"),
                                 data: {
                                   previewurl: decidim_admin_templates.preview_questionnaire_templates_url(format: :js)
                                 }
                               }
           ) { form.hidden_field :questionnaire_template_id } %>
-          <div class="card-section questionnaire-template-preview pt-4 hide">
+
+          <div class="card-section questionnaire-template-preview pt-4 hide" data-questionnaire-template-preview="true">
             <h2 class="item_show__header-title" data-template-name></h2>
             <p class="py-4" data-template-description></p>
             <div class="row column" data-choose-template-preview></div>
           </div>
         </div>
       </div>
-
-      <div class="item__edit-sticky">
-        <div class="item__edit-sticky-container">
-          <%= form.submit t(".create_from_template"), class: "button button__sm button__secondary" %>
-        </div>
-      </div>
     <% end %>
   </div>
 </div>

data/app/views/decidim/templates/admin/questionnaire_templates/_preview.html.erb

@@ -6,11 +6,11 @@
 </div>
 
 <div class="row columns">
-  <%= decidim_form_for(@preview_form, url: "", method: :post, authenticity_token: !defined?(skip_authenticity_token), html: { class: "form form-defaults answer-questionnaire" }, data: { "safe-path" => "" }) do |form| %>
+  <%= decidim_form_for(@preview_form, url: "", method: :post, authenticity_token: !defined?(skip_authenticity_token), html: { class: "form form-defaults response-questionnaire" }, data: { "safe-path" => "" }) do |form| %>
     <%= invisible_captcha %>
-    <% answer_idx = 0 %>
-    <% cleaned_answer_idx = 0 %>
-    <% @preview_form.responses_by_step.each_with_index do |step_answers, step_index| %>
+    <% response_idx = 0 %>
+    <% cleaned_response_idx = 0 %>
+    <% @preview_form.responses_by_step.each_with_index do |step_responses, step_index| %>
       <div id="step-<%= step_index %>" class="<%= step_index.zero? ? "questionnaire-step" : "questionnaire-step hide" %>" data-toggler=".hide">
         <div class="form__wrapper">
           <% if @preview_form.total_steps > 1 %>
@@ -19,23 +19,23 @@
             </h4>
           <% end %>
 
-          <% step_answers.each do |answer| %>
-            <div class="mb-4 answer" data-max-choices="<%= answer.question.max_choices %>">
-              <%= fields_for "questionnaire[responses][#{answer_idx}]", answer do |answer_form| %>
+          <% step_responses.each do |response| %>
+            <div class="mb-4 response" data-max-choices="<%= response.question.max_choices %>">
+              <%= fields_for "questionnaire[responses][#{response_idx}]", response do |response_form| %>
                 <%= render(
-                  "decidim/forms/questionnaires/answer",
-                  answer_form:,
-                  answer:,
-                  answer_idx:,
-                  cleaned_answer_idx:,
+                  "decidim/forms/questionnaires/response",
+                  response_form:,
+                  response:,
+                  response_idx:,
+                  cleaned_response_idx:,
                   disabled: false
                 ) %>
               <% end %>
             </div>
-            <% if !answer.question.separator? %>
-              <% cleaned_answer_idx += 1 %>
+            <% if !response.question.separator? %>
+              <% cleaned_response_idx += 1 %>
             <% end %>
-            <% answer_idx += 1 %>
+            <% response_idx += 1 %>
           <% end %>
 
           <% if step_index + 1 == @preview_form.total_steps %>

data/app/views/decidim/templates/admin/questionnaire_templates/index.html.erb

@@ -9,7 +9,7 @@
     </h1>
   </div>
   <% if @templates.any? %>
-    <div class="table-scroll">
+    <div class="table-stacked">
       <table class="table-list questionnaire-templates">
         <thead>
           <tr>
@@ -17,28 +17,63 @@
             <th><%= t("questionnaire_template.fields.title", scope: "decidim.models") %></th>
             <th><%= t("questionnaire_template.fields.questions", scope: "decidim.models") %></th>
             <th><%= t("template.fields.created_at", scope: "decidim.models") %></th>
-            <th></th>
+            <th><%= t("decidim.admin.actions.actions") %></th>
           </tr>
         </thead>
         <tbody>
           <% @templates.each do |template| %>
             <tr data-questionnaire_template-id="<%= template.id %>">
-              <td><%= link_to translated_attribute(template.name), edit_questionnaire_template_path(template) %></td>
-              <td><%= link_to translated_attribute(template.templatable.title), edit_questionnaire_path(template) %></td>
-              <td><%= template.templatable.questions.count.to_i %></td>
-              <td><%= l template.created_at, format: :long %></td>
-              <td class="table-list__actions">
-                <% if allowed_to?(:update, :template, questionnaire_template: template) %>
-                  <%= icon_link_to "pencil-line", edit_questionnaire_template_path(template), t("actions.edit", scope: "decidim.admin"), class: "edit" %>
-                <% end %>
+              <td data-label="<%= t("template.name", scope: "decidim.models") %>">
+                <%= link_to translated_attribute(template.name), edit_questionnaire_template_path(template) %>
+              </td>
+              <td data-label="<%= t("questionnaire_template.fields.title", scope: "decidim.models") %>">
+                <%= link_to translated_attribute(template.templatable.title), edit_questionnaire_path(template) %>
+              </td>
+              <td data-label="<%= t("questionnaire_template.fields.questions", scope: "decidim.models") %>">
+                <%= template.templatable.questions.count.to_i %>
+              </td>
+              <td data-label="<%= t("template.fields.created_at", scope: "decidim.models") %>">
+                <%= l template.created_at, format: :long %>
+              </td>
+              <td data-label="<%= t("decidim.admin.actions.actions") %>" class="table-list__actions">
+                <button type="button" data-controller="dropdown" data-target="actions-template-<%= template.id %>" aria-label="<%= t("decidim.admin.actions.actions_label", resource: template.name) %>">
+                  <%= icon "more-fill", class: "text-secondary" %>
+                </button>
+
+                <div class="inline-block relative">
+                  <ul id="actions-template-<%= template.id %>" class="dropdown dropdown__action" aria-hidden="true">
+                    <% if allowed_to?(:update, :template, questionnaire_template: template) %>
+                      <li class="dropdown__item">
+                        <%= link_to edit_questionnaire_template_path(template), class: "dropdown__button edit" do %>
+                          <%= icon "pencil-line" %>
+                          <%= t("actions.edit", scope: "decidim.admin") %>
+                        <% end %>
+                      </li>
+
+                      <hr>
+                    <% end %>
+
+                    <% if allowed_to?(:copy, :template, questionnaire_template: template) %>
+                      <li class="dropdown__item">
+                        <%= link_to copy_questionnaire_template_path(template), method: :post, class: "dropdown__button" do %>
+                          <%= icon "file-copy-line" %>
+                          <%= t("actions.duplicate", scope: "decidim.admin") %>
+                        <% end %>
+                      </li>
 
-                <% if allowed_to?(:copy, :template, questionnaire_template: template) %>
-                  <%= icon_link_to "file-copy-line", copy_questionnaire_template_path(template), t("actions.duplicate", scope: "decidim.admin"), method: :post %>
-                <% end %>
+                      <hr>
+                    <% end %>
 
-                <% if allowed_to?(:destroy, :template, questionnaire_template: template) %>
-                  <%= icon_link_to "delete-bin-line", questionnaire_template_path(template), t("actions.destroy", scope: "decidim.admin"), method: :delete, data: { confirm: t(".confirm_delete") }, class: "action-icon--remove" %>
-                <% end %>
+                    <% if allowed_to?(:destroy, :template, questionnaire_template: template) %>
+                      <li class="dropdown__item">
+                        <%= link_to questionnaire_template_path(template), method: :delete, data: { confirm: t(".confirm_delete") }, class: "dropdown__button" do %>
+                          <%= icon "delete-bin-line" %>
+                          <%= t("actions.destroy", scope: "decidim.admin") %>
+                        <% end %>
+                      </li>
+                    <% end %>
+                  </ul>
+                </div>
               </td>
             </tr>
           <% end %>