New ViewManager for persisting named bundles of grid and other component state

cmp/filter/FilterChooserModel.ts

@@ -196,7 +196,10 @@ export class FilterChooserModel extends HoistModel {
 
                 this.addReaction({
                     track: () => this.persistState,
-                    run: state => this.provider.write(state)
+                    run: state => {
+                        this.provider.write(state);
+                    },
+                    fireImmediately: this.provider.shouldWriteInitialState
                 });
             } catch (e) {
                 this.logError(e);

cmp/grid/GridModel.ts

@@ -630,8 +630,12 @@ export class GridModel extends HoistModel {
      *
      * @returns true if defaults were restored
      */
-    async restoreDefaultsAsync(): Promise<boolean> {
-        if (this.restoreDefaultsWarning) {
+    async restoreDefaultsAsync(
+        {skipWarning}: {skipWarning?: boolean} = {
+            skipWarning: !!this.restoreDefaultsWarning
+        }
+    ): Promise<boolean> {
+        if (this.restoreDefaultsWarning && !skipWarning) {
             const confirmed = await XH.confirm({
                 message: this.restoreDefaultsWarning,
                 confirmProps: {
@@ -1616,7 +1620,7 @@ export class GridModel extends HoistModel {
             // Remove the width from any non-resizable column - we don't want to track those widths as
             // they are set programmatically (e.g. fixed / action columns), and saved state should not
             // conflict with any code-level updates to their widths.
-            if (!col.resizable) state = omit(state, 'width');
+            if (!col.resizable || !col.manuallySized) state = omit(state, 'width'); // TODO
 
             // Remove all metadata other than the id and the hidden state from hidden columns, to save
             // on space when storing user configs with large amounts of hidden fields.

cmp/grid/impl/GridPersistenceModel.ts

@@ -55,7 +55,8 @@ export class GridPersistenceModel extends HoistModel {
             this.state = this.loadState() ?? this.legacyState() ?? {version: this.VERSION};
             this.addReaction({
                 track: () => this.state,
-                run: state => this.provider.write(state)
+                run: state => this.provider.write(state),
+                fireImmediately: this.provider.shouldWriteInitialState
             });
         } catch (e) {
             this.logError(e);
@@ -81,6 +82,7 @@ export class GridPersistenceModel extends HoistModel {
 
     @action
     clear() {
+        if (this.provider.shouldWriteInitialState) return;
         this.state = {version: this.VERSION};
     }
 
@@ -96,7 +98,8 @@ export class GridPersistenceModel extends HoistModel {
                     columns: gridModel.cleanColumnState(columnState),
                     autosize: autosizeState
                 });
-            }
+            },
+            fireImmediately: this.provider.shouldWriteInitialState
         };
     }
 
@@ -114,7 +117,8 @@ export class GridPersistenceModel extends HoistModel {
             track: () => this.gridModel.sortBy,
             run: sortBy => {
                 this.patchState({sortBy: sortBy.map(it => it.toString())});
-            }
+            },
+            fireImmediately: this.provider.shouldWriteInitialState
         };
     }
 
@@ -131,7 +135,8 @@ export class GridPersistenceModel extends HoistModel {
             track: () => this.gridModel.groupBy,
             run: groupBy => {
                 this.patchState({groupBy});
-            }
+            },
+            fireImmediately: this.provider.shouldWriteInitialState
         };
     }
 

cmp/grouping/GroupingChooserModel.ts

@@ -160,7 +160,8 @@ export class GroupingChooserModel extends HoistModel {
 
                 this.addReaction({
                     track: () => this.persistState,
-                    run: state => this.provider.write(state)
+                    run: state => this.provider.write(state),
+                    fireImmediately: this.provider.shouldWriteInitialState
                 });
             } catch (e) {
                 this.logError(e);

cmp/tab/TabContainerModel.ts

@@ -402,7 +402,8 @@ export class TabContainerModel extends HoistModel {
         if (this.provider) {
             this.addReaction({
                 track: () => this.activeTabId,
-                run: activeTabId => this.provider.write({activeTabId})
+                run: activeTabId => this.provider.write({activeTabId}),
+                fireImmediately: this.provider.shouldWriteInitialState
             });
         }
     }

cmp/zoneGrid/impl/ZoneGridPersistenceModel.ts

@@ -91,7 +91,8 @@ export class ZoneGridPersistenceModel extends HoistModel {
             track: () => this.zoneGridModel.mappings,
             run: mappings => {
                 this.patchState({mappings});
-            }
+            },
+            fireImmediately: this.provider.shouldWriteInitialState
         };
     }
 
@@ -108,7 +109,8 @@ export class ZoneGridPersistenceModel extends HoistModel {
             track: () => this.zoneGridModel.sortBy,
             run: sortBy => {
                 this.patchState({sortBy: sortBy?.toString()});
-            }
+            },
+            fireImmediately: this.provider.shouldWriteInitialState
         };
     }
 
@@ -125,7 +127,8 @@ export class ZoneGridPersistenceModel extends HoistModel {
             track: () => this.zoneGridModel.groupBy,
             run: groupBy => {
                 this.patchState({groupBy});
-            }
+            },
+            fireImmediately: this.provider.shouldWriteInitialState
         };
     }
 

