chooseWallet.tsx

import * as React from "react";
import { Button } from "semantic-ui-react";
import { getWallet } from '../services/wallet';
import { useGlobalState } from '../services/global-state';

const WalletView: React.SFC = () => {
  const setWallet = useGlobalState('wallet')[1];

  const connectWallet = async (walletIndex: number) => {
    const wallet = await getWallet(walletIndex);

    try{
      await wallet.connect();
      console.log('Successfully connected!');
      await wallet.login();
      console.log('Successfully logged in!');
      console.log('wallet', wallet);
      setWallet(wallet);
    }catch(err){
      console.log('Error create eos transit wallet instance: \n');
      console.log(err)
      alert('cannot connect to wallet');
    }
  }

  return (
    <div
      style={{
        flexGrow: 1,
        overflowX: "hidden",
        overflowY: "auto",
      }}>


      <Button fluid content='Scatter' onClick={()=> connectWallet(0)}/>
      <br/>
      <Button fluid content='Lynx' onClick={()=> connectWallet(1)}/>
      <br/>
      <Button fluid content='Token Pocket' onClick={()=> connectWallet(2)}/>
      <br/>

    </div>
  );
}

export default WalletView;

wallet.ts

import { initAccessContext, Wallet } from 'eos-transit';
import scatter from 'eos-transit-scatter-provider';
import lynx from 'eos-transit-lynx-provider';
import tokenPocket from 'eos-transit-tokenpocket-provider';
import config from '../config';

export const getWallet = async (walletIndex: number) : Promise<Wallet> => {
  const accessContext = initAccessContext({
    appName: 'MyApp',
    network: {
      host: config.eosApiHost || 'jungle2.cryptolions.io',
      port: parseInt(config.eosApiPort || '80'),
      protocol: config.eosApiProtocol || 'http',
      chainId: config.eosChainId || 'e70aaab8997e1dfce58fbfac80cbbb8fecec7b99cf982a9444273cbc64c41473'
    },
    walletProviders: [
      scatter(),
      lynx(),
      tokenPocket()
    ]
  });

  const walletProviders = accessContext.getWalletProviders();

  const selectedProvider = walletProviders[walletIndex];

  const wallet = accessContext.initWallet(selectedProvider);

  return wallet;
}