@xh/hoist 71.0.0-SNAPSHOT.1736281104503 → 71.0.0-SNAPSHOT.1736297680526

package/CHANGELOG.md

@@ -1,11 +1,11 @@
 # Changelog
 
-## v71.0.0-SNAPSHOT - unreleased
+## v71.0.0 - 2025-01-07
 
-### 💥 Breaking Changes (upgrade 🟢 Medium - Hoist core update, adjust imports)
+### 💥 Breaking Changes (upgrade difficulty: 🟠 MEDIUM - Hoist core update, import adjustments)
 
-* Requires `hoist-core >= 27.0` with new APIs to support `ViewManager` and additional cluster
-  synchronization monitor in admin client.
+* Requires `hoist-core >= 27.0` with new APIs to support `ViewManager` and enhanced cluster state
+  monitoring in the Admin Console.
 * `ErrorMessage` is now cross-platform - update imports from `@xh/hoist/desktop/cmp/error`
   or `@xh/hoist/mobile/cmp/error` to `@xh/hoist/cmp/error`.
 * `Mask` is now cross-platform - update imports from `@xh/hoist/desktop/cmp/mask` or
@@ -19,8 +19,8 @@
 
 ### 🎁 New Features
 
-* Major improvements to ViewManager component, including:
-    * A clearer, better organized view management dialog.
+* Major improvements to the `ViewManager` component, including:
+    * A clearer, better organized management dialog.
     * Support for persisting a view's pending value, to avoid users losing changes when e.g. an app
       goes into idle mode and requires a page refresh to restore.
     * Improved handling of delete / update collisions.
@@ -33,10 +33,10 @@
   ID and access tokens in a single request and to use refresh tokens to maintain access without
   relying on third-party cookies.
 * Updated sorting on grouped grids to place ungrouped items at the bottom.
-* `DashCanvas` views can now be resized left and up in addition to right and down.
-* `FetchService.autoGenCorrelationIds` now supports a functional form for per-request behavior.
-* New `Objects` tab in admin client supports comparing state across the cluster, and flagging any
-  persistent state inconsistencies.
+* Improved `DashCanvas` views to support resizing from left/top edges in addition to right/bottom.
+* Added functional form of `FetchService.autoGenCorrelationIds` for per-request behavior.
+* Added a new `Cluster›Objects` tab in Admin Console to support comparing state across the cluster
+  and alerting of any persistent state inconsistencies.
 
 ### 🐞 Bug Fixes
 
@@ -64,7 +64,7 @@
 
 * @azure/msal-browser `3.27 → 3.28`
 * dompurify `3.1 → 3.2`
-* react-grid-layout `1.4.3 → 1.5.0`
+* react-grid-layout `1.4 → 1.5`
 
 ## v70.0.0 - 2024-11-15
 

package/admin/tabs/cluster/ClusterTab.ts

@@ -16,8 +16,8 @@ export const clusterTab = hoistCmp.factory(() =>
             route: 'default.cluster',
             switcher: {orientation: 'left', testId: 'cluster-tab-switcher'},
             tabs: [
-                {id: 'instances', icon: Icon.info(), content: instancesTab},
-                {id: 'objects', icon: Icon.diff(), content: clusterObjectsPanel}
+                {id: 'instances', icon: Icon.server(), content: instancesTab},
+                {id: 'objects', icon: Icon.boxFull(), content: clusterObjectsPanel}
             ]
         }
     })

package/admin/tabs/cluster/objects/ClusterObjects.scss

@@ -16,10 +16,3 @@
 .xh-cluster-objects-cell-success {
   background-color: var(--xh-intent-success-trans1) !important;
 }
-
-.xh-cluster-objects-result-count {
-  align-items: center;
-  .xh-icon {
-    margin-right: 0.5em;
-  }
-}

package/admin/tabs/cluster/objects/ClusterObjectsPanel.ts

@@ -5,7 +5,7 @@
  * Copyright © 2025 Extremely Heavy Industries Inc.
  */
 import {grid} from '@xh/hoist/cmp/grid';
-import {div, filler, hframe, label} from '@xh/hoist/cmp/layout';
+import {filler, fragment, hframe, label} from '@xh/hoist/cmp/layout';
 import {relativeTimestamp} from '@xh/hoist/cmp/relativetimestamp';
 import {storeFilterField} from '@xh/hoist/cmp/store';
 import {creates, hoistCmp} from '@xh/hoist/core';
