diff --git a/packages/iris-grid/src/IrisGrid.tsx b/packages/iris-grid/src/IrisGrid.tsx index 2b778cceff..fbeee84b30 100644 --- a/packages/iris-grid/src/IrisGrid.tsx +++ b/packages/iris-grid/src/IrisGrid.tsx @@ -1924,10 +1924,27 @@ export class IrisGrid extends Component { } updatePartition(partition: string, partitionColumn: Column): void { + if (TableUtils.isCharType(partitionColumn.type) && partition === '') { + return; + } + const { model } = this.props; - const partitionFilter = partitionColumn - .filter() - .eq(model.dh.FilterValue.ofString(partition)); + + const partitionText = TableUtils.isCharType(partitionColumn.type) + ? model.displayString( + partition, + partitionColumn.type, + partitionColumn.name + ) + : partition; + const partitionFilter = this.tableUtils.makeQuickFilterFromComponent( + partitionColumn, + partitionText + ); + if (partitionFilter === null) { + return; + } + const partitionFilters = [partitionFilter]; this.setState({ partition, @@ -4427,7 +4444,7 @@ export class IrisGrid extends Component { type: string, stringName: string ) => model.displayString(value, type, stringName)} - columnName={partitionColumn.name} + column={partitionColumn} partition={partition} onChange={this.handlePartitionChange} onFetchAll={this.handlePartitionFetchAll} diff --git a/packages/iris-grid/src/IrisGridPartitionSelector.test.tsx b/packages/iris-grid/src/IrisGridPartitionSelector.test.tsx index 7743b7db0d..52b82eaeea 100644 --- a/packages/iris-grid/src/IrisGridPartitionSelector.test.tsx +++ b/packages/iris-grid/src/IrisGridPartitionSelector.test.tsx @@ -14,7 +14,7 @@ function makeIrisGridPartitionSelector( { dh: DhType; getFormattedString: (value: T, type: string, name: string) => string; table: Table; - columnName: ColumnName; + column: Column; partition: string; onAppend?: (partition: string) => void; onFetchAll: () => void; @@ -90,9 +91,15 @@ class IrisGridPartitionSelector extends Component< handlePartitionChange(event: React.ChangeEvent): void { log.debug2('handlePartitionChange'); + const { column } = this.props; const { value: partition } = event.target; - this.setState({ partition }); + this.setState({ + partition: + TableUtils.isCharType(column.type) && partition.length > 0 + ? partition.charCodeAt(0).toString() + : partition, + }); this.debounceUpdate(); } @@ -154,7 +161,7 @@ class IrisGridPartitionSelector extends Component< } render(): JSX.Element { - const { columnName, dh, getFormattedString, onAppend, onDone, table } = + const { column, dh, getFormattedString, onAppend, onDone, table } = this.props; const { partition } = this.state; const partitionSelectorSearch = ( @@ -173,12 +180,17 @@ class IrisGridPartitionSelector extends Component< return (
- Filtering "{columnName}" partition to + Filtering "{column.name}" partition to
0 + ? String.fromCharCode(parseInt(partition, 10)) + : IrisGridUtils.convertValueToText(partition, column.type) + } onChange={this.handlePartitionChange} className="form-control input-partition" /> diff --git a/packages/iris-grid/src/PartitionSelectorSearch.tsx b/packages/iris-grid/src/PartitionSelectorSearch.tsx index 20d92db32c..0b010315bb 100644 --- a/packages/iris-grid/src/PartitionSelectorSearch.tsx +++ b/packages/iris-grid/src/PartitionSelectorSearch.tsx @@ -1,6 +1,7 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import debounce from 'lodash.debounce'; +import { TableUtils } from '@deephaven/jsapi-utils'; import type { dh as DhType, Table } from '@deephaven/jsapi-types'; import { ItemList, LoadingSpinner } from '@deephaven/components'; import Log from '@deephaven/log'; @@ -74,7 +75,6 @@ class PartitionSelectorSearch extends Component< super(props); this.handleFilterChange = this.handleFilterChange.bind(this); - this.handleInputFocus = this.handleInputFocus.bind(this); this.handleKeyDown = this.handleKeyDown.bind(this); this.handleListKeydown = this.handleListKeydown.bind(this); this.handleSelect = this.handleSelect.bind(this); @@ -86,6 +86,9 @@ class PartitionSelectorSearch extends Component< this.searchInput = null; this.timer = null; + const { dh } = props; + this.tableUtils = new TableUtils(dh); + this.state = { offset: 0, itemCount: 0, @@ -125,6 +128,8 @@ class PartitionSelectorSearch extends Component< timer: null; + tableUtils: TableUtils; + handleKeyDown(event: React.KeyboardEvent): boolean { if (this.itemList == null) { return false; @@ -181,12 +186,6 @@ class PartitionSelectorSearch extends Component< this.setState({ itemCount, isLoading: true }); } - handleInputFocus(): void { - if (this.itemList) { - this.itemList.focusItem(0); - } - } - handleSelect(itemIndex: ModelIndex): void { log.debug2('handleSelect', itemIndex); @@ -227,9 +226,14 @@ class PartitionSelectorSearch extends Component< handleTextChange(event: React.ChangeEvent): void { log.debug2('handleTextChange'); + const { table } = this.props; const { value: text } = event.target; - this.setState({ text }); + if (text !== '' && TableUtils.isIntegerType(table.columns[0].type)) { + this.setState({ text: parseInt(text, 10).toString() }); + } else { + this.setState({ text }); + } this.debounceUpdateFilter(); } @@ -275,18 +279,21 @@ class PartitionSelectorSearch extends Component< } updateFilter(): void { - const { dh, initialPageSize, table } = this.props; + const { initialPageSize, table } = this.props; const { text } = this.state; const filterText = text.trim(); const filters = []; if (filterText.length > 0) { const column = table.columns[0]; - const filter = column - .filter() - .invoke( - 'matches', - dh.FilterValue.ofString(`(?s)(?i).*\\Q${filterText}\\E.*`) + const filter = this.tableUtils.makeQuickFilterFromComponent( + column, + TableUtils.isStringType(column.type) ? `~${filterText}` : filterText + ); + if (!filter) { + throw new Error( + 'Unable to create column filter for partition selector' ); + } filters.push(filter); } @@ -297,24 +304,28 @@ class PartitionSelectorSearch extends Component< } render(): JSX.Element { + const { table } = this.props; const { isLoading, itemCount, items, offset, text } = this.state; + const listHeight = Math.min(itemCount, PartitionSelectorSearch.MAX_VISIBLE_ITEMS) * ItemList.DEFAULT_ROW_HEIGHT + // Adjust for ListItem vertical padding - .375rem ~ 5.25px 11; + const inputType = TableUtils.isNumberType(table.columns[0].type) + ? 'number' + : 'text'; return (
{ this.searchInput = searchInput; }} value={text} placeholder="Available Partitions" onChange={this.handleTextChange} - onFocus={this.handleInputFocus} onKeyDown={this.handleKeyDown} className="form-control input-partition" />