Merge pull request #700 from threshold-network/remove-ledger-connect-…

…kit-loader

Remove ledger connect kit loader

.env

@@ -10,7 +10,6 @@ REACT_APP_FEATURE_FLAG_MULTI_APP_STAKING=true
 REACT_APP_FEATURE_FLAG_FEEDBACK_MODULE=false
 REACT_APP_FEATURE_FLAG_POSTHOG=false
 REACT_APP_FEATURE_FLAG_SENTRY=$SENTRY_SUPPORT
-REACT_APP_FEATURE_FLAG_LEDGER_LIVE=true
 REACT_APP_SENTRY_DSN=$SENTRY_DSN
 
 REACT_APP_ELECTRUM_PROTOCOL=$ELECTRUM_PROTOCOL

.env.production

@@ -11,7 +11,6 @@ REACT_APP_FEATURE_FLAG_POSTHOG=$POSTHOG_SUPPORT
 REACT_APP_POSTHOG_API_KEY=$POSTHOG_API_KEY
 REACT_APP_POSTHOG_HOSTNAME_HTTP=$POSTHOG_HOSTNAME_HTTP
 REACT_APP_FEATURE_FLAG_SENTRY=$SENTRY_SUPPORT
-REACT_APP_FEATURE_FLAG_LEDGER_LIVE=true
 REACT_APP_SENTRY_DSN=$SENTRY_DSN
 
 REACT_APP_ELECTRUM_PROTOCOL=$ELECTRUM_PROTOCOL

package.json

@@ -20,7 +20,6 @@
     "@keep-network/random-beacon": "2.0.0",
     "@keep-network/tbtc": "1.1.0",
     "@keep-network/tbtc-v2.ts": "2.3.0",
-    "@ledgerhq/connect-kit-loader": "^1.1.2",
     "@reduxjs/toolkit": "^1.6.1",
     "@rehooks/local-storage": "^2.4.4",
     "@sentry/react": "^7.33.0",

src/App.tsx

@@ -5,7 +5,17 @@ import "@fontsource/inter/500.css"
 import "@fontsource/inter/400.css"
 import "@fontsource/ibm-plex-mono/400.css"
 import { FC, useEffect, Fragment } from "react"
-import { Box, ChakraProvider, useColorModeValue } from "@chakra-ui/react"
+import {
+  Alert,
+  AlertDescription,
+  AlertIcon,
+  AlertTitle,
+  Box,
+  ChakraProvider,
+  CloseButton,
+  useColorModeValue,
+  useDisclosure,
+} from "@threshold-network/components"
 import { Provider as ReduxProvider, useDispatch } from "react-redux"
 import { useWeb3React, Web3ReactProvider } from "@web3-react/core"
 import { ConnectorEvent, ConnectorUpdate } from "@web3-react/types"
