Improve UI for home page

app/controllers/concerns/decidim/term_customizer/admin/filterable.rb

@@ -0,0 +1,31 @@
+# frozen_string_literal: true
+
+require "active_support/concern"
+
+module Decidim
+  module TermCustomizer
+    module Admin
+      module Filterable
+        extend ActiveSupport::Concern
+
+        included do
+          include Decidim::Admin::Filterable
+
+          private
+
+          def base_query
+            Decidim::TermCustomizer::TranslationSet.joins(:constraints).where(
+              decidim_term_customizer_constraints: {
+                decidim_organization_id: current_organization.id
+              }
+            ).distinct
+          end
+
+          def search_field_predicate
+            :search_text_cont
+          end
+        end
+      end
+    end
+  end
+end

app/controllers/decidim/term_customizer/admin/translation_sets_controller.rb

@@ -4,13 +4,14 @@ module Decidim
   module TermCustomizer
     module Admin
       class TranslationSetsController < TermCustomizer::Admin::ApplicationController
+        include Decidim::TermCustomizer::Admin::Filterable
         include TranslatableAttributes
 
         helper_method :collection, :subject_manifests, :blank_constraint
 
         def index
           enforce_permission_to :read, :translation_set
-          @sets = collection
+          @sets = filtered_collection
         end
 
         def new

app/models/decidim/term_customizer/translation_set.rb

@@ -3,6 +3,8 @@
 module Decidim
   module TermCustomizer
     class TranslationSet < TermCustomizer::ApplicationRecord
+      include Decidim::FilterableResource
+
       self.table_name = "decidim_term_customizer_translation_sets"
 
       has_many :translations,
@@ -12,6 +14,18 @@ class TranslationSet < TermCustomizer::ApplicationRecord
       has_many :constraints,
                class_name: "Decidim::TermCustomizer::Constraint",
                dependent: :destroy
+
+      # Create i18n ransackers for :name and :description.
+      # Create the :search_text ransacker alias for searching from both of these.
+      ransacker_i18n_multi :search_text, [:name]
+
+      def self.ransackable_attributes(_auth_object = nil)
+        %w(search_text)
+      end
+
+      def self.ransackable_associations(_auth_object = nil)
+        []
+      end
     end
   end
 end

app/views/decidim/term_customizer/admin/translation_sets/_form.html.erb

@@ -9,6 +9,7 @@
     <div class="card-section">
       <div class="row column">
         <%= form.translated :text_field, :name, autofocus: true %>
+        <span class="help-text"><%= t(".name_help_text") %></span>
       </div>
     </div>
   </div>

app/views/decidim/term_customizer/admin/translation_sets/_search.html.erb

@@ -0,0 +1,22 @@
+<div class="filters__section">
+<div class="fcell search">
+  <%= search_form_for(query, url: url_for) do |form| %>
+    <%= applied_filters_hidden_field_tags %>
+    <div class="input-group">
+      <%= form.search_field(
+            search_field_predicate,
+            class: "input-group-field",
+            label: false,
+            placeholder: t(search_field_predicate,
+                            collection: collection_name,
+                            scope: "decidim.admin.filters.search_placeholder")
+        ) %>
+        <div class="input-group-button">
+          <button type="submit" class="text-secondary" aria-label="<%= t("decidim.search.term_input_placeholder") %>">
+            <%= icon "search-line", class: "fill-secondary w-4 h-4" %>
+          </button>
+        </div>
+    </div>
+  <% end %>
+</div>
+</div>

app/views/decidim/term_customizer/admin/translation_sets/edit.html.erb

@@ -11,6 +11,10 @@
           <%= t("actions.help", scope: "decidim.term_customizer.admin") %>
         </button>
       </div>
+      <%= link_to translation_sets_path, class: "button button__sm button__transparent-secondary" do %>
+        <%= icon "arrow-go-back-line" %>
+        <%= t(".back") %>
+      <% end %>
     </h1>
   </div>
   <div class="item__edit item__edit-1col">

app/views/decidim/term_customizer/admin/translation_sets/index.html.erb

@@ -15,12 +15,18 @@
     </h1>
   </div>
 
+  <div class="card">
+    <%= render "search" %>
+  </div>
+
   <div class="table-scroll mt-16">
     <% if @sets.count > 0 %>
       <table class="table-list">
         <thead>
           <tr>
             <th><%= t("models.translation_sets.fields.name", scope: "decidim.term_customizer.admin") %></th>
