Странное задание знатокам reactjs

Попытаюсь объяснить на примере что мне нужно

1 открываем Chrome и заходим на анонимайзер  http://cameleo.ru и открываем через него сайт http://fav-bet.com

2 на сайте выбираем русский язык,  а затем в верхнем красном меню выбираем live

3 Жмем F12 чтобы открылся инспектор, в нем переходим в закладку консоль.

4 Слева мы видим меню с видами спорта, выбираем в нем Баскетбол (ставим галочку)

5 в центральной части появились матчи идущие сейчас. открываем подробности первого матча (в конце строки где названия команд есть цифры +23, +6, +26 у каждого матча своя цифра это количество событий на которые можно сделать ставки) жмем на ти цифры и откроется целый список различных событий.

Так вот теперь о проблеме, я делаю ставки только на события Тотал, все остальные мне не нужны. Если я открою детали всех матчей ну или хотябы штук 5 бразуер очень сильно грузит систему и чтобы найти нужное мне событие приходится долго крутить скрол который тоже подтормаживает.

Поэтому я хочу удалить не нужные события из окна браузера и оставить только где есть слово ТОТАЛ.

Раньше я свободно удалял куски html с помощью яваскрипта и все работало, не так давно fav-bet перевели на reactjs и если я сейчас просто удалю html node в консоль начинают валиться ошибки и коэфициенты у событий перестают обновляться (они обновляются почти каждую секунду)

Вопрос: Как корректно удалить элементы через React, а не через document.querySelector ('blabla').remove() ?

Задача для начала, дайте мне список команд или один большой кусок javascript, который удалит все виды спорта из списка слева (именно удалит, а не сделает hide) и при этом коэффициенты в центральной части таблицы будут обновляться и ошибки в консоль валиться не будут.  Этот код нужно будет вставить в консоль и нажать Enter чтобы применить его и он тут же сработает. (вторым шагом нужно удалить ненужные события (все кроме тотал) из списка и чтобы сайт полноценно работал)

Например если выполнить в консоли строку: document.querySelector("div.loginbgC").remove();

Справа вверху исчезнет блок с кнопками зарегистрироваться, логин и выбором языка.

Если я сделаю нечто подобное со списком видов спорта будут ошибки в консоли,  а если удалю строку из открытого списка событий командой: document.querySelector('[data-reactid]').remove(); то я не смогу вообще делать ставки. Через некоторое время перестают работать некоторые элементы интерфейса! а это недопустимо.

Если теперь вкраце переформулировать то мне нужно вместо document.querySelector('[data-reactid]').remove(); выполнить нечто подобное через React.DOM.нужныйinput.remove() и после этого чтобы ошибки не валились в консоль а сайт продолжал корректно работать.

пример ошибки: Uncaught (in promise) Error: Invariant Violation: findComponentRoot(..., .2.1.1.$1.1): Unable to find element. This probably means the DOM was unexpectedly mutated (e.g., by the browser), usually due to forgetting a when using tables, nesting tags like ,

, or , or using non-SVG elements in an parent. Try inspecting the child nodes of the element with React ID ``

На сами ошибки мне плевать, пусть хоть пачками валятся, главное чтобы при этом работали все элементы интерфейса, открывались закрывались формы ставки делалась сама ставка и так далее.

Если что еще не понятно, пишите уточню.

Оплата по факту выполненых работ. Я думаю если вы отлично понимаете принципы работы reactjs для вас не составит труда выполнить это задание.