From 4e270c99947d77e713694eb2c0fbc5841e97d68b Mon Sep 17 00:00:00 2001
From: Maicol Battistini <maicolbattistini@live.it>
Date: Tue, 23 Nov 2021 21:24:29 +0100
Subject: [PATCH] =?UTF-8?q?feat:=20=E2=9C=A8=20Cambia=20stato=20alla=20che?=
 =?UTF-8?q?ckbox=20dell'header=20quando=20cambi=20stato=20a=20una=20checkb?=
 =?UTF-8?q?ox=20di=20una=20riga?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../js/Components/DataTable/TableCell.jsx     | 29 +++++++++++++++++++
 1 file changed, 29 insertions(+)

diff --git a/resources/js/Components/DataTable/TableCell.jsx b/resources/js/Components/DataTable/TableCell.jsx
index f2363bdc3..0352410bc 100644
--- a/resources/js/Components/DataTable/TableCell.jsx
+++ b/resources/js/Components/DataTable/TableCell.jsx
@@ -1,3 +1,6 @@
+import {type Cash} from 'cash-dom/dist/cash';
+import {inRange} from 'lodash-es';
+
 import Component from '../Component.jsx';
 
 /**
@@ -16,4 +19,30 @@ export default class TableCell extends Component {
 
     return <td {...this.attrs.all()}>{vnode.children}</td>;
   }
+
+  oncreate(vnode) {
+    super.oncreate(vnode);
+
+    const checkboxes = (): Cash => $(this.element)
+      .closest('.mdc-data-table')
+      .find('tbody tr[checkable] mwc-checkbox');
+
+    const cell: Cash = $(this.element);
+    cell.children('mwc-checkbox').on('change', (event) => {
+      const row = cell.parent();
+      row.toggleClass('mdc-data-table__row--selected');
+
+      const headerCheckbox = cell.closest('.mdc-data-table').find('thead th mwc-checkbox');
+      const checks = checkboxes();
+      const checked = checks.filter('[checked]');
+
+      if (inRange(checked.length, 1, checks.length)) {
+        headerCheckbox.prop('indeterminate', true);
+        headerCheckbox.prop('checked', false);
+      } else {
+        headerCheckbox.prop('checked', checks.length === checked.length);
+        headerCheckbox.prop('indeterminate', false);
+      }
+    });
+  }
 }