@xh/hoist 69.0.0-SNAPSHOT.1728079276919 → 69.0.0-SNAPSHOT.1728081402362

package/CHANGELOG.md

@@ -2,10 +2,6 @@
 
 ## 69.0.0-SNAPSHOT - unreleased
 
-### 🐞 Bug Fixes
-
-* Added a workaround for a bug where Panel drag resizing was broken in Safari.
-
 ### 💥 Breaking Changes (upgrade difficulty: 🟢 LOW )
 * The `INITIALIZING` AppState has been replaced with more fine-grained states (see below).  This
 is not expected to affect any applications.
@@ -16,6 +12,17 @@ is not expected to affect any applications.
 more granular tracking and timing of app startup lifecycle.
 * Improved the default "Loaded App" activity tracking entry with more granular data on load timing.
 
+### ⚙️ Technical
+
+* Improvements to the typing of `HoistBase.addReaction`.  Note that applications may need to adjust
+typescript slightly in calls to this method to conform to the tighter typing.
+
+
+### 🐞 Bug Fixes
+
+* Added a workaround for a bug where Panel drag resizing was broken in Safari.
+
+
 ## 68.1.0 - 2024-09-27
 
 ### 🎁 New Features

package/admin/tabs/cluster/logs/levels/LogLevelDialog.ts

@@ -4,90 +4,39 @@
  *
  * Copyright © 2024 Extremely Heavy Industries Inc.
  */
-import {exportFilenameWithDate} from '@xh/hoist/admin/AdminUtils';
-import {AppModel} from '@xh/hoist/admin/AppModel';
-import * as Col from '@xh/hoist/admin/columns';
-import {LogViewerModel} from '@xh/hoist/admin/tabs/cluster/logs/LogViewerModel';
+import {LogLevelDialogModel} from '@xh/hoist/admin/tabs/cluster/logs/levels/LogLevelDialogModel';
 import {filler, span} from '@xh/hoist/cmp/layout';
-import {hoistCmp} from '@xh/hoist/core';
-import {FieldSpec} from '@xh/hoist/data';
+import {creates, hoistCmp} from '@xh/hoist/core';
 import {button} from '@xh/hoist/desktop/cmp/button';
-import {textInput} from '@xh/hoist/desktop/cmp/input';
 import {panel} from '@xh/hoist/desktop/cmp/panel';
-import {restGrid, RestGridConfig} from '@xh/hoist/desktop/cmp/rest';
+import {restGrid} from '@xh/hoist/desktop/cmp/rest';
 import {Icon} from '@xh/hoist/icon';
 import {dialog} from '@xh/hoist/kit/blueprint';
 
-export const logLevelDialog = hoistCmp.factory<LogViewerModel>(({model}) =>
-    dialog({
-        title: 'Configure Log Levels',
-        icon: Icon.gear(),
-        className: 'xh-admin-app__editor-dialog',
-        isOpen: model.showLogLevelDialog,
-        canOutsideClickClose: false,
-        onClose: () => (model.showLogLevelDialog = false),
-        item: panel({
-            item: restGrid({modelConfig: {...modelSpec, readonly: AppModel.readonly}}),
-            bbar: [
-                Icon.infoCircle(),
-                span('Note - log level adjustments apply to all instances in the cluster'),
-                filler(),
-                button({
-                    text: 'Close',
-                    icon: Icon.close(),
-                    onClick: () => (model.showLogLevelDialog = false)
-                })
-            ]
-        })
-    })
-);
-
-const modelSpec: RestGridConfig = {
-    persistWith: {localStorageKey: 'xhAdminLogLevelState'},
-    colChooserModel: true,
-    enableExport: true,
-    exportOptions: {filename: exportFilenameWithDate('log-levels')},
-    store: {
-        url: 'rest/logLevelAdmin',
-        fieldDefaults: {disableXssProtection: true},
-        fields: [
-            {
-                name: 'name',
-                type: 'string',
-                displayName: 'Package/Class',
-                required: true
-            },
-            {name: 'level', type: 'string', displayName: 'Override', lookupName: 'levels'},
-            {name: 'defaultLevel', type: 'string', displayName: 'Initial', editable: false},
-            {name: 'effectiveLevel', type: 'string', displayName: 'Effective', editable: false},
-            {...(Col.lastUpdated.field as FieldSpec), editable: false},
-            {...(Col.lastUpdatedBy.field as FieldSpec), editable: false}
-        ]
-    },
-    unit: 'log level',
-    filterFields: ['name'],
-    columns: [
-        {field: 'name', width: 400},
-        {field: 'defaultLevel', width: 110},
-        {field: 'level', width: 110},
-        {field: 'effectiveLevel', width: 110},
-        Col.lastUpdated,
-        Col.lastUpdatedBy
-    ],
-    editors: [
-        {
-            field: 'name',
-            formField: {
-                item: textInput({placeholder: 'com.myapp.MyClassWithLogging (or partial path)'})
-            }
-        },
-        {
-            field: 'level',
-            formField: {
-                info: 'Hint - clear to leave at default while keeping record in place to adjust again later.'
-            }
-        },
-        {field: 'lastUpdated'},
-        {field: 'lastUpdatedBy'}
-    ]
-};
+export const logLevelDialog = hoistCmp.factory({
+    model: creates(LogLevelDialogModel),
+    render({model}) {
+        const {parent} = model;
+        return dialog({
+            title: 'Configure Log Levels',
+            icon: Icon.gear(),
+            className: 'xh-admin-app__editor-dialog',
+            isOpen: parent.showLogLevelDialog,
+            canOutsideClickClose: false,
+            onClose: () => (parent.showLogLevelDialog = false),
+            item: panel({
+                item: restGrid(),
+                bbar: [
+                    Icon.infoCircle(),
+                    span('Note - log level adjustments apply to all instances in the cluster'),
+                    filler(),
+                    button({
+                        text: 'Close',
+                        icon: Icon.close(),
+                        onClick: () => (parent.showLogLevelDialog = false)
+                    })
+                ]
+            })
+        });
+    }
+});

