Backport/scopes drag and drop

Gemfile.lock

@@ -301,14 +301,6 @@ GEM
       rack-test (>= 0.6.3)
       regexp_parser (>= 1.5, < 3.0)
       xpath (~> 3.2)
-    carrierwave (2.2.6)
-      activemodel (>= 5.0.0)
-      activesupport (>= 5.0.0)
-      addressable (~> 2.6)
-      image_processing (~> 1.1)
-      marcel (~> 1.0.0)
-      mini_mime (>= 0.1.3)
-      ssrf_filter (~> 1.0)
     cells (4.1.8)
       declarative-builder (~> 0.2.0)
       declarative-option (< 0.2.0)
@@ -409,23 +401,13 @@ GEM
       activemodel (>= 3.2)
       mime-types (>= 1.0)
     flamegraph (0.9.5)
-    fog-aws (3.21.0)
-      fog-core (~> 2.1)
-      fog-json (~> 1.1)
-      fog-xml (~> 0.1)
     fog-core (2.6.0)
       builder
       excon (~> 1.0)
       formatador (>= 0.2, < 2.0)
       mime-types
-    fog-json (1.2.0)
-      fog-core
-      multi_json (~> 1.10)
     fog-local (0.8.0)
       fog-core (>= 1.27, < 3.0)
-    fog-xml (0.1.4)
-      fog-core
-      nokogiri (>= 1.5.11, < 2.0.0)
     formatador (1.1.0)
     foundation_rails_helper (4.0.1)
       actionpack (>= 4.1, < 7.1)
@@ -532,7 +514,6 @@ GEM
     mini_mime (1.1.5)
     minitest (5.25.1)
     msgpack (1.7.5)
-    multi_json (1.15.0)
     multi_xml (0.7.1)
       bigdecimal (~> 3.1)
     net-http (0.5.0)
@@ -813,7 +794,6 @@ GEM
     spring-watcher-listen (2.1.0)
       listen (>= 2.7, < 4.0)
       spring (>= 4)
-    ssrf_filter (1.1.2)
     stackprof (0.2.26)
     stringio (3.1.2)
     temple (0.10.3)
@@ -892,7 +872,6 @@ DEPENDENCIES
   brakeman (~> 6.1)
   bullet
   byebug (~> 11.0)
-  carrierwave
   dalli
   decidim-accountability!
   decidim-admin!
@@ -914,7 +893,6 @@ DEPENDENCIES
   decidim-verifications!
   dotenv-rails (~> 2.7)
   flamegraph
-  fog-aws
   letter_opener_web (~> 2.0)
   listen (~> 3.1)
   memory_profiler

app/commands/admin/reorder_scopes.rb

@@ -0,0 +1,37 @@
+# frozen_string_literal: true
+
+module Admin
+  class ReorderScopes < Decidim::Command
+    def initialize(organization, scope, ids)
+      @organization = organization
+      @scope = scope
+      @ids = ids
+    end
+
+    def call
+      return broadcast(:invalid) if @ids.blank?
+
+      reorder_scopes
+      broadcast(:ok)
+    end
+
+    def collection
+      @collection ||= Decidim::Scope.where(id: @ids, organization: @organization)
+    end
+
+    def reorder_scopes
+      transaction do
+        set_new_weights
+      end
+    end
+
+    def set_new_weights
+      @ids.each do |id|
+        current_scope = collection.find { |block| block.id == id.to_i }
+        next if current_scope.blank?
+
+        current_scope.update!(weight: @ids.index(id) + 1)
+      end
+    end
+  end
+end

app/forms/decidim/user_interest_scope_form.rb

@@ -0,0 +1,25 @@
+# frozen_string_literal: true
+
+module Decidim
+  # The form object that handles the data behind updating a user's
+  # interests in their profile page.
+  class UserInterestScopeForm < Form
+    mimic :scope
+
+    attribute :name, JsonbAttributes
+    attribute :checked, Boolean
+    attribute :children, [UserInterestScopeForm]
+
+    def map_model(model_hash)
+      scope = model_hash[:scope]
+      user = model_hash[:user]
+
+      self.id = scope.id
+      self.name = scope.name
+      self.checked = user.interested_scopes_ids.include?(scope.id)
+      self.children = scope.children.sort_by(&:weight).map do |children_scope|
+        UserInterestScopeForm.from_model(scope: children_scope, user:)
+      end
+    end
+  end
+end

