@mailstep/design-system 0.7.11-beta.0 → 0.7.11-beta.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mailstep/design-system",
-  "version": "0.7.11-beta.0",
+  "version": "0.7.11-beta.2",
   "license": "ISC",
   "type": "module",
   "main": "./ui/index.js",

package/ui/Blocks/CommonGrid/CommonGridContainer.js

@@ -39,7 +39,7 @@ import { getFilters } from './utils';
 import { useGridAutoHeight } from './hooks/useGridAutoHeight';
 var CommonGridContainer = function (props) {
     var _a;
-    var _b = props.optimizeFilters, optimizeFilters = _b === void 0 ? false : _b, extraControlButtons = props.extraControlButtons, onBatchAction = props.onBatchAction, processCheckedValues = props.processCheckedValues, processCheckedValuesTitle = props.processCheckedValuesTitle, hideControlButtons = props.hideControlButtons, quickFilter = props.quickFilter, floatingButtonProps = props.floatingButtonProps, queryRowsParam = props.queryRowsParam, customPaginationHandler = props.customPaginationHandler, _c = props.autoHeight, autoHeight = _c === void 0 ? true : _c, gridName = props.gridName, _d = props.withPresets, withPresets = _d === void 0 ? true : _d, getRowsPerPage = props.getRowsPerPage, onPresetsChange = props.onPresetsChange, passDownProps = __rest(props, ["optimizeFilters", "extraControlButtons", "onBatchAction", "processCheckedValues", "processCheckedValuesTitle", "hideControlButtons", "quickFilter", "floatingButtonProps", "queryRowsParam", "customPaginationHandler", "autoHeight", "gridName", "withPresets", "getRowsPerPage", "onPresetsChange"]);
+    var _b = props.optimizeFilters, optimizeFilters = _b === void 0 ? false : _b, extraControlButtons = props.extraControlButtons, onBatchAction = props.onBatchAction, processCheckedValues = props.processCheckedValues, processCheckedValuesTitle = props.processCheckedValuesTitle, hideControlButtons = props.hideControlButtons, quickFilter = props.quickFilter, floatingButtonProps = props.floatingButtonProps, queryRowsParam = props.queryRowsParam, customPaginationHandler = props.customPaginationHandler, _c = props.autoHeight, autoHeight = _c === void 0 ? true : _c, gridName = props.gridName, _d = props.withPresets, withPresets = _d === void 0 ? true : _d, getRowsPerPage = props.getRowsPerPage, passDownProps = __rest(props, ["optimizeFilters", "extraControlButtons", "onBatchAction", "processCheckedValues", "processCheckedValuesTitle", "hideControlButtons", "quickFilter", "floatingButtonProps", "queryRowsParam", "customPaginationHandler", "autoHeight", "gridName", "withPresets", "getRowsPerPage"]);
     var gridActions = passDownProps.gridActions, gridSelectors = passDownProps.gridSelectors, rowsData = passDownProps.rowsData, actionColumnDefinition = passDownProps.actionColumnDefinition;
     var _e = useState(false), displayManageColumnButton = _e[0], setDisplayManageColumnButton = _e[1];
     var _f = useGetGridHeight(), gridHeight = _f.gridHeight, gridRef = _f.gridRef, paginationRef = _f.paginationRef;
@@ -55,6 +55,6 @@ var CommonGridContainer = function (props) {
         onClose: onClose
     }), columnsConfigValues = _h.columnsConfigValues, setColumnsConfigOptions = _h.setColumnsConfigOptions, onConfirmForm = _h.onConfirmForm, resetColumnConfig = _h.resetColumnConfig, handleDragEnd = _h.handleDragEnd, onCloseForm = _h.onCloseForm, displayColumnsDefinitions = _h.displayColumnsDefinitions, manageColumnsFormDefinitions = _h.manageColumnsFormDefinitions;
     var _j = usePresetState(), isPresetsModalOpen = _j.isPresetsModalOpen, onClosePresetsModal = _j.onClosePresetsModal, onOpenPresetsModal = _j.onOpenPresetsModal, setSelectedPresetName = _j.setSelectedPresetName, selectedPresetName = _j.selectedPresetName;