core/HoistBase.ts

@@ -269,7 +269,8 @@ export abstract class HoistBase {
             }
             this.addReaction({
                 track: () => this[property],
-                run: data => provider.write(data)
+                run: data => provider.write(data),
+                fireImmediately: provider.shouldWriteInitialState
             });
         } catch (e) {
             this.logError(

core/persist/PersistOptions.ts

@@ -6,6 +6,7 @@
  */
 
 import {DebounceSpec} from '../';
+import {ViewManagerModel} from './viewManager';
 
 /**
  * Options governing persistence.
@@ -18,8 +19,8 @@ export interface PersistOptions {
     debounce?: DebounceSpec;
 
     /**
-     * Type of PersistenceProvider to create. If not provided, defaulted based
-     * on the presence of `prefKey`, `localStorageKey`, `dashViewModel`, `getData` and `setData`.
+     * Type of PersistenceProvider to create. If not provided, defaulted based on the presence of
+     * `prefKey`, `localStorageKey`, `dashViewModel`, `viewManagerModel`, `getData` and `setData`.
      */
     type?: string;
 
@@ -32,6 +33,9 @@ export interface PersistOptions {
     /** DashViewModel used to read / write view state. */
     dashViewModel?: object;
 
+    /** ViewManagerModel used to read / write view state. */
+    viewManagerModel?: ViewManagerModel;
+
     /**
      *  Function returning blob of data to be used for reading state.
      *  Ignored if `prefKey`, `localStorageKey` or `dashViewModel` are provided.

core/persist/PersistenceProvider.ts

@@ -10,6 +10,7 @@ import {
     LocalStorageProvider,
     PrefProvider,
     DashViewProvider,
+    ViewManagerProvider,
     CustomProvider,
     PersistOptions
 } from './';
@@ -45,6 +46,11 @@ export class PersistenceProvider {
     path: string;
     debounce: DebounceSpec;
 
+    // TODO - to discuss
+    get shouldWriteInitialState(): boolean {
+        return false;
+    }
+
     /**
      * Construct an instance of this class.
      */
@@ -53,6 +59,7 @@ export class PersistenceProvider {
             if (rest.prefKey) type = 'pref';
             if (rest.localStorageKey) type = 'localStorage';
             if (rest.dashViewModel) type = 'dashView';
+            if (rest.viewManagerModel) type = 'viewManagerModel';
             if (rest.getData || rest.setData) type = 'custom';
         }
 
@@ -63,6 +70,8 @@ export class PersistenceProvider {
                 return new LocalStorageProvider(rest);
             case `dashView`:
                 return new DashViewProvider(rest);
+            case 'viewManagerModel':
+                return new ViewManagerProvider(rest);
             case 'custom':
                 return new CustomProvider(rest);
             default:

core/persist/ViewManagerProvider.ts

@@ -0,0 +1,40 @@
+/*
+ * This file belongs to Hoist, an application development toolkit
+ * developed by Extremely Heavy Industries (www.xh.io | [email protected])
+ *
+ * Copyright © 2024 Extremely Heavy Industries Inc.
+ */
+
+import {cloneDeep} from 'lodash';
+import {PersistenceProvider, PersistOptions} from './';
+import {throwIf} from '@xh/hoist/utils/js';
+import {ViewManagerModel} from './viewManager';
+
+/**
+ * PersistenceProvider that stores state for ViewManager.
+ */
+export class ViewManagerProvider extends PersistenceProvider {
+    viewManagerModel: ViewManagerModel;
+
+    override get shouldWriteInitialState(): boolean {
+        return true;
+    }
+
+    constructor({viewManagerModel, ...rest}: PersistOptions) {
+        throwIf(!viewManagerModel, `ViewManagerProvider requires a 'viewManagerModel'.`);
+        super(rest);
+        this.viewManagerModel = viewManagerModel;
+    }
+
+    //----------------
+    // Implementation
+    //----------------
+    override readRaw() {
+        const {pendingValue, value} = this.viewManagerModel;
+        return cloneDeep(pendingValue ?? value ?? {});
+    }
+
+    override writeRaw(data) {
+        this.viewManagerModel.mergePendingValue(data);
+    }
+}

core/persist/index.ts

@@ -4,3 +4,4 @@ export * from './LocalStorageProvider';
 export * from './DashViewProvider';
 export * from './PrefProvider';
 export * from './CustomProvider';
+export * from './ViewManagerProvider';

core/persist/viewManager/Types.ts

@@ -0,0 +1,32 @@
+import {PlainObject} from '@xh/hoist/core';
+import {LocalDate} from '@xh/hoist/utils/datetime';
+
+export interface View<T extends PlainObject = PlainObject> {
+    acl: string;
+    archived: boolean;
+    dateCreated: LocalDate;
+    description: string;
+    lastUpdated: LocalDate;
+    lastUpdatedBy: string;
+    name: string;
+    owner: string;
+    token: string;
+    type: string;
+    group: string;
+    isShared: boolean;
+    value: T;
+}
+
+export type ViewTree = {
+    text: string;
+    selected: boolean;
+} & (
+    | {
+          type: 'directory';
+          items: ViewTree[];
+      }
+    | {
+          type: 'view';
+          token: string;
+      }
+);