@xh/hoist 62.0.0 → 62.0.1

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # Changelog
 
+## 62.0.1 - 2024-03-28
+
+### 🐞 New Features
+* New method `clear()` added to `TaskObserver` api.
+
+### 🐞 Bug Fixes
+
+* Ensure application viewport is masked throughout the entire app initialization process.
+
 ## 62.0.0 - 2024-03-19
 
 ### 💥 Breaking Changes (upgrade difficulty: 🟢 TRIVIAL - dependencies only)

package/appcontainer/AppContainerModel.ts

@@ -118,6 +118,8 @@ export class AppContainerModel extends HoistModel {
      * Triggers initial authentication and initialization of Hoist and application.
      */
     async initAsync() {
+        this.setAppState('PRE_AUTH');
+
         // Avoid bug where "Discarded" browser tabs can re-init an old version (see #3574)
         if (window.document['wasDiscarded']) {
             XH.reloadApp();
@@ -151,7 +153,6 @@ export class AppContainerModel extends HoistModel {
 
         try {
             await installServicesAsync(FetchService);
-            this.setAppState('PRE_AUTH');
 
             // consult (optional) pre-auth init for app
             const modelClass: any = this.appSpec.modelClass;

package/appcontainer/AppStateModel.ts

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

package/core/TaskObserver.ts

@@ -90,6 +90,11 @@ export class TaskObserver {
      */
     linkTo(task: TaskObserver) {}
 
+    /**
+     * Clear any tasks currently being observed.
+     */
+    clear() {}
+
     /**
      * This class is abstract and should not be instantiated directly. To get an instance of this
      * class, use static methods trackFirst(), trackLast() or fromPromise().
@@ -155,6 +160,11 @@ class CompoundObserver extends TaskObserver {
             this._subtasks = keep;
         }
     }
+
+    @action
+    override clear() {
+        this._subtasks = [];
+    }
 }
 
 class PromiseObserver extends TaskObserver {
@@ -177,6 +187,11 @@ class PromiseObserver extends TaskObserver {
         return this._message;
     }
 
+    @action
+    override clear() {
+        this._isPending = false;
+    }
+
     constructor(promise, message) {
         super();
         makeObservable(this);

package/desktop/appcontainer/AppContainer.ts

@@ -107,7 +107,7 @@ function viewForState() {
     switch (XH.appState) {
         case 'PRE_AUTH':
         case 'INITIALIZING':
-            return viewport(appLoadMask());
+            return viewport(mask({spinner: true, isDisplayed: true}));
         case 'LOGIN_REQUIRED':
             return loginPanel();
         case 'ACCESS_DENIED':
@@ -170,11 +170,15 @@ const appLoadMask = hoistCmp.factory<AppContainerModel>(({model}) =>
 
 const suspendedView = hoistCmp.factory<AppContainerModel>({
     render({model}) {
+        let ret;
         if (model.appStateModel.suspendData?.reason === 'IDLE') {
             const content = model.appSpec.idlePanel ?? idlePanel;
-            return elementFromContent(content, {onReactivate: () => XH.reloadApp()});
+            ret = elementFromContent(content, {onReactivate: () => XH.reloadApp()});
+        } else {
+            ret = suspendPanel();
         }
-        return suspendPanel();
+
+        return viewport(ret, appLoadMask());
     }
 });
 

package/mobile/appcontainer/AppContainer.ts

@@ -11,13 +11,14 @@ import {createElement, hoistCmp, refreshContextView, uses, XH} from '@xh/hoist/c
 import {installMobileImpls} from '@xh/hoist/dynamics/mobile';
 import {colChooser} from '@xh/hoist/mobile/cmp/grid/impl/ColChooser';
 import {ColChooserModel} from '@xh/hoist/mobile/cmp/grid/impl/ColChooserModel';
-import {zoneMapper} from '@xh/hoist/mobile/cmp/zoneGrid/impl/ZoneMapper';
 import {mask} from '@xh/hoist/mobile/cmp/mask';
+import {pinPadImpl} from '@xh/hoist/mobile/cmp/pinpad/impl/PinPad';
 import {storeFilterFieldImpl} from '@xh/hoist/mobile/cmp/store/impl/StoreFilterField';
 import {tabContainerImpl} from '@xh/hoist/mobile/cmp/tab/impl/TabContainer';
-import {pinPadImpl} from '@xh/hoist/mobile/cmp/pinpad/impl/PinPad';
-import {useOnMount, elementFromContent} from '@xh/hoist/utils/react';
+import {zoneMapper} from '@xh/hoist/mobile/cmp/zoneGrid/impl/ZoneMapper';
+import {elementFromContent, useOnMount} from '@xh/hoist/utils/react';
 import {isEmpty} from 'lodash';
+import {errorMessage} from '../cmp/error/ErrorMessage';
 import {aboutDialog} from './AboutDialog';
 import {banner} from './Banner';
 import {exceptionDialog} from './ExceptionDialog';
@@ -26,12 +27,11 @@ import {idlePanel} from './IdlePanel';
 import {impersonationBar} from './ImpersonationBar';
 import {lockoutPanel} from './LockoutPanel';
 import {loginPanel} from './LoginPanel';
-import {suspendPanel} from './SuspendPanel';
 import {messageSource} from './MessageSource';
 import {optionsDialog} from './OptionsDialog';
+import {suspendPanel} from './SuspendPanel';
 import {toastSource} from './ToastSource';
 import {versionBar} from './VersionBar';
-import {errorMessage} from '../cmp/error/ErrorMessage';
 
 installMobileImpls({
     tabContainerImpl,
@@ -90,7 +90,7 @@ function viewForState() {
     switch (XH.appState) {
         case 'PRE_AUTH':
         case 'INITIALIZING':
-            return viewport(appLoadMask());
+            return viewport(mask({spinner: true, isDisplayed: true}));
         case 'LOGIN_REQUIRED':
             return loginPanel();
         case 'ACCESS_DENIED':
@@ -153,10 +153,14 @@ const bannerList = hoistCmp.factory<AppContainerModel>({
 
 const suspendedView = hoistCmp.factory<AppContainerModel>({
     render({model}) {
+        let ret;
         if (model.appStateModel.suspendData?.reason === 'IDLE') {
             const content = model.appSpec.idlePanel ?? idlePanel;
-            return elementFromContent(content, {onReactivate: () => XH.reloadApp()});
+            ret = elementFromContent(content, {onReactivate: () => XH.reloadApp()});
+        } else {
+            ret = suspendPanel();
         }
-        return suspendPanel();
+
+        return viewport(ret, appLoadMask());
     }
 });

package/package.json

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