Misc Admin Console tweaks

+ Better sizing defaults for memory/JDBC charts + Dist objects grid expanded by default
xh · Oct 16, 2024 · e842f41 · e842f41
1 parent 1a7f185
commit e842f41
Show file tree

Hide file tree

Showing 8 changed files with 17 additions and 13 deletions.
diff --git a/admin/columns/Tracking.ts b/admin/columns/Tracking.ts
@@ -238,7 +238,8 @@ function badgeRenderer(v) {
     return v
         ? badge({
               item: v,
-              className: 'xh-font-family-mono xh-title-tip',
+              className: 'xh-font-family-mono',
+              style: {cursor: 'copy'},
               title: 'Double-click to copy',
               onDoubleClick: () => {
                   copy(v);

diff --git a/admin/tabs/cluster/ClusterTab.ts b/admin/tabs/cluster/ClusterTab.ts
@@ -47,6 +47,7 @@ export const detailPanel = hoistCmp.factory<ClusterTabModel>({
         return panel({
             compactHeader: true,
             tbar: [
+                Icon.server(),
                 box({width: 150, item: model.formatInstance(instance)}),
                 hspacer(25),
                 tabSwitcher()

diff --git a/admin/tabs/cluster/ClusterTabModel.ts b/admin/tabs/cluster/ClusterTabModel.ts
@@ -7,8 +7,8 @@
 import {AppModel} from '@xh/hoist/admin/AppModel';
 import {timestampNoYear} from '@xh/hoist/admin/columns';
 import {connPoolMonitorPanel} from '@xh/hoist/admin/tabs/cluster/connpool/ConnPoolMonitorPanel';
+import {distributedObjectsPanel} from '@xh/hoist/admin/tabs/cluster/distobjects/DistributedObjectsPanel';
 import {serverEnvPanel} from '@xh/hoist/admin/tabs/cluster/environment/ServerEnvPanel';
-import {hzObjectPanel} from '@xh/hoist/admin/tabs/cluster/hzobject/HzObjectPanel';
 import {logViewer} from '@xh/hoist/admin/tabs/cluster/logs/LogViewer';
 import {usedHeapMb, usedPctMax} from '@xh/hoist/admin/tabs/cluster/memory/MemoryMonitorModel';
 import {memoryMonitorPanel} from '@xh/hoist/admin/tabs/cluster/memory/MemoryMonitorPanel';
@@ -180,7 +180,7 @@ export class ClusterTabModel extends HoistModel {
                     id: 'objects',
                     title: 'Distributed Objects',
                     icon: Icon.grip(),
-                    content: hzObjectPanel
+                    content: distributedObjectsPanel
                 },
                 {id: 'webSockets', title: 'WebSockets', icon: Icon.bolt(), content: webSocketPanel}
             ]

diff --git a/admin/tabs/cluster/connpool/ConnPoolMonitorPanel.ts b/admin/tabs/cluster/connpool/ConnPoolMonitorPanel.ts
@@ -34,7 +34,7 @@ export const connPoolMonitorPanel = hoistCmp.factory({
                     panel({
                         modelConfig: {
                             side: 'bottom',
-                            defaultSize: 400
+                            defaultSize: '50%'
                         },
                         item: chart()
                     })

diff --git a/admin/tabs/cluster/hzobject/HzObjectModel.ts → ...er/distobjects/DistributedObjectsModel.ts b/admin/tabs/cluster/hzobject/HzObjectModel.ts → ...er/distobjects/DistributedObjectsModel.ts
@@ -18,7 +18,7 @@ import {Icon} from '@xh/hoist/icon';
 import {bindable, makeObservable} from '@xh/hoist/mobx';
 import {first, isEmpty, last} from 'lodash';
 
-export class HzObjectModel extends BaseInstanceModel {
+export class DistributedObjectsModel extends BaseInstanceModel {
     @bindable groupBy: 'type' | 'owner' = 'owner';
 
     @managed detailPanelModel = new PanelModel({

diff --git a/admin/tabs/cluster/hzobject/HzObjectPanel.ts → ...er/distobjects/DistributedObjectsPanel.ts b/admin/tabs/cluster/hzobject/HzObjectPanel.ts → ...er/distobjects/DistributedObjectsPanel.ts
@@ -14,16 +14,17 @@ import {panel} from '@xh/hoist/desktop/cmp/panel';
 import {toolbar} from '@xh/hoist/desktop/cmp/toolbar';
 import {recordActionBar} from '@xh/hoist/desktop/cmp/record';
 import {Icon} from '@xh/hoist/icon';
-import {HzObjectModel} from './HzObjectModel';
+import {DistributedObjectsModel} from './DistributedObjectsModel';
 
-export const hzObjectPanel = hoistCmp.factory({
-    model: creates(HzObjectModel),
+export const distributedObjectsPanel = hoistCmp.factory({
+    displayName: 'DistributedObjectsPanel',
+    model: creates(DistributedObjectsModel),
 
     render({model}) {
         return panel({
             item: hframe(
                 panel({
-                    item: grid({agOptions: {groupDefaultExpanded: 0}}),
+                    item: grid(),
                     bbar: bbar()
                 }),
                 detailsPanel()
@@ -35,7 +36,7 @@ export const hzObjectPanel = hoistCmp.factory({
 });
 
 const detailsPanel = hoistCmp.factory({
-    model: uses(HzObjectModel),
+    model: uses(DistributedObjectsModel),
     render({model}) {
         const record = model.gridModel.selectedRecord;
         return panel({
@@ -62,7 +63,7 @@ const detailsPanel = hoistCmp.factory({
     }
 });
 
-const bbar = hoistCmp.factory<HzObjectModel>({
+const bbar = hoistCmp.factory<DistributedObjectsModel>({
     render({model}) {
         return toolbar(
             recordActionBar({

diff --git a/admin/tabs/cluster/logs/LogViewer.ts b/admin/tabs/cluster/logs/LogViewer.ts
@@ -41,8 +41,9 @@ export const logViewer = hoistCmp.factory({
                     bbar: [
                         storeFilterField({flex: 1}),
                         select({
+                            leftIcon: Icon.server(),
                             bind: 'instanceOnly',
-                            width: 90,
+                            width: 110,
                             enableFilter: false,
                             hideDropdownIndicator: true,
                             hideSelectedOptionCheck: true,

diff --git a/admin/tabs/cluster/memory/MemoryMonitorPanel.ts b/admin/tabs/cluster/memory/MemoryMonitorPanel.ts
@@ -35,7 +35,7 @@ export const memoryMonitorPanel = hoistCmp.factory({
                 panel({
                     modelConfig: {
                         side: 'bottom',
-                        defaultSize: 400
+                        defaultSize: '50%'
                     },
                     item: chart()
                 })