From 42fea7bf7daa963298e2d9d0592b63c44eaed611 Mon Sep 17 00:00:00 2001
From: Tony Zhou <tonyzhou@deephaven.io>
Date: Mon, 20 Mar 2023 10:17:11 -0400
Subject: [PATCH 1/5] fix

---
 packages/components/src/DateTimeInput.tsx | 11 ++++++++++-
 packages/components/src/MaskedInput.tsx   |  9 +++++++--
 packages/iris-grid/src/GotoRow.tsx        |  5 +++++
 packages/iris-grid/src/IrisGrid.tsx       |  6 ++++--
 4 files changed, 26 insertions(+), 5 deletions(-)

diff --git a/packages/components/src/DateTimeInput.tsx b/packages/components/src/DateTimeInput.tsx
index 154e4fd718..5d3a76bbdd 100644
--- a/packages/components/src/DateTimeInput.tsx
+++ b/packages/components/src/DateTimeInput.tsx
@@ -1,4 +1,4 @@
-import React, { useCallback, useState } from 'react';
+import React, { KeyboardEvent, useCallback, useState } from 'react';
 import classNames from 'classnames';
 import Log from '@deephaven/log';
 import MaskedInput, { SelectionSegment } from './MaskedInput';
@@ -23,6 +23,7 @@ type DateTimeInputProps = {
   defaultValue?: string;
   onFocus?(): void;
   onBlur?(): void;
+  onSubmit?(event?: KeyboardEvent<HTMLInputElement>): void;
   'data-testid'?: string;
 };
 
