easy-admin-rails 0.2.4 → 0.2.5

data/app/assets/builds/easy_admin.css

@@ -5757,6 +5757,11 @@ input:checked + .toggle-switch .toggle-slider:before {
   background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));
 }
 
+.hover\:bg-gray-300:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1));
+}
+
 .hover\:bg-gray-400:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1));

data/app/components/easy_admin/permissions/user_role_assignment_component.rb

@@ -101,16 +101,35 @@ module EasyAdmin
       end
 
       def render_resource_permission_group(resource)
-        div(class: "border border-gray-200 bg-white rounded-lg p-4") do
-          div(class: "flex items-center justify-between mb-4") do
-            div(class: "flex items-center") do
-              h4(class: "text-md font-medium text-gray-900 capitalize") { resource.humanize }
-            end
-            
-            div(class: "flex items-center space-x-2") do
-              span(class: "inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-gray-100 text-gray-700") do
-                "4 permissions"
+        div(
+          class: "border border-gray-200 bg-white rounded-lg",
+          data: { 
+            controller: "collapsible-filters",
+            "collapsible-filters-expanded-value": "false",  # Collapsed by default
+            "collapsible-filters-persist-state-value": "false"  # Don't save/load state
+          }
+        ) do
+          # Collapsible header
+          div(
+            class: "px-4 py-3 border-b border-gray-200 cursor-pointer hover:bg-gray-50 transition-colors duration-150",
+            data: { action: "click->collapsible-filters#toggle" }
+          ) do
+            div(class: "flex items-center justify-between") do
+              div(class: "flex items-center space-x-3") do
+                # Collapse/Expand icon
+                div(data: { collapsible_filters_target: "icon" }) do
+                  unsafe_raw '<svg class="w-5 h-5 text-gray-400 transform transition-transform duration-200" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path>
+                  </svg>'
+                end
+                
+                h4(class: "text-md font-medium text-gray-900 capitalize") { resource.humanize }
+                
+                span(class: "inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-gray-100 text-gray-700") do
+                  "4 permissions"
+                end
               end
+              
               # Toggle all button for this resource
               button(
                 type: "button",
@@ -125,13 +144,21 @@ module EasyAdmin
             end
           end
 
-          # Permissions grid with old card style (2 per row)
-          div(class: "grid grid-cols-1 md:grid-cols-2 gap-3") do
-            %w[read create update delete].each do |action|
-              permission_name = "#{resource}:#{action}"
-              is_granted = permission_granted?(permission_name)
-              
-              render_permission_toggle_card(permission_name, action, is_granted)
+          # Collapsible content
+          div(
+            class: "transition-all duration-300 ease-in-out overflow-hidden",
+            data: { collapsible_filters_target: "content" }
+          ) do
+            div(class: "p-4") do
+              # Permissions grid with old card style (2 per row)
+              div(class: "grid grid-cols-1 md:grid-cols-2 gap-3") do
+                %w[read create update delete].each do |action|
+                  permission_name = "#{resource}:#{action}"
+                  is_granted = permission_granted?(permission_name)
+                  
+                  render_permission_toggle_card(permission_name, action, is_granted)
+                end
+              end
             end
           end
         end

data/app/javascript/easy_admin/controllers/collapsible_filters_controller.js

@@ -4,12 +4,15 @@ import { Controller } from "@hotwired/stimulus"
 export default class extends Controller {
   static targets = ["content", "icon"]
   static values = { 
-    expanded: { type: Boolean, default: true }
+    expanded: { type: Boolean, default: true },
+    persistState: { type: Boolean, default: true }
   }
 
   connect() {
-    // Load saved state
-    this.loadState()
+    // Load saved state only if persistence is enabled
+    if (this.persistStateValue) {
+      this.loadState()
+    }
     
     // Set initial state
     if (this.expandedValue) {
@@ -50,8 +53,10 @@ export default class extends Controller {
     // Update icon rotation
     this.updateIconRotation()
     
-    // Save state
-    this.saveState(true)
+    // Save state only if persistence is enabled
+    if (this.persistStateValue) {
+      this.saveState(true)
+    }
   }
 
   collapse(animate = true) {
@@ -78,8 +83,10 @@ export default class extends Controller {
     // Update icon rotation
     this.updateIconRotation()
     
-    // Save state
-    this.saveState(false)
+    // Save state only if persistence is enabled
+    if (this.persistStateValue) {
+      this.saveState(false)
+    }
   }
 
   saveState(expanded) {

data/app/javascript/easy_admin/controllers/permission_toggle_controller.js

@@ -7,31 +7,7 @@ export default class extends Controller {
   }
 
   connect() {
-    console.log("🎯 PermissionToggleController connected")
-    console.log("🎯 User ID:", this.userIdValue)
-    
-    // Debug: Log all permission cards found
-    const cards = this.permissionCardTargets
-    console.log("🎯 Found", cards.length, "permission cards")
-    
-    cards.forEach((card, index) => {
-      console.log(`🎯 Card ${index}:`, {
-        permission: card.dataset.permissionName,
-        granted: card.dataset.granted,
-        resourceType: card.dataset.resourceType
-      })
-    })
-    
-    // Debug: Log all hidden inputs found
     const hiddenInputs = this.element.querySelectorAll('input[type="hidden"][data-permission-toggle-target="hiddenInput"]')
-    console.log("🎯 Found", hiddenInputs.length, "hidden inputs")
-    
-    hiddenInputs.forEach((input, index) => {
-      console.log(`🎯 Hidden input ${index}:`, {
-        name: input.name,
-        value: input.value
-      })
-    })
   }
 
   togglePermission(event) {
@@ -42,16 +18,8 @@ export default class extends Controller {
     const currentlyGranted = card.dataset.granted === "true"
     const newGrantedState = !currentlyGranted
 
-    console.log("🎯 Toggling permission:", {
-      permission: permissionName,
-      wasGranted: currentlyGranted,
-      nowGranted: newGrantedState
-    })
-
-    // Update the card UI immediately
     this.updateCardUI(card, newGrantedState)
-    
-    // Update the hidden input field for form submission
+
     this.updateHiddenInput(card, newGrantedState)
     
     // Show notification for feedback
@@ -63,6 +31,7 @@ export default class extends Controller {
 
   toggleAllForResource(event) {
     event.preventDefault()
+    event.stopPropagation() // Prevent triggering parent collapsible toggle
     
     const resourceType = event.currentTarget.dataset.resourceType
     const resourceCards = this.permissionCardTargets.filter(card => 

data/lib/easy_admin/version.rb

@@ -1,3 +1,3 @@
 module EasyAdmin
-  VERSION = "0.2.4"
+  VERSION = "0.2.5"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: easy-admin-rails
 version: !ruby/object:Gem::Version
-  version: 0.2.4
+  version: 0.2.5
 platform: ruby
 authors:
 - Slaurmagan