@xh/hoist 80.0.0-SNAPSHOT.1767799665209 → 80.0.0-SNAPSHOT.1767974090726

package/CHANGELOG.md

@@ -2,6 +2,15 @@
 
 ## 80.0.0-SNAPSHOT - unreleased
 
+### 💥 Breaking Changes
+
+* Completed the refactoring away from `loadModel` to `loadObserver` started in v79:
+    * Renamed `XH.appLoadModel` to `XH.appLoadObserver`. The prior getter remains as an alias but is
+      deprecated and scheduled for removal in v82.
+    * Renamed `AppContainerModel.loadModel` to `loadObserver`. This is primarily an internal model,
+      so there is no deprecated alias. Any app usages should swap to `XH.appLoadObserver`.
+    * Removed additional references to deprecated `loadModel` within Hoist itself.
+
 ## 79.0.0 - 2026-01-05
 
 ### 💥 Breaking Changes
@@ -69,8 +78,8 @@ this release, but is not strictly required.
 
 ### 📚 Libraries
 
-* @blueprintjs/core: `5.10 -> 6.3`
-* @blueprintjs/datetime: `5.3 -> 6.0`
+* @blueprintjs/core: `5.10 → 6.3`
+* @blueprintjs/datetime: `5.3 → 6.0`
 * react-grid-layout `1.5 → 2.1`
 
 ## 78.1.4 - 2025-12-05
@@ -856,8 +865,8 @@ build. That said, we *strongly* recommend taking these same changes into your ap
 ### 📚 Libraries
 
 * @azure/msal-browser `3.17 → 3.23`
-* mobx  `6.9.1 -> 6.13.2`,
-* mobx-react-lite  `3.4.3 -> 4.0.7`,
+* mobx  `6.9 → 6.13`,
+* mobx-react-lite  `3.4 → 4.0`,
 
 ## 67.0.0 - 2024-09-03
 

package/admin/tabs/cluster/instances/services/DetailsPanel.ts

