feat: config feature flags

IPFS.json

@@ -6,7 +6,8 @@
       "enabledWithdrawalDexes": ["one-inch", "paraswap", "bebop"],
       "multiChainBanner": [
         324, 10, 42161, 137, 8453, 5000, 59144, 534352, 56, 34443
-      ]
+      ],
+      "featureFlags": {}
     }
   },
   "5": {
@@ -20,7 +21,10 @@
     "leastSafeVersion": "0.36.1",
     "config": {
       "enabledWithdrawalDexes": ["one-inch", "paraswap", "bebop"],
-      "multiChainBanner": []
+      "multiChainBanner": [],
+      "featureFlags": {
+        "ledgerLiveL2": true
+      }
     }
   },
   "11155111": {
@@ -29,7 +33,10 @@
     "leastSafeVersion": "0.36.1",
     "config": {
       "enabledWithdrawalDexes": ["one-inch", "paraswap", "bebop"],
-      "multiChainBanner": []
+      "multiChainBanner": [],
+      "featureFlags": {
+        "ledgerLiveL2": true
+      }
     }
   }
 }

config/external-config/types.ts

@@ -13,6 +13,9 @@ export type ManifestEntry = {
 export type ManifestConfig = {
   enabledWithdrawalDexes: DexWithdrawalApi[];
   multiChainBanner: number[];
+  featureFlags: {
+    ledgerLiveL2?: boolean;
+  };
 };
 
 export type ExternalConfig = Omit<ManifestEntry, 'config'> &

config/external-config/utils.ts

@@ -43,6 +43,14 @@ const isMultiChainBannerValid = (config: object) => {
   return !(new Set(multiChainBanner).size !== multiChainBanner.length);
 };
 
+const isFeatureFlagsValid = (config: object) => {
+  // allow empty config
+  if (!('featureFlags' in config) || !config.featureFlags) return true;
+
+  // only objects
+  return !(typeof config.featureFlags !== 'object');
+};
+
 export const isManifestEntryValid = (
   entry?: unknown,
 ): entry is ManifestEntry => {
@@ -57,7 +65,7 @@ export const isManifestEntryValid = (
   ) {
     const config = entry.config;
 
-    return [isEnabledDexesValid, isMultiChainBannerValid]
+    return [isEnabledDexesValid, isMultiChainBannerValid, isFeatureFlagsValid]
       .map((validator) => validator(config))
       .every((isValid) => isValid);
   }
@@ -71,6 +79,7 @@ export const getBackwardCompatibleConfig = (
     enabledWithdrawalDexes: config.enabledWithdrawalDexes.filter(
       (dex) => !!getDexConfig(dex),
     ),
+    featureFlags: { ...(config.featureFlags ?? {}) },
     multiChainBanner: config.multiChainBanner ?? [],
   };
 };

features/wsteth/shared/wallet/wallet.tsx

@@ -4,7 +4,7 @@ import { useAccount } from 'wagmi';
 import { Divider, Text } from '@lidofinance/lido-ui';
 import { useSDK } from '@lido-sdk/react';
 
-import { config } from 'config';
+import { config, useConfig } from 'config';
 import { CHAINS } from 'consts/chains';
 import { FormatToken } from 'shared/formatters';
 import { TokenToWallet } from 'shared/components';
@@ -30,6 +30,7 @@ import { capitalizeFirstLetter } from 'utils/capitalize-string';
 import { StyledCard } from './styles';
 import { useStETHByWstETHOnL2 } from 'shared/hooks/use-stETH-by-wstETH-on-l2';
 import { useWstETHByStETHOnL2 } from 'shared/hooks/use-wstETH-by-stETH-on-l2';
+import { useIsLedgerLive } from 'shared/hooks/useIsLedgerLive';
 
 const WalletComponent: WalletComponentType = (props) => {
   const { account } = useSDK();
@@ -139,11 +140,18 @@ const WalletComponent: WalletComponentType = (props) => {
 };
 
 export const Wallet: WalletComponentType = memo((props) => {
+  const isLedgerLive = useIsLedgerLive();
+  const { featureFlags } = useConfig().externalConfig;
   const { chainId } = useAccount();
   const { isDappActive, isDappActiveOnL2 } = useDappStatus();
   const { showLidoMultichainFallback } = useLidoMultichainFallbackCondition();
   const { chainName, isMatchDappChainAndWalletChain } = useDappChain();
 
+  if (!featureFlags.ledgerLiveL2 && isLedgerLive && chainName === OPTIMISM) {
+    const error = `Optimism is currently not supported in Ledger Live.`;
+    return <Fallback error={error} {...props} />;
+  }
+
   if (isDappActive && !isMatchDappChainAndWalletChain(chainId)) {
     const switchToEthereum =
       config.defaultChain === CHAINS.Mainnet