app/forms/decidim/user_interests_form.rb

@@ -0,0 +1,23 @@
+# frozen_string_literal: true
+
+module Decidim
+  # The form object that handles the data behind updating a user's
+  # interests in their profile page.
+  class UserInterestsForm < Form
+    mimic :user
+
+    attribute :scopes, [UserInterestScopeForm]
+
+    def newsletter_notifications_at
+      return unless newsletter_notifications
+
+      Time.current
+    end
+
+    def map_model(user)
+      self.scopes = user.organization.scopes.top_level.sort_by(&:weight).map do |scope|
+        UserInterestScopeForm.from_model(scope:, user:)
+      end
+    end
+  end
+end

app/packs/entrypoints/application.js

@@ -0,0 +1,21 @@
+/* eslint no-console:0 */
+// This file is automatically compiled by Webpack, along with any other files
+// present in this directory. You're encouraged to place your actual application logic in
+// a relevant structure within app/packs and only use these pack files to reference
+// that code so it'll be compiled.
+//
+// To reference this file, add <%= javascript_pack_tag 'application' %> to the appropriate
+// layout file, like app/views/layouts/application.html.erb
+
+// Uncomment to copy all static images under ../images to the output folder and reference
+// them with the image_pack_tag helper in views (e.g <%= image_pack_tag 'rails.png' %>)
+// or the `imagePath` JavaScript helper below.
+//
+// const images = require.context('../images', true)
+// const imagePath = (name) => images(name, true)
+
+// Activate Active Storage
+// import * as ActiveStorage from "@rails/activestorage"
+// ActiveStorage.start()
+
+import "src/decidim/admin/reorder_scopes";

app/packs/entrypoints/decidim_custom_scopes.scss

@@ -0,0 +1 @@
+@import "stylesheets/decidim/scopes/scopes-custom.scss";

app/packs/src/decidim/admin/reorder_scopes.js

@@ -0,0 +1,19 @@
+$(document).ready(() => {
+    let activeBlocks = Array.prototype.slice.call(document.querySelectorAll(".js-list-scopes li"));
+    const defaultOrder = activeBlocks.map(block => block.dataset.scopeId);
+
+    document.addEventListener("dragend", () => {
+        activeBlocks = Array.prototype.slice.call(document.querySelectorAll(".js-list-scopes li"));
+        let activeBlocksManifestName = activeBlocks.map(block => block.dataset.scopeId);
+        let sortUrl = document.querySelector(".js-list-scopes").dataset.sortUrl;
+
+        if (JSON.stringify(activeBlocksManifestName) === JSON.stringify(defaultOrder)) { return; }
+
+        $.ajax({
+            method: "PUT",
+            url: sortUrl,
+            contentType: "application/json",
+            data: JSON.stringify({ manifests: activeBlocksManifestName })
+        });
+    })
+});

app/packs/stylesheets/decidim/scopes/_scopes-custom.scss

@@ -0,0 +1,32 @@
+.draggable-list .draggable-content {
+  cursor: move;
+  justify-content: space-between;
+  align-items: center;
+  font-weight: 600;
+  border: none !important;
+  background-color: transparent !important;
+  padding: 0.5rem 1rem;
+}
+
+.custom-text {
+  color: black;
+}
+
+.custom-list {
+  border: 1px solid lightgray !important;
+  margin: 0.4rem
+}
+.draggable-content, .draggable-content__title, .draggable-content__icons {
+  display:flex;
+  align-items: center;
+}
+.draggable-content__title > a {
+  margin-left: 0.5rem;
+}
+.draggable-content__icons {
+  justify-content: space-between;
+  width: 8%;
+}
+.action-icon--remove {
+  fill: #e66a5d;
+}

