feat: refactor chains imports and add networks (#196)

e2e/poms/staking_page.ts

@@ -3,11 +3,13 @@ import type { Page } from "@playwright/test";
 import type { TStakingContext } from "@src/screens/staking/lib/staking_sdk/context";
 import type {
   Account,
-  Coin,
-  StakingNetworkId,
   Wallet,
 } from "@src/screens/staking/lib/staking_sdk/core";
-import { WalletId } from "@src/screens/staking/lib/staking_sdk/core";
+import type {
+  Coin,
+  StakingNetworkId,
+} from "@src/screens/staking/lib/staking_sdk/core/base";
+import { WalletId } from "@src/screens/staking/lib/staking_sdk/core/base";
 import type { NetworkKey } from "@src/utils/network_info";
 
 const networkCard = (network: NetworkKey) =>

e2e/staking.spec.ts

@@ -3,7 +3,7 @@ import { expect, test } from "@playwright/test";
 import {
   StakingNetworkId,
   WalletId,
-} from "@src/screens/staking/lib/staking_sdk/core";
+} from "@src/screens/staking/lib/staking_sdk/core/base";
 import type { NetworkKey } from "@src/utils/network_info";
 
 import { StakingPage } from "./poms/staking_page";

src/components/stats/hooks.tsx

@@ -9,7 +9,7 @@ import {
   fetchNetworksInfo,
 } from "@src/screens/staking/lib/staking_sdk/context/actions";
 import { getNetworkTVL } from "@src/screens/staking/lib/staking_sdk/context/selectors";
-import { StakingNetworkId } from "@src/screens/staking/lib/staking_sdk/core";
+import { StakingNetworkId } from "@src/screens/staking/lib/staking_sdk/core/base";
 import { networkFunctions } from "@src/utils/network_functions";
 import { EthData, VSYSData, networkNumber } from "@src/utils/network_info";
 

src/screens/staking/components/networks/components/network_grid/components/network_card/index.module.scss

@@ -52,6 +52,7 @@ $image-box-shadow:
   max-width: spacing(6);
   min-height: spacing(6);
   min-width: spacing(6);
+  overflow: hidden;
   padding: 0;
 }
 

src/screens/staking/components/networks/components/network_grid/components/network_card/popover.tsx

@@ -35,15 +35,15 @@ import {
   getUnbondingTokensForNetwork,
 } from "@src/screens/staking/lib/staking_sdk/context/selectors";
 import {
-  WalletId,
   networkKeyToNetworkId,
   networksWithStaking,
 } from "@src/screens/staking/lib/staking_sdk/core";
 import type {
   Account,
-  Coin,
-  NetworkInfo,
+  StakingNetworkInfo,
 } from "@src/screens/staking/lib/staking_sdk/core";