@@ -54,6 +55,7 @@ const DateTimeInput = React.forwardRef<HTMLInputElement, DateTimeInputProps>(
       defaultValue = '',
       onFocus = () => undefined,
       onBlur = () => undefined,
+      onSubmit,
       'data-testid': dataTestId,
     } = props;
     const [value, setValue] = useState(
@@ -61,6 +63,12 @@ const DateTimeInput = React.forwardRef<HTMLInputElement, DateTimeInputProps>(
     );
     const [selection, setSelection] = useState<SelectionSegment>();
 
+    const handleSubmit = useCallback(
+      (event: KeyboardEvent<HTMLInputElement>): void => {
+        onSubmit?.(event);
+      },
+      [onSubmit]
+    );
     const handleChange = useCallback(
       (newValue: string): void => {
         log.debug('handleChange', newValue);
@@ -90,6 +98,7 @@ const DateTimeInput = React.forwardRef<HTMLInputElement, DateTimeInputProps>(
           getNextSegmentValue={getNextSegmentValue}
           onChange={handleChange}
           onSelect={setSelection}
+          onSubmit={handleSubmit}
           pattern={FULL_DATE_PATTERN}
           placeholder={FULL_DATE_FORMAT}
           selection={selection}
diff --git a/packages/components/src/MaskedInput.tsx b/packages/components/src/MaskedInput.tsx
index 24183ac814..3e5b68007c 100644
--- a/packages/components/src/MaskedInput.tsx
+++ b/packages/components/src/MaskedInput.tsx
@@ -1,4 +1,4 @@
-import React, { useMemo, useEffect, useCallback } from 'react';
+import React, { useMemo, useEffect, useCallback, KeyboardEvent } from 'react';
 import classNames from 'classnames';
 import Log from '@deephaven/log';
 import { useForwardedRef } from '@deephaven/react-hooks';
@@ -88,6 +88,8 @@ type MaskedInputProps = {
   onChange?(value: string): void;
   /** Called when selection changes */
   onSelect?(segment: SelectionSegment): void;
+  /** Called when enter is pressed */
+  onSubmit?(event?: KeyboardEvent<HTMLInputElement>): void;
   /** Retrieve the next value for a provided segment */
   getNextSegmentValue?(
     segment: SelectionSegment,
@@ -124,6 +126,7 @@ const MaskedInput = React.forwardRef<HTMLInputElement, MaskedInputProps>(
       getPreferredReplacementString = DEFAULT_GET_PREFERRED_REPLACEMENT_STRING,
       onChange = () => false,
       onSelect = () => false,
+      onSubmit,
       pattern,
       placeholder,
       selection,
@@ -428,7 +431,9 @@ const MaskedInput = React.forwardRef<HTMLInputElement, MaskedInputProps>(
         );
         return;
       }
-
+      if (key === 'Enter') {
+        onSubmit?.(event);
+      }
       if (key.startsWith('Arrow')) {
         handleArrowKey(event);
         return;
diff --git a/packages/iris-grid/src/GotoRow.tsx b/packages/iris-grid/src/GotoRow.tsx
index 9ea5e63b4b..af8311ed9d 100644
--- a/packages/iris-grid/src/GotoRow.tsx
+++ b/packages/iris-grid/src/GotoRow.tsx
@@ -46,6 +46,7 @@ interface GotoRowProps {
 
   gotoValueSelectedColumnName: ColumnName;
   gotoValue: string;
+  gotoValueFilter: FilterTypeValue;
   onGotoValueSelectedColumnNameChanged: (columnName: ColumnName) => void;
   onGotoValueSelectedFilterChanged: (filter: FilterTypeValue) => void;
   onGotoValueChanged: (input: string) => void;
@@ -67,6 +68,7 @@ function GotoRow({
   onClose,
   gotoValueSelectedColumnName,
   gotoValue,
+  gotoValueFilter,
   onGotoValueSelectedColumnNameChanged,
   onGotoValueSelectedFilterChanged,
   onGotoValueChanged,
@@ -163,6 +165,7 @@ function GotoRow({
         return (
           <div className="goto-value-date-time-input">
             <DateTimeInput
+              ref={gotoValueInputRef}
               className={classNames(
                 'form-control',
                 'goto-value-date-time-input',
@@ -172,6 +175,7 @@ function GotoRow({
               )}
               defaultValue={gotoValue}
               onChange={onGotoValueInputChanged}
+              onSubmit={handleGotoValueKeyDown}
             />
           </div>
         );
@@ -186,6 +190,7 @@ function GotoRow({
                     event.target.value as FilterTypeValue
                   );
                 }}
+                value={gotoValueFilter}
               >
                 <option key={FilterType.eq} value={FilterType.eq}>
                   Equals
diff --git a/packages/iris-grid/src/IrisGrid.tsx b/packages/iris-grid/src/IrisGrid.tsx
index 7acccd5c89..a8154e20a5 100644
--- a/packages/iris-grid/src/IrisGrid.tsx
+++ b/packages/iris-grid/src/IrisGrid.tsx
@@ -3336,7 +3336,7 @@ export class IrisGrid extends Component<IrisGridProps, IrisGridState> {
         case TableUtils.dataType.CHAR:
         case TableUtils.dataType.STRING: {
           rowIndex = await model.seekRow(
-            isBackwards === true ? searchFromRow - 1 : searchFromRow + 1,
+            searchFromRow,
             selectedColumn,
             dh.ValueType.STRING,
             inputString,
@@ -3352,7 +3352,7 @@ export class IrisGrid extends Component<IrisGridProps, IrisGridState> {
             formatter.timeZone
           );
           rowIndex = await model.seekRow(
-            isBackwards === true ? searchFromRow - 1 : searchFromRow + 1,
+            searchFromRow,
             selectedColumn,
             dh.ValueType.DATETIME,
             startDate,
@@ -3930,6 +3930,7 @@ export class IrisGrid extends Component<IrisGridProps, IrisGridState> {
       gotoValueError,
       gotoValueSelectedColumnName,
       gotoValue,
+      gotoValueSelectedFilter,
     } = this.state;
     if (!isReady) {
       return null;
@@ -4557,6 +4558,7 @@ export class IrisGrid extends Component<IrisGridProps, IrisGridState> {
             onExited={this.handleAnimationEnd}
             gotoValueSelectedColumnName={gotoValueSelectedColumnName}
             gotoValue={gotoValue}
+            gotoValueFilter={gotoValueSelectedFilter}
             onGotoValueSelectedColumnNameChanged={
               this.handleGotoValueSelectedColumnNameChanged
             }

From 5107246375b614478bc9a544f7dba95179745321 Mon Sep 17 00:00:00 2001
From: Tony Zhou <tonyzhou@deephaven.io>
Date: Mon, 20 Mar 2023 10:48:53 -0400
Subject: [PATCH 2/5] added tests

---
 .../components/src/DateTimeInput.test.tsx     | 22 ++++++++++++++++++-
 1 file changed, 21 insertions(+), 1 deletion(-)

diff --git a/packages/components/src/DateTimeInput.test.tsx b/packages/components/src/DateTimeInput.test.tsx
index 5e177ba3c7..26d2b0b068 100644
--- a/packages/components/src/DateTimeInput.test.tsx
+++ b/packages/components/src/DateTimeInput.test.tsx
@@ -12,8 +12,15 @@ const F = '\u2007';
 function makeDateTimeInput({
   value = DEFAULT_DATE_TIME,
   onChange = jest.fn(),
+  onSubmit = jest.fn(),
 } = {}) {
-  return render(<DateTimeInput defaultValue={value} onChange={onChange} />);
+  return render(
+    <DateTimeInput
+      defaultValue={value}
+      onChange={onChange}
+      onSubmit={onSubmit}
+    />
+  );
 }
 
 it('mounts and unmounts properly', () => {
@@ -138,3 +145,16 @@ describe('addSeparators', () => {
     expect(addSeparators('2022-02-22')).toBe(`2022-02-22`);
   });
 });
+
+it('onSubmit works correctly', async () => {
+  const onSubmit = jest.fn();
+  const { unmount } = makeDateTimeInput({
+    value: '2022-02-22 00:00:00.000',
+    onSubmit,
+  });
+  const input: HTMLInputElement = screen.getByRole('textbox');
+  const user = userEvent.setup();
+  await user.type(input, '{enter}');
+  expect(onSubmit).toBeCalledTimes(1);
+  unmount();
+});

From 11378a0657140b910dab3e1b89282d6c8be74ca7 Mon Sep 17 00:00:00 2001
From: Tony Zhou <tonyzhou@deephaven.io>
Date: Mon, 20 Mar 2023 10:53:57 -0400
Subject: [PATCH 3/5] more test

---
 packages/components/src/MaskedInput.test.tsx | 21 ++++++++++++++++++--
 1 file changed, 19 insertions(+), 2 deletions(-)

diff --git a/packages/components/src/MaskedInput.test.tsx b/packages/components/src/MaskedInput.test.tsx
index b0172d19cf..7059847f34 100644
--- a/packages/components/src/MaskedInput.test.tsx
+++ b/packages/components/src/MaskedInput.test.tsx
@@ -1,5 +1,6 @@
 import React from 'react';
-import { render } from '@testing-library/react';
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import MaskedInput, { fillToLength, trimTrailingMask } from './MaskedInput';
 
 const TIME_PATTERN = '([01][0-9]|2[0-3]):[0-5][0-9]:[0-5][0-9]';
@@ -8,12 +9,28 @@ function makeMaskedInput({
   value = '00:00:00',
   pattern = TIME_PATTERN,
   example = '12:34:56',
+  onSubmit = jest.fn(),
 } = {}) {
   return render(
-    <MaskedInput value={value} pattern={pattern} example={example} />
+    <MaskedInput
+      value={value}
+      pattern={pattern}
+      example={example}
+      onSubmit={onSubmit}
+    />
   );
 }
 
+it('mounts and unmounts properly', async () => {
+  const onSubmit = jest.fn();
+  const { unmount } = makeMaskedInput({ onSubmit });
+  const input: HTMLInputElement = screen.getByRole('textbox');
+  const user = userEvent.setup();
+  await user.type(input, '{enter}');
+  expect(onSubmit).toBeCalledTimes(1);
+  unmount();
+});
+
 it('mounts and unmounts properly', () => {
   const { unmount } = makeMaskedInput();
   unmount();

From 7a669d99c480cbb6d59aba0d751ec5df3dcb166d Mon Sep 17 00:00:00 2001
From: Tony Zhou <tonyzhou@deephaven.io>
Date: Mon, 20 Mar 2023 11:44:01 -0400
Subject: [PATCH 4/5] improved style

---
 packages/components/src/DateTimeInput.tsx    |  8 +-------
 packages/components/src/MaskedInput.test.tsx | 12 ++++++------
 packages/components/src/MaskedInput.tsx      |  1 +
 packages/iris-grid/src/GotoRow.tsx           | 16 +++++++---------
 4 files changed, 15 insertions(+), 22 deletions(-)

diff --git a/packages/components/src/DateTimeInput.tsx b/packages/components/src/DateTimeInput.tsx
index 3af5d0a0ac..ddb10053cb 100644
--- a/packages/components/src/DateTimeInput.tsx
+++ b/packages/components/src/DateTimeInput.tsx
@@ -59,12 +59,6 @@ const DateTimeInput = React.forwardRef<HTMLInputElement, DateTimeInputProps>(
     );
     const [selection, setSelection] = useState<SelectionSegment>();
 
-    const handleSubmit = useCallback(
-      (event: KeyboardEvent<HTMLInputElement>): void => {
-        onSubmit?.(event);
-      },
-      [onSubmit]
-    );
     const handleChange = useCallback(
       (newValue: string): void => {
         log.debug('handleChange', newValue);
@@ -94,7 +88,7 @@ const DateTimeInput = React.forwardRef<HTMLInputElement, DateTimeInputProps>(
           getNextSegmentValue={getNextSegmentValue}
           onChange={handleChange}
           onSelect={setSelection}
-          onSubmit={handleSubmit}
+          onSubmit={onSubmit}
           pattern={FULL_DATE_PATTERN}
           placeholder={FULL_DATE_FORMAT}
           selection={selection}
diff --git a/packages/components/src/MaskedInput.test.tsx b/packages/components/src/MaskedInput.test.tsx
index 7b765e5b85..85fc30da43 100644
--- a/packages/components/src/MaskedInput.test.tsx
+++ b/packages/components/src/MaskedInput.test.tsx
@@ -22,7 +22,12 @@ function makeMaskedInput({
   );
 }
 
-it('mounts and unmounts properly', async () => {
+it('mounts and unmounts properly', () => {
+  const { unmount } = makeMaskedInput();
+  unmount();
+});
+
+it('onSubmit works properly', async () => {
   const onSubmit = jest.fn();
   const { unmount } = makeMaskedInput({ onSubmit });
   const input: HTMLInputElement = screen.getByRole('textbox');
@@ -32,11 +37,6 @@ it('mounts and unmounts properly', async () => {
   unmount();
 });
 
-it('mounts and unmounts properly', () => {
-  const { unmount } = makeMaskedInput();
-  unmount();
-});
-
 describe('fillToLength', () => {
   it('fills empty string with the example value', () => {
     expect(fillToLength('te', 'TEST', 0)).toBe('te');
diff --git a/packages/components/src/MaskedInput.tsx b/packages/components/src/MaskedInput.tsx
index 227c66a45f..c59bd52177 100644
--- a/packages/components/src/MaskedInput.tsx
+++ b/packages/components/src/MaskedInput.tsx
@@ -391,6 +391,7 @@ const MaskedInput = React.forwardRef<HTMLInputElement, MaskedInputProps>(
       }
       if (key === 'Enter') {
         onSubmit?.(event);
+        return;
       }
       if (key.startsWith('Arrow')) {
         handleArrowKey(event);
diff --git a/packages/iris-grid/src/GotoRow.tsx b/packages/iris-grid/src/GotoRow.tsx
index 8a033ce3f9..c3a1835f30 100644
--- a/packages/iris-grid/src/GotoRow.tsx
+++ b/packages/iris-grid/src/GotoRow.tsx
@@ -102,12 +102,10 @@ function GotoRow({
     }
   };
 
-  const handleGotoValueKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {
-    if (e.key === 'Enter') {
-      e.stopPropagation();
-      e.preventDefault();
-      onGotoValueSubmit();
-    }
+  const handleGotoValueKeySubmit = (e: KeyboardEvent<HTMLInputElement>) => {
+    e.stopPropagation();
+    e.preventDefault();
+    onGotoValueSubmit();
   };
 
   const index = model.getColumnIndexByName(gotoValueSelectedColumnName);
@@ -175,7 +173,7 @@ function GotoRow({
               )}
               defaultValue={gotoValue}
               onChange={onGotoValueInputChanged}
-              onSubmit={handleGotoValueKeyDown}
+              onSubmit={handleGotoValueKeySubmit}
             />
           </div>
         );
@@ -212,7 +210,7 @@ function GotoRow({
                 className={classNames('form-control', {
                   'is-invalid': gotoValueError !== '',
                 })}
-                onKeyDown={handleGotoValueKeyDown}
+                onKeyDown={handleGotoValueKeySubmit}
                 placeholder="value"
                 onChange={e => onGotoValueInputChanged(e.target.value)}
                 value={gotoValue}
@@ -246,7 +244,7 @@ function GotoRow({
             <input
               ref={gotoValueInputRef}
               className="form-control"
-              onKeyDown={handleGotoValueKeyDown}
+              onKeyDown={handleGotoValueKeySubmit}
               placeholder="value"
               onChange={e => onGotoValueInputChanged(e.target.value)}
               value={gotoValue}

From 8a693b0e7b99ff0322c3bba227d8cf6955c0e972 Mon Sep 17 00:00:00 2001
From: Tony Zhou <tonyzhou@deephaven.io>
Date: Mon, 20 Mar 2023 12:38:10 -0400
Subject: [PATCH 5/5] added shift for backwards

---
 packages/iris-grid/src/GotoRow.tsx | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/packages/iris-grid/src/GotoRow.tsx b/packages/iris-grid/src/GotoRow.tsx
index c3a1835f30..f96dc9379e 100644
--- a/packages/iris-grid/src/GotoRow.tsx
+++ b/packages/iris-grid/src/GotoRow.tsx
@@ -103,9 +103,11 @@ function GotoRow({
   };
 
   const handleGotoValueKeySubmit = (e: KeyboardEvent<HTMLInputElement>) => {
-    e.stopPropagation();
-    e.preventDefault();
-    onGotoValueSubmit();
+    if (e.key === 'Enter') {
+      e.stopPropagation();
+      e.preventDefault();
+      onGotoValueSubmit(e.shiftKey);
+    }
   };
 
   const index = model.getColumnIndexByName(gotoValueSelectedColumnName);