-
Notifications
You must be signed in to change notification settings - Fork 5
/
configured-rainbowkit-provider.tsx
122 lines (106 loc) · 2.88 KB
/
configured-rainbowkit-provider.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
import {
connectorsForWallets,
// getDefaultWallets,
RainbowKitProvider,
} from '@rainbow-me/rainbowkit';
// Import known recommended wallets
import { Valora } from '@celo/rainbowkit-celo/wallets';
import { injectedWallet, metaMaskWallet } from '@rainbow-me/rainbowkit/wallets';
// Import CELO chain information
import { Alfajores, Celo } from '@celo/rainbowkit-celo/chains';
import {
baseGoerli,
bsc,
bscTestnet,
goerli,
mainnet,
polygon,
polygonMumbai,
} from 'wagmi/chains';
import { configureChains, createClient, WagmiConfig } from 'wagmi';
import { publicProvider } from 'wagmi/providers/public';
import { jsonRpcProvider } from 'wagmi/providers/jsonRpc';
import type { ReactNode } from 'react';
import React, { createContext, useContext, useMemo } from 'react';
import { getRainbowkitChains } from './utils';
// import { SupportedNetworks } from '@masa-finance/masa-sdk';
type ConfiguredRainbowKitProviderValue = Record<string, never>;
interface ConfiguredRainbowKitProviderProps {
children: ReactNode;
chainsToUse?: any;
}
const { chains, provider } = configureChains(
[
// eth
mainnet,
goerli,
// polygon
polygon,
polygonMumbai,
// base
baseGoerli,
// binance smart chain
bsc,
bscTestnet,
// celo
Alfajores,
Celo,
],
[
// alchemyProvider({ apiKey: process.env.ALCHEMY_ID }),
publicProvider(),
jsonRpcProvider({
rpc: (chain) => ({ http: chain.rpcUrls.default.http[0] }),
}),
]
);
// const { wallets } = getDefaultWallets({
// appName: 'Masa React',
// projectId: '04a4088bf7ff775c3de808412c291cc0',
// chains,
// });
const celoConnectors = connectorsForWallets([
{
groupName: 'Recommended',
wallets: [injectedWallet({ chains }), metaMaskWallet({ chains })],
},
{
groupName: 'Celo',
wallets: [
Valora({ chains }),
// CeloWallet({ chains }),
// CeloDance({ chains }),
],
},
]);
console.log(
'abyayayayo',
celoConnectors().map((cc) => cc.name)
);
const wagmiClient = createClient({
autoConnect: true,
connectors: celoConnectors,
provider,
});
export const ConfiguredRainbowKitProvider = ({
children,
chainsToUse,
}: ConfiguredRainbowKitProviderProps) => {
const rainbowkitChains = getRainbowkitChains(chainsToUse);
const contextValue = useMemo(() => ({}), []);
return (
<WagmiConfig client={wagmiClient}>
<RainbowKitProvider modalSize="compact" chains={rainbowkitChains}>
<ConfiguredRainbowKitContext.Provider value={contextValue}>
{children}
</ConfiguredRainbowKitContext.Provider>
</RainbowKitProvider>
</WagmiConfig>
);
};
export const ConfiguredRainbowKitContext = createContext(
{} as ConfiguredRainbowKitProviderValue
);
export const useConfiguredRainbowKit = (): ConfiguredRainbowKitProviderValue =>
useContext(ConfiguredRainbowKitContext);
export default ConfiguredRainbowKitProvider;