feat: Goto Value Improvements

packages/iris-grid/src/GotoRow.scss

@@ -25,7 +25,7 @@
   }
 
   .goto-row-text {
-    width: 10ch;
+    min-width: 10ch;
   }
 
   .goto-row-close {

packages/iris-grid/src/GotoRow.tsx

@@ -91,6 +91,12 @@ function GotoRow({
       e.stopPropagation();
       e.preventDefault();
       onGotoValueSubmit();
+    } else if (
+      e.key === 'Backspace' &&
+      (gotoValue === `${Number.POSITIVE_INFINITY}` ||
+        gotoValue === `${Number.NEGATIVE_INFINITY}`)
+    ) {
+      onGotoValueInputChanged('');
     }
   };
 
@@ -126,13 +132,21 @@ function GotoRow({
           <div className="goto-row-input">
             <input
               ref={gotoValueInputRef}
-              type="number"
               className={classNames('form-control', {
                 'is-invalid': gotoValueError !== '',
               })}
               onKeyDown={handleGotoValueKeyDown}
               placeholder="value"
-              onChange={e => onGotoValueInputChanged(e.target.value)}
+              onChange={e => {
+                const value = e.target.value.toLowerCase();
+                if (/^-?[0-9]*\.?[0-9]*$/.test(e.target.value)) {
+                  onGotoValueInputChanged(e.target.value);
+                } else if (value === '-i' || value === '-infinity') {
+                  onGotoValueInputChanged(`${Number.NEGATIVE_INFINITY}`);
+                } else if (value === 'i' || value === 'infinity') {
+                  onGotoValueInputChanged(`${Number.POSITIVE_INFINITY}`);
+                }
+              }}
               value={gotoValue}
             />
           </div>
@@ -202,6 +216,7 @@ function GotoRow({
               }}
               value={gotoValue}
             >
+              <option aria-label="null value" key="null" value="" />
               <option key="true" value="true">
                 true
               </option>

packages/iris-grid/src/IrisGrid.tsx

@@ -2453,6 +2453,29 @@ export class IrisGrid extends Component<IrisGridProps, IrisGridState> {
       this.focusRowInGrid(row);
       return;
     }
+
+    let cursorRow;
+    let cursorColumn;
+    if (this.grid) {
+      ({ cursorRow, cursorColumn } = this.grid.state);
+    }
+    if (cursorRow != null && cursorColumn != null) {
+      // if a row is selected
+      const { model } = this.props;
+      const { name, type } = model.columns[cursorColumn];
+
+      const cellValue = model.valueForCell(cursorColumn, cursorRow);
+      const text = IrisGridUtils.convertValueToText(cellValue, type);
+      this.setState({
+        isGotoShown: !isGotoShown,
+        gotoRow: `${cursorRow}`,
+        gotoValue: `${text}`,
+        gotoValueSelectedColumnName: name,
+        gotoRowError: '',
+        gotoValueError: '',
+      });
+      return;
+    }
     this.setState({
       isGotoShown: !isGotoShown,
       gotoRow: '',
@@ -3219,18 +3242,19 @@ export class IrisGrid extends Component<IrisGridProps, IrisGridState> {
     if (inputString === '') {
       return;
     }
+    const selectedColumn = IrisGridUtils.getColumnByName(
+      model.columns,
+      selectedColumnName
+    );
 
-    const columnIndex = model.getColumnIndexByName(selectedColumnName);
-    if (columnIndex === undefined) {
+    if (selectedColumn === undefined) {
       return;
     }
 
-    const selectedColumn = model.columns[columnIndex];
-
     let searchFromRow;
 
     if (this.grid) {
-      ({ selectionEndRow: searchFromRow } = this.grid.state);
+      ({ cursorRow: searchFromRow } = this.grid.state);
     }
 
     if (searchFromRow == null) {
@@ -3243,11 +3267,13 @@ export class IrisGrid extends Component<IrisGridProps, IrisGridState> {
       gotoValueSelectedFilter === FilterType.eqIgnoreCase;
 
     try {
+      const { formatter } = model;
       const columnDataType = TableUtils.getNormalizedType(selectedColumn.type);
 
       let rowIndex;
 
       switch (columnDataType) {
+        case TableUtils.dataType.CHAR:
         case TableUtils.dataType.STRING: {
           rowIndex = await model.seekRow(
             isBackwards === true ? searchFromRow - 1 : searchFromRow + 1,
@@ -3261,7 +3287,6 @@ export class IrisGrid extends Component<IrisGridProps, IrisGridState> {
           break;
         }
         case TableUtils.dataType.DATETIME: {
-          const { formatter } = model;
           const [startDate] = DateUtils.parseDateRange(
             inputString,
             formatter.timeZone
@@ -3283,7 +3308,13 @@ export class IrisGrid extends Component<IrisGridProps, IrisGridState> {
             !TableUtils.isBigDecimalType(selectedColumn.type) &&
             !TableUtils.isBigIntegerType(selectedColumn.type)
           ) {
-            const inputValue = parseInt(inputString, 10);
+            let inputValue = parseInt(inputString, 10);
+            if (inputString === '-Infinity') {
+              inputValue = Number.NEGATIVE_INFINITY;
+            } else if (inputString === 'Infinity') {
+              inputValue = Number.POSITIVE_INFINITY;
+            }
+
             rowIndex = await model.seekRow(
               searchFromRow,
               selectedColumn,
@@ -3311,7 +3342,11 @@ export class IrisGrid extends Component<IrisGridProps, IrisGridState> {
             searchFromRow,
             selectedColumn,
             dh.ValueType.STRING,
-            inputString,
+            TableUtils.makeValue(
+              selectedColumn.type,
+              inputString,
+              formatter.timeZone
+            ),
             undefined,
             undefined,
             isBackwards ?? false
@@ -3635,6 +3670,23 @@ export class IrisGrid extends Component<IrisGridProps, IrisGridState> {
   }
 
   handleGotoValueSelectedColumnNameChanged(columnName: ColumnName): void {
+    const { model } = this.props;
+    let cursorRow;
+    if (this.grid) {
+      ({ cursorRow } = this.grid.state);
+    }
+    if (cursorRow != null) {
+      const index = model.getColumnIndexByName(columnName);
+      const column = IrisGridUtils.getColumnByName(model.columns, columnName);
+      assertNotNull(index);
+      const value = model.valueForCell(index, cursorRow);
+      const text = IrisGridUtils.convertValueToText(value, column?.type);
+      this.setState({
+        gotoValueSelectedColumnName: columnName,
+        gotoValue: `${text}`,
+        gotoValueError: '',
+      });
+    }
     this.setState({
       gotoValueSelectedColumnName: columnName,
       gotoValueError: '',

packages/iris-grid/src/IrisGridUtils.ts

@@ -1671,6 +1671,20 @@ class IrisGridUtils {
 
     return { groups: [...groupMap.values()], maxDepth, groupMap, parentMap };
   }
+
+  static convertValueToText(value: unknown, columnName?: string): unknown {
+    if (
+      columnName != null &&
+      TableUtils.isCharType(columnName) &&
+      value != null
+    ) {
+      return String.fromCharCode(parseInt(value as string, 10));
+    }
+    if (value == null) {
+      return '';
+    }
+    return value;
+  }
 }
 
 export default IrisGridUtils;