From 957ae9d7ca03155ee54cc12c88d0b9fd95741a69 Mon Sep 17 00:00:00 2001 From: Timur Valiev Date: Thu, 22 Oct 2020 13:13:35 -0700 Subject: [PATCH] small Searchable table refactoring Summary: export filterRowsFact so we can reuse it. it's needed in diffs above Reviewed By: SimoneCasagranda Differential Revision: D24445819 fbshipit-source-id: 1c9ca363419c7e34f53e65b77764a49235e259e2 --- desktop/app/src/index.tsx | 5 +- .../components/searchable/SearchableTable.tsx | 8 +-- .../searchable/SearchableTable_immutable.tsx | 64 +------------------ desktop/app/src/ui/index.tsx | 5 +- 4 files changed, 15 insertions(+), 67 deletions(-) diff --git a/desktop/app/src/index.tsx b/desktop/app/src/index.tsx index 569c6600b..ba2f0fd85 100644 --- a/desktop/app/src/index.tsx +++ b/desktop/app/src/index.tsx @@ -166,7 +166,10 @@ export { SearchableProps, default as Searchable, } from './ui/components/searchable/Searchable'; -export {default as SearchableTable} from './ui/components/searchable/SearchableTable'; +export { + default as SearchableTable, + filterRowsFactory, +} from './ui/components/searchable/SearchableTable'; export {default as SearchableTable_immutable} from './ui/components/searchable/SearchableTable_immutable'; export { ElementID, diff --git a/desktop/app/src/ui/components/searchable/SearchableTable.tsx b/desktop/app/src/ui/components/searchable/SearchableTable.tsx index f3c3f882e..bdfab56bf 100644 --- a/desktop/app/src/ui/components/searchable/SearchableTable.tsx +++ b/desktop/app/src/ui/components/searchable/SearchableTable.tsx @@ -27,7 +27,7 @@ type State = { filterRows: (row: TableBodyRow) => boolean; }; -const rowMatchesFilters = (filters: Array, row: TableBodyRow) => +export const rowMatchesFilters = (filters: Array, row: TableBodyRow) => filters .map((filter: Filter) => { if (filter.type === 'enum' && row.type != null) { @@ -56,7 +56,7 @@ const rowMatchesFilters = (filters: Array, row: TableBodyRow) => }) .every((x) => x === true); -function rowMatchesRegex(values: Array, regex: string): boolean { +export function rowMatchesRegex(values: Array, regex: string): boolean { try { const re = new RegExp(regex); return values.some((x) => re.test(x)); @@ -65,7 +65,7 @@ function rowMatchesRegex(values: Array, regex: string): boolean { } } -function rowMatchesSearchTerm( +export function rowMatchesSearchTerm( searchTerm: string, isRegex: boolean, isContentSearchEnabled: boolean, @@ -91,7 +91,7 @@ function rowMatchesSearchTerm( ); } -const filterRowsFactory = ( +export const filterRowsFactory = ( filters: Array, searchTerm: string, regexSearch: boolean, diff --git a/desktop/app/src/ui/components/searchable/SearchableTable_immutable.tsx b/desktop/app/src/ui/components/searchable/SearchableTable_immutable.tsx index 31c8d9fcf..a0bb9e250 100644 --- a/desktop/app/src/ui/components/searchable/SearchableTable_immutable.tsx +++ b/desktop/app/src/ui/components/searchable/SearchableTable_immutable.tsx @@ -13,9 +13,9 @@ import {TableBodyRow} from '../table/types'; import Searchable, {SearchableProps} from './Searchable'; import {PureComponent} from 'react'; import ManagedTable_immutable from '../table/ManagedTable_immutable'; -import textContent from '../../../utils/textContent'; import deepEqual from 'deep-equal'; import React from 'react'; +import {filterRowsFactory} from './SearchableTable'; type Props = { /** Reference to the table */ @@ -29,66 +29,6 @@ type State = { filterRows: (row: TableBodyRow) => boolean; }; -const rowMatchesFilters = (filters: Array, row: TableBodyRow) => - filters - .map((filter: Filter) => { - if (filter.type === 'enum' && row.type != null) { - return filter.value.length === 0 || filter.value.indexOf(row.type) > -1; - } else if (filter.type === 'include') { - return ( - textContent(row.columns[filter.key].value).toLowerCase() === - filter.value.toLowerCase() - ); - } else if (filter.type === 'exclude') { - return ( - textContent(row.columns[filter.key].value).toLowerCase() !== - filter.value.toLowerCase() - ); - } else { - return true; - } - }) - .every((x) => x === true); - -function rowMatchesRegex(values: Array, regex: string): boolean { - try { - const re = new RegExp(regex); - return values.some((x) => re.test(x)); - } catch (e) { - return false; - } -} - -function rowMatchesSearchTerm( - searchTerm: string, - isRegex: boolean, - row: TableBodyRow, -): boolean { - if (searchTerm == null || searchTerm.length === 0) { - return true; - } - const rowValues = Object.keys(row.columns).map((key) => - textContent(row.columns[key].value), - ); - if (row.filterValue != null) { - rowValues.push(row.filterValue); - } - if (isRegex) { - return rowMatchesRegex(rowValues, searchTerm); - } - return rowValues.some((x) => - x.toLowerCase().includes(searchTerm.toLowerCase()), - ); -} - -const filterRowsFactory = ( - filters: Array, - searchTerm: string, - regexSearch: boolean, -) => (row: TableBodyRow): boolean => - rowMatchesFilters(filters, row) && - rowMatchesSearchTerm(searchTerm, regexSearch, row); - class SearchableManagedTable_immutable extends PureComponent { static defaultProps = { defaultFilters: [], @@ -99,6 +39,7 @@ class SearchableManagedTable_immutable extends PureComponent { this.props.filters, this.props.searchTerm, this.props.regexEnabled || false, + this.props.contentSearchEnabled || false, ), }; @@ -117,6 +58,7 @@ class SearchableManagedTable_immutable extends PureComponent { nextProps.filters, nextProps.searchTerm, nextProps.regexEnabled || false, + this.props.contentSearchEnabled || false, ), }); } diff --git a/desktop/app/src/ui/index.tsx b/desktop/app/src/ui/index.tsx index 0b364543f..795e98f30 100644 --- a/desktop/app/src/ui/index.tsx +++ b/desktop/app/src/ui/index.tsx @@ -142,7 +142,10 @@ export { SearchIcon, default as Searchable, } from './components/searchable/Searchable'; -export {default as SearchableTable} from './components/searchable/SearchableTable'; +export { + default as SearchableTable, + filterRowsFactory, +} from './components/searchable/SearchableTable'; export {default as SearchableTable_immutable} from './components/searchable/SearchableTable_immutable'; export {SearchableProps} from './components/searchable/Searchable';