Как используя чекбоксы менять параметры ссылки для получения данных из api используя URLSearchParams

Необходимо при выборе нескольких чекбоксов в фильтрах добавлять параметры ссылке чтобы при нажатии кнопки получать отфильтрованные данные из api. Нужно использовать URLSearchParams

export function Filters(props) {
  const [filters, setFilters] = useState({ platform: [], category: [] })


  useEffect(() => {
    props.getGames()
  }, [])
// в useEffect список не фильтрованных игр(https://free-to-play-games-database.p.rapidapi.com/api/games)

  const onSubmitFilter = () => {
    const filterCategory = filters.category;
    const queryParams = new URLSearchParams();

    for (let i = 0; i < filterCategory.length; i++) {
      if (filterCategory[i].checked) {
        const value = filterCategory[i].value;
        queryParams.append('platform', value);
        
      }
      let query = ''
      query += '?category=' + queryParams;
      props.getGames(query)
     
    }
    
  }

  

  const onFilterChange = (event) => {
    const { name, value, checked } = event.target;

    if (checked) {
      filters[name].push(value);
      setFilters({ ...filters });
    } else {
      const newFilters = filters[name].filter(
        (filter) => filter !== value
      );

      setFilters({ ...filters, [name]: newFilters });
    }
  };
  

  return (
    <div className='filters'>
      <fieldset>
        <legend>Платформа:</legend>
        <ul className='filters-list'>
          <li className='filters-item'>
            <input type="checkbox" name="platform" value="pc" id="pc" onChange={onFilterChange}></input>
            <label for="pc">ПК</label>
          </li>
          <li className='filters-item'>
            <input type="checkbox" name="platform" value="browser" id="browser" onChange={onFilterChange}></input>
            <label for="browser">Брузер</label>
          </li>
        </ul>
      </fieldset>
      <fieldset>
        <legend>Жанр:</legend>
        <ul className='filters-list'>
          <li className='filters-item'>
            <input type="checkbox" name="category" value="shooter" id="shooter" onChange={onFilterChange}></input>
            <label for="shooter">Шутер</label>
          </li>
          <li className='filters-item'>
            <input type="checkbox" name="category" value="pvp" id="pvp" onChange={onFilterChange}></input>
            <label for="pvp">ПВП</label>
          </li>
          <li className='filters-item'>
            <input type="checkbox" name="category" value="racing" id="racing" onChange={onFilterChange}></input>
            <label for="racing">Гонки</label>
          </li>
          <li className='filters-item'>
            <input type="checkbox" name="category" value="strategy" id="strategy" onChange={onFilterChange}></input>
            <label for="strategy">Стратегии</label>
          </li>
        </ul>
      </fieldset>
      <button type="button" onClick={onSubmitFilter}>Применить</button>
    </div>
  )
} ```