@xh/hoist 71.0.0-SNAPSHOT.1733347475493 → 71.0.0-SNAPSHOT.1733376295239

package/build/types/cmp/viewmanager/ViewManagerModel.d.ts

@@ -3,6 +3,7 @@ import type { ViewManagerProvider } from '@xh/hoist/core';
 import { SaveAsDialogModel } from './SaveAsDialogModel';
 import { ViewInfo } from './ViewInfo';
 import { View } from './View';
+import { ViewToBlobApi } from './ViewToBlobApi';
 export interface ViewManagerConfig {
     /**
      * True (default) to allow user to opt in to automatically saving changes to their current view.
@@ -94,6 +95,7 @@ export declare class ViewManagerModel<T = PlainObject> extends HoistModel {
      */
     static createAsync(config: ViewManagerConfig): Promise<ViewManagerModel>;
     /** Immutable configuration for this model. */
+    persistWith: ViewManagerPersistOptions;
     readonly viewType: string;
     readonly typeDisplayName: string;
     readonly globalDisplayName: string;
@@ -124,18 +126,22 @@ export declare class ViewManagerModel<T = PlainObject> extends HoistModel {
      */
     saveTask: TaskObserver;
     manageDialogOpen: boolean;
-    readonly saveAsDialogModel: SaveAsDialogModel;
+    saveAsDialogModel: SaveAsDialogModel;
+    /** Unsaved changes on the current view.*/
     private pendingValue;
-    private lastPushed;
     /**
      * Array of {@link ViewManagerProvider} instances bound to this model. Providers will
      * push themselves onto this array when constructed with a reference to this model. Used to
      * proactively push state to the target components when the model's selected `value` changes.
-     *
      * @internal
      */
     providers: ViewManagerProvider<any>[];
-    persistWith: ViewManagerPersistOptions;
+    /**
+     * Data access for persisting views
+     * @internal
+     */
+    api: ViewToBlobApi<T>;
+    private lastPushed;
     get isValueDirty(): boolean;
     get isViewSavable(): boolean;
     get isViewAutoSavable(): boolean;
@@ -150,7 +156,6 @@ export declare class ViewManagerModel<T = PlainObject> extends HoistModel {
      * initial load before binding to persistable components.
      */
     private constructor();
-    private initAsync;
     doLoadAsync(loadSpec: LoadSpec): Promise<void>;
     selectViewAsync(info: ViewInfo): Promise<void>;
     saveAsync(): Promise<void>;
@@ -165,12 +170,8 @@ export declare class ViewManagerModel<T = PlainObject> extends HoistModel {
     openManageDialog(): void;
     closeManageDialog(): void;
     validateViewNameAsync(name: string, existing?: ViewInfo): Promise<string>;
-    deleteViewAsync(view: ViewInfo): Promise<void>;
-    updateViewAsync(view: ViewInfo, name: string, description: string, isGlobal: boolean): Promise<void>;
-    createViewAsync(name: string, description: string, value: PlainObject): Promise<View>;
+    private initAsync;
     private loadViewAsync;
-    private fetchViewAsync;
-    private fetchViewInfosAsync;
     private maybeAutoSaveAsync;
     private setAsView;
     private handleException;

package/build/types/cmp/viewmanager/ViewToBlobApi.d.ts

@@ -0,0 +1,19 @@
+import { PlainObject } from '@xh/hoist/core';
+import { ViewInfo } from './ViewInfo';
+import { View } from './View';
+import { ViewManagerModel } from './ViewManagerModel';
+/**
+ * Class for accessing and updating views using JSON Blobs Service.
+ *
+ * @internal
+ */
+export declare class ViewToBlobApi<T> {
+    private owner;
+    constructor(owner: ViewManagerModel<T>);
+    fetchViewInfosAsync(): Promise<ViewInfo[]>;
+    fetchViewAsync(info: ViewInfo): Promise<View<T>>;
+    createViewAsync(name: string, description: string, value: PlainObject): Promise<View<T>>;
+    updateViewInfoAsync(view: ViewInfo, name: string, description: string, isGlobal: boolean): Promise<View<T>>;
+    updateViewValueAsync(view: View<T>, value: Partial<T>): Promise<View<T>>;
+    deleteViewAsync(view: ViewInfo): Promise<void>;
+}

package/cmp/viewmanager/SaveAsDialogModel.ts

@@ -81,7 +81,7 @@ export class SaveAsDialogModel extends HoistModel {
         if (!isValid) return;
 
         try {
-            const ret = await this.parent.createViewAsync(name, description, parent.getValue());
+            const ret = await this.parent.api.createViewAsync(name, description, parent.getValue());
             this.close();
             this.resolveOpen(ret);
         } catch (e) {

package/cmp/viewmanager/ViewManagerModel.ts

@@ -30,6 +30,7 @@ import {ReactNode} from 'react';
 import {SaveAsDialogModel} from './SaveAsDialogModel';
 import {ViewInfo} from './ViewInfo';
 import {View} from './View';
+import {ViewToBlobApi} from './ViewToBlobApi';
 
 export interface ViewManagerConfig {
     /**
@@ -139,6 +140,7 @@ export class ViewManagerModel<T = PlainObject> extends HoistModel {
     }
 
     /** Immutable configuration for this model. */
+    declare persistWith: ViewManagerPersistOptions;
     readonly viewType: string;
     readonly typeDisplayName: string;
     readonly globalDisplayName: string;
@@ -174,25 +176,35 @@ export class ViewManagerModel<T = PlainObject> extends HoistModel {
     saveTask: TaskObserver;
 
     @observable manageDialogOpen = false;
-    @managed readonly saveAsDialogModel: SaveAsDialogModel;
-
-    // Unsaved changes on the current view.
-    @observable.ref private pendingValue: PendingValue<T> = null;
+    @managed saveAsDialogModel: SaveAsDialogModel;
 
-    // Last time changes were pushed to linked persistence providers
-    private lastPushed: number = null;
+    //-----------------------
+    // Private, internal state.
+    //-------------------------
+    /** Unsaved changes on the current view.*/
+    @observable.ref
+    private pendingValue: PendingValue<T> = null;
 
     /**
      * Array of {@link ViewManagerProvider} instances bound to this model. Providers will
      * push themselves onto this array when constructed with a reference to this model. Used to
      * proactively push state to the target components when the model's selected `value` changes.
-     *
      * @internal
      */
     providers: ViewManagerProvider<any>[] = [];
 
-    declare persistWith: ViewManagerPersistOptions;
+    /**
+     * Data access for persisting views
+     * @internal
+     */
+    api: ViewToBlobApi<T>;
+
+    // Last time changes were pushed to linked persistence providers
+    private lastPushed: number = null;
 
+    //---------------
+    // Getters
+    //---------------
     get isValueDirty(): boolean {
         return !!this.pendingValue;
     }
@@ -266,7 +278,6 @@ export class ViewManagerModel<T = PlainObject> extends HoistModel {
         this.enableAutoSave = enableAutoSave;
         this.enableFavorites = enableFavorites;
         this.settleTime = settleTime;
-        this.saveAsDialogModel = new SaveAsDialogModel(this);
         this.initialViewSpec = initialViewSpec;
 
         this.selectTask = TaskObserver.trackLast({
@@ -275,40 +286,15 @@ export class ViewManagerModel<T = PlainObject> extends HoistModel {
         this.saveTask = TaskObserver.trackLast({
             message: `Saving ${this.typeDisplayName}...`
         });
-    }
-
-    private async initAsync() {
-        try {
-            const views = await this.fetchViewInfosAsync();
-            runInAction(() => (this.views = views));
-
-            if (this.persistWith) {
-                this.initPersist(this.persistWith);
-                await when(() => !this.selectTask.isPending);
-            }
 
-            // If the initial view not initialized from persistence, assign it.
-            if (!this.view) {
-                await this.loadViewAsync(this.initialViewSpec?.(views), this.pendingValue);
-            }
-        } catch (e) {
-            // Always ensure at least default view is installed.
-            if (!this.view) this.loadViewAsync(null, this.pendingValue);
-
-            this.handleException(e, {showAlert: false, logOnServer: true});
-        }
-
-        this.addReaction({
-            track: () => [this.pendingValue, this.autoSave],
-            run: () => this.maybeAutoSaveAsync(),
-            debounce: 5 * SECONDS
-        });
+        this.saveAsDialogModel = new SaveAsDialogModel(this);
+        this.api = new ViewToBlobApi(this);
     }
 
     override async doLoadAsync(loadSpec: LoadSpec) {
         try {
             // 1) Update all view info
-            const views = await this.fetchViewInfosAsync();
+            const views = await this.api.fetchViewInfosAsync();
             if (loadSpec.isStale) return;
             runInAction(() => (this.views = views));
 
@@ -344,21 +330,20 @@ export class ViewManagerModel<T = PlainObject> extends HoistModel {
             this.logError('Unexpected conditions for call to save, skipping');
             return;
         }
-        const {pendingValue} = this,
-            {info} = this.view;
+        const {pendingValue, view, api} = this;
         try {
-            if (!(await this.maybeConfirmSaveAsync(info, pendingValue))) {
+            if (!(await this.maybeConfirmSaveAsync(view.info, pendingValue))) {
                 return;
             }
-            const update = await XH.jsonBlobService
-                .updateAsync(info.token, {value: pendingValue.value})
+            const updated = await api
+                .updateViewValueAsync(view, pendingValue.value)
                 .linkTo(this.saveTask);
 
-            this.setAsView(View.fromBlob(update, this));
-            this.noteSuccess(`Saved ${info.typedName}`);
+            this.setAsView(updated);
+            this.noteSuccess(`Saved ${view.info.typedName}`);
         } catch (e) {
             this.handleException(e, {
-                message: `Failed to save ${info.typedName}.  If this persists consider \`Save As...\`.`
+                message: `Failed to save ${view.info.typedName}.  If this persists consider \`Save As...\`.`
             });
         }
         this.refreshAsync();
@@ -451,46 +436,43 @@ export class ViewManagerModel<T = PlainObject> extends HoistModel {
         return null;
     }
 
-    async deleteViewAsync(view: ViewInfo) {
+    //------------------
+    // Implementation
+    //------------------
+    private async initAsync() {
         try {
-            await XH.jsonBlobService.archiveAsync(view.token);
-            this.removeFavorite(view.token);
-        } catch (e) {
-            throw XH.exception({message: `Unable to delete ${view.typedName}`, cause: e});
-        }
-    }
+            const views = await this.api.fetchViewInfosAsync();
+            runInAction(() => (this.views = views));
 
-    async updateViewAsync(view: ViewInfo, name: string, description: string, isGlobal: boolean) {
-        try {
-            await XH.jsonBlobService.updateAsync(view.token, {
-                name: name.trim(),
-                description: description?.trim(),
-                acl: isGlobal ? '*' : null
-            });
-        } catch (e) {
-            throw XH.exception({message: `Unable to update ${view.typedName}`, cause: e});
-        }
-    }
+            if (this.persistWith) {
+                this.initPersist(this.persistWith);
+                await when(() => !this.selectTask.isPending);
+            }
 
-    async createViewAsync(name: string, description: string, value: PlainObject): Promise<View> {
-        try {
-            const blob = await XH.jsonBlobService.createAsync({
-                type: this.viewType,
-                name: name.trim(),
-                description: description?.trim(),
-                value
-            });
-            return View.fromBlob(blob, this);
+            // If the initial view not initialized from persistence, assign it.
+            if (!this.view) {
+                await this.loadViewAsync(this.initialViewSpec?.(views), this.pendingValue);
+            }
         } catch (e) {
-            throw XH.exception({message: `Unable to create ${this.typeDisplayName}`, cause: e});
+            // Always ensure at least default view is installed.
+            if (!this.view) this.loadViewAsync(null, this.pendingValue);
+
+            this.handleException(e, {showAlert: false, logOnServer: true});
         }
+
+        this.addReaction({
+            track: () => [this.pendingValue, this.autoSave],
+            run: () => this.maybeAutoSaveAsync(),
+            debounce: 5 * SECONDS
+        });
     }
 
-    //------------------
-    // Implementation
-    //------------------
-    private loadViewAsync(info: ViewInfo, pendingValue: PendingValue<T> = null): Promise<void> {
-        return this.fetchViewAsync(info)
+    private async loadViewAsync(
+        info: ViewInfo,
+        pendingValue: PendingValue<T> = null
+    ): Promise<void> {
+        return this.api
+            .fetchViewAsync(info)
             .thenAction(latest => {
                 this.setAsView(latest, pendingValue?.token == info?.token ? pendingValue : null);
                 this.providers.forEach(it => it.pushStateToTarget());
@@ -499,44 +481,20 @@ export class ViewManagerModel<T = PlainObject> extends HoistModel {
             .linkTo(this.selectTask);
     }
 
-    private async fetchViewAsync(info: ViewInfo): Promise<View<T>> {
-        if (!info) return View.createDefault();
-        try {
-            const blob = await XH.jsonBlobService.getAsync(info.token);
-            return View.fromBlob(blob, this);
-        } catch (e) {
-            throw XH.exception({message: `Unable to fetch ${info.typedName}`, cause: e});
-        }
-    }
-
-    private async fetchViewInfosAsync(): Promise<ViewInfo[]> {
-        try {
-            const blobs = await XH.jsonBlobService.listAsync({
-                type: this.viewType,
-                includeValue: false
-            });
-            return blobs.map(b => new ViewInfo(b, this));
-        } catch (e) {
-            throw XH.exception({
-                message: `Unable to fetch ${pluralize(this.typeDisplayName)}`,
-                cause: e
-            });
-        }
-    }
-
     private async maybeAutoSaveAsync() {
-        const {pendingValue, isViewAutoSavable, view} = this;
+        const {pendingValue, isViewAutoSavable, view, api} = this;
         if (isViewAutoSavable && pendingValue) {
             try {
-                const raw = await XH.jsonBlobService
-                    .updateAsync(view.token, {value: pendingValue.value})
+                const updated = await api
+                    .updateViewValueAsync(view, pendingValue.value)
                     .linkTo(this.saveTask);
-                this.setAsView(View.fromBlob(raw, this));
+
+                this.setAsView(updated);
             } catch (e) {
                 // TODO: How to alert but avoid for flaky or spam when user editing a deleted view
                 // Keep count and alert server and user once at count n?
                 XH.handleException(e, {
-                    message: `Failing AutoSave for ${this.view.info.typedName}`,
+                    message: `Failing AutoSave for ${view.info.typedName}`,
                     showAlert: false,
                     logOnServer: false
                 });
@@ -586,7 +544,7 @@ export class ViewManagerModel<T = PlainObject> extends HoistModel {
 
     private async maybeConfirmSaveAsync(info: ViewInfo, pendingValue: PendingValue<T>) {
         // Get latest from server for reference
-        const latest = await this.fetchViewAsync(info),
+        const latest = await this.api.fetchViewAsync(info),
             isGlobal = latest.isGlobal,
             isStale = latest.lastUpdated > pendingValue.baseUpdated;
         if (!isStale && !isGlobal) return true;

package/cmp/viewmanager/ViewToBlobApi.ts

@@ -0,0 +1,110 @@
+/*
+ * This file belongs to Hoist, an application development toolkit
+ * developed by Extremely Heavy Industries (www.xh.io | info@xh.io)
+ *
+ * Copyright © 2024 Extremely Heavy Industries Inc.
+ */
+
+import {PlainObject, XH} from '@xh/hoist/core';
+import {pluralize} from '@xh/hoist/utils/js';
+import {ViewInfo} from './ViewInfo';
+import {View} from './View';
+import {ViewManagerModel} from './ViewManagerModel';
+
+/**
+ * Class for accessing and updating views using JSON Blobs Service.
+ *
+ * @internal
+ */
+export class ViewToBlobApi<T> {
+    private owner: ViewManagerModel<T>;
+
+    constructor(owner: ViewManagerModel<T>) {
+        this.owner = owner;
+    }
+
+    //---------------
+    // Load/search.
+    //---------------
+    async fetchViewInfosAsync(): Promise<ViewInfo[]> {
+        const {owner} = this;
+        try {
+            const blobs = await XH.jsonBlobService.listAsync({
+                type: owner.viewType,
+                includeValue: false
+            });
+            return blobs.map(b => new ViewInfo(b, owner));
+        } catch (e) {
+            throw XH.exception({
+                message: `Unable to fetch ${pluralize(owner.typeDisplayName)}`,
+                cause: e
+            });
+        }
+    }
+
+    async fetchViewAsync(info: ViewInfo): Promise<View<T>> {
+        if (!info) return View.createDefault();
+        try {
+            const blob = await XH.jsonBlobService.getAsync(info.token);
+            return View.fromBlob(blob, this.owner);
+        } catch (e) {
+            throw XH.exception({message: `Unable to fetch ${info.typedName}`, cause: e});
+        }
+    }
+
+    //-----------------
+    // Crud
+    //-----------------
+    async createViewAsync(name: string, description: string, value: PlainObject): Promise<View<T>> {
+        const {owner} = this;
+        try {
+            const blob = await XH.jsonBlobService.createAsync({
+                type: owner.viewType,
+                name: name.trim(),
+                description: description?.trim(),
+                value
+            });
+            return View.fromBlob(blob, owner);
+        } catch (e) {
+            throw XH.exception({message: `Unable to create ${owner.typeDisplayName}`, cause: e});
+        }
+    }
+
+    async updateViewInfoAsync(
+        view: ViewInfo,
+        name: string,
+        description: string,
+        isGlobal: boolean
+    ): Promise<View<T>> {
+        try {
+            const blob = await XH.jsonBlobService.updateAsync(view.token, {
+                name: name.trim(),
+                description: description?.trim(),
+                acl: isGlobal ? '*' : null
+            });
+            return View.fromBlob(blob, this.owner);
+        } catch (e) {
+            throw XH.exception({message: `Unable to update ${view.typedName}`, cause: e});
+        }
+    }
+
+    async updateViewValueAsync(view: View<T>, value: Partial<T>): Promise<View<T>> {
+        try {
+            const blob = await XH.jsonBlobService.updateAsync(view.token, {value});
+            return View.fromBlob(blob, this.owner);
+        } catch (e) {
+            throw XH.exception({
+                message: `Unable to update value for ${view.info.typedName}`,
+                cause: e
+            });
+        }
+    }
+
+    async deleteViewAsync(view: ViewInfo) {
+        try {
+            await XH.jsonBlobService.archiveAsync(view.token);
+        } catch (e) {
+            throw XH.exception({message: `Unable to delete ${view.typedName}`, cause: e});
+        }
+    }
+}

package/desktop/cmp/viewmanager/dialog/EditForm.ts

@@ -15,7 +15,7 @@ import {formField} from '@xh/hoist/desktop/cmp/form';
 import {select, textArea, textInput} from '@xh/hoist/desktop/cmp/input';
 import {panel} from '@xh/hoist/desktop/cmp/panel';
 import {toolbar} from '@xh/hoist/desktop/cmp/toolbar';
-import {fmtCompactDate} from '@xh/hoist/format';
+import {fmtDateTime} from '@xh/hoist/format';
 import {Icon} from '@xh/hoist/icon';
 import {startCase} from 'lodash';
 
@@ -98,7 +98,7 @@ export const editForm = hoistCmp.factory({
                         filler(),
                         div({
                             className: 'xh-view-manager__manage-dialog__metadata',
-                            item: `Last Updated: ${fmtCompactDate(lastUpdated)} (${lastUpdatedBy === XH.getUsername() ? 'you' : lastUpdatedBy})`
+                            item: `Last Updated: ${fmtDateTime(lastUpdated)} by ${lastUpdatedBy === XH.getUsername() ? 'you' : lastUpdatedBy}`
                         })
                     ]
                 })

package/desktop/cmp/viewmanager/dialog/ManageDialogModel.ts

@@ -158,7 +158,7 @@ export class ManageDialogModel extends HoistModel {
     ) {
         const {viewManagerModel} = this;
 
-        await viewManagerModel.updateViewAsync(view, name, description, isGlobal);
+        await viewManagerModel.api.updateViewInfoAsync(view, name, description, isGlobal);
         await viewManagerModel.refreshAsync();
         await this.refreshAsync();
 
@@ -200,7 +200,7 @@ export class ManageDialogModel extends HoistModel {
         if (!confirmed) return;
 
         for (const view of views) {
-            await viewManagerModel.deleteViewAsync(view);
+            await viewManagerModel.api.deleteViewAsync(view);
         }
 
         await viewManagerModel.refreshAsync();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xh/hoist",
-  "version": "71.0.0-SNAPSHOT.1733347475493",
+  "version": "71.0.0-SNAPSHOT.1733376295239",
   "description": "Hoist add-on for building and deploying React Applications.",
   "repository": "github:xh/hoist-react",
   "homepage": "https://xh.io",