@@ -35,9 +35,9 @@ export const detailsPanel = hoistCmp.factory({
 
 const stats = hoistCmp.factory<DetailsModel>({
     render({model}) {
-        const {stats, lastLoadException, loadModel} = model;
+        const {stats, lastLoadException, loadObserver} = model;
 
-        if (!loadModel.isPending && lastLoadException) {
+        if (!loadObserver.isPending && lastLoadException) {
             return errorMessage({
                 error: lastLoadException,
                 detailsFn: e => XH.exceptionHandler.showExceptionDetails(e)
@@ -46,7 +46,7 @@ const stats = hoistCmp.factory<DetailsModel>({
 
         return isEmpty(stats)
             ? placeholder(
-                  ...(loadModel.isPending
+                  ...(loadObserver.isPending
                       ? []
                       : [Icon.questionCircle(), 'This service does not report any admin stats.'])
               )

package/admin/tabs/cluster/instances/services/ServiceModel.ts

@@ -91,7 +91,7 @@ export class ServiceModel extends BaseInstanceModel {
     }
 
     async clearCachesAsync(entireCluster: boolean) {
-        const {gridModel, instanceName, loadModel} = this,
+        const {gridModel, instanceName, loadObserver} = this,
             {selectedRecords} = gridModel;
 
         if (isEmpty(selectedRecords)) return;
@@ -125,7 +125,7 @@ export class ServiceModel extends BaseInstanceModel {
                     instance: entireCluster ? null : instanceName,
                     names: selectedRecords.map(it => it.data.name)
                 }
-            }).linkTo(loadModel);
+            }).linkTo(loadObserver);
             await this.refreshAsync();
             XH.successToast('Service caches cleared.');
         } catch (e) {

package/appcontainer/AppContainerModel.ts

@@ -76,7 +76,7 @@ export class AppContainerModel extends HoistModel {
     //------------
     // Sub-models
     //------------
-    @managed appLoadModel = TaskObserver.trackAll();
+    @managed appLoadObserver = TaskObserver.trackAll();
     @managed appStateModel = new AppStateModel();
     @managed pageStateModel = new PageStateModel();
     @managed routerModel = new RouterModel();
@@ -250,7 +250,7 @@ export class AppContainerModel extends HoistModel {
 
             // init all models other than Router
             const models = [
-                this.appLoadModel,
+                this.appLoadObserver,
                 this.appStateModel,
                 this.pageStateModel,
                 this.routerModel,
@@ -271,7 +271,7 @@ export class AppContainerModel extends HoistModel {
             ];
             models.forEach((m: any) => m.init?.());
 
-            this.bindInitSequenceToAppLoadModel();
+            this.bindInitSequenceToAppLoadObserver();
 
             this.setDocTitle();
 
@@ -359,10 +359,10 @@ export class AppContainerModel extends HoistModel {
         this.appStateModel.setAppState(nextState);
     }
 
-    private bindInitSequenceToAppLoadModel() {
+    private bindInitSequenceToAppLoadObserver() {
         const terminalStates: AppState[] = ['RUNNING', 'SUSPENDED', 'LOAD_FAILED', 'ACCESS_DENIED'],
             loadingPromise = mobxWhen(() => terminalStates.includes(this.appStateModel.state));
-        loadingPromise.linkTo(this.appLoadModel);
+        loadingPromise.linkTo(this.appLoadObserver);
     }
 
     private setViewportContent(content: string) {

package/appcontainer/AppStateModel.ts

@@ -57,7 +57,7 @@ export class AppStateModel extends HoistModel {
         this.setAppState('SUSPENDED');
         XH.webSocketService.shutdown();
         Timer.cancelAll();
-        XH.appContainerModel.appLoadModel.clear();
+        XH.appContainerModel.appLoadObserver.clear();
     }
 
     checkAccess(): boolean {

package/appcontainer/FeedbackDialogModel.ts

@@ -51,20 +51,18 @@ export class FeedbackDialogModel extends HoistModel {
      * Submit the feedback entry to the activity tracking system.
      */
     async submitAsync() {
-        const {message} = this,
-            {trackService} = XH;
-
+        const {message} = this;
         if (!message) this.hide();
 
         try {
-            trackService.track({
+            XH.trackService.track({
                 category: 'Feedback',
                 message: 'User submitted feedback',
                 data: {
                     userMessage: this.message
                 }
             });
-            trackService.pushPendingAsync().linkTo(XH.appLoadModel);
+            await XH.trackService.pushPendingAsync().linkTo(XH.appLoadObserver);
             XH.successToast('Thank you - your feedback has been sent.');
             this.hide();
         } catch (e) {

package/build/types/appcontainer/AppContainerModel.d.ts

@@ -23,7 +23,7 @@ export declare class AppContainerModel extends HoistModel {
     private initCalled;
     appSpec: AppSpec;
     appModel: HoistAppModel;
-    appLoadModel: TaskObserver;
+    appLoadObserver: TaskObserver;
     appStateModel: AppStateModel;
     pageStateModel: PageStateModel;
     routerModel: RouterModel;
@@ -87,7 +87,7 @@ export declare class AppContainerModel extends HoistModel {
     private startRouter;
     private startOptionsDialog;
     private setAppState;
-    private bindInitSequenceToAppLoadModel;
+    private bindInitSequenceToAppLoadObserver;
     private setViewportContent;
     private getViewportContent;
 }

package/build/types/core/XH.d.ts

@@ -73,8 +73,9 @@ export declare class XHApi {
     webSocketService: WebSocketService;
     /**
      * Tracks globally loading promises.
-     * Apps should link any async operations that should mask the entire viewport to this model.
+     * Apps should link any async operations that should mask the entire viewport to this observer.
      */
+    get appLoadObserver(): TaskObserver;
     get appLoadModel(): TaskObserver;
     /** Root level application model. */
     get appModel(): HoistAppModel;

package/cmp/viewmanager/ViewManagerModel.ts

@@ -281,8 +281,8 @@ export class ViewManagerModel<T = PlainObject> extends HoistModel {
 
     /** True if any async tasks are pending. */
     get isLoading(): boolean {
-        const {loadModel, saveTask, selectTask} = this;
-        return loadModel.isPending || saveTask.isPending || selectTask.isPending;
+        const {loadObserver, saveTask, selectTask} = this;
+        return loadObserver.isPending || saveTask.isPending || selectTask.isPending;
     }
 
     /**

package/core/XH.ts

@@ -31,7 +31,7 @@ import {
     WebSocketService,
     ClientHealthService
 } from '@xh/hoist/svc';
-import {getLogLevel, setLogLevel, LogLevel} from '@xh/hoist/utils/js';
+import {getLogLevel, setLogLevel, LogLevel, apiDeprecated} from '@xh/hoist/utils/js';
 import {camelCase, flatten, isString, uniqueId} from 'lodash';
 import {Router, State} from 'router5';
 import {CancelFn} from 'router5/types/types/base';
@@ -164,10 +164,18 @@ export class XHApi {
     //----------------------------
     /**
      * Tracks globally loading promises.
-     * Apps should link any async operations that should mask the entire viewport to this model.
+     * Apps should link any async operations that should mask the entire viewport to this observer.
      */
+    get appLoadObserver(): TaskObserver {
+        return this.acm.appLoadObserver;
+    }
+
     get appLoadModel(): TaskObserver {
-        return this.acm.appLoadModel;
+        apiDeprecated('XH.appLoadModel', {
+            v: 'v82',
+            msg: 'Use XH.appLoadObserver instead.'
+        });
+        return this.appLoadObserver;
     }
 
     /** Root level application model. */
@@ -439,7 +447,7 @@ export class XHApi {
      */
     @action
     reloadApp(opts?: ReloadAppOptions | string) {
-        never().linkTo(this.appLoadModel);
+        never().linkTo(this.appLoadObserver);
 
         opts = isString(opts) ? {path: opts} : (opts ?? {});
 

package/desktop/appcontainer/AppContainer.ts

@@ -171,7 +171,7 @@ const appContainerView = hoistCmp.factory({
 });
 
 const appLoadMask = hoistCmp.factory<AppContainerModel>(({model}) =>
-    mask({bind: model.appLoadModel, spinner: true})
+    mask({bind: model.appLoadObserver, spinner: true})
 );
 
 const suspendedView = hoistCmp.factory(() => viewport(suspendPanel(), appLoadMask()));

package/desktop/appcontainer/LoginPanel.ts

@@ -25,7 +25,7 @@ export const loginPanel = hoistCmp.factory({
 
     render({model}) {
         const {loginMessage} = XH.appSpec,
-            {loadModel, warning, isValid, loginInProgress} = model;
+            {loadObserver, warning, isValid, loginInProgress} = model;
 
         const onKeyDown = ev => {
             if (ev.key === 'Enter') model.submitAsync();
@@ -40,7 +40,7 @@ export const loginPanel = hoistCmp.factory({
                 icon: Icon.login(),
                 className: 'xh-login',
                 width: 300,
-                mask: loadModel,
+                mask: loadObserver,
                 items: [
                     vspacer(10),
                     form(

package/desktop/cmp/viewmanager/ViewManager.ts

@@ -86,7 +86,7 @@ export const [ViewManager, viewManager] = hoistCmp.withFactory<ViewManagerProps>
         buttonSide = 'right',
         extraMenuItems = []
     }: ViewManagerProps) {
-        const {loadModel} = model,
+        const {loadObserver} = model,
             locModel = useLocalModel(() => new ViewManagerLocalModel(model)),
             save = saveButton({model: locModel, mode: showSaveButton, ...saveButtonProps}),
             revert = revertButton({model: locModel, mode: showRevertButton, ...revertButtonProps}),
@@ -103,7 +103,7 @@ export const [ViewManager, viewManager] = hoistCmp.withFactory<ViewManagerProps>
                     }),
                     ...menuButtonProps
                 }),
-                content: loadModel.isPending
+                content: loadObserver.isPending
                     ? box({
                           item: spinner({compact: true}),
                           alignItems: 'center',

package/mobile/appcontainer/AppContainer.ts

@@ -143,7 +143,7 @@ const appContainerView = hoistCmp.factory<AppContainerModel>({
 });
 
 const appLoadMask = hoistCmp.factory<AppContainerModel>(({model}) =>
-    mask({bind: model.appLoadModel, spinner: true})
+    mask({bind: model.appLoadObserver, spinner: true})
 );
 
 const bannerList = hoistCmp.factory<AppContainerModel>({

package/mobile/appcontainer/LoginPanel.ts

@@ -26,7 +26,7 @@ export const loginPanel = hoistCmp.factory({
 
     render({model}) {
         const {loginMessage} = XH.appSpec,
-            {isValid, loadModel, warning, loginInProgress} = model;
+            {isValid, loadObserver, warning, loginInProgress} = model;
 
         return panel({
             className: 'xh-login',
@@ -34,7 +34,7 @@ export const loginPanel = hoistCmp.factory({
                 toolbar(filler(), XH.clientAppName, filler()),
                 panel({
                     className: 'xh-login__body',
-                    mask: loadModel,
+                    mask: loadObserver,
                     items: [
                         form({
                             className: 'xh-login__fields',

package/package.json

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