feat: BBN/BTC env (#565)

* feat: bbn network + split getNetworkConfig btc bbn

docs/WalletIntegration.md

@@ -402,7 +402,7 @@ import { Fees, UTXO } from "./wallet/btc_wallet_provider";
 // The base URL for the signet API
 // Utilises an environment variable specifying the mempool API we intend to
 // utilise
-const mempoolAPI = `${getNetworkConfig().mempoolApiUrl}/api/`;
+const mempoolAPI = `${getNetworkConfigBTC().mempoolApiUrl}/api/`;
 
 // URL for the address info endpoint
 function addressInfoUrl(address: string): URL {

src/app/components/Delegations/Delegation.tsx

@@ -13,7 +13,7 @@ import {
   type Delegation as DelegationInterface,
   DelegationState,
 } from "@/app/types/delegations";
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 import { satoshiToBtc } from "@/utils/btc";
 import { getState, getStateTooltip } from "@/utils/getState";
 import { maxDecimals } from "@/utils/maxDecimals";
@@ -55,7 +55,7 @@ export const Delegation: React.FC<DelegationProps> = ({
   const { isApiNormal, isGeoBlocked } = useHealthCheck();
   const { transitionPhase1Delegation } = useTransactionService();
   const { getFinalityProviderMoniker } = useFinalityProviderState();
-  const { coinName, mempoolApiUrl } = getNetworkConfig();
+  const { coinName, mempoolApiUrl } = getNetworkConfigBTC();
 
   useEffect(() => {
     const timerId = setInterval(() => setCurrentTime(Date.now()), ONE_MINUTE); // Update every minute

src/app/components/FAQ/FAQ.tsx

@@ -1,14 +1,14 @@
 import { Heading } from "@babylonlabs-io/bbn-core-ui";
 
 import { useNetworkInfo } from "@/app/hooks/client/api/useNetworkInfo";
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 
 import { questions } from "./data/questions";
 import { Section } from "./Section";
 interface FAQProps {}
 
 export const FAQ: React.FC<FAQProps> = () => {
-  const { coinName, networkName } = getNetworkConfig();
+  const { coinName, networkName } = getNetworkConfigBTC();
   const { data: networkInfo } = useNetworkInfo();
   const confirmationDepth =
     networkInfo?.params.btcEpochCheckParams?.latestParam

src/app/components/Modals/EOIModal/EOIModal.tsx

@@ -9,7 +9,7 @@ import {
 
 import { ResponsiveDialog } from "@/app/components/Modals/ResponsiveDialog";
 import { shouldDisplayTestingMsg } from "@/config";
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 
 import { Step } from "./Step";
 
@@ -34,7 +34,7 @@ interface EOIModalProps {
   onSubmit?: () => void;
 }
 
-const { coinSymbol } = getNetworkConfig();
+const { coinSymbol } = getNetworkConfigBTC();
 const bbnTokenName = shouldDisplayTestingMsg() ? "tBABY" : "BABY";
 
 const STEP_STATES = {

src/app/components/Modals/FeedbackModal.tsx

@@ -12,7 +12,7 @@ import { MdFeedback } from "react-icons/md";
 import { useNetworkInfo } from "@/app/hooks/client/api/useNetworkInfo";
 import { useIsMobileView } from "@/app/hooks/useBreakpoint";
 import { shouldDisplayTestingMsg } from "@/config";
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 
 interface FeedbackModalProps {
   open: boolean;
@@ -21,7 +21,7 @@ interface FeedbackModalProps {
 }
 
 interface ContentProps {}
-const { networkName, coinName } = getNetworkConfig();
+const { networkName, coinName } = getNetworkConfigBTC();
 
 const SuccessContent: React.FC<ContentProps> = () => {
   const { data: networkInfo } = useNetworkInfo();

src/app/components/Modals/InfoModal.tsx

@@ -10,15 +10,15 @@ import {
 
 import { useNetworkInfo } from "@/app/hooks/client/api/useNetworkInfo";
 import { useIsMobileView } from "@/app/hooks/useBreakpoint";
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 import { blocksToDisplayTime } from "@/utils/time";
 
 interface InfoModalProps {
   open: boolean;
   onClose: () => void;
 }
 
-const { coinName } = getNetworkConfig();
+const { coinName } = getNetworkConfigBTC();
 
 export function InfoModal({ open, onClose }: InfoModalProps) {
   const { data: networkInfo } = useNetworkInfo();

src/app/components/Modals/PendingVerificationModal.tsx

@@ -6,7 +6,7 @@ import { useDelegationV2 } from "@/app/hooks/client/api/useDelegationV2";
 import { useTransactionService } from "@/app/hooks/services/useTransactionService";
 import { useDelegationV2State } from "@/app/state/DelegationV2State";
 import { DelegationV2StakingState as State } from "@/app/types/delegationsV2";
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 
 import { GeneralModal } from "./GeneralModal";
 
@@ -47,7 +47,7 @@ export function PendingVerificationModal({
 }: PendingVerificationModalProps) {
   const { submitStakingTx } = useTransactionService();
   const { updateDelegationStatus } = useDelegationV2State();
-  const { networkName } = getNetworkConfig();
+  const { networkName } = getNetworkConfigBTC();
 
   const { data: delegation = null } = useDelegationV2(stakingTxHash);
 

src/app/components/Modals/Phase2Here.tsx

@@ -9,7 +9,7 @@ import { MdLooksTwo } from "react-icons/md";
 import { twMerge } from "tailwind-merge";
 
 import { shouldDisplayTestingMsg } from "@/config";
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 
 import { ResponsiveDialog } from "./ResponsiveDialog";
 
@@ -19,7 +19,7 @@ interface Phase2HereModalProps {
   onClose: () => void;
 }
 
-const { networkName } = getNetworkConfig();
+const { networkName } = getNetworkConfigBTC();
 
 export const Phase2HereModal = ({
   className,

src/app/components/Modals/PreviewModal.tsx

@@ -13,7 +13,7 @@ import { Fragment } from "react";
 import { useNetworkInfo } from "@/app/hooks/client/api/useNetworkInfo";
 import { useIsMobileView } from "@/app/hooks/useBreakpoint";
 import { shouldDisplayTestingMsg } from "@/config";
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 import { satoshiToBtc } from "@/utils/btc";
 import { maxDecimals } from "@/utils/maxDecimals";
 import { blocksToDisplayTime } from "@/utils/time";
@@ -48,7 +48,7 @@ export const PreviewModal = ({
   awaitingWalletResponse,
 }: PreviewModalProps) => {
   const isMobileView = useIsMobileView();
-  const { coinSymbol, networkName } = getNetworkConfig();
+  const { coinSymbol, networkName } = getNetworkConfigBTC();
 
   const { data: networkInfo } = useNetworkInfo();
   const confirmationDepth =

src/app/components/Modals/StakeModal.tsx

@@ -1,10 +1,10 @@
 import { MdEditNote } from "react-icons/md";
 
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 
 import { SubmitModal } from "./SubmitModal";
 
-const { networkName } = getNetworkConfig();
+const { networkName } = getNetworkConfigBTC();
 
 interface StakeModalProps {
   processing?: boolean;

src/app/components/Modals/UnbondModal.tsx

@@ -1,7 +1,7 @@
 import { Text } from "@babylonlabs-io/bbn-core-ui";
 
 import { useNetworkInfo } from "@/app/hooks/client/api/useNetworkInfo";
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 import { satoshiToBtc } from "@/utils/btc";
 import { maxDecimals } from "@/utils/maxDecimals";
 import { blocksToDisplayTime } from "@/utils/time";
@@ -14,7 +14,7 @@ interface UnbondModalProps {
   onClose: () => void;
   onSubmit: () => void;
 }
-const { networkName, coinSymbol } = getNetworkConfig();
+const { networkName, coinSymbol } = getNetworkConfigBTC();
 
 export const UnbondModal = ({
   open,

src/app/components/Modals/WalletDisconnectModal.tsx

@@ -9,7 +9,7 @@ import Image from "next/image";
 
 import cancelCircle from "@/app/assets/cancel-circle.svg";
 import { shouldDisplayTestingMsg } from "@/config";
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 
 import { ResponsiveDialog } from "./ResponsiveDialog";
 
@@ -19,7 +19,7 @@ interface WalletDisconnectModalProps {
   onDisconnect: () => void;
 }
 
-const { networkName } = getNetworkConfig();
+const { networkName } = getNetworkConfigBTC();
 
 export const WalletDisconnectModal = ({
   isOpen,

src/app/components/Modals/WithdrawModal.tsx

@@ -1,6 +1,6 @@
 import { Text } from "@babylonlabs-io/bbn-core-ui";
 
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 
 import { ConfirmationModal } from "./ConfirmationModal";
 
@@ -11,7 +11,7 @@ interface WithdrawModalProps {
   onSubmit: () => void;
 }
 
-const { networkName } = getNetworkConfig();
+const { networkName } = getNetworkConfigBTC();
 
 export const WithdrawModal = (props: WithdrawModalProps) => {
   return (

src/app/components/NetworkBadge/NetworkBadge.tsx

@@ -1,7 +1,7 @@
 import Image from "next/image";
 import { twJoin } from "tailwind-merge";
 
-import { network } from "@/config/network.config";
+import { network } from "@/config/network/btc";
 import { Network } from "@/utils/wallet/btc_wallet_provider";
 
 import testnetIcon from "./testnet-icon.png";

src/app/components/PersonalBalance/PersonalBalance.tsx

@@ -7,7 +7,7 @@ import { useCosmosWallet } from "@/app/context/wallet/CosmosWalletProvider";
 import { useBbnQuery } from "@/app/hooks/client/rpc/queries/useBbnQuery";
 import { useRewardsService } from "@/app/hooks/services/useRewardsService";
 import { shouldDisplayTestingMsg } from "@/config";
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 import { ubbnToBbn } from "@/utils/bbn";
 import { satoshiToBtc } from "@/utils/btc";
 
@@ -21,7 +21,7 @@ const QUERY_KEYS = {
 };
 
 const bbnTokenName = shouldDisplayTestingMsg() ? "tBABY" : "BABY";
-const { coinName, coinSymbol } = getNetworkConfig();
+const { coinName, coinSymbol } = getNetworkConfigBTC();
 
 export function PersonalBalance() {
   const {

src/app/components/Stakers/Staker.tsx

@@ -1,4 +1,4 @@
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 import { satoshiToBtc } from "@/utils/btc";
 import { maxDecimals } from "@/utils/maxDecimals";
 
@@ -15,7 +15,7 @@ export const Staker: React.FC<StakerProps> = ({
   delegations,
   activeTVLSat,
 }) => {
-  const { coinName } = getNetworkConfig();
+  const { coinName } = getNetworkConfigBTC();
 
   return (
     <div className="card border bg-base-300 p-4 text-sm dark:border-0 dark:bg-base-200">

src/app/components/Staking/FinalityProviders/FinalityProviderColumns.tsx

@@ -6,11 +6,11 @@ import {
   FinalityProviderState,
   FinalityProviderStateLabels,
 } from "@/app/types/finalityProviders";
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 import { satoshiToBtc } from "@/utils/btc";
 import { maxDecimals } from "@/utils/maxDecimals";
 
-const { coinSymbol } = getNetworkConfig();
+const { coinSymbol } = getNetworkConfigBTC();
 
 const mapStatus = (value: FinalityProviderState): string => {
   return FinalityProviderStateLabels[value] || "Unknown";

src/app/components/Staking/Form/StakingAmount.tsx

@@ -1,7 +1,7 @@
 import { ChangeEvent, FocusEvent, useEffect, useState } from "react";
 import { twJoin } from "tailwind-merge";
 
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 import { btcToSatoshi, satoshiToBtc } from "@/utils/btc";
 import { maxDecimals } from "@/utils/maxDecimals";
 
@@ -33,7 +33,7 @@ export const StakingAmount: React.FC<StakingAmountProps> = ({
   const errorLabel = "Staking amount";
   const generalErrorMessage = "You should input staking amount";
 
-  const { coinName } = getNetworkConfig();
+  const { coinName } = getNetworkConfigBTC();
 
   // Use effect to reset the state when reset prop changes
   useEffect(() => {

src/app/components/Staking/Form/StakingFee.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useState } from "react";
 
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 import { satoshiToBtc } from "@/utils/btc";
 import { getFeeRateFromMempool } from "@/utils/getFeeRateFromMempool";
 import { Fees } from "@/utils/wallet/btc_wallet_provider";
@@ -31,7 +31,7 @@ export const StakingFee: React.FC<StakingFeeProps> = ({
     setCustomMode(false);
   }, [reset]);
 
-  const { coinName } = getNetworkConfig();
+  const { coinName } = getNetworkConfigBTC();
 
   const { minFeeRate, defaultFeeRate, maxFeeRate } =
     getFeeRateFromMempool(mempoolFeeRates);

src/app/components/Staking/Form/States/WalletNotConnected.tsx

@@ -2,13 +2,13 @@ import { Button, Heading, Text } from "@babylonlabs-io/bbn-core-ui";
 import Image from "next/image";
 
 import { useBTCWallet } from "@/app/context/wallet/BTCWalletProvider";
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 
 import walletIcon from "./wallet-icon.svg";
 
 export const WalletNotConnected = () => {
   const { open } = useBTCWallet();
-  const { coinName } = getNetworkConfig();
+  const { coinName } = getNetworkConfigBTC();
 
   return (
     <div className="flex flex-1 flex-col">

src/app/components/Stats/Stats.tsx

@@ -2,13 +2,13 @@ import { Heading } from "@babylonlabs-io/bbn-core-ui";
 import { memo } from "react";
 
 import { useSystemStats } from "@/app/hooks/client/api/useSystemStats";
-import { getNetworkConfig } from "@/config/network.config";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 import { satoshiToBtc } from "@/utils/btc";
 import { maxDecimals } from "@/utils/maxDecimals";
 
 import { StatItem } from "./StatItem";
 
-const { coinName } = getNetworkConfig();
+const { coinName } = getNetworkConfigBTC();
 
 const formatter = Intl.NumberFormat("en", {
   notation: "compact",

src/app/context/tomo/TomoProvider.tsx

@@ -3,16 +3,17 @@ import "@tomo-inc/wallet-connect-sdk/style.css";
 import { useTheme } from "next-themes";
 import { type PropsWithChildren } from "react";
 
-import { getNetworkConfig } from "@/config/network.config";
-import { bbnDevnet } from "@/config/wallet/babylon";
+import { getNetworkConfigBBN } from "@/config/network/bbn";
+import { getNetworkConfigBTC } from "@/config/network/btc";
 
 type ChainType = "bitcoin" | "cosmos";
 type ThemeType = "dark" | "light";
 
 export const TomoConnectionProvider = ({ children }: PropsWithChildren) => {
   const { resolvedTheme } = useTheme();
 
-  const { mempoolApiUrl, network, networkName } = getNetworkConfig();
+  const { mempoolApiUrl, network, networkName } = getNetworkConfigBTC();
+  const { rpc, chainId, chainData } = getNetworkConfigBBN();
 
   const bitcoinChain = {
     id: 1,
@@ -26,14 +27,14 @@ export const TomoConnectionProvider = ({ children }: PropsWithChildren) => {
 
   const cosmosChain = {
     id: 2,
-    name: bbnDevnet.chainName,
+    name: chainData.chainName,
     type: "cosmos" as ChainType,
-    network: bbnDevnet.chainId,
-    modularData: bbnDevnet,
+    network: chainId,
+    modularData: chainData,
     backendUrls: {
-      rpcUrl: bbnDevnet.rpc,
+      rpcUrl: rpc,
     },
-    logo: bbnDevnet.chainSymbolImageUrl,
+    logo: chainData.chainSymbolImageUrl,
   };
 
   return (