@addev-be/ui 2.7.0 → 2.7.2

package/src/components/data/DataGrid/DataGridFilterMenu/hooks.tsx

@@ -1,81 +1,81 @@
-import {
-  DataGridColumnWithFilter,
-  DataGridContext,
-  DataGridFilter,
-} from '../types';
-import { FilterIcon, FilterSlashIcon } from '../../../../Icons';
-import { useCallback, useState } from 'react';
-
-import { Button } from '../../../forms/Button';
-import { FilterModalContent } from '../FilterModalContent';
-import { Modal } from '../../../layout/Modal';
-import { useDataGridContext } from '../hooks';
-
-export const useFilterModal = <R,>({
-  column,
-  context,
-  onClose,
-}: {
-  column: DataGridColumnWithFilter<R>;
-  context: DataGridContext<R>;
-  onClose?: () => void;
-}) => {
-  const [isVisible, setIsVisible] = useState(false);
-  const { filters = {}, setFilters } = useDataGridContext<R>(context);
-  const [currentFilter, setCurrentFilter] = useState<DataGridFilter>(
-    column.filter
-  );
-
-  const openModal = useCallback(() => {
-    setIsVisible(true);
-  }, []);
-  const closeModal = useCallback(() => {
-    setIsVisible(false);
-    onClose?.();
-  }, [onClose]);
-
-  const onClearClicked = useCallback(() => {
-    const newFilters = { ...filters };
-    delete newFilters[column.key];
-    setFilters(newFilters);
-    closeModal();
-  }, [closeModal, column.key, filters, setFilters]);
-
-  const onApplyClicked = useCallback(() => {
-    setFilters({ ...filters, [column.key]: currentFilter });
-    closeModal();
-  }, [closeModal, column.key, currentFilter, filters, setFilters]);
-
-  const onCancelClicked = useCallback(() => {
-    closeModal();
-  }, [closeModal]);
-
-  const modal = isVisible ? (
-    <Modal>
-      <Modal.Header>Filtrer "{column.name}"</Modal.Header>
-      <Modal.ContentWithIcon>
-        <FilterIcon fill="var(--color-primary-400)" />
-        <FilterModalContent
-          filter={currentFilter}
-          onFilterChanged={setCurrentFilter}
-        />
-      </Modal.ContentWithIcon>
-      <Modal.Buttons>
-        <Button $color="danger" icon={FilterSlashIcon} onClick={onClearClicked}>
-          Supprimer
-        </Button>
-        <Button
-          style={{ marginLeft: 'auto' }}
-          $color="primary"
-          icon={FilterIcon}
-          onClick={onApplyClicked}
-        >
-          Filtrer
-        </Button>
-        <Button onClick={onCancelClicked}>Annuler</Button>
-      </Modal.Buttons>
-    </Modal>
-  ) : null;
-
-  return { openModal, closeModal, modal };
-};
+import {
+  DataGridColumnWithFilter,
+  DataGridContext,
+  DataGridFilter,
+} from '../types';
+import { FilterIcon, FilterSlashIcon } from '../../../../Icons';
+import { useCallback, useState } from 'react';
+
+import { Button } from '../../../forms/Button';
+import { FilterModalContent } from '../FilterModalContent';
+import { Modal } from '../../../layout/Modal';
+import { useDataGridContext } from '../hooks';
+
+export const useFilterModal = <R,>({
+  column,
+  context,
+  onClose,
+}: {
+  column: DataGridColumnWithFilter<R>;
+  context: DataGridContext<R>;
+  onClose?: () => void;
+}) => {
+  const [isVisible, setIsVisible] = useState(false);
+  const { filters = {}, setFilters } = useDataGridContext<R>(context);
+  const [currentFilter, setCurrentFilter] = useState<DataGridFilter>(
+    column.filter
+  );
+
+  const openModal = useCallback(() => {
+    setIsVisible(true);
+  }, []);
+  const closeModal = useCallback(() => {
+    setIsVisible(false);
+    onClose?.();
+  }, [onClose]);
+
+  const onClearClicked = useCallback(() => {
+    const newFilters = { ...filters };
+    delete newFilters[column.key];
+    setFilters(newFilters);
+    closeModal();
+  }, [closeModal, column.key, filters, setFilters]);
+
+  const onApplyClicked = useCallback(() => {
+    setFilters({ ...filters, [column.key]: currentFilter });
+    closeModal();
+  }, [closeModal, column.key, currentFilter, filters, setFilters]);
+
+  const onCancelClicked = useCallback(() => {
+    closeModal();
+  }, [closeModal]);
+
+  const modal = isVisible ? (
+    <Modal>
+      <Modal.Header>Filtrer "{column.name}"</Modal.Header>
+      <Modal.ContentWithIcon>
+        <FilterIcon fill="var(--color-primary-400)" />
+        <FilterModalContent
+          filter={currentFilter}
+          onFilterChanged={setCurrentFilter}
+        />
+      </Modal.ContentWithIcon>
+      <Modal.Buttons>
+        <Button $color="danger" icon={FilterSlashIcon} onClick={onClearClicked}>
+          Supprimer
+        </Button>
+        <Button
+          style={{ marginLeft: 'auto' }}
+          $color="primary"
+          icon={FilterIcon}
+          onClick={onApplyClicked}
+        >
+          Filtrer
+        </Button>
+        <Button onClick={onCancelClicked}>Annuler</Button>
+      </Modal.Buttons>
+    </Modal>
+  ) : null;
+
+  return { openModal, closeModal, modal };
+};