Панель поиска возвращает результаты для всех столбцов

Question

Существует такой обработчик поиска:

  searchHandler = event => {
    const { getCustomers } = this.props;
    getCustomers({
      name: event.target.value,
      surname: this.props.query.surname,
      city: this.props.query.city,
      nationality: this.props.query.nationality,
      pagination: {
        currentPage: this.props.query.pagination.currentPage,
        totalPages: this.props.query.pagination.totalPages,
      },
    });
  };

Он помещается поверх таблицы и фильтрует данные таблицы на основе name.

Как видно, name: event.target.value, а остальные берут свое значение из запроса.

Моя задача - заставить его выполнять поиск по всем фильтрам.

Например, в старой функции , если кто-то ищет «Джек», он вернет все строки, содержащие «Джек» в поле name.

Новый должен также вернуть строки, содержащие «Джек» в фамилии, национальности и т. д. on.

Мой подход заключался в том, чтобы установить все значения на event.target.value:

  searchHandler = event => {
    const { getCustomers } = this.props;
    getCustomers({
      name: event.target.value,
      surname: event.target.value,
      city: event.target.value,
      nationality: event.target.value,
      pagination: {
        currentPage: this.props.query.pagination.currentPage,
        totalPages: this.props.query.pagination.totalPages,
      },
    });
  };

К сожалению, это не работает.

Как можно заставить искать все поля?

ОБНОВЛЕНИЕ Запрос построен в redux-saga следующим образом:

export function* getCustomers({ query }) {
  let urlQuery = '';

  if (query && query.pagination.currentPage) {
    urlQuery += `&page=${query.pagination.currentPage}`;
  }

  if (query && query.name) {
    urlQuery += `&name=${query.name}`;
  }

  if (query && query.surname) {
    urlQuery += `&surname=${query.surname}`;
  }

  if (query && query.city) {
    urlQuery += `&city=${query.city}`;
  }

  if (query && query.nationality) {
    urlQuery += `&nationality=${query.nationality}`;
  }

  try {
    const response = yield call(api.getCustomers, urlQuery);
    yield put(Creators.getCustomersSuccess(response.data));
  } catch (error) {
    yield put(Creators.getCustomersFailure(error));
  }
}

Запрос построен с AND (&), и я думаю он должен использовать что-то вроде OR (|), но я не знаю, как это реализовать.

Если я протестирую это с помощью своего подхода (установка event.target.value для всех), и я пишу «t» в searchBar, вызов API будет выглядеть так, что наверняка неверно:

http://localhost:5000/customers?&page=1&name=t&surname=t&city=t&nationality=t

на обратной стороне -end, в mongoDB поиск ведется так:

const aggregateOptions = [];

 // search by name
    if (req.query.name) {
      aggregateOptions.push({ $match: { name: { $regex: req.query.name, $options: 'i' } } });
    }

    // search by nationality
    if (req.query.nationality) {
      aggregateOptions.push({ $match: { nationality: req.query.nationality } });
    }