adds eslint rule for direct appconfig import

apps/hyperdrive-trading/.eslintrc

@@ -19,5 +19,19 @@
     // scanning. Arrow functions can still be used as anonymous functions.
     "func-style": ["error", "declaration"],
     "react-refresh/only-export-components": "warn",
+    // Restrict importing `appConfig` from `@delvtech/hyperdrive-appconfig`
+    "no-restricted-imports": [
+      "error",
+      {
+        "paths": [
+          {
+            "name": "@delvtech/hyperdrive-appconfig",
+            "importNames": ["appConfig"],
+            "message": "Importing `appConfig` from `@delvtech/hyperdrive-appconfig` is restricted. Please use the new `useAppConfigForConnectedChain` hook instead."
+          }
+        ],
+        "patterns": []
+      }
+    ]
   },
 }

apps/hyperdrive-trading/src/hyperdrive/getDepositAssets.ts

@@ -1,14 +1,17 @@
 import { ZERO_ADDRESS } from "@delvtech/drift";
 import {
+  AppConfig,
   HyperdriveConfig,
   TokenConfig,
-  appConfig,
   getBaseToken,
   getToken,
 } from "@delvtech/hyperdrive-appconfig";
 
 // TODO: Move this to the appconfig
-export function getDepositAssets(hyperdrive: HyperdriveConfig): TokenConfig[] {
+export function getDepositAssets(
+  hyperdrive: HyperdriveConfig,
+  appConfig: AppConfig,
+): TokenConfig[] {
   const depositAssets: TokenConfig[] = [];
   if (hyperdrive.depositOptions.isBaseTokenDepositEnabled) {
     const baseToken = getBaseToken({

apps/hyperdrive-trading/src/hyperdrive/getLpApy.ts

@@ -1,7 +1,7 @@
 import { Block } from "@delvtech/drift";
 import { fixed } from "@delvtech/fixed-point-wasm";
 import {
-  appConfig,
+  AppConfig,
   getAddLiquidityRewardConfigs,
   getYieldSource,
   HyperdriveConfig,
@@ -44,9 +44,11 @@ export type LpApyResult = {
 export async function getLpApy({
   readHyperdrive,
   hyperdrive,
+  appConfig,
 }: {
   readHyperdrive: ReadHyperdrive;
   hyperdrive: HyperdriveConfig;
+  appConfig: AppConfig;
 }): Promise<LpApyResult> {
   // Get current block and configuration
   const currentBlock = (await readHyperdrive.drift.getBlock()) as Block;

apps/hyperdrive-trading/src/ui/chainlog/AddressCell.tsx

@@ -1,6 +1,7 @@
-import { appConfig, makeAddressUrl } from "@delvtech/hyperdrive-appconfig";
+import { makeAddressUrl } from "@delvtech/hyperdrive-appconfig";
 import { ReactElement } from "react";
 import { ExternalLink } from "src/ui/analytics/ExternalLink";
+import { useAppConfigForConnectedChain } from "src/ui/appconfig/useAppConfigForConnectedChain";
 import { formatAddress } from "src/ui/base/formatting/formatAddress";
 import { Address } from "viem";
 
@@ -11,6 +12,7 @@ export function AddressCell({
   address: Address;
   chainId: number;
 }): ReactElement {
+  const appConfig = useAppConfigForConnectedChain();
   return (
     <ExternalLink
       href={makeAddressUrl(address, appConfig.chains[chainId])}

apps/hyperdrive-trading/src/ui/chainlog/ChainCell.tsx

@@ -1,8 +1,9 @@
-import { appConfig } from "@delvtech/hyperdrive-appconfig";
 import { ReactElement } from "react";
 import { ExternalLink } from "src/ui/analytics/ExternalLink";
+import { useAppConfigForConnectedChain } from "src/ui/appconfig/useAppConfigForConnectedChain";
 
 export function ChainCell({ chainId }: { chainId: number }): ReactElement {
+  const appConfig = useAppConfigForConnectedChain();
   const { iconUrl, name } = appConfig.chains[chainId] || {};
   return (
     <ExternalLink

apps/hyperdrive-trading/src/ui/chainlog/Chainlog.tsx

@@ -1,8 +1,9 @@
-import { appConfig, makeAddressUrl } from "@delvtech/hyperdrive-appconfig";
+import { makeAddressUrl } from "@delvtech/hyperdrive-appconfig";
 import { ArrowTopRightOnSquareIcon } from "@heroicons/react/24/outline";
 import { useNavigate, useSearch } from "@tanstack/react-router";
 import { ReactElement } from "react";
 import { ExternalLink } from "src/ui/analytics/ExternalLink";
+import { useAppConfigForConnectedChain } from "src/ui/appconfig/useAppConfigForConnectedChain";
 import { Tabs } from "src/ui/base/components/Tabs/Tabs";
 import { PoolsTable } from "src/ui/chainlog/PoolsTable";
 import { CHAINLOG_ROUTE } from "src/ui/chainlog/routes";
@@ -12,7 +13,7 @@ import { FactoriesTable } from "./FactoriesTable";
 export function Chainlog(): ReactElement {
   const navigate = useNavigate();
   const chainId = useChainId();
-
+  const appConfig = useAppConfigForConnectedChain();
   const registryAddress = appConfig.registries[chainId];
   const { tab = "pools", version } = useSearch({ from: CHAINLOG_ROUTE });
 

apps/hyperdrive-trading/src/ui/hyperdrive/hooks/useIsNewPool.ts

@@ -1,4 +1,5 @@
-import { HyperdriveConfig, appConfig } from "@delvtech/hyperdrive-appconfig";
+import { HyperdriveConfig } from "@delvtech/hyperdrive-appconfig";
+import { useAppConfigForConnectedChain } from "src/ui/appconfig/useAppConfigForConnectedChain";
 import { useBlockNumber } from "wagmi";
 
 /**
@@ -16,6 +17,8 @@ export function useIsNewPool({
   const blocksSinceInitialization =
     (currentBlockNumber || 0n) - hyperdrive.initializationBlock;
 
+  const appConfig = useAppConfigForConnectedChain();
+
   // if the pool was deployed less than one day ago, it's new.
   const isYoungerThanOneDay =
     blocksSinceInitialization <

apps/hyperdrive-trading/src/ui/hyperdrive/hooks/usePrepareSharesIn.ts

@@ -1,12 +1,9 @@
-import {
-  AppConfig,
-  appConfig,
-  getHyperdriveConfig,
-} from "@delvtech/hyperdrive-appconfig";
+import { AppConfig, getHyperdriveConfig } from "@delvtech/hyperdrive-appconfig";
 import { ReadHyperdrive } from "@delvtech/hyperdrive-js";
 import { useQuery } from "@tanstack/react-query";
 import { makeQueryKey } from "src/base/makeQueryKey";
 import { QueryStatusWithIdle, getStatus } from "src/base/queryStatus";
+import { useAppConfigForConnectedChain } from "src/ui/appconfig/useAppConfigForConnectedChain";
 import { useReadHyperdrive } from "src/ui/hyperdrive/hooks/useReadHyperdrive";
 import { Address } from "viem";
 
@@ -29,6 +26,8 @@ export function usePrepareSharesIn({
     address: hyperdriveAddress,
   });
 
+  const appConfig = useAppConfigForConnectedChain();
+
   const queryEnabled =
     !!readHyperdrive && sharesAmount !== undefined && enabled;
   const { data, status, fetchStatus } = useQuery({

apps/hyperdrive-trading/src/ui/hyperdrive/hooks/usePrepareSharesOut.ts

@@ -1,12 +1,9 @@
-import {
-  AppConfig,
-  appConfig,
-  getHyperdriveConfig,
-} from "@delvtech/hyperdrive-appconfig";
+import { AppConfig, getHyperdriveConfig } from "@delvtech/hyperdrive-appconfig";
 import { ReadHyperdrive } from "@delvtech/hyperdrive-js";
 import { useQuery } from "@tanstack/react-query";
 import { makeQueryKey } from "src/base/makeQueryKey";
 import { QueryStatusWithIdle, getStatus } from "src/base/queryStatus";
+import { useAppConfigForConnectedChain } from "src/ui/appconfig/useAppConfigForConnectedChain";
 import { useReadHyperdrive } from "src/ui/hyperdrive/hooks/useReadHyperdrive";
 import { Address } from "viem";
 
@@ -29,6 +26,8 @@ export function usePrepareSharesOut({
     address: hyperdriveAddress,
   });
 
+  const appConfig = useAppConfigForConnectedChain();
+
   const queryEnabled =
     !!readHyperdrive && sharesAmount !== undefined && enabled;
   const { data, status, fetchStatus } = useQuery({

apps/hyperdrive-trading/src/ui/hyperdrive/hooks/usePresentValue.ts

@@ -1,6 +1,6 @@
 import { fixed } from "@delvtech/fixed-point-wasm";
 import {
-  appConfig,
+  AppConfig,
   getBaseToken,
   getHyperdriveConfig,
 } from "@delvtech/hyperdrive-appconfig";
@@ -12,6 +12,7 @@ import { makeQueryKey2 } from "src/base/makeQueryKey";
 import { isTestnetChain } from "src/chains/isTestnetChain";
 import { queryClient } from "src/network/queryClient";
 import { wagmiConfig } from "src/network/wagmiClient";
+import { useAppConfigForConnectedChain } from "src/ui/appconfig/useAppConfigForConnectedChain";
 import { useReadHyperdrive } from "src/ui/hyperdrive/hooks/useReadHyperdrive";
 import { makeTokenFiatPriceQuery } from "src/ui/token/hooks/useTokenFiatPrice";
 import { Address, PublicClient } from "viem";
@@ -35,6 +36,7 @@ export function usePresentValue({
     chainId,
     address: hyperdriveAddress,
   });
+  const appConfig = useAppConfigForConnectedChain();
   const queryEnabled = !!readHyperdrive;
   const { data, status } = useQuery({
     queryKey: makeQueryKey2({
@@ -49,6 +51,7 @@ export function usePresentValue({
           }) as PublicClient;
 
           return getPresentValue({
+            appConfig,
             hyperdriveAddress,
             chainId,
             publicClient,
@@ -66,11 +69,13 @@ export function usePresentValue({
 }
 
 export function getPresentValue({
+  appConfig,
   hyperdriveAddress,
   chainId,
   publicClient,
   readHyperdrive,
 }: {
+  appConfig: AppConfig;
   publicClient: PublicClient;
   hyperdriveAddress: Address;
   chainId: number;
@@ -92,6 +97,7 @@ export function getPresentValue({
     ? queryClient
         .fetchQuery(
           makeTokenFiatPriceQuery({
+            appConfig,
             chainId: baseToken.chainId,
             tokenAddress: baseToken.address,
           }),

apps/hyperdrive-trading/src/ui/hyperdrive/hooks/useReadHyperdrive.ts

@@ -1,7 +1,8 @@
-import { appConfig, getHyperdriveConfig } from "@delvtech/hyperdrive-appconfig";
+import { getHyperdriveConfig } from "@delvtech/hyperdrive-appconfig";
 import { getHyperdrive, ReadHyperdrive } from "@delvtech/hyperdrive-js";
 import { useQuery } from "@tanstack/react-query";
 import { makeQueryKey } from "src/base/makeQueryKey";
+import { useAppConfigForConnectedChain } from "src/ui/appconfig/useAppConfigForConnectedChain";
 import { useDrift } from "src/ui/drift/useDrift";
 import { Address } from "viem";
 
@@ -14,7 +15,7 @@ export function useReadHyperdrive({
 }): ReadHyperdrive | undefined {
   const drift = useDrift({ chainId });
   const enabled = !!address && !!drift;
-
+  const appConfig = useAppConfigForConnectedChain();
   const { data } = useQuery({
     queryKey: makeQueryKey("getReadHyperdrive", {
       chainId,

apps/hyperdrive-trading/src/ui/hyperdrive/hooks/useReadWriteHyperdrive.ts

@@ -1,7 +1,8 @@
-import { appConfig, getHyperdriveConfig } from "@delvtech/hyperdrive-appconfig";
+import { getHyperdriveConfig } from "@delvtech/hyperdrive-appconfig";
 import { getHyperdrive, ReadWriteHyperdrive } from "@delvtech/hyperdrive-js";
 import { useQuery } from "@tanstack/react-query";
 import { makeQueryKey } from "src/base/makeQueryKey";
+import { useAppConfigForConnectedChain } from "src/ui/appconfig/useAppConfigForConnectedChain";
 import { useReadWriteDrift } from "src/ui/drift/useDrift";
 import { Address } from "viem";
 
@@ -13,7 +14,7 @@ export function useReadWriteHyperdrive({
   chainId: number;
 }): ReadWriteHyperdrive | undefined {
   const drift = useReadWriteDrift({ chainId });
-
+  const appConfig = useAppConfigForConnectedChain();
   const enabled = !!address && !!drift;
 
   const { data } = useQuery({

apps/hyperdrive-trading/src/ui/hyperdrive/hooks/useTradingVolume.ts

@@ -1,6 +1,7 @@
-import { appConfig, getHyperdriveConfig } from "@delvtech/hyperdrive-appconfig";
+import { getHyperdriveConfig } from "@delvtech/hyperdrive-appconfig";
 import { useQuery } from "@tanstack/react-query";
 import { makeQueryKey } from "src/base/makeQueryKey";
+import { useAppConfigForConnectedChain } from "src/ui/appconfig/useAppConfigForConnectedChain";
 import { useReadHyperdrive } from "src/ui/hyperdrive/hooks/useReadHyperdrive";
 import { Address, BlockTag } from "viem";
 
@@ -14,6 +15,7 @@ export function useTradingVolume(
   shortVolume: bigint | undefined;
   tradingVolumeStatus: "loading" | "error" | "success";
 } {
+  const appConfig = useAppConfigForConnectedChain();
   const hyperdrive = getHyperdriveConfig({
     hyperdriveChainId: chainId,
     hyperdriveAddress,

apps/hyperdrive-trading/src/ui/hyperdrive/hooks/useUnpausedPools.ts

@@ -1,6 +1,5 @@
 import {
   AnyReward,
-  appConfig,
   getAddLiquidityRewardConfigs,
   HyperdriveConfig,
 } from "@delvtech/hyperdrive-appconfig";
@@ -24,7 +23,7 @@ export function useUnpausedPools(): {
 } {
   // Only show testnet and fork pools if the user is connected to a testnet
   // chain
-  const appConfigForConnectedChain = useAppConfigForConnectedChain();
+  const appConfig = useAppConfigForConnectedChain();
 
   // Use the chain id in the query key to make sure the pools list updates when
   // you switch chains
@@ -40,7 +39,7 @@ export function useUnpausedPools(): {
         rewardsAmount: AnyReward[];
       })[] = (
         await Promise.all(
-          appConfigForConnectedChain.hyperdrives
+          appConfig.hyperdrives
             .filter((hyperdrive) => !HIDDEN_POOLS.includes(hyperdrive.address))
             .map(async (hyperdrive) => {
               const readHyperdrive = await getHyperdrive({

apps/hyperdrive-trading/src/ui/hyperdrive/longs/CloseLongForm/CloseLongForm.tsx

@@ -1,6 +1,5 @@
 import { fixed } from "@delvtech/fixed-point-wasm";
 import {
-  appConfig,
   getBaseToken,
   getHyperdriveConfig,
   getToken,
@@ -13,6 +12,7 @@ import { isTestnetChain } from "src/chains/isTestnetChain";
 import { getDepositAssets } from "src/hyperdrive/getDepositAssets";
 import { ETH_MAGIC_NUMBER } from "src/token/ETH_MAGIC_NUMBER";
 import { getHasEnoughAllowance } from "src/token/getHasEnoughAllowance";
+import { useAppConfigForConnectedChain } from "src/ui/appconfig/useAppConfigForConnectedChain";
 import { ConnectWalletButton } from "src/ui/base/components/ConnectWallet";
 import { LoadingButton } from "src/ui/base/components/LoadingButton";
 import { PrimaryStat } from "src/ui/base/components/PrimaryStat";
@@ -53,6 +53,7 @@ export function CloseLongForm({
   const { address: account } = useAccount();
   const connectedChainId = useChainId();
   const defaultItems: TokenConfig[] = [];
+  const appConfig = useAppConfigForConnectedChain();
   const baseToken = getBaseToken({
     hyperdriveAddress: hyperdrive.address,
     hyperdriveChainId: hyperdrive.chainId,
@@ -96,6 +97,7 @@ export function CloseLongForm({
       hyperdriveAddress: hyperdrive.address,
       appConfig,
     }),
+    appConfig,
   );
 
   const isZapping = !depositAssets.some(

apps/hyperdrive-trading/src/ui/hyperdrive/longs/CloseLongModalButton/CloseLongModalButton.tsx

@@ -1,12 +1,12 @@
 import {
   HyperdriveConfig,
   TokenConfig,
-  appConfig,
   getBaseToken,
   getToken,
 } from "@delvtech/hyperdrive-appconfig";
 import { Long } from "@delvtech/hyperdrive-js";
 import { ReactElement } from "react";
+import { useAppConfigForConnectedChain } from "src/ui/appconfig/useAppConfigForConnectedChain";
 import { Modal } from "src/ui/base/components/Modal/Modal";
 import { ModalHeader } from "src/ui/base/components/Modal/ModalHeader";
 import { CloseLongForm } from "src/ui/hyperdrive/longs/CloseLongForm/CloseLongForm";
@@ -21,6 +21,7 @@ export function CloseLongModalButton({
   long,
   hyperdrive,
 }: CloseLongModalButtonProps): ReactElement {
+  const appConfig = useAppConfigForConnectedChain();
   const baseToken = getBaseToken({
     hyperdriveChainId: hyperdrive.chainId,
     hyperdriveAddress: hyperdrive.address,

apps/hyperdrive-trading/src/ui/hyperdrive/longs/OpenLongForm/OpenLongForm.tsx

@@ -1,6 +1,5 @@
 import { fixed } from "@delvtech/fixed-point-wasm";
 import {
-  appConfig,
   getBaseToken,
   getToken,
   HyperdriveConfig,
@@ -13,6 +12,7 @@ import { getDepositAssets } from "src/hyperdrive/getDepositAssets";
 import { getIsValidTradeSize } from "src/hyperdrive/getIsValidTradeSize";
 import { getHasEnoughAllowance } from "src/token/getHasEnoughAllowance";
 import { getHasEnoughBalance } from "src/token/getHasEnoughBalance";
+import { useAppConfigForConnectedChain } from "src/ui/appconfig/useAppConfigForConnectedChain";
 import { ConnectWalletButton } from "src/ui/base/components/ConnectWallet";
 import { LoadingButton } from "src/ui/base/components/LoadingButton";
 import { useFeatureFlag } from "src/ui/base/featureFlags/featureFlags";
@@ -62,7 +62,7 @@ export function OpenLongForm({
     hyperdriveAddress: hyperdrive.address,
     chainId: hyperdrive.chainId,
   });
-
+  const appConfig = useAppConfigForConnectedChain();
   const { isFlagEnabled: isZapsEnabled } = useFeatureFlag("zaps");
 
   const { tokenList } = useTokenList({
@@ -150,7 +150,7 @@ export function OpenLongForm({
   });
 
   const zapsConfig = appConfig.zaps[hyperdrive.chainId];
-  const depositAssets = getDepositAssets(hyperdrive);
+  const depositAssets = getDepositAssets(hyperdrive, appConfig);
   const isZapping = !depositAssets.some(
     (asset) => asset.address === activeToken.address,
   );