-    return (_jsxs(_Fragment, { children: [_jsxs(ContentContainer, { children: [_jsxs(CommonGridWrap, { children: [_jsx(HidePrint, { children: _jsx(StyledButtonStrip, { className: "buttonsStrip", children: _jsx(ControlButtons, { hideControlButtons: hideControlButtons, extraControlButtons: extraControlButtons, gridActions: gridActions, gridSelectors: gridSelectors, quickFilter: quickFilter, displayColumnsDefinitions: displayColumnsDefinitions, filters: filters, setDisplayManageColumnButton: setDisplayManageColumnButton, displayManageColumnButton: displayManageColumnButton, openManageColumnForm: openManageColumnForm, onOpenPresetsModal: onOpenPresetsModal, selectedPresetName: selectedPresetName, withPresets: withPresets, gridName: gridName }) }) }), _jsx(CommonGridWithStyles, __assign({}, passDownProps, modifiedPassDownProps, { filters: filters, gridRef: gridRef, height: gridHeight, floatingButtonProps: floatingButtonProps, handleDragEnd: handleDragEnd(false), displayColumnsDefinitions: displayColumnsDefinitions, hasColouredRows: true }))] }), _jsx(HidePrint, { children: _jsxs(BottomWrapper, { ref: paginationRef, isFixed: !!gridHeight, children: [(processCheckedValues || !!((_a = actionColumnDefinition === null || actionColumnDefinition === void 0 ? void 0 : actionColumnDefinition.actionOptions) === null || _a === void 0 ? void 0 : _a.length)) && (_jsx(ActionHead, { rowsData: rowsData, onBatchAction: onBatchAction, gridActions: gridActions, gridSelectors: gridSelectors, actionColumn: actionColumnDefinition, processCheckedValues: processCheckedValues, processCheckedValuesTitle: processCheckedValuesTitle })), _jsxs(x.div, { display: "flex", justifyContent: "center", alignItems: "center", className: "paginatorWrapper", w: "100%", h: window.innerWidth > 1204 ? '60px' : '32px', children: [_jsx(Pagination, { page: gridSelectors === null || gridSelectors === void 0 ? void 0 : gridSelectors.page, itemCount: passDownProps === null || passDownProps === void 0 ? void 0 : passDownProps.totalRowsCount, itemPerPage: (gridSelectors === null || gridSelectors === void 0 ? void 0 : gridSelectors.rowsPerPage) || 10, onPageChange: gridActions === null || gridActions === void 0 ? void 0 : gridActions.setPage, customPaginationHandler: customPaginationHandler, radius: window.innerWidth < 768 ? 3 : 5, rate: window.innerWidth < 768 ? 1 : 4 }), _jsx(TablePagination, { gridActions: gridActions, gridSelectors: gridSelectors, customPaginationHandler: customPaginationHandler, getRowsPerPage: getRowsPerPage, gridHeight: gridHeight })] })] }) })] }), _jsx(GridModals, { manageColumnFormVisible: manageColumnFormVisible, onCloseForm: onCloseForm, resetColumnConfig: resetColumnConfig, onConfirmForm: onConfirmForm, manageColumnsFormDefinitions: manageColumnsFormDefinitions, columnsConfigValues: columnsConfigValues, setColumnsConfigOptions: setColumnsConfigOptions, handleDragEnd: handleDragEnd(true), gridName: gridName, gridActions: gridActions, gridSelectors: gridSelectors, onClosePresetsModal: onClosePresetsModal, isPresetsModalOpen: isPresetsModalOpen, selectedPresetName: selectedPresetName, setSelectedPresetName: setSelectedPresetName, onPresetsChange: onPresetsChange })] }));
+    return (_jsxs(_Fragment, { children: [_jsxs(ContentContainer, { children: [_jsxs(CommonGridWrap, { children: [_jsx(HidePrint, { children: _jsx(StyledButtonStrip, { className: "buttonsStrip", children: _jsx(ControlButtons, { hideControlButtons: hideControlButtons, extraControlButtons: extraControlButtons, gridActions: gridActions, gridSelectors: gridSelectors, quickFilter: quickFilter, displayColumnsDefinitions: displayColumnsDefinitions, filters: filters, setDisplayManageColumnButton: setDisplayManageColumnButton, displayManageColumnButton: displayManageColumnButton, openManageColumnForm: openManageColumnForm, onOpenPresetsModal: onOpenPresetsModal, selectedPresetName: selectedPresetName, withPresets: withPresets, gridName: gridName }) }) }), _jsx(CommonGridWithStyles, __assign({}, passDownProps, modifiedPassDownProps, { filters: filters, gridRef: gridRef, height: gridHeight, floatingButtonProps: floatingButtonProps, handleDragEnd: handleDragEnd(false), displayColumnsDefinitions: displayColumnsDefinitions, hasColouredRows: true }))] }), _jsx(HidePrint, { children: _jsxs(BottomWrapper, { ref: paginationRef, isFixed: !!gridHeight, children: [(processCheckedValues || !!((_a = actionColumnDefinition === null || actionColumnDefinition === void 0 ? void 0 : actionColumnDefinition.actionOptions) === null || _a === void 0 ? void 0 : _a.length)) && (_jsx(ActionHead, { rowsData: rowsData, onBatchAction: onBatchAction, gridActions: gridActions, gridSelectors: gridSelectors, actionColumn: actionColumnDefinition, processCheckedValues: processCheckedValues, processCheckedValuesTitle: processCheckedValuesTitle })), _jsxs(x.div, { display: "flex", justifyContent: "center", alignItems: "center", className: "paginatorWrapper", w: "100%", h: window.innerWidth > 1204 ? '60px' : '32px', children: [_jsx(Pagination, { page: gridSelectors === null || gridSelectors === void 0 ? void 0 : gridSelectors.page, itemCount: passDownProps === null || passDownProps === void 0 ? void 0 : passDownProps.totalRowsCount, itemPerPage: (gridSelectors === null || gridSelectors === void 0 ? void 0 : gridSelectors.rowsPerPage) || 10, onPageChange: gridActions === null || gridActions === void 0 ? void 0 : gridActions.setPage, customPaginationHandler: customPaginationHandler, radius: window.innerWidth < 768 ? 3 : 5, rate: window.innerWidth < 768 ? 1 : 4 }), _jsx(TablePagination, { gridActions: gridActions, gridSelectors: gridSelectors, customPaginationHandler: customPaginationHandler, getRowsPerPage: getRowsPerPage, gridHeight: gridHeight })] })] }) })] }), _jsx(GridModals, { manageColumnFormVisible: manageColumnFormVisible, onCloseForm: onCloseForm, resetColumnConfig: resetColumnConfig, onConfirmForm: onConfirmForm, manageColumnsFormDefinitions: manageColumnsFormDefinitions, columnsConfigValues: columnsConfigValues, setColumnsConfigOptions: setColumnsConfigOptions, handleDragEnd: handleDragEnd(true), gridName: gridName, gridActions: gridActions, gridSelectors: gridSelectors, onClosePresetsModal: onClosePresetsModal, isPresetsModalOpen: isPresetsModalOpen, selectedPresetName: selectedPresetName, setSelectedPresetName: setSelectedPresetName })] }));
 };
 export default CommonGridContainer;