+            <th><%= t("models.translation_sets.fields.keys", scope: "decidim.term_customizer.admin") %></th>
+            <th><%= t("models.translation_sets.fields.total", scope: "decidim.term_customizer.admin") %>
             <th class="actions"><%= t("actions.title", scope: "decidim.term_customizer.admin") %></th>
           </tr>
         </thead>
@@ -34,6 +40,11 @@
                     <%= translated_attribute(set.name) %>
                   <% end %>
                 </td>
+                <td>
+                  <% preview_keys = set.translations.limit(4).pluck(:key) %>
+                  <%= preview_keys.first(3).join(", ") %><%= "..." if preview_keys.size > 3 %>
+                </td>
+                <td><%= set.translations.count %></td>
                 <td class="table-list__actions large-3">
                   <% if allowed_to? :read, :translation %>
                     <%= icon_link_to "eye-line", translation_set_translations_path(set), t("actions.view", scope: "decidim.term_customizer.admin"), class: "action-icon--show" %>

app/views/decidim/term_customizer/admin/translation_sets/new.html.erb

@@ -11,6 +11,10 @@
           <%= t("actions.help", scope: "decidim.term_customizer.admin") %>
         </button>
       </div>
+      <%= link_to translation_sets_path, class: "button button__sm button__transparent-secondary" do %>
+        <%= icon "arrow-go-back-line" %>
+        <%= t(".back") %>
+      <% end %>
     </h1>
   </div>
   <div class="item__edit item__edit-1col">

app/views/decidim/term_customizer/admin/translations/index.html.erb

@@ -10,6 +10,7 @@
       </div>
 
       <div class="flex items-center gap-x-4">
+
         <%= render partial: "decidim/term_customizer/admin/translations/bulk_actions/dropdown" %>
         <% if allowed_to? :create, :translation %>
           <%= link_to t("actions.add_multiple_translations", scope: "decidim.term_customizer.admin"), translation_set_add_translations_path(set), class: "button button__sm button__secondary" %>
@@ -21,6 +22,9 @@
         <% if set.translations.count > 0 && allowed_to?(:export, :translation_set, translation_set: set) %>
           <%= render partial: "export_dropdown" %>
         <% end %>
+        <% if allowed_to? :update, :organization %>
+          <%= link_to t("actions.clear_cache", scope: "decidim.term_customizer.admin"), clear_caches_path, method: :delete, class: "imports-example tiny button button__sm button__secondary button--simple mr-2", data: { confirm: t("actions.confirm_destroy", scope: "decidim.admin") } %>
+        <% end %>
       </div>
 
       <%= render partial: "decidim/term_customizer/admin/translations/bulk_actions/destroy" %>

config/locales/en.yml

@@ -20,18 +20,22 @@ en:
             file:
               invalid_mime_type: 'Invalid file type. Accepted formats are: %{valid_mime_types}'
   decidim:
+    admin:
+      filters:
+        search_placeholder:
+          search_text_cont: Search translation sets by name
     term_customizer:
       admin:
         actions:
           add_multiple_translations: Add multiple
           back: Back
           cancel: Cancel
-          clear_cache: Clear cache
+          clear_cache: Apply translations
           confirm_duplicate: Are you sure you want to duplicate this set?
           duplicate: Duplicate
           help: Help
           import: Import
-          new_translation: New translation
+          new_translation: Manual translation
           new_translation_set: New translation set
           title: Actions
           view: View
@@ -55,6 +59,8 @@ en:
           translation_sets:
             fields:
               name: Name
+              keys: Keys
+              total: Total translations
           translations:
             fields:
               key: Translation key
@@ -80,6 +86,7 @@ en:
           edit:
             save: Save
             title: Translation set
+            back: Back
           form:
             add_constraint: Add constraint
             constraint_help_html: <p>Constraints are specific rules that allow you
@@ -101,6 +108,7 @@ en:
               a button with the term "Add" differently for different participatory
               processes, you can create separate translation sets for both processes
               and apply the set to those processes using the constraints.</p>
+            name_help_text: Enter a descriptive title for the translation set.
             help_title: What is a translation set?
             title: Translation set
           index:
@@ -111,6 +119,7 @@ en:
           new:
             create: Create
             title: Translation sets
+            back: Back
           update:
             error: Error updating translation set.
             success: Translation set successfully updated.