package/admin/tabs/cluster/logs/levels/LogLevelDialogModel.ts

@@ -0,0 +1,103 @@
+/*
+ * 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 {exportFilenameWithDate} from '@xh/hoist/admin/AdminUtils';
+import {AppModel} from '@xh/hoist/admin/AppModel';
+import * as Col from '@xh/hoist/admin/columns/Rest';
+import {LogViewerModel} from '@xh/hoist/admin/tabs/cluster/logs/LogViewerModel';
+import {HoistModel, managed, lookup, LoadSpec} from '@xh/hoist/core';
+import {FieldSpec} from '@xh/hoist/data';
+import {textInput} from '@xh/hoist/desktop/cmp/input';
+import {RestGridModel} from '@xh/hoist/desktop/cmp/rest';
+
+/**
+ * @internal
+ */
+export class LogLevelDialogModel extends HoistModel {
+    @lookup(LogViewerModel)
+    parent: LogViewerModel;
+
+    @managed
+    gridModel: RestGridModel;
+
+    constructor() {
+        super();
+        this.gridModel = this.createGridModel();
+
+        // Force a full-reload after any update. Levels cascade, so need to update entire grid
+        const {store} = this.gridModel;
+        this.addReaction({
+            track: () => store.lastLoaded != store.lastUpdated,
+            run: async isUpdated => {
+                if (isUpdated) await store.loadAsync();
+            }
+        });
+    }
+
+    override async doLoadAsync(loadSpec: LoadSpec) {
+        this.gridModel.loadAsync(loadSpec);
+    }
+
+    private createGridModel() {
+        return new RestGridModel({
+            persistWith: {localStorageKey: 'xhAdminLogLevelState'},
+            colChooserModel: true,
+            enableExport: true,
+            exportOptions: {filename: exportFilenameWithDate('log-levels')},
+            readonly: AppModel.readonly,
+            store: {
+                url: 'rest/logLevelAdmin',
+                fieldDefaults: {disableXssProtection: true},
+                fields: [
+                    {
+                        name: 'name',
+                        type: 'string',
+                        displayName: 'Package/Class',
+                        required: true
+                    },
+                    {name: 'level', type: 'string', displayName: 'Override', lookupName: 'levels'},
+                    {name: 'defaultLevel', type: 'string', displayName: 'Initial', editable: false},
+                    {
+                        name: 'effectiveLevel',
+                        type: 'string',
+                        displayName: 'Effective',
+                        editable: false
+                    },
+                    {...(Col.lastUpdated.field as FieldSpec), editable: false},
+                    {...(Col.lastUpdatedBy.field as FieldSpec), editable: false}
+                ]
+            },
+            unit: 'log level',
+            filterFields: ['name'],
+            columns: [
+                {field: 'name', width: 400},
+                {field: 'defaultLevel', width: 110},
+                {field: 'level', width: 110},
+                {field: 'effectiveLevel', width: 110},
+                Col.lastUpdated,
+                Col.lastUpdatedBy
+            ],
+            editors: [
+                {
+                    field: 'name',
+                    formField: {
+                        item: textInput({
+                            placeholder: 'com.myapp.MyClassWithLogging (or partial path)'
+                        })
+                    }
+                },
+                {
+                    field: 'level',
+                    formField: {
+                        info: 'Hint - clear to leave at default while keeping record in place to adjust again later.'
+                    }
+                },
+                {field: 'lastUpdated'},
+                {field: 'lastUpdatedBy'}
+            ]
+        });
+    }
+}

