Как подключиться к метамаске с помощью React 2020

Я видел, как подключиться к метамаске с помощью реакции в 2020 году, потому что многие способы подключения к метамаске устарели. Документы говорят, что текущий обновленный способ подключения к метамаске — это модуль @web3-react/injected-connector, а затем использовать этот

const injected = new InjectedConnector({
  // Chain IDs for metamask network
  supportedChainIds: [1598738245329, 1337, 5777, 1, 3, 4, 5, 10, 42, 77, 99, 100]
});

мой вопрос: как мне использовать указанную выше константу, чтобы открыть расширение метамаски, чтобы выбрать кошелек для подключения к децентрализованному приложению? также я не использую функциональный компонент, я использую класс. Я все еще учусь реагировать и не совсем понимаю, как перевести реагирующие крючки в класс, например, useWeb3React, или мне ДОЛЖЕН использовать функциональный компонент, чтобы иметь возможность открывать метамаску и получать информацию об учетной записи? Кроме того, в примерах документов это показано в tsx, я надеялся, что кто-нибудь здесь может показать мне, как это сделать в jsx!