@@ -49,49 +49,56 @@ const tbar = hoistCmp.factory<ClusterObjectsModel>(({model}) => {
     return toolbar(
         diffBar({omit: isSingleInstance}),
         filler(),
-        'As of',
+        label('As of'),
         relativeTimestamp({bind: 'startTimestamp'}),
-        toolbarSep(),
-        'Took ',
-        fmtNumber(model.runDurationMs, {label: 'ms'})
+        '-',
+        label('Took '),
+        fmtNumber(model.runDurationMs, {label: 'ms'}),
+        '-',
+        storeFilterField({
+            matchMode: 'any',
+            autoApply: false,
+            onFilterChange: f => (model.textFilter = f)
+        }),
+        exportButton()
     );
 });
 
 const diffBar = hoistCmp.factory<ClusterObjectsModel>(({model}) => {
     const {counts} = model;
-    return [
-        switchInput({
-            label: 'Hide unchecked',
-            bind: 'hideUnchecked'
-        }),
-        div({
-            className: 'xh-cluster-objects-result-count',
+    return fragment(
+        Icon.diff(),
+        label('Cross-instance comparisons'),
+        fragment({
             omit: !counts.failed,
             items: [
                 toolbarSep(),
-                Icon.error({prefix: 'fas', className: 'xh-red'}),
-                label(`${counts.failed} Failed`)
+                Icon.diff({prefix: 'fas', intent: 'danger'}),
+                label(`${counts.failed} diffs`)
             ]
         }),
-        div({
-            className: 'xh-cluster-objects-result-count',
+        fragment({
             omit: !counts.passed,
             items: [
                 toolbarSep(),
-                Icon.checkCircle({prefix: 'fas', className: 'xh-green'}),
-                label(`${counts.passed} OK`)
+                Icon.checkCircle({prefix: 'fas', intent: 'success'}),
+                label(`${counts.passed} in-sync`)
             ]
         }),
-        div({
-            className: 'xh-cluster-objects-result-count',
-            omit: !counts.unchecked || model.hideUnchecked,
+        fragment({
+            omit: !counts.unchecked,
             items: [
                 toolbarSep(),
-                Icon.disabled({prefix: 'fas', className: 'xh-gray'}),
-                label(`${counts.unchecked} Unchecked`)
+                Icon.disabled({prefix: 'fas', className: 'xh-text-color-muted'}),
+                label(`${counts.unchecked} unchecked`)
             ]
+        }),
+        toolbarSep(),
+        switchInput({
+            label: 'w/Comparisons only',
+            bind: 'hideUnchecked'
         })
-    ];
+    );
 });
 
 const bbar = hoistCmp.factory<ClusterObjectsModel>(({model}) => {
@@ -102,13 +109,6 @@ const bbar = hoistCmp.factory<ClusterObjectsModel>(({model}) => {
             intent: 'warning',
             tooltip: 'Clear the Hibernate caches using the native Hibernate API',
             onClick: () => model.clearAllHibernateCachesAsync()
-        }),
-        filler(),
-        storeFilterField({
-            matchMode: 'any',
-            autoApply: false,
-            onFilterChange: f => (model.textFilter = f)
-        }),
-        exportButton()
+        })
     );
 });

package/admin/tabs/cluster/objects/DetailModel.ts

@@ -9,7 +9,7 @@ import {ColumnSpec, GridModel} from '@xh/hoist/cmp/grid';
 import {HoistModel, lookup, managed, PlainObject, XH} from '@xh/hoist/core';
 import {StoreRecord} from '@xh/hoist/data';
 import {fmtDateTimeSec, fmtJson} from '@xh/hoist/format';
-import {makeObservable, action, observable} from '@xh/hoist/mobx';
+import {action, makeObservable, observable} from '@xh/hoist/mobx';
 import {DAYS} from '@xh/hoist/utils/datetime';
 import {
     cloneDeep,

package/admin/tabs/cluster/objects/DetailPanel.ts

@@ -18,11 +18,11 @@ export const detailPanel = hoistCmp.factory({
 
     render({model}) {
         const {instanceName, selectedAdminStats, objectName, objectType} = model;
-        if (!objectName) return placeholder(Icon.grip(), 'Select an object');
+        if (!objectName) return placeholder(Icon.grip(), 'Select an object to view details...');
 
         return panel({
             title: `${objectType} - ${objectName}`,
-            icon: Icon.diff(),
+            icon: getIcon(objectType),
             compactHeader: true,
             items: [
                 grid({flex: 1}),
@@ -49,3 +49,14 @@ export const detailPanel = hoistCmp.factory({
         });
     }
 });
+
+const getIcon = (objType: string) => {
+    switch (objType) {
+        case 'Service':
+            return Icon.gears();
+        case 'Topic':
+            return Icon.mail();
+    }
+
+    return Icon.database();
+};

package/admin/tabs/monitor/MonitorTab.ts

@@ -85,7 +85,7 @@ const tbar = hoistCmp.factory<MonitorTabModel>(({model}) => {
             className: getClassName(!failed),
             items: [
                 toolbarSep(),
-                Icon.error({prefix: 'fas', className: 'xh-red'}),
+                Icon.error({prefix: 'fas', intent: 'danger'}),
                 label(`${failed} failed`)
             ]
         }),
@@ -93,7 +93,7 @@ const tbar = hoistCmp.factory<MonitorTabModel>(({model}) => {
             className: getClassName(!warned),
             items: [
                 toolbarSep(),
-                Icon.warning({prefix: 'fas', className: 'xh-orange'}),
+                Icon.warning({prefix: 'fas', intent: 'warning'}),
                 label(`${warned} warned`)
             ]
         }),
@@ -101,7 +101,7 @@ const tbar = hoistCmp.factory<MonitorTabModel>(({model}) => {
             className: getClassName(!passed),
             items: [
                 toolbarSep(),
-                Icon.checkCircle({prefix: 'fas', className: 'xh-green'}),
+                Icon.checkCircle({prefix: 'fas', intent: 'success'}),
                 label(`${passed} passed`)
             ]
         }),
@@ -109,7 +109,7 @@ const tbar = hoistCmp.factory<MonitorTabModel>(({model}) => {
             className: getClassName(!inactive),
             items: [
                 toolbarSep(),
-                Icon.disabled({prefix: 'fas', className: 'xh-gray'}),
+                Icon.disabled({prefix: 'fas', className: 'xh-text-color-muted'}),
                 label(`${inactive} inactive`)
             ]
         }),

package/package.json

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