Minor updates to Admin Cluster tabs

- Move log file filter/instance selection to top for more visibility
- Tweak a few config dialogs / grid col headers for consistency / extra polish.

Author: amcclain

admin/tabs/cluster/instances/InstancesTabModel.ts

@@ -149,7 +149,7 @@ export class InstancesTabModel extends HoistModel {
                 },
                 {
                     ...usedHeapMb,
-                    headerName: 'Heap (MB)'
+                    headerName: 'Heap (mb)'
                 },
                 {
                     ...usedPctMax,
@@ -214,11 +214,12 @@ export class InstancesTabModel extends HoistModel {
     private async shutdownInstanceAsync(instance: PlainObject) {
         if (
             !(await XH.confirm({
-                message: `Are you SURE you want to shutdown instance ${instance.name}?`,
+                message: `Are you sure you wish to immediately terminate instance ${instance.name}?`,
                 confirmProps: {
                     icon: Icon.skull(),
-                    text: 'Shutdown Now',
+                    text: 'Yes, kill the instance',
                     intent: 'danger',
+                    outlined: true,
                     autoFocus: false
                 }
             }))

admin/tabs/cluster/instances/logs/LogDisplay.ts

@@ -6,12 +6,12 @@
  */
 import {clock} from '@xh/hoist/cmp/clock';
 import {grid} from '@xh/hoist/cmp/grid';
-import {code, filler, fragment, hspacer, label, placeholder} from '@xh/hoist/cmp/layout';
+import {filler, fragment, hspacer, label, placeholder} from '@xh/hoist/cmp/layout';
+import {loadingIndicator} from '@xh/hoist/cmp/loadingindicator';
 import {hoistCmp, uses, XH} from '@xh/hoist/core';
 import {button, modalToggleButton} from '@xh/hoist/desktop/cmp/button';
 import {gridFindField} from '@xh/hoist/desktop/cmp/grid';
 import {numberInput, switchInput, textInput} from '@xh/hoist/desktop/cmp/input';
-import {loadingIndicator} from '@xh/hoist/cmp/loadingindicator';
 import {panel} from '@xh/hoist/desktop/cmp/panel';
 import {toolbar, toolbarSep} from '@xh/hoist/desktop/cmp/toolbar';
 import {Icon} from '@xh/hoist/icon';
@@ -48,7 +48,7 @@ const tbar = hoistCmp.factory<LogDisplayModel>(({model}) => {
         numberInput({
             bind: 'startLine',
             min: 1,
-            width: 80,
+            width: 70,
             disabled: model.tail,
             displayWithCommas: true
         }),
@@ -57,13 +57,13 @@ const tbar = hoistCmp.factory<LogDisplayModel>(({model}) => {
         numberInput({
             bind: 'maxLines',
             min: 1,
-            width: 80,
+            width: 70,
             displayWithCommas: true
         }),
         '-',
         textInput({
             bind: 'pattern',
-            placeholder: 'Filter',
+            placeholder: 'Filter lines...',
             leftIcon: Icon.filter(),
             flex: 1,
             rightElement: fragment(
@@ -85,7 +85,7 @@ const tbar = hoistCmp.factory<LogDisplayModel>(({model}) => {
                 })
             )
         }),
-        gridFindField({flex: 1}),
+        gridFindField({flex: 1, placeholder: 'Find lines...'}),
         '-',
         switchInput({
             bind: 'tail',
@@ -123,16 +123,14 @@ const bbar = hoistCmp.factory<LogDisplayModel>({
             }),
             filler(),
             Icon.clock(),
-            code(
-                clock({
-                    timezone: zone,
-                    format: 'HH:mm',
-                    suffix: fmtTimeZone(zone, offset)
-                })
-            ),
+            clock({
+                timezone: zone,
+                format: 'HH:mm',
+                suffix: fmtTimeZone(zone, offset)
+            }),
             fragment({
                 omit: !logRootPath,
-                items: [toolbarSep(), Icon.folder(), code(logRootPath)]
+                items: [toolbarSep(), Icon.folder({className: 'xh-margin-right'}), logRootPath]
             })
         );
     }

admin/tabs/cluster/instances/logs/LogViewer.ts

@@ -5,8 +5,8 @@
  * Copyright © 2025 Extremely Heavy Industries Inc.
  */
 import {logLevelDialog} from '@xh/hoist/admin/tabs/cluster/instances/logs/levels/LogLevelDialog';
-import {grid} from '@xh/hoist/cmp/grid';
-import {hframe} from '@xh/hoist/cmp/layout';
+import {grid, gridCountLabel} from '@xh/hoist/cmp/grid';
+import {filler, hframe} from '@xh/hoist/cmp/layout';
 import {storeFilterField} from '@xh/hoist/cmp/store';
 import {creates, hoistCmp} from '@xh/hoist/core';
 import {errorMessage} from '@xh/hoist/cmp/error';
@@ -37,9 +37,8 @@ export const logViewer = hoistCmp.factory({
                         side: 'left',
                         defaultSize: 380
                     },
-                    item: grid(),
-                    bbar: [
-                        storeFilterField({flex: 1}),
+                    tbar: [
+                        storeFilterField({flex: 1, placeholder: 'Filter files...'}),
                         select({
                             leftIcon: Icon.server(),
                             bind: 'instanceOnly',
@@ -53,6 +52,8 @@ export const logViewer = hoistCmp.factory({
                             ]
                         })
                     ],
+                    item: grid(),
+                    bbar: [filler(), gridCountLabel({unit: 'log file'})],
                     mask: 'onLoad'
                 }),
                 logDisplay(),

admin/tabs/cluster/instances/logs/LogViewerModel.ts

@@ -13,6 +13,7 @@ import {RecordActionSpec} from '@xh/hoist/data';
 import {compactDateRenderer, fmtNumber} from '@xh/hoist/format';
 import {Icon} from '@xh/hoist/icon';
 import {bindable, makeObservable, observable} from '@xh/hoist/mobx';
+import {pluralize} from '@xh/hoist/utils/js';
 import download from 'downloadjs';
 import {LogDisplayModel} from './LogDisplayModel';
 
@@ -119,7 +120,13 @@ export class LogViewerModel extends BaseInstanceModel {
             if (!count) return;
 
             const confirmed = await XH.confirm({
-                message: `Delete ${count} log files on the server? This cannot be undone.`
+                message: `Are you sure you want to delete ${pluralize('log file', count, true)}? This cannot be undone.`,
+                confirmProps: {
+                    text: `Yes, delete the ${pluralize('file', count)}`,
+                    intent: 'danger',
+                    outlined: true,
+                    autoFocus: false
+                }
             });
             if (!confirmed) return;
 

admin/tabs/cluster/instances/memory/MemoryMonitorModel.ts

@@ -131,6 +131,7 @@ export class MemoryMonitorModel extends BaseInstanceModel {
                 },
                 {
                     groupId: 'GC',
+                    headerName: 'Garbage Collection',
                     headerAlign: 'center',
                     children: [collectionCount, avgCollectionTime, pctCollectionTime]
                 }