From feb7a9117cc588a4d3917a1ddfda02fe6bf55d1f Mon Sep 17 00:00:00 2001 From: Cee Chen Date: Thu, 14 Sep 2023 18:20:46 -0700 Subject: [PATCH] [PR feedback] Change `searchPlainText` prop name to `searchFormat` --- .../tables/in_memory/in_memory_search.tsx | 10 ++++----- .../basic_table/in_memory_table.test.tsx | 4 ++-- .../basic_table/in_memory_table.tsx | 22 +++++++++++-------- upcoming_changelogs/7175.md | 2 +- 4 files changed, 21 insertions(+), 17 deletions(-) diff --git a/src-docs/src/views/tables/in_memory/in_memory_search.tsx b/src-docs/src/views/tables/in_memory/in_memory_search.tsx index cc6d95bdfca..f92b3558736 100644 --- a/src-docs/src/views/tables/in_memory/in_memory_search.tsx +++ b/src-docs/src/views/tables/in_memory/in_memory_search.tsx @@ -114,7 +114,7 @@ export default () => { const [incremental, setIncremental] = useState(false); const [filters, setFilters] = useState(false); const [contentBetween, setContentBetween] = useState(false); - const [searchPlainText, setSearchPlainText] = useState(false); + const [textSearchFormat, setTextSearchFormat] = useState(false); const search: EuiSearchBarProps = { box: { @@ -162,17 +162,17 @@ export default () => { /> setSearchPlainText(!searchPlainText)} + checked={textSearchFormat} + onChange={() => setTextSearchFormat(!textSearchFormat)} /> { }); }); - describe('plain text search', () => { + describe('text search format', () => { it('allows searching for any text with special characters in it', () => { const specialCharacterSearch = '!@#$%^&*(){}+=-_hello:world"`<>?/👋~.,;|'; const items = [ @@ -1450,7 +1450,7 @@ describe('EuiInMemoryTable', () => { const { getByTestSubject, container } = render( diff --git a/src/components/basic_table/in_memory_table.tsx b/src/components/basic_table/in_memory_table.tsx index c1cb7e3150a..6fc5dbfce56 100644 --- a/src/components/basic_table/in_memory_table.tsx +++ b/src/components/basic_table/in_memory_table.tsx @@ -81,14 +81,17 @@ type InMemoryTableProps = Omit< */ search?: Search; /** - * If passed as true, search ignores all filters and EQL syntax, and anything - * typed into the table search bar is treated as plain text. + * By default, tables use `eql` format for search which allows using advanced filters. * - * This functionality allows users to search for strings with special characters - * such as quotes, parentheses, and colons, which are normally otherwise - * reserved for EQL syntax. + * However, certain special characters (such as quotes, parentheses, and colons) + * are reserved for EQL syntax and will error if used. + * If your table does not require filter search and instead requires searching for certain + * symbols, use a plain `text` search format instead (note that filters will be ignored + * in this format). + * + * @default "eql" */ - searchPlainText?: boolean; + searchFormat?: 'eql' | 'text'; /** * Configures #Pagination */ @@ -298,6 +301,7 @@ export class EuiInMemoryTable extends Component< static defaultProps = { responsive: true, tableLayout: 'fixed', + searchFormat: 'eql', }; tableRef: React.RefObject; @@ -545,12 +549,12 @@ export class EuiInMemoryTable extends Component< }; renderSearchBar() { - const { search, searchPlainText } = this.props; + const { search, searchFormat } = this.props; if (!search) return; let searchBar: ReactNode; - if (searchPlainText) { + if (searchFormat === 'text') { const _searchBoxProps = (search as EuiSearchBarProps)?.box || {}; // Work around | boolean type const { schema, ...searchBoxProps } = _searchBoxProps; // Destructure `schema` so it doesn't get rendered to DOM @@ -695,7 +699,7 @@ export class EuiInMemoryTable extends Component< tableLayout, items: _unuseditems, search, - searchPlainText, + searchFormat, onTableChange, executeQueryOptions, allowNeutralSort, diff --git a/upcoming_changelogs/7175.md b/upcoming_changelogs/7175.md index ddda1327451..b570f6c3d93 100644 --- a/upcoming_changelogs/7175.md +++ b/upcoming_changelogs/7175.md @@ -1,4 +1,4 @@ -- Updated `EuiInMemoryTable` with a new `searchPlainText` prop. This boolean flag allows the built-in search bar to ignore EQL syntax and search for plain strings with special characters and symbols. +- Updated `EuiInMemoryTable` with a new `searchFormat` prop (defaults to `eql`). When setting this prop to `text`, the built-in search bar will ignore EQL syntax and allow searching for plain strings with special characters and symbols. **Bug fixes**