chore: misc improvements

CB-264

webapp/packages/core-administration/src/AdministrationScreen/ConfigurationWizard/Pages/ServerConfiguration/ServerConfigurationForm.tsx

@@ -73,6 +73,9 @@ export const ServerConfigurationForm = observer(function ServerConfigurationForm
     <SubmittingForm onSubmit={onSave} name='server_config' ref={focusedRef}>
       <box as="div">
         <box-element as='div'>
+          <group as="div">
+            <InputGroup long>{translate('administration_configuration_wizard_configuration_server_info')}</InputGroup>
+          </group>
           <group as="div">
             <InputField
               type="text"

webapp/packages/core-administration/src/locales/en.ts

@@ -7,6 +7,7 @@ export default [
   ['administration_configuration_wizard_configuration', 'Server configuration'],
   ['administration_configuration_wizard_configuration_step_description', 'Server configuration'],
   ['administration_configuration_wizard_configuration_plugins', 'Configuration'],
+  ['administration_configuration_wizard_configuration_server_info', 'Server Info'],
   ['administration_configuration_wizard_configuration_server_name', 'Server Name'],
   ['administration_configuration_wizard_configuration_admin', 'Administrator'],
   ['administration_configuration_wizard_configuration_admin_name', 'Admin user name'],

webapp/packages/core-blocks/src/Loader/Loader.tsx

@@ -66,7 +66,7 @@ export function Loader({
     return null;
   }
 
-  return styled(useStyles(loaderStyles, ...(overlay ? [overlayStyles] : [])))(
+  return styled(useStyles(loaderStyles, overlay && overlayStyles))(
     <loader as="div" className={className} {...use({ small })}>
       <icon as="div"><img src={spinnerURL}/></icon>
       {!hideMessage && <message as="div"><Translate token='ui_processing_loading' /></message>}

webapp/packages/plugin-data-spreadsheet/src/AgGridTable/AgGridTableController.ts

@@ -246,14 +246,14 @@ export const INDEX_COLUMN_DEF: ColDef = {
   headerName: '#',
   colId: `${Number.MAX_SAFE_INTEGER}`,
   field: `${Number.MAX_SAFE_INTEGER}`,
-  valueGetter: 'node.id',
   width: 70,
   pinned: 'left',
   suppressNavigable: true,
   suppressMenu: true,
   editable: false,
   sortable: false,
-  cellRenderer: 'indexCellRenderer',
+  valueGetter: props => props.node.rowIndex + 1,
+  cellRendererSelector: props => ({ component: !props.data ? 'indexCellRenderer' : undefined }),
 };
 
 function mapDataToColumns(columns?: IAgGridCol[]): ColDef[] {

webapp/packages/plugin-data-spreadsheet/src/AgGridTable/IndexCellRenderer.tsx

@@ -6,14 +6,12 @@
  * you may not use this file except in compliance with the License.
  */
 
-import { CellClassParams } from '@ag-grid-community/core';
 import { Loader } from '@cloudbeaver/core-blocks';
 
-export function IndexCellRenderer(props: CellClassParams) {
+export function IndexCellRenderer() {
   return (
     <div style={{ display: 'flex', width: '100%' }}>
-      {!props.data && <Loader small/>}
-      {props.data && props.rowIndex + 1}
+      <Loader small/>
     </div>
   );
 }

webapp/packages/plugin-data-viewer/src/TableViewer/TableFooter/TableFooter.tsx

@@ -7,10 +7,10 @@
  */
 
 import { observer } from 'mobx-react';
-import { useCallback } from 'react';
+import { useCallback, useRef } from 'react';
 import styled, { css, use } from 'reshadow';
 
-import { IconButton } from '@cloudbeaver/core-blocks';
+import { IconButton, SubmittingForm } from '@cloudbeaver/core-blocks';
 import { composes, useStyles } from '@cloudbeaver/core-theming';
 
 import { TableViewerModel } from '../TableViewerModel';
@@ -73,8 +73,9 @@ type TableFooterProps = {
 export const TableFooter = observer(function TableFooter({
   model,
 }: TableFooterProps) {
+  const ref = useRef<HTMLInputElement>(null);
   const handleChange = useCallback(
-    (e: React.ChangeEvent<HTMLInputElement>) => model.setChunkSize(parseInt(e.target.value, 10)),
+    () => ref.current && model.setChunkSize(parseInt(ref.current.value, 10)),
     [model]
   );
 
@@ -84,7 +85,9 @@ export const TableFooter = observer(function TableFooter({
         <IconButton type="button" name='reload' onClick={model.refresh} viewBox=""/>
       </reload>
       <count as="div">
-        <input type="number" value={model.getChunkSize()} onBlur={handleChange} {...use({ mod: 'surface' })} />
+        <SubmittingForm onSubmit={handleChange}>
+          <input type="number" value={model.getChunkSize()} ref={ref} onBlur={handleChange} {...use({ mod: 'surface' })} />
+        </SubmittingForm>
       </count>
       <TableFooterMenu model={model}/>
       {model.requestStatusMessage.length > 0 && (