+import type { Coin } from "@src/screens/staking/lib/staking_sdk/core/base";
+import { WalletId } from "@src/screens/staking/lib/staking_sdk/core/base";
 import {
   formatCoin,
   formatStakedDataUSD,
@@ -93,7 +93,7 @@ const PopOver = ({
   const { t } = useTranslation("staking");
 
   const [stakingNetworkInfo, setStakingNetworkInfo] =
-    useState<NetworkInfo | null>(null);
+    useState<null | StakingNetworkInfo>(null);
 
   const { state: stakingState } = useContext(StakingContext);
 

src/screens/staking/components/staking_section/claim_rewards_modal.tsx

@@ -14,7 +14,7 @@ import {
   syncAccountData,
 } from "@src/screens/staking/lib/staking_sdk/context/actions";
 import { getSelectedAccount } from "@src/screens/staking/lib/staking_sdk/context/selectors";
-import type { Coin } from "@src/screens/staking/lib/staking_sdk/core";
+import type { Coin } from "@src/screens/staking/lib/staking_sdk/core/base";
 import { formatCoin } from "@src/screens/staking/lib/staking_sdk/formatters";
 import { accountHasRewards } from "@src/screens/staking/lib/staking_sdk/utils/accounts";
 import {

src/screens/staking/components/staking_section/networks_select.tsx

@@ -15,15 +15,13 @@ import {
   getSelectedAccount,
   getWalletCustomName,
 } from "@src/screens/staking/lib/staking_sdk/context/selectors";
-import type {
-  Account,
-  StakingNetworkId,
-} from "@src/screens/staking/lib/staking_sdk/core";
+import type { Account } from "@src/screens/staking/lib/staking_sdk/core";
 import {
-  WalletId,
-  mainNetworkDenom,
   networkIdToNetworkKey,
+  walletsSupported,
 } from "@src/screens/staking/lib/staking_sdk/core";
+import type { StakingNetworkId } from "@src/screens/staking/lib/staking_sdk/core/base";
+import { mainNetworkDenom } from "@src/screens/staking/lib/staking_sdk/core/base";
 import { formatCoin } from "@src/screens/staking/lib/staking_sdk/formatters";
 import {
   getClaimableRewardsForAccount,
@@ -179,7 +177,7 @@ const NetworksSelect = ({ disabled, variant }: Props) => {
 
   if (isWallet) {
     const otherWalletsAccounts = allAccounts
-      .filter(({ wallet }) => wallet !== WalletId.Leap) // TODO remove this line when staking with Leap Wallet is reliable
+      .filter(({ wallet }) => walletsSupported.has(wallet))
       .filter((account) => account.networkId === selectedAccount.networkId);
 
     if (otherWalletsAccounts.length < 2) {

src/screens/staking/components/staking_section/staking_modal.tsx

@@ -19,8 +19,8 @@ import {
   syncAccountData,
 } from "@src/screens/staking/lib/staking_sdk/context/actions";
 import { getSelectedAccount } from "@src/screens/staking/lib/staking_sdk/context/selectors";
-import type { NetworkInfo } from "@src/screens/staking/lib/staking_sdk/core";
-import { mainNetworkDenom } from "@src/screens/staking/lib/staking_sdk/core";
+import type { StakingNetworkInfo } from "@src/screens/staking/lib/staking_sdk/core";
+import { mainNetworkDenom } from "@src/screens/staking/lib/staking_sdk/core/base";
 import { formatCoin } from "@src/screens/staking/lib/staking_sdk/formatters";
 import { getAccountNormalisedBalance } from "@src/screens/staking/lib/staking_sdk/utils/accounts";
 import { getEmptyCoin } from "@src/screens/staking/lib/staking_sdk/utils/coins";
@@ -43,7 +43,10 @@ const StakingModal = () => {
   const [isLoading, setIsLoading] = useState(false);
   const { selectedAccount, selectedAction } = stakingRef.current.state;
 
-  const [networkInfo, setNetworkInfo] = useState<NetworkInfo | null>(null);
+  const [networkInfo, setNetworkInfo] = useState<null | StakingNetworkInfo>(
+    null,
+  );
+
   const [amount, setAmount] = useState("");
   const [amountError, setAmountError] = useState("");
   const [memoError, setMemoError] = useState("");

src/screens/staking/components/staking_section/unstaking_modal.tsx

@@ -20,7 +20,7 @@ import {
   syncAccountData,
 } from "@src/screens/staking/lib/staking_sdk/context/actions";
 import { getSelectedAccount } from "@src/screens/staking/lib/staking_sdk/context/selectors";
-import type { NetworkInfo } from "@src/screens/staking/lib/staking_sdk/core";
+import type { StakingNetworkInfo } from "@src/screens/staking/lib/staking_sdk/core";
 import { formatCoin } from "@src/screens/staking/lib/staking_sdk/formatters";
 import { getAccountNormalisedDelegation } from "@src/screens/staking/lib/staking_sdk/utils/accounts";
 import {
@@ -43,8 +43,13 @@ const UnstakingModal = () => {
   const stakingRef = useStakingRef();
 
   const { locale } = useRouter();
-  const { selectedAccount, selectedAction } = stakingRef.current.state;
-  const [networkInfo, setNetworkInfo] = useState<NetworkInfo | null>(null);
+  const { selectedAction } = stakingRef.current.state;
+
+  const [networkInfo, setNetworkInfo] = useState<null | StakingNetworkInfo>(
+    null,
+  );
+
+  const selectedAccount = getSelectedAccount(stakingRef.current.state);
 
   const isOpen = !!selectedAccount && selectedAction === "unstake";
 

src/screens/staking/components/staking_widget/index.tsx

@@ -14,10 +14,8 @@ import {
   setSelectedAccount,
 } from "@src/screens/staking/lib/staking_sdk/context/actions";
 import { getCanAddWallet } from "@src/screens/staking/lib/staking_sdk/context/selectors";
-import type {
-  Wallet,
-  WalletId,
-} from "@src/screens/staking/lib/staking_sdk/core";
+import type { Wallet } from "@src/screens/staking/lib/staking_sdk/core";
+import type { WalletId } from "@src/screens/staking/lib/staking_sdk/core/base";
 import {
   getWalletName,
   walletsIcons,

src/screens/staking/lib/staking_sdk/context/actions.ts

@@ -1,19 +1,18 @@
 import type { TStakingContext } from ".";
+import { networksWithStaking } from "../core";
+import type {
+  Account,
+  StakingNetworkInfo,
+  StakingState,
+  Wallet,
+} from "../core";
+import type { CoinDenom, StakingNetworkId } from "../core/base";
 import {
   ENABLE_TESTNETS,
   WalletId,
   mainNetworkDenom,
-  networksWithStaking,
   testnetNetworks,
-} from "../core";
-import type {
-  Account,
-  CoinDenom,
-  NetworkInfo,
-  StakingNetworkId,
-  State,
-  Wallet,
-} from "../core";
+} from "../core/base";
 import type { CoinsPricesResult } from "../gecko_client";
 import { geckoClient } from "../gecko_client";
 import { stakingClient } from "../staking_client";
@@ -24,15 +23,15 @@ import { disconnectWalletFns } from "../wallet_operations";
 // Actions
 
 const networkInfoRequests: {
-  [key in StakingNetworkId]?: Promise<NetworkInfo>;
+  [key in StakingNetworkId]?: Promise<StakingNetworkInfo>;
 } = {};
 
 export const getNetworkStakingInfo = async (
   context: TStakingContext,
   networkId: StakingNetworkId,
 ) => {
   if (context.state.networksInfo[networkId])
-    return context.state.networksInfo[networkId] as NetworkInfo;
+    return context.state.networksInfo[networkId] as StakingNetworkInfo;
 
   const request = networkInfoRequests[networkId];
 
@@ -49,7 +48,7 @@ export const getNetworkStakingInfo = async (
 
     networkInfoRequests[networkId] = undefined;
 
-    return newInfo as NetworkInfo;
+    return newInfo as StakingNetworkInfo;
   });
 
   networkInfoRequests[networkId] = newRequest;
@@ -139,8 +138,8 @@ export const setUserWallet = (
 
 export const setSelectedAccount = (
   context: TStakingContext,
-  selectedAction: State["selectedAction"],
-  selectedAccount: State["selectedAccount"],
+  selectedAction: StakingState["selectedAction"],
+  selectedAccount: StakingState["selectedAccount"],
 ) => {
   context.setState({
     selectedAccount: selectedAccount

src/screens/staking/lib/staking_sdk/context/index.tsx

@@ -8,17 +8,19 @@ import {
   useState,
 } from "react";
 
-import type { State } from "../core";
+import type { StakingState } from "../core";
 import { useWalletsListeners } from "../wallet_operations";
 
-type SetState = (state: ((s: State) => State) | Partial<State>) => void;
+type SetState = (
+  state: ((s: StakingState) => StakingState) | Partial<StakingState>,
+) => void;
 
 export type TStakingContext = {
   setState: SetState;
-  state: State;
+  state: StakingState;
 };
 
-const defaultState: State = {
+const defaultState: StakingState = {
   coinsPrices: {},
   hasInit: false,
   networksInfo: {},
@@ -35,7 +37,7 @@ const baseContext: TStakingContext = {
 export const StakingContext = createContext(baseContext);
 
 export const StakingProvider = ({ children }: PropsWithChildren) => {
-  const [state, setState] = useState<State>(
+  const [state, setState] = useState<StakingState>(
     (typeof window !== "undefined" && window.stakingContext?.state) ||
       baseContext.state,
   );