fix: grid view item selector (#3613)

* fix: grid view item selector * test
avo-hq · Jan 27, 2025 · 026da08 · 026da08
1 parent b12b3f9
commit 026da08
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 4 deletions.
diff --git a/app/javascript/js/controllers/item_selector_controller.js b/app/javascript/js/controllers/item_selector_controller.js
@@ -44,15 +44,19 @@ export default class extends Controller {
 
     ids.push(this.resourceId)
 
-    // Mark the row as selected
-    this.element.closest('tr').classList.add('selected-row')
+    // Mark the row as selected if on table view
+    if (this.element.closest('tr')) {
+      this.element.closest('tr').classList.add('selected-row')
+    }
 
     this.currentIds = ids
   }
 
   removeFromSelected() {
-    // Un-mark the row as selected
-    this.element.closest('tr').classList.remove('selected-row')
+    // Un-mark the row as selected if on table view
+    if (this.element.closest('tr')) {
+      this.element.closest('tr').classList.remove('selected-row')
+    }
 
     this.currentIds = this.currentIds.filter(
       (item) => item.toString() !== this.resourceId,

diff --git a/spec/system/avo/actions_spec.rb b/spec/system/avo/actions_spec.rb
@@ -408,6 +408,30 @@
     end
   end
 
+  describe "select items on grid view" do
+    let!(:post) { create :post }
+
+    it "enables and disables the actions" do
+      visit avo.resources_posts_path
+
+      # Find disabled action
+      click_on "Actions"
+      expect(page.find("a", text: "Toggle post published")["data-disabled"]).to eq "true"
+
+      # Hover grid element, select post, and verify that action is not disabled anymore
+      find("[data-component-name=\"avo/index/grid_item_component\"][data-resource-name=\"posts\"][data-record-id=\"#{post.id}\"]").hover
+      find('input[type="checkbox"][data-action="input->item-selector#toggle input->item-select-all#selectRow"]', visible: false).click
+      click_on "Actions"
+      expect(page.find("a", text: "Toggle post published")["data-disabled"]).to eq "false"
+
+      # Hover grid element, "unselect" post, and verify that action is disabled again
+      find("[data-component-name=\"avo/index/grid_item_component\"][data-resource-name=\"posts\"][data-record-id=\"#{post.id}\"]").hover
+      find('input[type="checkbox"][data-action="input->item-selector#toggle input->item-select-all#selectRow"]', visible: false).click
+      click_on "Actions"
+      expect(page.find("a", text: "Toggle post published")["data-disabled"]).to eq "true"
+    end
+  end
+
   #   let!(:roles) { { admin: false, manager: false, writer: false } }
   #   let!(:user) { create :user, active: true, roles: roles }