package/build/types/admin/tabs/cluster/logs/levels/LogLevelDialog.d.ts

@@ -1,2 +1,2 @@
-import { LogViewerModel } from '@xh/hoist/admin/tabs/cluster/logs/LogViewerModel';
-export declare const logLevelDialog: import("@xh/hoist/core").ElementFactory<import("@xh/hoist/core").DefaultHoistProps<LogViewerModel>>;
+import { LogLevelDialogModel } from '@xh/hoist/admin/tabs/cluster/logs/levels/LogLevelDialogModel';
+export declare const logLevelDialog: import("@xh/hoist/core").ElementFactory<import("@xh/hoist/core").DefaultHoistProps<LogLevelDialogModel>>;

package/build/types/admin/tabs/cluster/logs/levels/LogLevelDialogModel.d.ts

@@ -0,0 +1,13 @@
+import { LogViewerModel } from '@xh/hoist/admin/tabs/cluster/logs/LogViewerModel';
+import { HoistModel, LoadSpec } from '@xh/hoist/core';
+import { RestGridModel } from '@xh/hoist/desktop/cmp/rest';
+/**
+ * @internal
+ */
+export declare class LogLevelDialogModel extends HoistModel {
+    parent: LogViewerModel;
+    gridModel: RestGridModel;
+    constructor();
+    doLoadAsync(loadSpec: LoadSpec): Promise<void>;
+    private createGridModel;
+}

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

@@ -71,9 +71,10 @@ export declare abstract class HoistBase {
      * @param specs - one or more reactions to add
      * @returns disposer(s) to manually dispose of each created reaction.
      */
+    addReaction<T>(spec: ReactionSpec<T>): IReactionDisposer;
     addReaction<T extends any[]>(...specs: {
         [K in keyof T]: ReactionSpec<T[K]>;
-    }): IReactionDisposer | IReactionDisposer[];
+    }): IReactionDisposer[];
     /**
      * Add and start one or more managed autoruns.
      *

package/core/HoistBase.ts

@@ -137,9 +137,12 @@ export abstract class HoistBase {
      * @param specs - one or more reactions to add
      * @returns disposer(s) to manually dispose of each created reaction.
      */
+    addReaction<T>(spec: ReactionSpec<T>): IReactionDisposer;
     addReaction<T extends any[]>(
         ...specs: {[K in keyof T]: ReactionSpec<T[K]>}
-    ): IReactionDisposer | IReactionDisposer[] {
+    ): IReactionDisposer[];
+
+    addReaction(...specs: ReactionSpec[]): IReactionDisposer | IReactionDisposer[] {
         const disposers = specs.map(s => {
             if (!s) return null;
             let {track, when, run, debounce, ...rest} = s;

package/desktop/cmp/rest/impl/RestGridToolbar.ts

@@ -11,6 +11,7 @@ import {hoistCmp, uses} from '@xh/hoist/core';
 import {exportButton} from '@xh/hoist/desktop/cmp/button';
 import {recordActionBar} from '@xh/hoist/desktop/cmp/record';
 import {toolbar, toolbarSep} from '@xh/hoist/desktop/cmp/toolbar';
+import {refreshButton} from '@xh/hoist/desktop/cmp/button';
 import {castArray, isEmpty, isFunction} from 'lodash';
 import {RestGridModel} from '../RestGridModel';
 
@@ -52,7 +53,8 @@ export const restGridToolbar = hoistCmp.factory({
             exportButton({
                 gridModel,
                 omit: !model.gridModel.enableExport
-            })
+            }),
+            refreshButton({model})
         );
     }
 });

package/package.json

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