@uxf/data-grid 11.56.1 → 11.58.0

package/README.md

@@ -44,17 +44,23 @@ yarn upgrade @uxf/core@latest @uxf/ui@latest @uxf/data-grid@latest
 
 ```tsx
 import { useDataGridControl } from "@uxf/data-grid/use-data-grid-control";
+import { useUserConfigLocalStorageAdapter } from "@uxf/data-grid/user-config-storage-adapters/local-storage";
+
+const { middleware, useUserConfig } = useUserConfigLocalStorageAdapter(schema);
 
 const { state, actions } = useDataGridControl({
-    schema ,
+    schema,
     initialState: "Request or string (base64 encoded request)",
     userConfig: {
         columns: {
             id: { isHidden: true },
         }
     },
+    middleware,
     isDebug: true,
 });
+
+useUserConfig(actions);
 ```
 
 ## Supported FilterHandlers
@@ -77,9 +83,14 @@ const { state, actions } = useDataGridControl({
 ```tsx
 import { useDataGridControl } from "@uxf/data-grid/use-data-grid-control";
 import { useDataGridFetching } from "@uxf/data-grid/use-data-grid-fetching";
+import { useUserConfigLocalStorageAdapter } from "@uxf/data-grid/user-config-storage-adapters/local-storage";
 
 function BasicExample() {
-    const { state, actions } = useDataGridControl({ schema });
+    const { middleware, useUserConfig } = useUserConfigLocalStorageAdapter(schema);
+    const { state, actions } = useDataGridControl({ schema, middleware });
+    
+    useUserConfig(actions);
+    
     const { isLoading, error, data, reload } = useDataGridFetching(loader, schema, "grid-name", state);
 
     return (

package/_store/reducer.js

@@ -30,7 +30,7 @@ function getInitialState(schema, init, initialUserConfig) {
 }
 // eslint-disable-next-line complexity
 const reducer = (state, action) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
     switch (action.type) {
         case "CHANGE_PAGE":
             return {
@@ -194,6 +194,10 @@ const reducer = (state, action) => {
         case "REINITIALIZE_USER_CONFIG":
             return {
                 ...state,
+                request: {
+                    ...state.request,
+                    perPage: (_r = action.userConfig.perPage) !== null && _r !== void 0 ? _r : state.request.perPage,
+                },
                 userConfig: action.userConfig,
             };
         default:

package/data-grid-v2.stories.js

@@ -34,6 +34,7 @@ const data_grid_v2_1 = require("./data-grid-v2");
 const action_cell_1 = require("./table-v2/components/action-cell");
 const use_data_grid_control_1 = require("./use-data-grid-control");
 const use_data_grid_fetching_1 = require("./use-data-grid-fetching");
+const local_storage_1 = require("./user-config-storage-adapters/local-storage");
 const merge_schema_with_config_1 = require("./utils/merge-schema-with-config");
 const actionCell = {
     width: 92,
@@ -79,10 +80,12 @@ const FILTER_BEHAVIOR_OPTIONS = [
 ];
 function Default() {
     const [filterBehavior, setFilterBehavior] = (0, react_1.useState)("filtersPerTab");
+    const { middleware, useUserConfig } = (0, local_storage_1.useUserConfigLocalStorageAdapter)(schema_1.schema);
     const { state, actions } = (0, use_data_grid_control_1.useDataGridControl)({
         schema: schema_1.schema,
-        middleware: (newState, action) => console.log("middlerware", { newState, action }),
+        middleware,
     });
+    useUserConfig(actions);
     const { isLoading, error, data, reload } = (0, use_data_grid_fetching_1.useDataGridFetching)({
         loader: loader_1.loader,
         schema: schema_1.schema,

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@uxf/data-grid",
-    "version": "11.56.1",
+    "version": "11.58.0",
     "description": "UXF DataGrid",
     "homepage": "https://gitlab.com/uxf-npm/data-grid#readme",
     "main": "index.js",
@@ -31,9 +31,9 @@
         "typecheck": "tsc --noEmit --skipLibCheck"
     },
     "dependencies": {
-        "@uxf/core": "11.54.0",
-        "@uxf/core-react": "11.54.0",
-        "@uxf/ui": "11.56.0",
+        "@uxf/core": "11.58.0",
+        "@uxf/core-react": "11.58.0",
+        "@uxf/ui": "11.58.0",
         "dayjs": "1.11.13",
         "deepmerge": "4.3.1",
         "fast-glob": "3.3.2",

package/types/user-config-storage-adapter.d.ts

@@ -0,0 +1,8 @@
+import { DataGridControl } from "../use-data-grid-control";
+import { Action } from "../use-data-grid-control/action";
+import { Middleware } from "../use-data-grid-control/use-middleware-reducer";
+import { DataGridState } from "./state";
+export type UserConfigStorageAdapter = {
+    middleware: Middleware<DataGridState<any>, Action>;
+    useUserConfig: (actions: DataGridControl["actions"]) => void;
+};

package/types/user-config-storage-adapter.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/use-data-grid-control/action.d.ts

@@ -44,3 +44,4 @@ export type Action = {
     type: "REINITIALIZE_USER_CONFIG";
     userConfig: any;
 };
+export declare const ACTIONS_CHANGING_USER_CONFIG: Array<Action["type"]>;

package/use-data-grid-control/action.js

@@ -1,2 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.ACTIONS_CHANGING_USER_CONFIG = void 0;
+exports.ACTIONS_CHANGING_USER_CONFIG = [
+    "CHANGE_PER_PAGE",
+    "HIDE_COLUMN",
+    "SHOW_COLUMN",
+    "UPDATE_USER_CONFIG",
+];

package/user-config-storage-adapters/local-storage.d.ts

@@ -0,0 +1,3 @@
+import { Schema } from "../types";
+import { UserConfigStorageAdapter } from "../types/user-config-storage-adapter";
+export declare function useUserConfigLocalStorageAdapter(schema: Schema<any>): UserConfigStorageAdapter;

package/user-config-storage-adapters/local-storage.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useUserConfigLocalStorageAdapter = useUserConfigLocalStorageAdapter;
+const react_1 = require("react");
+const action_1 = require("../use-data-grid-control/action");
+const get_config_key_1 = require("../utils/get-config-key");
+const isObject = (value) => typeof value === "function" || (typeof value === "object" && Boolean(value));
+function useUserConfigLocalStorageAdapter(schema) {
+    const configKey = (0, get_config_key_1.getConfigKey)(schema);
+    return (0, react_1.useMemo)(() => ({
+        middleware: (newState, action) => {
+            if (action_1.ACTIONS_CHANGING_USER_CONFIG.includes(action.type)) {
+                window.localStorage.setItem(configKey, JSON.stringify(newState.userConfig));
+            }
+        },
+        useUserConfig: (actions) => {
+            (0, react_1.useEffect)(() => {
+                var _a;
+                let config = null;
+                try {
+                    config = JSON.parse((_a = window.localStorage.getItem(configKey)) !== null && _a !== void 0 ? _a : "{}");
+                }
+                catch {
+                    // ignore
+                }
+                if (isObject(config) && config !== null) {
+                    actions.reinitializeUserConfig(config);
+                }
+            }, [actions]);
+        },
+    }), [configKey]);
+}

package/utils/get-config-key.d.ts

@@ -0,0 +1,2 @@
+import { Schema } from "../types";
+export declare function getConfigKey(schema: Schema<any>): string;

package/utils/get-config-key.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getConfigKey = getConfigKey;
+function getConfigKey(schema) {
+    return `data-grid-config__v2__${schema.name}`;
+}