package/ui/Blocks/CommonGrid/HoC/withReduxActions.js

@@ -21,6 +21,9 @@ var withReduxActions = function (gridName, prefix) {
                 closeConfigForm: actions.closeConfigForm,
                 setColumnConfig: actions.setColumnConfig,
                 setPage: actions.setPage,
+                setPresets: actions.setPresets,
+                createPreset: actions.createPreset,
+                deletePreset: actions.deletePreset,
                 setRowsPerPage: actions.setRowsPerPage,
                 addFilter: actions.addFilter,
                 setFilters: actions.setFilters,
@@ -29,7 +32,7 @@ var withReduxActions = function (gridName, prefix) {
                 clearSettings: actions.clearSettings,
                 setColumnWidth: actions.setColumnWidth,
                 resetGrid: actions.resetGrid,
-                setColumnsOrder: actions.setColumnsOrder
+                setColumnsOrder: actions.setColumnsOrder,
             }, dispatch),
             _a);
     });

package/ui/Blocks/CommonGrid/components/GridModals/index.d.ts

@@ -1,6 +1,6 @@
 import React, { type FC } from 'react';
 import { DropResult } from 'react-beautiful-dnd';
-import { ColumnConfig, ColumnDefinition, GridActionsType, GridSelectorsType, Filtering } from '../../types';
+import { ColumnConfig, ColumnDefinition, GridActionsType, GridSelectorsType } from '../../types';
 type ModalsProps = {
     manageColumnFormVisible: boolean;
     onCloseForm: () => void;
@@ -17,7 +17,6 @@ type ModalsProps = {
     onClosePresetsModal: () => void;
     selectedPresetName: string;
     setSelectedPresetName: (value: string) => void;
-    onPresetsChange?: (data: Record<string, Filtering>) => void;
 };
 export declare const GridModals: FC<ModalsProps>;
 export {};

package/ui/Blocks/CommonGrid/components/GridModals/index.js

@@ -9,20 +9,20 @@ import ManageColumnForm from '../ManageColumnForm';
 import { PresetsModalBody } from '../PresetsModalBody';
 import { Trans } from '@lingui/react';
 export var GridModals = function (_a) {
-    var manageColumnFormVisible = _a.manageColumnFormVisible, onCloseForm = _a.onCloseForm, resetColumnConfig = _a.resetColumnConfig, onConfirmForm = _a.onConfirmForm, manageColumnsFormDefinitions = _a.manageColumnsFormDefinitions, columnsConfigValues = _a.columnsConfigValues, setColumnsConfigOptions = _a.setColumnsConfigOptions, handleDragEnd = _a.handleDragEnd, gridName = _a.gridName, gridSelectors = _a.gridSelectors, gridActions = _a.gridActions, isPresetsModalOpen = _a.isPresetsModalOpen, onPresetsChange = _a.onPresetsChange, onClosePresetsModal = _a.onClosePresetsModal, selectedPresetName = _a.selectedPresetName, setSelectedPresetName = _a.setSelectedPresetName;
-    var _b = useSelectPreset({
+    var manageColumnFormVisible = _a.manageColumnFormVisible, onCloseForm = _a.onCloseForm, resetColumnConfig = _a.resetColumnConfig, onConfirmForm = _a.onConfirmForm, manageColumnsFormDefinitions = _a.manageColumnsFormDefinitions, columnsConfigValues = _a.columnsConfigValues, setColumnsConfigOptions = _a.setColumnsConfigOptions, handleDragEnd = _a.handleDragEnd, gridName = _a.gridName, gridSelectors = _a.gridSelectors, gridActions = _a.gridActions, isPresetsModalOpen = _a.isPresetsModalOpen, onClosePresetsModal = _a.onClosePresetsModal, selectedPresetName = _a.selectedPresetName, setSelectedPresetName = _a.setSelectedPresetName;
+    var handleSelectPreset = useSelectPreset({
         gridName: gridName,
         gridActions: gridActions,
         setSelectedPresetName: setSelectedPresetName,
         onClosePresetsModal: onClosePresetsModal,
-        onPresetsChange: onPresetsChange,
         filters: gridSelectors.filter
-    }), gridPresets = _b.gridPresets, setGridPresets = _b.setGridPresets, handleSelectPreset = _b.handleSelectPreset;
-    var _c = useCreatePreset({ gridName: gridName, setGridPresets: setGridPresets, onClosePresetsModal: onClosePresetsModal, setSelectedPresetName: setSelectedPresetName, filters: gridSelectors.filter }), isCreatePresetModalOpen = _c.isCreatePresetModalOpen, handleCloseCreatePresetModal = _c.handleCloseCreatePresetModal, onOpenCreatePresetModal = _c.onOpenCreatePresetModal, handleCreatePreset = _c.handleCreatePreset, presetName = _c.presetName, handleChangePresetName = _c.handleChangePresetName;
-    var _d = useDeletePreset({ gridName: gridName, selectedPresetName: selectedPresetName, setGridPresets: setGridPresets, setSelectedPresetName: setSelectedPresetName }), handleOpenDeletePresetModal = _d.handleOpenDeletePresetModal, handleDeletePreset = _d.handleDeletePreset, onCloseDeletePresetModal = _d.onCloseDeletePresetModal, presetNameToDelete = _d.presetNameToDelete, isDeletePresetModalOpen = _d.isDeletePresetModalOpen;
-    var _e = usePresetFileHandlers({
+    }).handleSelectPreset;
+    var _b = useCreatePreset({ gridName: gridName, gridActions: gridActions, onClosePresetsModal: onClosePresetsModal, setSelectedPresetName: setSelectedPresetName, filters: gridSelectors.filter }), isCreatePresetModalOpen = _b.isCreatePresetModalOpen, handleCloseCreatePresetModal = _b.handleCloseCreatePresetModal, onOpenCreatePresetModal = _b.onOpenCreatePresetModal, handleCreatePreset = _b.handleCreatePreset, presetName = _b.presetName, handleChangePresetName = _b.handleChangePresetName;
+    var _c = useDeletePreset({ gridName: gridName, selectedPresetName: selectedPresetName, gridActions: gridActions, setSelectedPresetName: setSelectedPresetName }), handleOpenDeletePresetModal = _c.handleOpenDeletePresetModal, handleDeletePreset = _c.handleDeletePreset, onCloseDeletePresetModal = _c.onCloseDeletePresetModal, presetNameToDelete = _c.presetNameToDelete, isDeletePresetModalOpen = _c.isDeletePresetModalOpen;
+    var _d = usePresetFileHandlers({
         gridName: gridName,
-        setGridPresets: setGridPresets
-    }), fileInputRef = _e.fileInputRef, handleImportPresets = _e.handleImportPresets, handleExportPresets = _e.handleExportPresets, handleImportButtonClick = _e.handleImportButtonClick;
-    return (_jsxs(_Fragment, { children: [_jsx(Modal, { title: _jsx(Trans, { id: "manageColumn.title", message: "Manage columns" }), onClose: onCloseForm, onCancel: onCloseForm, onExtraAction: resetColumnConfig, onConfirm: onConfirmForm, isShown: manageColumnFormVisible, width: "auto", minWidth: "350px", hasFooter: true, extraActionLabel: _jsx(Trans, { id: "dataGrid.buttonClearConfig", message: "Reset config" }), cancelLabel: _jsx(Trans, { id: "form.buttonCancel", message: "Cancel" }), confirmLabel: _jsx(Trans, { id: "form.buttonConfirm", message: "Confirm" }), children: _jsx(ManageColumnForm, { columns: manageColumnsFormDefinitions, columnsConfigValues: columnsConfigValues, setColumnsConfigOptions: setColumnsConfigOptions, handleDragEnd: handleDragEnd }) }), _jsx(Modal, { isShown: isPresetsModalOpen, title: _jsx(Trans, { id: "dataGrid.presets.title", message: "Presets" }), onClose: onClosePresetsModal, width: "narrow", children: _jsx(PresetsModalBody, { onOpenCreatePresetModal: onOpenCreatePresetModal, gridPresets: gridPresets, handleSelectPreset: handleSelectPreset, handleOpenDeletePresetModal: handleOpenDeletePresetModal, selectedPresetName: selectedPresetName, handleExportPresets: handleExportPresets, handleImportPresets: handleImportPresets, handleImportButtonClick: handleImportButtonClick, fileInputRef: fileInputRef, filters: gridSelectors.filter }) }), _jsx(Modal, { isShown: isCreatePresetModalOpen, title: _jsx(Trans, { id: "dataGrid.createNewPreset.title", message: "Create new preset" }), onCancel: handleCloseCreatePresetModal, onConfirm: handleCreatePreset, isConfirmDisabled: !presetName, width: "narrow", children: _jsx(Input, { type: "text", onChange: handleChangePresetName, value: presetName, label: _jsx(Trans, { id: "dataGrid.presetName.title", message: "Preset name" }) }) }), _jsx(Modal, { isShown: isDeletePresetModalOpen, title: _jsx(Trans, { id: "dataGrid.deletePreset.title", message: "Delete preset" }), onCancel: onCloseDeletePresetModal, onConfirm: handleDeletePreset, isConfirmDisabled: !presetNameToDelete, width: "narrow", children: _jsxs(_Fragment, { children: [_jsx(Trans, { id: "dataGrid.deletePreset.confirm", message: "Are you sure you want to delete preset" }), " \"", presetNameToDelete, "\" ?"] }) })] }));
+        gridActions: gridActions,
+        gridSelectors: gridSelectors,
+    }), fileInputRef = _d.fileInputRef, handleImportPresets = _d.handleImportPresets, handleExportPresets = _d.handleExportPresets, handleImportButtonClick = _d.handleImportButtonClick;
+    return (_jsxs(_Fragment, { children: [_jsx(Modal, { title: _jsx(Trans, { id: "manageColumn.title", message: "Manage columns" }), onClose: onCloseForm, onCancel: onCloseForm, onExtraAction: resetColumnConfig, onConfirm: onConfirmForm, isShown: manageColumnFormVisible, width: "auto", minWidth: "350px", hasFooter: true, extraActionLabel: _jsx(Trans, { id: "dataGrid.buttonClearConfig", message: "Reset config" }), cancelLabel: _jsx(Trans, { id: "form.buttonCancel", message: "Cancel" }), confirmLabel: _jsx(Trans, { id: "form.buttonConfirm", message: "Confirm" }), children: _jsx(ManageColumnForm, { columns: manageColumnsFormDefinitions, columnsConfigValues: columnsConfigValues, setColumnsConfigOptions: setColumnsConfigOptions, handleDragEnd: handleDragEnd }) }), _jsx(Modal, { isShown: isPresetsModalOpen, title: _jsx(Trans, { id: "dataGrid.presets.title", message: "Presets" }), onClose: onClosePresetsModal, width: "narrow", children: _jsx(PresetsModalBody, { onOpenCreatePresetModal: onOpenCreatePresetModal, gridPresets: gridSelectors.presets, handleSelectPreset: handleSelectPreset, handleOpenDeletePresetModal: handleOpenDeletePresetModal, selectedPresetName: selectedPresetName, handleExportPresets: handleExportPresets, handleImportPresets: handleImportPresets, handleImportButtonClick: handleImportButtonClick, fileInputRef: fileInputRef, filters: gridSelectors.filter }) }), _jsx(Modal, { isShown: isCreatePresetModalOpen, title: _jsx(Trans, { id: "dataGrid.createNewPreset.title", message: "Create new preset" }), onCancel: handleCloseCreatePresetModal, onConfirm: handleCreatePreset, isConfirmDisabled: !presetName, width: "narrow", children: _jsx(Input, { type: "text", onChange: handleChangePresetName, value: presetName, label: _jsx(Trans, { id: "dataGrid.presetName.title", message: "Preset name" }) }) }), _jsx(Modal, { isShown: isDeletePresetModalOpen, title: _jsx(Trans, { id: "dataGrid.deletePreset.title", message: "Delete preset" }), onCancel: onCloseDeletePresetModal, onConfirm: handleDeletePreset, isConfirmDisabled: !presetNameToDelete, width: "narrow", children: _jsxs(_Fragment, { children: [_jsx(Trans, { id: "dataGrid.deletePreset.confirm", message: "Are you sure you want to delete preset" }), " \"", presetNameToDelete, "\" ?"] }) })] }));
 };

package/ui/Blocks/CommonGrid/components/PresetsModalBody/index.d.ts

@@ -1,8 +1,8 @@
 import { ChangeEvent, type FC, MouseEvent, RefObject } from 'react';
-import { Filtering } from '../../types';
+import { Filtering, GridPresets } from '../../types';
 type PresetsModalBodyProps = {
     onOpenCreatePresetModal: () => void;
-    gridPresets: Record<string, Record<string, any>>;
+    gridPresets?: GridPresets;
     handleSelectPreset: (presetName: string, filters: Filtering) => () => void;
     handleOpenDeletePresetModal: (presetName: string) => (e: MouseEvent) => void;
     selectedPresetName: string;

package/ui/Blocks/CommonGrid/hooks/useCreatePreset.d.ts

@@ -1,11 +1,11 @@
 import { ChangeEvent } from 'react';
-import { Filtering } from '../types';
+import { Filtering, GridActionsType } from '../types';
 type Props = {
     gridName?: string;
     filters?: Filtering;
     onClosePresetsModal: () => void;
     setSelectedPresetName: (value: string) => void;
-    setGridPresets: (data: Record<string, Filtering>) => void;
+    gridActions: GridActionsType;
 };
 type HookType = (props: Props) => {
     isCreatePresetModalOpen: boolean;

package/ui/Blocks/CommonGrid/hooks/useCreatePreset.js

@@ -1,21 +1,9 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 import { useCallback, useState } from 'react';
 import { useModal } from '../../Modal/hooks/useModal';
-import { presetsLocalStorageKey } from '../utils/constants';
 import isEmpty from 'lodash/isEmpty';
 import { useEvent } from './useEvent';
 export var useCreatePreset = function (_a) {
-    var gridName = _a.gridName, filters = _a.filters, onClosePresetsModal = _a.onClosePresetsModal, setSelectedPresetName = _a.setSelectedPresetName, setGridPresets = _a.setGridPresets;
+    var gridName = _a.gridName, filters = _a.filters, onClosePresetsModal = _a.onClosePresetsModal, setSelectedPresetName = _a.setSelectedPresetName, gridActions = _a.gridActions;
     var _b = useModal(), isCreatePresetModalOpen = _b.isOpen, onOpenCreatePresetModal = _b.onOpen, onCloseCreatePresetModal = _b.onClose;
     var _c = useState(''), presetName = _c[0], setPresetName = _c[1];
     var handleChangePresetName = useCallback(function (event) {
@@ -27,19 +15,13 @@ export var useCreatePreset = function (_a) {
     }, []);
     var handleCreatePreset = useEvent(function () {
         var _a;
-        var _b;
         setPresetName('');
         onCloseCreatePresetModal();
         onClosePresetsModal();
         if (isEmpty(filters) || !gridName)
             return;
-        var presetsAsString = localStorage.getItem(presetsLocalStorageKey);
-        var presets = presetsAsString ? JSON.parse(presetsAsString) : {};
-        var updatedPresets = __assign({}, presets);
-        updatedPresets[gridName] = __assign(__assign({}, ((_b = updatedPresets[gridName]) !== null && _b !== void 0 ? _b : {})), (_a = {}, _a[presetName] = filters, _a));
-        setGridPresets(updatedPresets[gridName]);
+        (_a = gridActions.createPreset) === null || _a === void 0 ? void 0 : _a.call(gridActions, presetName, filters);
         setSelectedPresetName(presetName);
-        localStorage.setItem(presetsLocalStorageKey, JSON.stringify(updatedPresets));
     });
     return {
         isCreatePresetModalOpen: isCreatePresetModalOpen,

package/ui/Blocks/CommonGrid/hooks/useDeletePreset.d.ts

@@ -1,9 +1,9 @@
 import { MouseEvent } from 'react';
-import { Filtering } from '../types';
+import { GridActionsType } from '../types';
 type Props = {
     gridName?: string;
     selectedPresetName: string;
-    setGridPresets: (data: Record<string, Filtering>) => void;
+    gridActions: GridActionsType;
     setSelectedPresetName: (value: string) => void;
 };
 type HookType = (props: Props) => {

package/ui/Blocks/CommonGrid/hooks/useDeletePreset.js

@@ -1,19 +1,7 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 import { useCallback } from 'react';
 import { useModal } from '../../Modal/hooks/useModal';
-import { presetsLocalStorageKey } from '../utils/constants';
 export var useDeletePreset = function (_a) {
-    var selectedPresetName = _a.selectedPresetName, gridName = _a.gridName, setGridPresets = _a.setGridPresets, setSelectedPresetName = _a.setSelectedPresetName;
+    var selectedPresetName = _a.selectedPresetName, gridName = _a.gridName, gridActions = _a.gridActions, setSelectedPresetName = _a.setSelectedPresetName;
     var _b = useModal(), isDeletePresetModalOpen = _b.isOpen, onOpenDeletePresetModal = _b.onOpen, onCloseDeletePresetModal = _b.onClose, presetNameToDelete = _b.data;
     var handleOpenDeletePresetModal = useCallback(function (presetName) { return function (e) {
         if (!presetName)
@@ -22,14 +10,10 @@ export var useDeletePreset = function (_a) {
         onOpenDeletePresetModal(presetName);
     }; }, [selectedPresetName]);
     var handleDeletePreset = useCallback(function () {
+        var _a;
         if (!gridName || !presetNameToDelete)
             return;
-        var presetsAsString = localStorage.getItem(presetsLocalStorageKey);
-        var presets = presetsAsString ? JSON.parse(presetsAsString) : {};
-        var updatedPresets = __assign({}, presets);
-        delete updatedPresets[gridName][presetNameToDelete];
-        setGridPresets(updatedPresets[gridName]);
-        localStorage.setItem(presetsLocalStorageKey, JSON.stringify(updatedPresets));
+        (_a = gridActions.deletePreset) === null || _a === void 0 ? void 0 : _a.call(gridActions, presetNameToDelete);
         if (selectedPresetName === presetNameToDelete) {
             setSelectedPresetName('');
         }

package/ui/Blocks/CommonGrid/hooks/usePresetFileHandlers.d.ts

@@ -1,7 +1,9 @@
 import { ChangeEvent, RefObject } from 'react';
+import { GridActionsType, GridSelectorsType } from '../types';
 type FileHandlersProps = {
     gridName?: string;
-    setGridPresets: (data: Record<string, any>) => void;
+    gridActions: GridActionsType;
+    gridSelectors: GridSelectorsType;
 };
 type HookType = (props: FileHandlersProps) => {
     handleExportPresets: () => void;

package/ui/Blocks/CommonGrid/hooks/usePresetFileHandlers.js

@@ -1,25 +1,11 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 import { useRef, useCallback } from 'react';
-import { presetsLocalStorageKey } from '../utils/constants';
 export var usePresetFileHandlers = function (_a) {
-    var gridName = _a.gridName, setGridPresets = _a.setGridPresets;
+    var gridName = _a.gridName, gridActions = _a.gridActions, gridSelectors = _a.gridSelectors;
     var fileInputRef = useRef(null);
     var handleExportPresets = useCallback(function () {
         if (!gridName)
             return;
-        var presetsAsString = localStorage.getItem(presetsLocalStorageKey);
-        var presets = presetsAsString ? JSON.parse(presetsAsString) : {};
-        var blob = new Blob([JSON.stringify(presets[gridName], null, 2)], {
+        var blob = new Blob([JSON.stringify(gridSelectors.presets, null, 2)], {
             type: 'application/json'
         });
         var link = document.createElement('a');
@@ -39,15 +25,10 @@ export var usePresetFileHandlers = function (_a) {
         var reader = new FileReader();
         reader.readAsText(file);
         reader.onload = function (e) {
-            var _a;
-            var _b;
+            var _a, _b;
             try {
-                var fileContent = JSON.parse((_b = e.target) === null || _b === void 0 ? void 0 : _b.result);
-                var presetsAsString = localStorage.getItem(presetsLocalStorageKey);
-                var presets = presetsAsString ? JSON.parse(presetsAsString) : {};
-                var newPresets = JSON.stringify(__assign(__assign({}, presets), (_a = {}, _a[gridName] = fileContent, _a)));
-                localStorage.setItem(presetsLocalStorageKey, newPresets);
-                setGridPresets(fileContent);
+                var fileContent = JSON.parse((_a = e.target) === null || _a === void 0 ? void 0 : _a.result);
+                (_b = gridActions.setPresets) === null || _b === void 0 ? void 0 : _b.call(gridActions, fileContent);
             }
             catch (error) {
                 console.warn('Error parsing JSON file:', error);

package/ui/Blocks/CommonGrid/hooks/useSelectPreset.d.ts

@@ -1,16 +1,14 @@
-import { Filtering, GridActionsType } from '../types';
+import { Filtering, GridActionsType, GridSelectorsType } from '../types';
 type Props = {
     gridName?: string;
     gridActions: GridActionsType;
+    gridSelectors?: GridSelectorsType;
     setSelectedPresetName: (value: string) => void;
     onClosePresetsModal: () => void;
-    onPresetsChange?: (data: Record<string, Filtering>) => void;
     filters?: Filtering;
 };
 type HookType = (props: Props) => {
-    gridPresets: Record<string, Filtering>;
     handleSelectPreset: (presetName: string, filters: Filtering) => () => void;
-    setGridPresets: (data: Record<string, Filtering>) => void;
 };
 export declare const useSelectPreset: HookType;
 export {};

package/ui/Blocks/CommonGrid/hooks/useSelectPreset.js

@@ -1,32 +1,14 @@
-import { useCallback, useEffect, useState } from 'react';
-import { presetsLocalStorageKey } from '../utils/constants';
+import { useCallback, useEffect } from 'react';
 import isEqual from 'lodash/isEqual';
-var getInitialPresets = function (gridName) {
-    var _a;
-    if (!gridName)
-        return {};
-    try {
-        var presetsAsString = localStorage.getItem(presetsLocalStorageKey);
-        var presets = presetsAsString ? JSON.parse(presetsAsString) : {};
-        return gridName ? (_a = presets[gridName]) !== null && _a !== void 0 ? _a : {} : {};
-    }
-    catch (error) {
-        console.error('Error parsing JSON file:', error);
-    }
-};
 export var useSelectPreset = function (_a) {
-    var gridName = _a.gridName, gridActions = _a.gridActions, setSelectedPresetName = _a.setSelectedPresetName, onClosePresetsModal = _a.onClosePresetsModal, onPresetsChange = _a.onPresetsChange, filters = _a.filters;
-    var _b = useState(getInitialPresets(gridName)), gridPresets = _b[0], setGridPresets = _b[1];
+    var gridName = _a.gridName, gridActions = _a.gridActions, gridSelectors = _a.gridSelectors, setSelectedPresetName = _a.setSelectedPresetName, onClosePresetsModal = _a.onClosePresetsModal, filters = _a.filters;
+    var gridPresets = gridSelectors === null || gridSelectors === void 0 ? void 0 : gridSelectors.presets;
     var handleSelectPreset = useCallback(function (presetName, filters) { return function () {
         var _a;
         setSelectedPresetName(presetName);
         (_a = gridActions.setFilters) === null || _a === void 0 ? void 0 : _a.call(gridActions, filters);
         onClosePresetsModal();
     }; }, [gridActions]);
-    var handleSetGridPresets = useCallback(function (data) {
-        setGridPresets(data);
-        onPresetsChange === null || onPresetsChange === void 0 ? void 0 : onPresetsChange(data);
-    }, []);
     useEffect(function () {
         var _a;
         if (!gridName || !gridPresets)
@@ -37,5 +19,5 @@ export var useSelectPreset = function (_a) {
         });
         activePreset ? setSelectedPresetName(activePreset[0]) : setSelectedPresetName('');
     }, [filters]);
-    return { gridPresets: gridPresets, setGridPresets: handleSetGridPresets, handleSelectPreset: handleSelectPreset };
+    return { handleSelectPreset: handleSelectPreset };
 };

package/ui/Blocks/CommonGrid/store/index.d.ts

@@ -1,4 +1,4 @@
-import { FilterProps, SortingValueType, InitProps, GridState, GridSelectorsType, ColumnConfig, Filtering } from '../types';
+import { FilterProps, SortingValueType, InitProps, GridState, GridSelectorsType, ColumnConfig, Filtering, GridPresets } from '../types';
 type DefaultRootState = {};
 export type MultiState = {
     [key: string]: GridState;
@@ -13,6 +13,9 @@ export declare const actionTypes: {
     closeConfigForm: string;
     setColumnConfig: string;
     setPage: string;
+    setPresets: string;
+    createPreset: string;
+    deletePreset: string;
     setRowsPerPage: string;
     resetFilters: string;
     addFilter: string;
@@ -33,6 +36,9 @@ export declare const createActions: (gridName: string) => {
     closeConfigForm: () => Action;
     setColumnConfig: (columnConfig: ColumnConfig) => Action;
     setPage: (page: number) => Action;
+    setPresets: (presets: GridPresets) => Action;
+    createPreset: (presetName: string, filters: Filtering) => Action;
+    deletePreset: (presetName: string) => Action;
     setColumnWidth: (columnsWidth: {
         [anyKey: string]: number;
     } | null, columnLayout: 'normal' | 'no-scroll' | 'sticky') => Action;

package/ui/Blocks/CommonGrid/store/index.js

@@ -12,9 +12,11 @@ var __assign = (this && this.__assign) || function () {
 import produce from 'immer';
 import { createSelector } from 'reselect';
 import getOr from 'lodash/fp/getOr';
+import omit from 'lodash/omit';
 import migrateState from './migrateState';
 export var initialState = {
     page: 1,
+    presets: {},
     sorting: [],
     isConfigFormOpen: false,
     uxState: {
@@ -36,6 +38,9 @@ export var actionTypes = {
     closeConfigForm: "".concat(actionPrefix, "/closeConfigForm"),
     setColumnConfig: "".concat(actionPrefix, "/setColumnConfig"),
     setPage: "".concat(actionPrefix, "/setPage"),
+    setPresets: "".concat(actionPrefix, "/setPresets"),
+    createPreset: "".concat(actionPrefix, "/createPreset"),
+    deletePreset: "".concat(actionPrefix, "/deletePreset"),
     setRowsPerPage: "".concat(actionPrefix, "/setRowsPerPage"),
     resetFilters: "".concat(actionPrefix, "/resetFilters"),
     addFilter: "".concat(actionPrefix, "/addFilter"),
@@ -50,8 +55,8 @@ var migrationChecked = false;
 export default (function (state, action) {
     if (state === void 0) { state = {}; }
     return produce(state, function (draft) {
-        var _a, _b;
-        var _c, _d, _e, _f, _g;
+        var _a, _b, _c;
+        var _d, _e, _f, _g, _h;
         // version migrations
         if (!migrationChecked && state && Object.keys(state).length > 0) {
             draft = migrateState(draft);
@@ -70,7 +75,7 @@ export default (function (state, action) {
                 draft[gridName].page = 1;
                 if (defaultSorting) {
                     draft[gridName].defaultSorting = defaultSorting;
-                    draft[gridName].sorting = ((_c = draft[gridName].sorting) === null || _c === void 0 ? void 0 : _c.length) ? draft[gridName].sorting : defaultSorting;
+                    draft[gridName].sorting = ((_d = draft[gridName].sorting) === null || _d === void 0 ? void 0 : _d.length) ? draft[gridName].sorting : defaultSorting;
                 }
                 break;
             case actionTypes.clearUxState:
@@ -104,12 +109,12 @@ export default (function (state, action) {
             case actionTypes.addSorting:
                 var direction = action.direction;
                 var sortingColumn = action.column;
-                if (((_f = (_e = (_d = draft[gridName]) === null || _d === void 0 ? void 0 : _d.defaultSorting) === null || _e === void 0 ? void 0 : _e[0]) === null || _f === void 0 ? void 0 : _f.column) === sortingColumn && direction === null) {
+                if (((_g = (_f = (_e = draft[gridName]) === null || _e === void 0 ? void 0 : _e.defaultSorting) === null || _f === void 0 ? void 0 : _f[0]) === null || _g === void 0 ? void 0 : _g.column) === sortingColumn && direction === null) {
                     direction = 'asc';
                 }
                 var sorting = [{ column: sortingColumn, direction: direction }];
                 if (direction === null) {
-                    sorting = ((_g = draft[gridName]) === null || _g === void 0 ? void 0 : _g.defaultSorting) || [];
+                    sorting = ((_h = draft[gridName]) === null || _h === void 0 ? void 0 : _h.defaultSorting) || [];
                 }
                 draft[gridName].sorting = sorting;
                 break;
@@ -121,6 +126,15 @@ export default (function (state, action) {
             case actionTypes.setPage:
                 draft[gridName].page = action.page;
                 break;
+            case actionTypes.setPresets:
+                draft[gridName].presets = action.presets;
+                break;
+            case actionTypes.createPreset:
+                draft[gridName].presets = __assign(__assign({}, (draft[gridName].presets || {})), (_c = {}, _c[action.presetName] = action.filters, _c));
+                break;
+            case actionTypes.deletePreset:
+                draft[gridName].presets = omit(draft[gridName].presets, action.presetName);
+                break;
             case actionTypes.setRowsPerPage:
                 draft[gridName].rowsPerPage = action.rowsPerPage;
                 break;
@@ -156,6 +170,14 @@ export var createActions = function (gridName) { return ({
     closeConfigForm: function () { return ({ gridName: gridName, type: actionTypes.closeConfigForm }); },
     setColumnConfig: function (columnConfig) { return ({ gridName: gridName, type: actionTypes.setColumnConfig, columnConfig: columnConfig }); },
     setPage: function (page) { return ({ gridName: gridName, type: actionTypes.setPage, page: page }); },
+    setPresets: function (presets) { return ({ gridName: gridName, type: actionTypes.setPresets, presets: presets }); },
+    createPreset: function (presetName, filters) { return ({
+        gridName: gridName,
+        type: actionTypes.createPreset,
+        presetName: presetName,
+        filters: filters
+    }); },
+    deletePreset: function (presetName) { return ({ gridName: gridName, type: actionTypes.deletePreset, presetName: presetName }); },
     setColumnWidth: function (columnsWidth, columnLayout) { return ({
         gridName: gridName,
         type: actionTypes.setColumnWidth,

package/ui/Blocks/CommonGrid/types.d.ts

@@ -189,6 +189,7 @@ export type UxState = {
 export type ColumnLayout = 'normal' | 'no-scroll' | 'sticky';
 export type GridState = {
     page: number;
+    presets: GridPresets;
     rowsPerPage?: number;
     filter: Settings['filter'];
     sorting: Settings['sorting'];
@@ -206,6 +207,7 @@ export type GridSelectorsType = {
     uxState?: UxState;
     columnConfig?: ColumnConfig;
     page?: number;
+    presets?: GridPresets;
     rowsPerPage?: number;
     filter?: Settings['filter'];
     sorting?: Settings['sorting'];
@@ -227,6 +229,9 @@ export type GridActionsType = {
     handleUxChange?: (uxKey: keyof UxState, uxValue: any) => void;
     setColumnConfig?: (columnConfig: ColumnConfig) => void | Promise<any>;
     setPage?: (number: number) => void;
+    setPresets?: (presets: Filtering) => void;
+    createPreset?: (presetName: string, filters: Filtering) => void;
+    deletePreset?: (presetName: string) => void;
     setRowsPerPage?: (number: number) => RowsPerPageType | null;
     addFilter?: (column: string, value: any, filterProps: FilterProps) => void;
     setFilters?: (filters: Filtering) => void;
@@ -274,7 +279,6 @@ export type CommonGridProps<TData extends RowProps = RowProps> = {
     floatingButtonProps?: FloatingButtonProps;
     editReadPosition?: EditReadPosition;
     comparators?: CustomComparators;
-    onPresetsChange?: (data: Record<string, Filtering>) => void;
 };
 export declare enum EditReadPosition {
     Left = "left",
@@ -331,4 +335,5 @@ export type Comparator = {
     value: string;
     icon?: string;
 };
+export type GridPresets = Record<string, Filtering>;
 export {};

package/ui/Blocks/CommonGrid/utils/constants.d.ts

@@ -1,4 +1,3 @@
-export declare const presetsLocalStorageKey = "commonGridPresets";
 export declare const rowsPerPageOptions: {
     value: number;
     label: number;

package/ui/Blocks/CommonGrid/utils/constants.js

@@ -1,4 +1,3 @@
-export var presetsLocalStorageKey = 'commonGridPresets';
 export var rowsPerPageOptions = [
     { value: 10, label: 10 },
     { value: 20, label: 20 },