@@ -180,6 +190,8 @@ const AppBody = () => {
 }
 
 const Layout = () => {
+  const { isOpen: isVisible, onClose } = useDisclosure({ defaultIsOpen: true })
+
   return (
     <Box display="flex">
       <Sidebar />
@@ -188,6 +200,23 @@ const Layout = () => {
         w={{ base: "100%", md: "calc(100% - 80px)" }}
         bg={useColorModeValue("transparent", "gray.900")}
       >
+        {isVisible && (
+          <Alert status="warning">
+            <AlertIcon />
+            <AlertTitle>Attention!</AlertTitle>
+            <AlertDescription>
+              Ledger is temporarily not supported due to an active
+              vulnerability. Please take an additional care while interacting
+              with WalletConnect too.
+            </AlertDescription>
+            <CloseButton
+              position="absolute"
+              right="8px"
+              top="8px"
+              onClick={onClose}
+            />
+          </Alert>
+        )}
         <Navbar />
         <Box as="main" data-cy="app-container">
           <Outlet />

src/components/Modal/SelectWalletModal/index.tsx

@@ -16,9 +16,6 @@ import { CoinbaseWallet } from "../../../static/icons/CoinbaseWallet"
 import { useModal } from "../../../hooks/useModal"
 import ModalCloseButton from "../ModalCloseButton"
 import ConnectTaho from "./ConnectTaho"
-import ConnectLedgerLive from "./ConnectLedgerLive"
-import { LedgerLight } from "../../../static/icons/LedgerLight"
-import { LedgerDark } from "../../../static/icons/LedgerDark"
 import { featureFlags } from "../../../constants"
 
 const walletOptions: WalletOption[] = [
@@ -38,18 +35,6 @@ const walletOptions: WalletOption[] = [
       dark: MetaMaskIcon,
     },
   },
-  ...(featureFlags.LEDGER_LIVE
-    ? [
-        {
-          id: WalletType.LedgerLive,
-          title: "Ledger Live",
-          icon: {
-            light: LedgerLight,
-            dark: LedgerDark,
-          },
-        },
-      ]
-    : []),
   {
     id: WalletType.WalletConnect,
     title: "WalletConnect",
@@ -122,8 +107,6 @@ const ConnectWallet: FC<{
       return <ConnectWalletConnect goBack={goBack} closeModal={onClose} />
     case WalletType.Coinbase:
       return <ConnectCoinbase goBack={goBack} closeModal={onClose} />
-    case WalletType.LedgerLive:
-      return <ConnectLedgerLive goBack={goBack} closeModal={onClose} />
     default:
       return <></>
   }

src/constants/featureFlags.ts

@@ -18,6 +18,3 @@ export const SENTRY = getEnvVariable(EnvVariable.FEATURE_FLAG_SENTRY) === "true"
 
 export const TBTC_V2_REDEMPTION =
   getEnvVariable(EnvVariable.FEATURE_FLAG_TBTC_V2_REDEMPTION) === "true"
-
-export const LEDGER_LIVE =
-  getEnvVariable(EnvVariable.FEATURE_FLAG_LEDGER_LIVE) === "true"

src/enums/env.ts

@@ -7,7 +7,6 @@ const envVariables = [
   "FEATURE_FLAG_MULTI_APP_STAKING",
   "FEATURE_FLAG_POSTHOG",
   "FEATURE_FLAG_FEEDBACK_MODULE",
-  "FEATURE_FLAG_LEDGER_LIVE",
   "POSTHOG_HOSTNAME_HTTP",
   "POSTHOG_API_KEY",
   "ELECTRUM_PROTOCOL",

src/enums/web3.ts

@@ -16,5 +16,4 @@ export enum WalletType {
   Metamask = "METAMASK",
   WalletConnect = "WALLET_CONNECT",
   Coinbase = "COINBASE",
-  LedgerLive = "LEDGER_LIVE",
 }

src/web3/connectors/index.ts

@@ -2,6 +2,5 @@ export * from "./taho"
 export * from "./metamask"
 export * from "./walletConnect"
 export * from "./coinbaseWallet"
-export * from "./ledgerLive"
 export { AbstractConnector } from "@web3-react/abstract-connector"
 export { UserRejectedRequestError } from "@web3-react/injected-connector"

yarn.lock

@@ -3337,11 +3337,6 @@
     "@summa-tx/relay-sol" "^2.0.2"
     openzeppelin-solidity "2.3.0"
 
-"@ledgerhq/connect-kit-loader@^1.1.2":
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/@ledgerhq/connect-kit-loader/-/connect-kit-loader-1.1.2.tgz#d550e3c1f046e4c796f32a75324b03606b7e226a"
-  integrity sha512-mscwGroSJQrCTjtNGBu+18FQbZYA4+q6Tyx6K7CXHl6AwgZKbWfZYdgP2F+fyZcRUdGRsMX8QtvU61VcGGtO1A==
-
 "@ledgerhq/cryptoassets@^5.53.0":
   version "5.53.0"
   resolved "https://registry.yarnpkg.com/@ledgerhq/cryptoassets/-/cryptoassets-5.53.0.tgz#11dcc93211960c6fd6620392e4dd91896aaabe58"