diff --git a/sippy-ng/src/component_readiness/RegressedTestsPanel.js b/sippy-ng/src/component_readiness/RegressedTestsPanel.js index 0252365448..105bc4f744 100644 --- a/sippy-ng/src/component_readiness/RegressedTestsPanel.js +++ b/sippy-ng/src/component_readiness/RegressedTestsPanel.js @@ -373,6 +373,7 @@ export default function RegressedTestsPanel(props) { setFilterModel: setFilterModel, clearSearch: () => requestSearch(''), doSearch: requestSearch, + searchField: 'test_name', autocompleteData: regressedTests, downloadDataFunc: () => { return filteredTests diff --git a/sippy-ng/src/component_readiness/TriagedRegressionTestList.js b/sippy-ng/src/component_readiness/TriagedRegressionTestList.js index 5b047b74bc..ff763650bc 100644 --- a/sippy-ng/src/component_readiness/TriagedRegressionTestList.js +++ b/sippy-ng/src/component_readiness/TriagedRegressionTestList.js @@ -352,6 +352,7 @@ export default function TriagedRegressionTestList(props) { setFilterModel: setFilterModel, clearSearch: () => requestSearch(''), doSearch: requestSearch, + searchField: 'test_name', autocompleteData: triagedRegressions, downloadDataFunc: () => { return filteredRegressions diff --git a/sippy-ng/src/component_readiness/TriagedRegressions.js b/sippy-ng/src/component_readiness/TriagedRegressions.js index cc8c28a423..41fbeacc54 100644 --- a/sippy-ng/src/component_readiness/TriagedRegressions.js +++ b/sippy-ng/src/component_readiness/TriagedRegressions.js @@ -407,6 +407,7 @@ export default function TriagedRegressions({ setFilterModel: setFilterModel, clearSearch: () => requestSearch(''), doSearch: requestSearch, + searchField: 'description', autocompleteData: triageEntries, downloadDataFunc: () => { return filteredTriageEntries diff --git a/sippy-ng/src/datagrid/GridToolbar.js b/sippy-ng/src/datagrid/GridToolbar.js index 602a3f640d..f96889333f 100644 --- a/sippy-ng/src/datagrid/GridToolbar.js +++ b/sippy-ng/src/datagrid/GridToolbar.js @@ -8,7 +8,7 @@ import GridToolbarPeriodSelector from '../datagrid/GridToolbarPeriodSelector' import GridToolbarViewSelector from './GridToolbarViewSelector' import IconButton from '@mui/material/IconButton' import PropTypes from 'prop-types' -import React, { Fragment } from 'react' +import React, { Fragment, useEffect, useRef } from 'react' import SearchIcon from '@mui/icons-material/Search' import TextField from '@mui/material/TextField' @@ -39,6 +39,29 @@ export default function GridToolbar(props) { const classes = useStyles(theme) const [search, setSearch] = React.useState('') + const initializedFromFilter = useRef(false) + + useEffect(() => { + if ( + initializedFromFilter.current || + !props.searchField || + !props.filterModel || + !props.filterModel.items + ) { + return + } + const filtersForField = props.filterModel.items.filter( + (f) => f.columnField === props.searchField + ) + if (filtersForField.length !== 1) { + return + } + const filter = filtersForField[0] + if (filter.operatorValue === 'contains' && filter.value) { + setSearch(filter.value) + initializedFromFilter.current = true + } + }, [props.searchField, props.filterModel]) return (
@@ -92,7 +115,6 @@ export default function GridToolbar(props) { value={search} onChange={(e) => setSearch(e.target.value)} onKeyDown={(e) => e.key === 'Enter' && props.doSearch(search)} - onBlur={() => props.doSearch(search)} placeholder="Search…" InputProps={{ endAdornment: ( @@ -145,4 +167,5 @@ GridToolbar.propTypes = { downloadDataFunc: PropTypes.func, downloadFilePrefix: PropTypes.string, autocompleteData: PropTypes.array, + searchField: PropTypes.string, } diff --git a/sippy-ng/src/jobs/JobAnalysis.js b/sippy-ng/src/jobs/JobAnalysis.js index 363faa9f68..42bef2e807 100644 --- a/sippy-ng/src/jobs/JobAnalysis.js +++ b/sippy-ng/src/jobs/JobAnalysis.js @@ -602,6 +602,7 @@ export function JobAnalysis(props) { setFilterModel: setTestFilter, clearSearch: () => requestSearch(''), doSearch: requestSearch, + searchField: 'name', }, }} /> diff --git a/sippy-ng/src/jobs/JobRunsTable.js b/sippy-ng/src/jobs/JobRunsTable.js index 81c9e4ab71..2fc6a3a813 100644 --- a/sippy-ng/src/jobs/JobRunsTable.js +++ b/sippy-ng/src/jobs/JobRunsTable.js @@ -468,17 +468,17 @@ export default function JobRunsTable(props) { } const requestSearch = (searchValue) => { - const currentFilters = filterModel - currentFilters.items = currentFilters.items.filter( - (f) => f.columnField !== 'job' - ) - currentFilters.items.push({ + const newItems = filterModel.items.filter((f) => f.columnField !== 'job') + newItems.push({ id: 99, columnField: 'job', operatorValue: 'contains', value: searchValue, }) - setFilterModel(currentFilters) + setFilterModel({ + ...filterModel, + items: newItems, + }) } useEffect(() => { @@ -655,6 +655,7 @@ export default function JobRunsTable(props) { columns: columns, clearSearch: () => requestSearch(''), doSearch: requestSearch, + searchField: 'job', filterModel: filterModel, setFilterModel: setFilterModel, addFilters: (m) => addFilters(m), diff --git a/sippy-ng/src/jobs/JobTable.js b/sippy-ng/src/jobs/JobTable.js index 1d8eea3cb8..972595dea7 100644 --- a/sippy-ng/src/jobs/JobTable.js +++ b/sippy-ng/src/jobs/JobTable.js @@ -533,17 +533,17 @@ function JobTable(props) { } const requestSearch = (searchValue) => { - const currentFilters = filterModel - currentFilters.items = currentFilters.items.filter( - (f) => f.columnField !== 'name' - ) - currentFilters.items.push({ + const newItems = filterModel.items.filter((f) => f.columnField !== 'name') + newItems.push({ id: 99, columnField: 'name', operatorValue: 'contains', value: searchValue, }) - setFilterModel(currentFilters) + setFilterModel({ + ...filterModel, + items: newItems, + }) } useEffect(() => { @@ -708,6 +708,7 @@ function JobTable(props) { columns: gridView.filterColumns, clearSearch: () => requestSearch(''), doSearch: requestSearch, + searchField: 'name', period: period, selectPeriod: setPeriod, addFilters: (m) => addFilters(m), diff --git a/sippy-ng/src/releases/PayloadStreamTestFailures.js b/sippy-ng/src/releases/PayloadStreamTestFailures.js index 878b959e65..96ab7f02e3 100644 --- a/sippy-ng/src/releases/PayloadStreamTestFailures.js +++ b/sippy-ng/src/releases/PayloadStreamTestFailures.js @@ -116,17 +116,17 @@ function PayloadStreamTestFailures(props) { ) const requestSearch = (searchValue) => { - const currentFilters = filterModel - currentFilters.items = currentFilters.items.filter( - (f) => f.columnField !== 'name' - ) - currentFilters.items.push({ + const newItems = filterModel.items.filter((f) => f.columnField !== 'name') + newItems.push({ id: 99, columnField: 'name', operatorValue: 'contains', value: searchValue, }) - setFilterModel(currentFilters) + setFilterModel({ + ...filterModel, + items: newItems, + }) } const addFilters = (filter) => { @@ -257,6 +257,7 @@ function PayloadStreamTestFailures(props) { columns: columns, clearSearch: () => requestSearch(''), doSearch: requestSearch, + searchField: 'name', addFilters: addFilters, filterModel: filterModel, setFilterModel: setFilterModel, diff --git a/sippy-ng/src/releases/PayloadStreamsTable.js b/sippy-ng/src/releases/PayloadStreamsTable.js index 5095857009..a4cb9a581f 100644 --- a/sippy-ng/src/releases/PayloadStreamsTable.js +++ b/sippy-ng/src/releases/PayloadStreamsTable.js @@ -127,17 +127,19 @@ function PayloadStreamsTable(props) { ) const requestSearch = (searchValue) => { - const currentFilters = filterModel - currentFilters.items = currentFilters.items.filter( + const newItems = filterModel.items.filter( (f) => f.columnField !== 'release_tag' ) - currentFilters.items.push({ + newItems.push({ id: 99, columnField: 'release_tag', operatorValue: 'contains', value: searchValue, }) - setFilterModel(currentFilters) + setFilterModel({ + ...filterModel, + items: newItems, + }) } const addFilters = (filter) => { @@ -246,6 +248,7 @@ function PayloadStreamsTable(props) { columns: columns, clearSearch: () => requestSearch(''), doSearch: requestSearch, + searchField: 'release_tag', addFilters: addFilters, filterModel: filterModel, setFilterModel: setFilterModel, diff --git a/sippy-ng/src/releases/PayloadTestFailures.js b/sippy-ng/src/releases/PayloadTestFailures.js index 34b264d491..4773972e12 100644 --- a/sippy-ng/src/releases/PayloadTestFailures.js +++ b/sippy-ng/src/releases/PayloadTestFailures.js @@ -95,17 +95,17 @@ function PayloadTestFailures(props) { ) const requestSearch = (searchValue) => { - const currentFilters = filterModel - currentFilters.items = currentFilters.items.filter( - (f) => f.columnField !== 'name' - ) - currentFilters.items.push({ + const newItems = filterModel.items.filter((f) => f.columnField !== 'name') + newItems.push({ id: 99, columnField: 'name', operatorValue: 'contains', value: searchValue, }) - setFilterModel(currentFilters) + setFilterModel({ + ...filterModel, + items: newItems, + }) } const addFilters = (filter) => { @@ -231,6 +231,7 @@ function PayloadTestFailures(props) { columns: columns, clearSearch: () => requestSearch(''), doSearch: requestSearch, + searchField: 'name', addFilters: addFilters, filterModel: filterModel, setFilterModel: setFilterModel, diff --git a/sippy-ng/src/releases/ReleasePayloadJobRuns.js b/sippy-ng/src/releases/ReleasePayloadJobRuns.js index 86123b7d52..047eb4d4ac 100644 --- a/sippy-ng/src/releases/ReleasePayloadJobRuns.js +++ b/sippy-ng/src/releases/ReleasePayloadJobRuns.js @@ -155,17 +155,19 @@ function ReleasePayloadJobRuns(props) { ) const requestSearch = (searchValue) => { - const currentFilters = filterModel - currentFilters.items = currentFilters.items.filter( + const newItems = filterModel.items.filter( (f) => f.columnField !== 'release_tag' ) - currentFilters.items.push({ + newItems.push({ id: 99, columnField: 'releaseTag', operatorValue: 'contains', value: searchValue, }) - setFilterModel(currentFilters) + setFilterModel({ + ...filterModel, + items: newItems, + }) } const addFilters = (filter) => { @@ -341,6 +343,7 @@ function ReleasePayloadJobRuns(props) { columns: columns, clearSearch: () => requestSearch(''), doSearch: requestSearch, + searchField: 'release_tag', addFilters: addFilters, filterModel: filterModel, setFilterModel: setFilterModel, diff --git a/sippy-ng/src/releases/ReleasePayloadPullRequests.js b/sippy-ng/src/releases/ReleasePayloadPullRequests.js index 60794905b2..a304adf452 100644 --- a/sippy-ng/src/releases/ReleasePayloadPullRequests.js +++ b/sippy-ng/src/releases/ReleasePayloadPullRequests.js @@ -77,17 +77,19 @@ function ReleasePayloadPullRequests(props) { ) const requestSearch = (searchValue) => { - const currentFilters = filterModel - currentFilters.items = currentFilters.items.filter( + const newItems = filterModel.items.filter( (f) => f.columnField !== 'release_tag' ) - currentFilters.items.push({ + newItems.push({ id: 99, columnField: 'release_tag', operatorValue: 'contains', value: searchValue, }) - setFilterModel(currentFilters) + setFilterModel({ + ...filterModel, + items: newItems, + }) } const addFilters = (filter) => { @@ -195,6 +197,7 @@ function ReleasePayloadPullRequests(props) { columns: columns, clearSearch: () => requestSearch(''), doSearch: requestSearch, + searchField: 'release_tag', addFilters: addFilters, filterModel: filterModel, setFilterModel: setFilterModel, diff --git a/sippy-ng/src/releases/ReleasePayloadTable.js b/sippy-ng/src/releases/ReleasePayloadTable.js index a9412f6ad6..4920d9f6ae 100644 --- a/sippy-ng/src/releases/ReleasePayloadTable.js +++ b/sippy-ng/src/releases/ReleasePayloadTable.js @@ -320,17 +320,19 @@ function ReleasePayloadTable(props) { } const requestSearch = (searchValue) => { - const currentFilters = filterModel - currentFilters.items = currentFilters.items.filter( + const newItems = filterModel.items.filter( (f) => f.columnField !== 'release_tag' ) - currentFilters.items.push({ + newItems.push({ id: 99, columnField: 'release_tag', operatorValue: 'contains', value: searchValue, }) - setFilterModelWithConversion(currentFilters) + setFilterModelWithConversion({ + ...filterModel, + items: newItems, + }) } const addFilters = (filter) => { @@ -443,6 +445,7 @@ function ReleasePayloadTable(props) { columns: columns, clearSearch: () => requestSearch(''), doSearch: requestSearch, + searchField: 'release_tag', addFilters: addFilters, filterModel: filterModel, setFilterModel: setFilterModelWithConversion, diff --git a/sippy-ng/src/repositories/RepositoriesTable.js b/sippy-ng/src/repositories/RepositoriesTable.js index c25ba537b8..8851d3ccc3 100644 --- a/sippy-ng/src/repositories/RepositoriesTable.js +++ b/sippy-ng/src/repositories/RepositoriesTable.js @@ -278,17 +278,17 @@ function RepositoriesTable(props) { } const requestSearch = (searchValue) => { - const currentFilters = filterModel - currentFilters.items = currentFilters.items.filter( - (f) => f.columnField !== 'repo' - ) - currentFilters.items.push({ + const newItems = filterModel.items.filter((f) => f.columnField !== 'repo') + newItems.push({ id: 99, columnField: 'repo', operatorValue: 'contains', value: searchValue, }) - setFilterModel(currentFilters) + setFilterModel({ + ...filterModel, + items: newItems, + }) } return ( @@ -328,6 +328,7 @@ function RepositoriesTable(props) { componentsProps={{ toolbar: { doSearch: requestSearch, + searchField: 'repo', clearSearch: () => requestSearch(''), views: gridView.views, view: view, diff --git a/sippy-ng/src/tests/FeatureGates.js b/sippy-ng/src/tests/FeatureGates.js index 31ac07999c..d268aeb9e3 100644 --- a/sippy-ng/src/tests/FeatureGates.js +++ b/sippy-ng/src/tests/FeatureGates.js @@ -211,17 +211,19 @@ export default function FeatureGates(props) { } const requestSearch = (searchValue) => { - const currentFilters = filterModel - currentFilters.items = currentFilters.items.filter( + const newItems = filterModel.items.filter( (f) => f.columnField !== 'feature_gate' ) - currentFilters.items.push({ + newItems.push({ id: 99, columnField: 'feature_gate', operatorValue: 'contains', value: searchValue, }) - setFilterModel(currentFilters) + setFilterModel({ + ...filterModel, + items: newItems, + }) } const addFilters = (filter) => { @@ -401,6 +403,7 @@ export default function FeatureGates(props) { columns: columns, clearSearch: () => requestSearch(''), doSearch: requestSearch, + searchField: 'feature_gate', addFilters: (m) => addFilters(m), filterModel: filterModel, setFilterModel: setFilterModel, diff --git a/sippy-ng/src/tests/TestTable.js b/sippy-ng/src/tests/TestTable.js index 68fd3701ce..8e4c4eed46 100644 --- a/sippy-ng/src/tests/TestTable.js +++ b/sippy-ng/src/tests/TestTable.js @@ -1003,18 +1003,24 @@ function TestTable(props) { ]) const requestSearch = (searchValue) => { - setSearching(true) - const currentFilters = filterModel - currentFilters.items = currentFilters.items.filter( - (f) => f.columnField !== 'name' + const existingFilter = filterModel.items.find( + (f) => f.columnField === 'name' && f.operatorValue === 'contains' ) - currentFilters.items.push({ + if (existingFilter && existingFilter.value === searchValue) { + return + } + setSearching(true) + const newItems = filterModel.items.filter((f) => f.columnField !== 'name') + newItems.push({ id: 99, columnField: 'name', operatorValue: 'contains', value: searchValue, }) - setFilterModel(currentFilters) + setFilterModel({ + ...filterModel, + items: newItems, + }) } if (fetchError !== '') { @@ -1123,6 +1129,7 @@ function TestTable(props) { columns: gridView.filterColumns, clearSearch: () => requestSearch(''), doSearch: requestSearch, + searchField: 'name', period: period, selectPeriod: setPeriod, addFilters: addFilters,