app/views/decidim/admin/scopes/index.html.erb

@@ -0,0 +1,65 @@
+<% add_decidim_page_title(t("decidim.admin.scopes.titles.scopes")) %>
+<div class="grid-container full">
+  <div class="grid-x grid-margin-x card-grid">
+    <div class="cell">
+      <div class="card">
+        <div class="card-divider">
+          <h2 class="card-title">
+            <% if parent_scope %>
+              <%= scope_breadcrumbs(parent_scope).join(" - ").html_safe %> <%= link_to t("actions.add", scope: "decidim.admin"), new_scope_scope_path(parent_scope), class: "button tiny button--title" if allowed_to? :create, :scope %><%= link_to t("actions.edit", scope: "decidim.admin"), edit_scope_path(parent_scope), class: "button tiny button--title" if allowed_to? :edit, :scope, scope: parent_scope %>
+            <% else %>
+              <%= t "decidim.admin.scopes.titles.scopes" %> <%= link_to t("actions.add", scope: "decidim.admin"), new_scope_path, class: "button tiny button--title" if allowed_to? :create, :scope %>
+            <% end %>
+          </h2>
+        </div>
+        <div class="card-section">
+          <% if @scopes.any? %>
+            <div class="table-scroll">
+              <table class="table-list">
+                <thead>
+                <tr>
+                  <th><%= t("models.scope.fields.name", scope: "decidim.admin") %></th>
+                  <th><%= t("models.scope.fields.scope_type", scope: "decidim.admin") %></th>
+                  <th></th>
+                </tr>
+                </thead>
+              </table>
+              <table>
+                <tbody>
+                <ul class="draggable-list js-connect js-list-scopes" data-sort-url="<%= "/admin/scopes/refresh_scopes" %>">
+                  <% @scopes.each do |scope| %>
+                    <li draggable="true" data-scope-id="<%= scope.id %>" class="custom-list">
+                      <div class="draggable-content">
+                        <div class="draggable-content__title">
+                          <%= icon "drag-move-2-fill", class: "icon--small", role: "img", "aria-hidden": true %>
+                          <%= link_to translated_attribute(scope.name), scope_scopes_path(scope), class:"custom-text" %>
+                        </div>
+                        <div class="draggable-content__icons">
+                          <%= icon_link_to "zoom-in-line", scope_scopes_path(scope), t("actions.browse", scope: "decidim.admin"), class: "action-icon--browse", method: :get, data: {} %>
+
+                          <% if allowed_to? :update, :scope, scope: scope %>
+                            <%= icon_link_to "pencil-line", [:edit, scope], t("actions.edit", scope: "decidim.admin"), class: "action-icon--edit", method: :get, data: {} %>
+                          <% end %>
+
+                          <% if allowed_to? :destroy, :scope, scope: scope %>
+                            <%= icon_link_to "close-circle-line", scope, t("actions.destroy", scope: "decidim.admin"), class: "action-icon--remove", method: :delete, data: { confirm: t("actions.confirm_destroy", scope: "decidim.admin") } %>
+                          <% end %>
+                        </div>
+                      </div>
+                    </li>
+                  <% end %>
+                </ul>
+                </tbody>
+              </table>
+            </div>
+          <% else %>
+            <p><%= t("decidim.admin.scopes.no_scopes") %></p>
+          <% end %>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<%= append_stylesheet_pack_tag "decidim_custom_scopes", media: "all" %>
+<%= append_javascript_pack_tag 'application' %>

config/application.rb

@@ -26,5 +26,11 @@ class Application < Rails::Application
     #
     # config.time_zone = "Central Time (US & Canada)"
     # config.eager_load_paths << Rails.root.join("extras")
+    config.after_initialize do
+      # extends
+      require "extends/controllers/decidim/admin/scopes_controller_extends"
+      require "extends/controllers/decidim/scopes_controller_extends"
+      require "extends/helpers/decidim/check_boxes_tree_helper_extends"
+    end
   end
 end