From e7990d68896c29c699429200252b809db3e12946 Mon Sep 17 00:00:00 2001 From: Mohammad Ehsan Kaji Date: Sat, 31 Aug 2024 16:42:38 +0330 Subject: [PATCH 1/5] Add state context --- .../Cloverfield/constants/chains/addresses.ts | 9 +- apps/Cloverfield/pages/_app.tsx | 15 +- apps/Cloverfield/pages/configSDK.tsx | 33 +++- .../core/src/context/configSdkContext.tsx | 90 +++++++++++ packages/core/src/state/chains/hooks.ts | 143 +++++++----------- packages/core/src/state/chains/reducer.ts | 32 +--- 6 files changed, 195 insertions(+), 127 deletions(-) create mode 100644 packages/core/src/context/configSdkContext.tsx diff --git a/apps/Cloverfield/constants/chains/addresses.ts b/apps/Cloverfield/constants/chains/addresses.ts index 266c270..9cf7cde 100644 --- a/apps/Cloverfield/constants/chains/addresses.ts +++ b/apps/Cloverfield/constants/chains/addresses.ts @@ -1,5 +1,8 @@ import { SupportedChainId } from "@symmio/frontend-sdk/constants/chains"; -import { ChainType } from "@symmio/frontend-sdk/state/chains/reducer"; +import { + ChainsType, + ChainType, +} from "@symmio/frontend-sdk/state/chains/reducer"; export enum FrontEndsName { ALPHA = "Alpha", @@ -460,9 +463,7 @@ export const ArbitrumChainCloverfieldFE: ChainType = { "https://api.studio.thegraph.com/query/62454/fundingrate_arbitrum_8_2/version/latest", }; -export const contractInfo: { - [chainId: number]: { [name: string]: ChainType }; -} = { +export const contractInfo: ChainsType = { [SupportedChainId.FANTOM]: { [FrontEndsName.CLOVERFIELD]: FantomChain }, [SupportedChainId.BSC]: { [FrontEndsName.ALPHA]: BSCChainAlphaFE, diff --git a/apps/Cloverfield/pages/_app.tsx b/apps/Cloverfield/pages/_app.tsx index 5ee8d51..5389e03 100644 --- a/apps/Cloverfield/pages/_app.tsx +++ b/apps/Cloverfield/pages/_app.tsx @@ -17,6 +17,7 @@ import ConfigSDKComponent from "./configSDK"; import { setUseWhatChange } from "@simbathesailor/use-what-changed"; import Updaters from "@symmio/frontend-sdk/state/updaters"; import ErrorBoundary from "components/App/ErrorBoundaries"; +import { StateProvider } from "@symmio/frontend-sdk/context/configSdkContext"; // const Updaters = dynamic(() => import("@symmio/frontend-sdk/state/updaters"), { // ssr: false, @@ -60,12 +61,14 @@ export default function MyApp({ Component, pageProps }: AppProps) { - - - - - - + + + + + + + + diff --git a/apps/Cloverfield/pages/configSDK.tsx b/apps/Cloverfield/pages/configSDK.tsx index 52ae911..9aa1d6f 100644 --- a/apps/Cloverfield/pages/configSDK.tsx +++ b/apps/Cloverfield/pages/configSDK.tsx @@ -7,21 +7,40 @@ import { HedgerInfo } from "constants/chains/hedgers"; import { APP_NAME } from "constants/chains/misc"; import { MuonInfo } from "constants/chains/muon"; import { wagmiConfig } from "pages/_app"; +import { useStateContext } from "@symmio/frontend-sdk/context/configSdkContext"; export default function ConfigSDKComponent() { const setConfigCallBack = useSetSdkConfig(); + const { + setChains, + setClientChain, + setFallbackChainId, + setHedgerInfo, + setAppName, + setMuonData, + } = useStateContext(); useEffect(() => { + setChains(contractInfo); + setClientChain(ClientChain); + setFallbackChainId(FALLBACK_CHAIN_ID); + setHedgerInfo(HedgerInfo); + setAppName(APP_NAME); + setMuonData(MuonInfo); + setConfigCallBack({ - chains: contractInfo, - V3_CHAIN_IDS: ClientChain, - FALLBACK_CHAIN_ID, - hedgers: HedgerInfo, - appName: APP_NAME, - MuonData: MuonInfo, wagmiConfig, + hedgers: HedgerInfo, }); - }, [setConfigCallBack]); + }, [ + setAppName, + setChains, + setClientChain, + setConfigCallBack, + setFallbackChainId, + setHedgerInfo, + setMuonData, + ]); return <>; } diff --git a/packages/core/src/context/configSdkContext.tsx b/packages/core/src/context/configSdkContext.tsx new file mode 100644 index 0000000..acb8a36 --- /dev/null +++ b/packages/core/src/context/configSdkContext.tsx @@ -0,0 +1,90 @@ +import React, { createContext, useContext, useState } from "react"; +import { SupportedChainId } from "../constants"; +import { ChainsType, MuonDataObject } from "../state/chains/reducer"; +import { HedgerInfoMap } from "../types/hedger"; + +// Define your context state and actions +interface State { + clientChain: SupportedChainId[]; + setClientChain: (clientChain: SupportedChainId[]) => void; + + chains: ChainsType; + setChains: (chains: ChainsType) => void; + + hedgerInfo: HedgerInfoMap; + setHedgerInfo: (hedgers: HedgerInfoMap) => void; + + fallbackChainId: number; + setFallbackChainId: (chainId: number) => void; + + appName: string; + setAppName: (name: string) => void; + + muonData: MuonDataObject; + setMuonData: (data: MuonDataObject) => void; +} + +// Create a default state +const defaultState: State = { + clientChain: [], + setClientChain: () => {}, + + chains: {}, + setChains: () => {}, + + hedgerInfo: { + [SupportedChainId.NOT_SET]: [], + }, + setHedgerInfo: () => {}, + + fallbackChainId: 1, + setFallbackChainId: () => {}, + + appName: "", + setAppName: () => {}, + + muonData: {}, + setMuonData: () => {}, +}; + +// Create the context with the default state +const StateContext = createContext(defaultState); + +export const StateProvider: React.FC<{ children: React.ReactNode }> = ({ + children, +}) => { + const [clientChain, setClientChain] = useState([]); + const [chains, setChains] = useState({}); + const [hedgerInfo, setHedgerInfo] = useState({ + [SupportedChainId.NOT_SET]: [], + }); + const [fallbackChainId, setFallbackChainId] = useState(1); + const [appName, setAppName] = useState(""); + const [muonData, setMuonData] = useState({}); + + const value = { + clientChain, + setClientChain, + + chains, + setChains, + + hedgerInfo, + setHedgerInfo, + + fallbackChainId, + setFallbackChainId, + + appName, + setAppName, + + muonData, + setMuonData, + }; + + return ( + {children} + ); +}; + +export const useStateContext = () => useContext(StateContext); diff --git a/packages/core/src/state/chains/hooks.ts b/packages/core/src/state/chains/hooks.ts index ad0ac8e..c3467a6 100644 --- a/packages/core/src/state/chains/hooks.ts +++ b/packages/core/src/state/chains/hooks.ts @@ -1,10 +1,11 @@ import { useCallback, useMemo } from "react"; import { AppState, useAppDispatch, useAppSelector } from "../declaration"; import { setChains } from "./actions"; -import { ChainsState, ChainsType, MuonDataType } from "./reducer"; +import { ChainsState, MuonDataObject } from "./reducer"; import useActiveWagmi from "../../lib/hooks/useActiveWagmi"; import { useFEName } from "../user/hooks"; import { useHedgerInfo } from "../hedger/hooks"; +import { useStateContext } from "../../context/configSdkContext"; type InputObject = { [chainId: number]: { [name: string]: any }; @@ -41,102 +42,100 @@ export function useCollateralAddress(): { [chainId: number]: string; } { const FE_NAME = useFEName(); - const chains = useAppSelector((state: AppState) => state.chains.chains); - const v3_ids = useAppSelector((state: AppState) => state.chains.V3_CHAIN_IDS); + + const { chains, clientChain } = useStateContext(); return useMemo(() => { const data = compatibleWithLegacyStructure( chains, - v3_ids, + clientChain, "COLLATERAL_ADDRESS" ); return getValuesByName(data, FE_NAME); - }, [FE_NAME, chains, v3_ids]); + }, [FE_NAME, chains, clientChain]); } export function useCollateralSymbol(): { [chainId: number]: string; } { const FE_NAME = useFEName(); - const chains = useAppSelector((state: AppState) => state.chains.chains); - const v3_ids = useAppSelector((state: AppState) => state.chains.V3_CHAIN_IDS); + + const { chains, clientChain } = useStateContext(); return useMemo(() => { const data = compatibleWithLegacyStructure( chains, - v3_ids, + clientChain, "COLLATERAL_SYMBOL" ); return getValuesByName(data, FE_NAME); - }, [FE_NAME, chains, v3_ids]); + }, [FE_NAME, chains, clientChain]); } export function useCollateralDecimal(): { [chainId: number]: number; } { const FE_NAME = useFEName(); - const chains = useAppSelector((state: AppState) => state.chains.chains); - const v3_ids = useAppSelector((state: AppState) => state.chains.V3_CHAIN_IDS); + + const { chains, clientChain } = useStateContext(); return useMemo(() => { const data = compatibleWithLegacyStructure( chains, - v3_ids, + clientChain, "COLLATERAL_DECIMALS" ); return getValuesByName(data, FE_NAME); - }, [FE_NAME, chains, v3_ids]); + }, [FE_NAME, chains, clientChain]); } export function useDiamondAddress() { const FE_NAME = useFEName(); - const chains = useAppSelector((state: AppState) => state.chains.chains); - const v3_ids = useAppSelector((state: AppState) => state.chains.V3_CHAIN_IDS); + const { chains, clientChain } = useStateContext(); return useMemo(() => { const data = compatibleWithLegacyStructure( chains, - v3_ids, + clientChain, "DIAMOND_ADDRESS" ); return getValuesByName(data, FE_NAME); - }, [FE_NAME, chains, v3_ids]); + }, [FE_NAME, chains, clientChain]); } export function useMultiAccountAddress() { const FE_NAME = useFEName(); - const chains = useAppSelector((state: AppState) => state.chains.chains); - const v3_ids = useAppSelector((state: AppState) => state.chains.V3_CHAIN_IDS); + + const { chains, clientChain } = useStateContext(); return useMemo(() => { const data = compatibleWithLegacyStructure( chains, - v3_ids, + clientChain, "MULTI_ACCOUNT_ADDRESS" ); return getValuesByName(data, FE_NAME); - }, [FE_NAME, chains, v3_ids]); + }, [FE_NAME, chains, clientChain]); } export function useTpSlWalletAddress() { const FE_NAME = useFEName(); - const chains = useAppSelector((state: AppState) => state.chains.chains); - const v3_ids = useAppSelector((state: AppState) => state.chains.V3_CHAIN_IDS); + const { chains, clientChain } = useStateContext(); return useMemo(() => { const data = compatibleWithLegacyStructure( chains, - v3_ids, + clientChain, "TP_SL_WALLET_ADDRESS" ); return getValuesByName(data, FE_NAME); - }, [FE_NAME, chains, v3_ids]); + }, [FE_NAME, chains, clientChain]); } export function useTpSlAvailable() { const FE_NAME = useFEName(); - const chains = useAppSelector((state: AppState) => state.chains.chains); + const { chains } = useStateContext(); const { chainId } = useActiveWagmi(); const { tpslUrl } = useHedgerInfo() || {}; const isEnableTpSl = chains?.[chainId ?? 1]?.[FE_NAME]?.TP_SL_WALLET_ADDRESS; @@ -147,83 +146,80 @@ export function useTpSlAvailable() { } export function useAllMultiAccountAddresses() { - const chains = useAppSelector((state: AppState) => state.chains.chains); - const v3_ids = useAppSelector((state: AppState) => state.chains.V3_CHAIN_IDS); + const { chains, clientChain } = useStateContext(); return useMemo(() => { return compatibleWithLegacyStructure( chains, - v3_ids, + clientChain, "MULTI_ACCOUNT_ADDRESS" ); - }, [chains, v3_ids]); + }, [chains, clientChain]); } export function useSignatureStoreAddress() { const FE_NAME = useFEName(); - const chains = useAppSelector((state: AppState) => state.chains.chains); - const v3_ids = useAppSelector((state: AppState) => state.chains.V3_CHAIN_IDS); + const { chains, clientChain } = useStateContext(); return useMemo(() => { const data = compatibleWithLegacyStructure( chains, - v3_ids, + clientChain, "SIGNATURE_STORE_ADDRESS" ); return getValuesByName(data, FE_NAME); - }, [FE_NAME, chains, v3_ids]); + }, [FE_NAME, chains, clientChain]); } export function usePartyBWhitelistAddress() { const FE_NAME = useFEName(); - const chains = useAppSelector((state: AppState) => state.chains.chains); - const v3_ids = useAppSelector((state: AppState) => state.chains.V3_CHAIN_IDS); + const { chains, clientChain } = useStateContext(); return useMemo(() => { const data = compatibleWithLegacyStructure( chains, - v3_ids, + clientChain, "PARTY_B_WHITELIST" ); return getValuesByName(data, FE_NAME); - }, [FE_NAME, chains, v3_ids]); + }, [FE_NAME, chains, clientChain]); } export function useMultiCallAddress() { const FE_NAME = useFEName(); - const chains = useAppSelector((state: AppState) => state.chains.chains); - const v3_ids = useAppSelector((state: AppState) => state.chains.V3_CHAIN_IDS); + const { chains, clientChain } = useStateContext(); return useMemo(() => { const data = compatibleWithLegacyStructure( chains, - v3_ids, + clientChain, "MULTICALL3_ADDRESS" ); return getValuesByName(data, FE_NAME); - }, [FE_NAME, chains, v3_ids]); + }, [FE_NAME, chains, clientChain]); } export function useUSDCAddress() { const FE_NAME = useFEName(); - const chains = useAppSelector((state: AppState) => state.chains.chains); - const v3_ids = useAppSelector((state: AppState) => state.chains.V3_CHAIN_IDS); + const { chains, clientChain } = useStateContext(); return useMemo(() => { - const data = compatibleWithLegacyStructure(chains, v3_ids, "USDC_ADDRESS"); + const data = compatibleWithLegacyStructure( + chains, + clientChain, + "USDC_ADDRESS" + ); return getValuesByName(data, FE_NAME); - }, [FE_NAME, chains, v3_ids]); + }, [FE_NAME, chains, clientChain]); } export function useV3Ids(): number[] { - const v3_ids = useAppSelector((state: AppState) => state.chains.V3_CHAIN_IDS); - return v3_ids; + const { clientChain } = useStateContext(); + return clientChain; } export function useFallbackChainId() { - const fallbackChainId = useAppSelector( - (state: AppState) => state.chains.FALLBACK_CHAIN_ID - ); + const { fallbackChainId } = useStateContext(); return fallbackChainId; } @@ -233,14 +229,14 @@ export function useHedgerAddress() { } export function useAppName() { - const appName = useAppSelector((state: AppState) => state.chains.appName); + const { appName } = useStateContext(); return appName; } export function useOrderHistorySubgraphAddress() { const { chainId } = useActiveWagmi(); const frontEndName = useFEName(); - const chainsData = useAppSelector((state: AppState) => state.chains.chains); + const { chains: chainsData } = useStateContext(); let address = ""; if (chainId && frontEndName && chainsData && chainsData[chainId]) { @@ -253,9 +249,7 @@ export function useOrderHistorySubgraphAddress() { } export function useGetUniqueElementInChains(element: string) { - const config: ChainsType = useAppSelector( - (state: AppState) => state.chains.chains - ); + const { chains: config } = useStateContext(); const addresses: { chainId: string; url: string }[] = []; @@ -278,7 +272,7 @@ export function useGetUniqueElementInChains(element: string) { export function useAnalyticsSubgraphAddress() { const { chainId } = useActiveWagmi(); const frontEndName = useFEName(); - const chainsData = useAppSelector((state: AppState) => state.chains.chains); + const { chains: chainsData } = useStateContext(); let address = ""; if (chainId && frontEndName && chainsData && chainsData[chainId]) { @@ -294,7 +288,7 @@ export function useAnalyticsSubgraphAddress() { export function useFundingRateSubgraphAddress() { const { chainId } = useActiveWagmi(); const frontEndName = useFEName(); - const chainsData = useAppSelector((state: AppState) => state.chains.chains); + const { chains: chainsData } = useStateContext(); let address = ""; if (chainId && frontEndName && chainsData && chainsData[chainId]) { @@ -307,9 +301,9 @@ export function useFundingRateSubgraphAddress() { return address; } -export function useMuonData(): { [chainId: number]: MuonDataType } { - const MuonData = useAppSelector((state: AppState) => state.chains.MuonData); - return MuonData; +export function useMuonData(): MuonDataObject { + const { muonData } = useStateContext(); + return muonData; } export function useWagmiConfig() { @@ -319,35 +313,14 @@ export function useWagmiConfig() { return wagmiConfig; } -export function useSetSdkConfig(): ({ - chains, - V3_CHAIN_IDS, - FALLBACK_CHAIN_ID, - hedgers, - appName, - MuonData, - wagmiConfig, -}: ChainsState) => void { +export function useSetSdkConfig(): ({ wagmiConfig }: ChainsState) => void { const dispatch = useAppDispatch(); return useCallback( - ({ - chains, - V3_CHAIN_IDS, - FALLBACK_CHAIN_ID, - hedgers, - appName, - MuonData, - wagmiConfig, - }: ChainsState) => { + ({ wagmiConfig, hedgers }: ChainsState) => { dispatch( setChains({ - chains, - V3_CHAIN_IDS, - FALLBACK_CHAIN_ID, - hedgers, - appName, - MuonData, wagmiConfig, + hedgers, }) ); }, diff --git a/packages/core/src/state/chains/reducer.ts b/packages/core/src/state/chains/reducer.ts index 6e4028f..236a00b 100644 --- a/packages/core/src/state/chains/reducer.ts +++ b/packages/core/src/state/chains/reducer.ts @@ -4,7 +4,7 @@ const { createReducer } = ((toolkitRaw as any).default ?? toolkitRaw) as typeof toolkitRaw; import { setChains } from "./actions"; import { HedgerInfoMap } from "../../types/hedger"; -import { SupportedChainId } from "../../constants/chains"; +import { SupportedChainId } from "../../constants"; export interface ChainType { readonly COLLATERAL_SYMBOL: string; @@ -28,47 +28,29 @@ export interface MuonDataType { Urls: string[]; } +export interface MuonDataObject { + [chainId: number]: MuonDataType; +} + export interface ChainsType { [chainId: number]: { [name: string]: ChainType }; } export interface ChainsState { - readonly chains: ChainsType; - readonly V3_CHAIN_IDS: number[]; - readonly FALLBACK_CHAIN_ID: number; readonly hedgers: HedgerInfoMap; - readonly appName: string; - readonly MuonData: { [chainId: number]: MuonDataType }; readonly wagmiConfig: Config; } const initialState: ChainsState = { - chains: {}, - V3_CHAIN_IDS: [], - FALLBACK_CHAIN_ID: 1, hedgers: { [SupportedChainId.NOT_SET]: [] }, - appName: "", - MuonData: {}, + wagmiConfig: {} as Config, }; export default createReducer(initialState, (builder) => builder.addCase(setChains, (state, { payload }) => { - const { - chains, - V3_CHAIN_IDS, - FALLBACK_CHAIN_ID, - hedgers, - appName, - MuonData, - wagmiConfig, - } = payload; - state.chains = chains; - state.V3_CHAIN_IDS = V3_CHAIN_IDS; - state.FALLBACK_CHAIN_ID = FALLBACK_CHAIN_ID; + const { wagmiConfig, hedgers } = payload; state.hedgers = hedgers; - state.appName = appName; - state.MuonData = MuonData; state.wagmiConfig = wagmiConfig; }) ); From c969918f04e9ce28111414355d4c0b20e4cffe80 Mon Sep 17 00:00:00 2001 From: Mohammad Ehsan Kaji Date: Sat, 31 Aug 2024 17:24:29 +0330 Subject: [PATCH 2/5] Add wagmi config to state --- apps/Cloverfield/pages/configSDK.tsx | 4 +++- packages/core/src/context/configSdkContext.tsx | 12 ++++++++++++ packages/core/src/state/chains/hooks.ts | 9 +++------ packages/core/src/state/chains/reducer.ts | 7 +------ 4 files changed, 19 insertions(+), 13 deletions(-) diff --git a/apps/Cloverfield/pages/configSDK.tsx b/apps/Cloverfield/pages/configSDK.tsx index 9aa1d6f..cac30be 100644 --- a/apps/Cloverfield/pages/configSDK.tsx +++ b/apps/Cloverfield/pages/configSDK.tsx @@ -18,6 +18,7 @@ export default function ConfigSDKComponent() { setHedgerInfo, setAppName, setMuonData, + setWagmiConfig, } = useStateContext(); useEffect(() => { @@ -27,9 +28,9 @@ export default function ConfigSDKComponent() { setHedgerInfo(HedgerInfo); setAppName(APP_NAME); setMuonData(MuonInfo); + setWagmiConfig(wagmiConfig); setConfigCallBack({ - wagmiConfig, hedgers: HedgerInfo, }); }, [ @@ -40,6 +41,7 @@ export default function ConfigSDKComponent() { setFallbackChainId, setHedgerInfo, setMuonData, + setWagmiConfig, ]); return <>; diff --git a/packages/core/src/context/configSdkContext.tsx b/packages/core/src/context/configSdkContext.tsx index acb8a36..cc74573 100644 --- a/packages/core/src/context/configSdkContext.tsx +++ b/packages/core/src/context/configSdkContext.tsx @@ -2,6 +2,7 @@ import React, { createContext, useContext, useState } from "react"; import { SupportedChainId } from "../constants"; import { ChainsType, MuonDataObject } from "../state/chains/reducer"; import { HedgerInfoMap } from "../types/hedger"; +import { Config } from "@wagmi/core"; // Define your context state and actions interface State { @@ -22,6 +23,9 @@ interface State { muonData: MuonDataObject; setMuonData: (data: MuonDataObject) => void; + + wagmiConfig: Config; + setWagmiConfig: (config: Config) => void; } // Create a default state @@ -45,6 +49,9 @@ const defaultState: State = { muonData: {}, setMuonData: () => {}, + + wagmiConfig: {} as Config, + setWagmiConfig: () => {}, }; // Create the context with the default state @@ -62,6 +69,8 @@ export const StateProvider: React.FC<{ children: React.ReactNode }> = ({ const [appName, setAppName] = useState(""); const [muonData, setMuonData] = useState({}); + const [wagmiConfig, setWagmiConfig] = useState({} as Config); + const value = { clientChain, setClientChain, @@ -80,6 +89,9 @@ export const StateProvider: React.FC<{ children: React.ReactNode }> = ({ muonData, setMuonData, + + wagmiConfig, + setWagmiConfig, }; return ( diff --git a/packages/core/src/state/chains/hooks.ts b/packages/core/src/state/chains/hooks.ts index c3467a6..9b3eb2e 100644 --- a/packages/core/src/state/chains/hooks.ts +++ b/packages/core/src/state/chains/hooks.ts @@ -307,19 +307,16 @@ export function useMuonData(): MuonDataObject { } export function useWagmiConfig() { - const wagmiConfig = useAppSelector( - (state: AppState) => state.chains.wagmiConfig - ); + const { wagmiConfig } = useStateContext(); return wagmiConfig; } -export function useSetSdkConfig(): ({ wagmiConfig }: ChainsState) => void { +export function useSetSdkConfig(): ({ hedgers }: ChainsState) => void { const dispatch = useAppDispatch(); return useCallback( - ({ wagmiConfig, hedgers }: ChainsState) => { + ({ hedgers }: ChainsState) => { dispatch( setChains({ - wagmiConfig, hedgers, }) ); diff --git a/packages/core/src/state/chains/reducer.ts b/packages/core/src/state/chains/reducer.ts index 236a00b..266f57a 100644 --- a/packages/core/src/state/chains/reducer.ts +++ b/packages/core/src/state/chains/reducer.ts @@ -1,4 +1,3 @@ -import { Config } from "@wagmi/core"; import * as toolkitRaw from "@reduxjs/toolkit/dist/redux-toolkit.cjs.production.min.js"; const { createReducer } = ((toolkitRaw as any).default ?? toolkitRaw) as typeof toolkitRaw; @@ -38,19 +37,15 @@ export interface ChainsType { export interface ChainsState { readonly hedgers: HedgerInfoMap; - readonly wagmiConfig: Config; } const initialState: ChainsState = { hedgers: { [SupportedChainId.NOT_SET]: [] }, - - wagmiConfig: {} as Config, }; export default createReducer(initialState, (builder) => builder.addCase(setChains, (state, { payload }) => { - const { wagmiConfig, hedgers } = payload; + const { hedgers } = payload; state.hedgers = hedgers; - state.wagmiConfig = wagmiConfig; }) ); From 9ddb15ab035f786ed478526822a9fa43f9b3cb87 Mon Sep 17 00:00:00 2001 From: Mohammad Ehsan Kaji Date: Sun, 1 Sep 2024 11:59:37 +0330 Subject: [PATCH 3/5] Remove chains reducer & actions --- apps/Cloverfield/pages/configSDK.tsx | 7 --- packages/core/package.json | 4 ++ .../core/src/context/configSdkContext.tsx | 35 ++++++++++++- packages/core/src/state/chains/actions.ts | 6 --- packages/core/src/state/chains/hooks.ts | 28 +++------- packages/core/src/state/chains/index.ts | 1 - packages/core/src/state/chains/reducer.ts | 51 ------------------- packages/core/src/state/reducer.ts | 2 - 8 files changed, 45 insertions(+), 89 deletions(-) delete mode 100644 packages/core/src/state/chains/actions.ts delete mode 100644 packages/core/src/state/chains/reducer.ts diff --git a/apps/Cloverfield/pages/configSDK.tsx b/apps/Cloverfield/pages/configSDK.tsx index cac30be..522c062 100644 --- a/apps/Cloverfield/pages/configSDK.tsx +++ b/apps/Cloverfield/pages/configSDK.tsx @@ -1,5 +1,4 @@ import { useEffect } from "react"; -import { useSetSdkConfig } from "@symmio/frontend-sdk/state/chains/hooks"; import { contractInfo } from "constants/chains/addresses"; import { ClientChain, FALLBACK_CHAIN_ID } from "constants/chains/chains"; @@ -10,7 +9,6 @@ import { wagmiConfig } from "pages/_app"; import { useStateContext } from "@symmio/frontend-sdk/context/configSdkContext"; export default function ConfigSDKComponent() { - const setConfigCallBack = useSetSdkConfig(); const { setChains, setClientChain, @@ -29,15 +27,10 @@ export default function ConfigSDKComponent() { setAppName(APP_NAME); setMuonData(MuonInfo); setWagmiConfig(wagmiConfig); - - setConfigCallBack({ - hedgers: HedgerInfo, - }); }, [ setAppName, setChains, setClientChain, - setConfigCallBack, setFallbackChainId, setHedgerInfo, setMuonData, diff --git a/packages/core/package.json b/packages/core/package.json index f5ddd77..07be68b 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -189,6 +189,10 @@ "types": "./dist/constants/abi/index.d.ts", "default": "./dist/constants/abi/index.js" }, + "./context/configSdkContext": { + "types": "./dist/context/configSdkContext.d.ts", + "default": "./dist/context/configSdkContext.js" + }, "./hooks/useAccountData": { "types": "./dist/hooks/useAccountData.d.ts", "default": "./dist/hooks/useAccountData.js" diff --git a/packages/core/src/context/configSdkContext.tsx b/packages/core/src/context/configSdkContext.tsx index cc74573..b49ea61 100644 --- a/packages/core/src/context/configSdkContext.tsx +++ b/packages/core/src/context/configSdkContext.tsx @@ -1,9 +1,42 @@ import React, { createContext, useContext, useState } from "react"; import { SupportedChainId } from "../constants"; -import { ChainsType, MuonDataObject } from "../state/chains/reducer"; import { HedgerInfoMap } from "../types/hedger"; import { Config } from "@wagmi/core"; +export interface ChainType { + readonly COLLATERAL_SYMBOL: string; + readonly COLLATERAL_DECIMALS: number; + readonly COLLATERAL_ADDRESS: string; + readonly DIAMOND_ADDRESS: string; + readonly MULTI_ACCOUNT_ADDRESS: string; + readonly PARTY_B_WHITELIST: string; + readonly SIGNATURE_STORE_ADDRESS: string; + readonly TP_SL_WALLET_ADDRESS: string; + readonly MULTICALL3_ADDRESS: string; + readonly USDC_ADDRESS: string; + readonly WRAPPED_NATIVE_ADDRESS: string; + readonly ANALYTICS_SUBGRAPH_ADDRESS: string; + readonly ORDER_HISTORY_SUBGRAPH_ADDRESS: string; + readonly FUNDING_RATE_SUBGRAPH_ADDRESS: string; +} + +export interface MuonDataType { + AppName: string; + Urls: string[]; +} + +export interface MuonDataObject { + [chainId: number]: MuonDataType; +} + +export interface ChainsType { + [chainId: number]: { [name: string]: ChainType }; +} + +export interface ChainsState { + readonly hedgers: HedgerInfoMap; +} + // Define your context state and actions interface State { clientChain: SupportedChainId[]; diff --git a/packages/core/src/state/chains/actions.ts b/packages/core/src/state/chains/actions.ts deleted file mode 100644 index 330774c..0000000 --- a/packages/core/src/state/chains/actions.ts +++ /dev/null @@ -1,6 +0,0 @@ -import * as toolkitRaw from "@reduxjs/toolkit/dist/redux-toolkit.cjs.production.min.js"; -const { createAction } = ((toolkitRaw as any).default ?? - toolkitRaw) as typeof toolkitRaw; -import { ChainsState } from "./reducer"; - -export const setChains = createAction("chains/setChains"); diff --git a/packages/core/src/state/chains/hooks.ts b/packages/core/src/state/chains/hooks.ts index 9b3eb2e..9e579ce 100644 --- a/packages/core/src/state/chains/hooks.ts +++ b/packages/core/src/state/chains/hooks.ts @@ -1,11 +1,11 @@ -import { useCallback, useMemo } from "react"; -import { AppState, useAppDispatch, useAppSelector } from "../declaration"; -import { setChains } from "./actions"; -import { ChainsState, MuonDataObject } from "./reducer"; +import { useMemo } from "react"; import useActiveWagmi from "../../lib/hooks/useActiveWagmi"; import { useFEName } from "../user/hooks"; import { useHedgerInfo } from "../hedger/hooks"; -import { useStateContext } from "../../context/configSdkContext"; +import { + MuonDataObject, + useStateContext, +} from "../../context/configSdkContext"; type InputObject = { [chainId: number]: { [name: string]: any }; @@ -224,8 +224,8 @@ export function useFallbackChainId() { } export function useHedgerAddress() { - const hedgers = useAppSelector((state: AppState) => state.chains.hedgers); - return hedgers; + const { hedgerInfo } = useStateContext(); + return hedgerInfo; } export function useAppName() { @@ -310,17 +310,3 @@ export function useWagmiConfig() { const { wagmiConfig } = useStateContext(); return wagmiConfig; } - -export function useSetSdkConfig(): ({ hedgers }: ChainsState) => void { - const dispatch = useAppDispatch(); - return useCallback( - ({ hedgers }: ChainsState) => { - dispatch( - setChains({ - hedgers, - }) - ); - }, - [dispatch] - ); -} diff --git a/packages/core/src/state/chains/index.ts b/packages/core/src/state/chains/index.ts index c83bccf..007f69d 100644 --- a/packages/core/src/state/chains/index.ts +++ b/packages/core/src/state/chains/index.ts @@ -1,2 +1 @@ -export * from "./actions"; export * from "./hooks"; diff --git a/packages/core/src/state/chains/reducer.ts b/packages/core/src/state/chains/reducer.ts deleted file mode 100644 index 266f57a..0000000 --- a/packages/core/src/state/chains/reducer.ts +++ /dev/null @@ -1,51 +0,0 @@ -import * as toolkitRaw from "@reduxjs/toolkit/dist/redux-toolkit.cjs.production.min.js"; -const { createReducer } = ((toolkitRaw as any).default ?? - toolkitRaw) as typeof toolkitRaw; -import { setChains } from "./actions"; -import { HedgerInfoMap } from "../../types/hedger"; -import { SupportedChainId } from "../../constants"; - -export interface ChainType { - readonly COLLATERAL_SYMBOL: string; - readonly COLLATERAL_DECIMALS: number; - readonly COLLATERAL_ADDRESS: string; - readonly DIAMOND_ADDRESS: string; - readonly MULTI_ACCOUNT_ADDRESS: string; - readonly PARTY_B_WHITELIST: string; - readonly SIGNATURE_STORE_ADDRESS: string; - readonly TP_SL_WALLET_ADDRESS: string; - readonly MULTICALL3_ADDRESS: string; - readonly USDC_ADDRESS: string; - readonly WRAPPED_NATIVE_ADDRESS: string; - readonly ANALYTICS_SUBGRAPH_ADDRESS: string; - readonly ORDER_HISTORY_SUBGRAPH_ADDRESS: string; - readonly FUNDING_RATE_SUBGRAPH_ADDRESS: string; -} - -export interface MuonDataType { - AppName: string; - Urls: string[]; -} - -export interface MuonDataObject { - [chainId: number]: MuonDataType; -} - -export interface ChainsType { - [chainId: number]: { [name: string]: ChainType }; -} - -export interface ChainsState { - readonly hedgers: HedgerInfoMap; -} - -const initialState: ChainsState = { - hedgers: { [SupportedChainId.NOT_SET]: [] }, -}; - -export default createReducer(initialState, (builder) => - builder.addCase(setChains, (state, { payload }) => { - const { hedgers } = payload; - state.hedgers = hedgers; - }) -); diff --git a/packages/core/src/state/reducer.ts b/packages/core/src/state/reducer.ts index a4c6835..ec2174e 100644 --- a/packages/core/src/state/reducer.ts +++ b/packages/core/src/state/reducer.ts @@ -8,11 +8,9 @@ import hedger from "./hedger/reducer"; import trade from "./trade/reducer"; import notifications from "./notifications/reducer"; import quotes from "./quotes/reducer"; -import chains from "./chains/reducer"; const reducer = combineReducers({ application, - chains, transactions, user, hedger, From e81f0c3ffdc372e7c667aa184baf99dc493d5acb Mon Sep 17 00:00:00 2001 From: Mohammad Ehsan Kaji Date: Sun, 1 Sep 2024 11:59:50 +0330 Subject: [PATCH 4/5] Remove retry codes --- packages/core/src/state/hedger/updater.ts | 45 ++--------------------- 1 file changed, 3 insertions(+), 42 deletions(-) diff --git a/packages/core/src/state/hedger/updater.ts b/packages/core/src/state/hedger/updater.ts index 9128aff..571b4f0 100644 --- a/packages/core/src/state/hedger/updater.ts +++ b/packages/core/src/state/hedger/updater.ts @@ -13,9 +13,9 @@ enum ReadyState { } import { useAppDispatch, AppThunkDispatch } from "../declaration"; import useIsWindowVisible from "../../lib/hooks/useIsWindowVisible"; -import { autoRefresh, retry } from "../../utils/retry"; +import { autoRefresh } from "../../utils/retry"; -import { ApiState, ConnectionStatus } from "../../types/api"; +import { ConnectionStatus } from "../../types/api"; import { MarketDataMap as PricesType, MarketData, @@ -26,12 +26,10 @@ import { useSetWebSocketStatus, useSetPrices, useHedgerInfo, - useMarketsStatus, useMarketNotionalCap, useSetDepth, useMarkets, useSetFundingRates, - useOpenInterestStatus, } from "./hooks"; import { getMarkets, @@ -85,7 +83,6 @@ function useFetchMarkets( ) { const appName = useAppName(); const { baseUrl } = hedger || {}; - const marketsStatus = useMarketsStatus(); const hedgerMarket = useCallback( (options?: { [x: string]: any }) => { @@ -109,16 +106,6 @@ function useFetchMarkets( controller.abort(); }; }, [hedgerMarket]); - - //if error occurs it will retry to fetch markets 5 times - useEffect(() => { - if (marketsStatus === ApiState.ERROR) - retry(hedgerMarket, { - n: 5, - minWait: 1000, - maxWait: 10000, - }); - }, [marketsStatus, hedgerMarket]); } function useFetchOpenInterest( @@ -127,7 +114,6 @@ function useFetchOpenInterest( ) { const appName = useAppName(); const { baseUrl } = hedger || {}; - const marketsStatus = useOpenInterestStatus(); const hedgerOpenInterest = useCallback( (options?: { [x: string]: any }) => { @@ -155,16 +141,6 @@ function useFetchOpenInterest( controller.abort(); }; }, [hedgerOpenInterest]); - - //if error occurs it will retry to fetch markets 5 times - useEffect(() => { - if (marketsStatus === ApiState.ERROR) - retry(hedgerOpenInterest, { - n: 5, - minWait: 1000, - maxWait: 10000, - }); - }, [marketsStatus, hedgerOpenInterest]); } function useFetchNotionalCap( @@ -172,7 +148,7 @@ function useFetchNotionalCap( thunkDispatch: AppThunkDispatch, activeMarket?: Market ) { - const { marketNotionalCap, marketNotionalCapStatus } = useMarketNotionalCap(); + const { marketNotionalCap } = useMarketNotionalCap(); const { baseUrl } = hedger || {}; const appName = useAppName(); @@ -193,17 +169,6 @@ function useFetchNotionalCap( useEffect(() => { if (activeMarket) return autoRefresh(notionalCaps, 60 * 60); }, [activeMarket, notionalCaps]); - - //if error occurs it will retry to fetch markets 5 times - useEffect(() => { - if (activeMarket && marketNotionalCapStatus === ApiState.ERROR) { - retry(notionalCaps, { - n: 5, - minWait: 3000, - maxWait: 10000, - }); - } - }, [marketNotionalCapStatus, activeMarket, notionalCaps]); } function usePriceWebSocket() { @@ -316,10 +281,6 @@ function useFundingRateWebSocket() { } }, [readyState]); - // useEffect(() => { - // updateWebSocketStatus(connectionStatus) - // }, [connectionStatus, updateWebSocketStatus]) - useEffect(() => { if (connectionStatus === ConnectionStatus.OPEN && activeMarket) { const json = { From 765975dfb897ed20630e92f27fe7b7519244f2a8 Mon Sep 17 00:00:00 2001 From: Mohammad Ehsan Kaji Date: Sun, 1 Sep 2024 12:13:38 +0330 Subject: [PATCH 5/5] Fix build errors --- apps/Cloverfield/constants/chains/addresses.ts | 2 +- apps/Cloverfield/constants/chains/muon.ts | 3 ++- packages/core/package.json | 8 -------- 3 files changed, 3 insertions(+), 10 deletions(-) diff --git a/apps/Cloverfield/constants/chains/addresses.ts b/apps/Cloverfield/constants/chains/addresses.ts index 9cf7cde..db579ed 100644 --- a/apps/Cloverfield/constants/chains/addresses.ts +++ b/apps/Cloverfield/constants/chains/addresses.ts @@ -2,7 +2,7 @@ import { SupportedChainId } from "@symmio/frontend-sdk/constants/chains"; import { ChainsType, ChainType, -} from "@symmio/frontend-sdk/state/chains/reducer"; +} from "@symmio/frontend-sdk/context/configSdkContext"; export enum FrontEndsName { ALPHA = "Alpha", diff --git a/apps/Cloverfield/constants/chains/muon.ts b/apps/Cloverfield/constants/chains/muon.ts index b9183d2..8d21032 100644 --- a/apps/Cloverfield/constants/chains/muon.ts +++ b/apps/Cloverfield/constants/chains/muon.ts @@ -1,5 +1,6 @@ import { SupportedChainId } from "@symmio/frontend-sdk/constants/chains"; -import { MuonDataType } from "@symmio/frontend-sdk/state/chains/reducer"; +import { MuonDataType } from "@symmio/frontend-sdk/context/configSdkContext"; + import { MUON_APP_NAME, BSC_MUON_BASE_URLS, diff --git a/packages/core/package.json b/packages/core/package.json index 07be68b..2ffe086 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -401,10 +401,6 @@ "types": "./dist/state/application/updater.d.ts", "default": "./dist/state/application/updater.js" }, - "./state/chains/actions": { - "types": "./dist/state/chains/actions.d.ts", - "default": "./dist/state/chains/actions.js" - }, "./state/chains/hooks": { "types": "./dist/state/chains/hooks.d.ts", "default": "./dist/state/chains/hooks.js" @@ -413,10 +409,6 @@ "types": "./dist/state/chains/index.d.ts", "default": "./dist/state/chains/index.js" }, - "./state/chains/reducer": { - "types": "./dist/state/chains/reducer.d.ts", - "default": "./dist/state/chains/reducer.js" - }, "./state/hedger/actions": { "types": "./dist/state/hedger/actions.d.ts", "default": "./dist/state/hedger/actions.js"