Skip to content

Commit dae2433

Browse files
TarnadasTarnadas
committed
solana integration
1 parent a3ab285 commit dae2433

25 files changed

+2861
-234
lines changed

‎app/App.tsx

+19-19
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,29 @@
1-
import { DefaultEVMAdapterWalletAdapter } from '@orderly.network/default-evm-adapter';
2-
import { OrderlyConfigProvider } from '@orderly.network/hooks';
3-
import { EthersProvider } from '@orderly.network/web3-provider-ethers';
1+
import { Theme } from '@radix-ui/themes';
42
import { Outlet } from '@remix-run/react';
53
import { FC } from 'react';
64

5+
import { EvmProvider } from './providers/EvmProvider';
6+
import { OrderlyProvider } from './providers/OrderlyProvider';
7+
import { SolanaProvider } from './providers/SolanaProvider';
8+
79
import { NavBar } from '~/components';
8-
import { useIsTestnet } from '~/hooks';
910

1011
export const App: FC = () => {
11-
const [isTestnet, networkChanged] = useIsTestnet();
12-
13-
if (networkChanged && typeof window !== 'undefined') {
14-
window.localStorage.setItem('networkId', isTestnet ? 'testnet' : 'mainnet');
15-
window.location.reload();
16-
}
17-
1812
return (
19-
<OrderlyConfigProvider
20-
networkId={isTestnet ? 'testnet' : 'mainnet'}
21-
brokerId="orderly"
22-
brokerName="Orderly Network"
23-
walletAdapters={[new DefaultEVMAdapterWalletAdapter(new EthersProvider())]}
13+
<Theme
14+
appearance="dark"
15+
accentColor="iris"
16+
radius="small"
17+
className="w-full flex flex-col flex-items-center"
2418
>
25-
<NavBar />
26-
<Outlet />
27-
</OrderlyConfigProvider>
19+
<EvmProvider>
20+
<SolanaProvider>
21+
<OrderlyProvider>
22+
<NavBar />
23+
<Outlet />
24+
</OrderlyProvider>
25+
</SolanaProvider>
26+
</EvmProvider>
27+
</Theme>
2828
);
2929
};

‎app/components/Assets.tsx

+5-3
Original file line numberDiff line numberDiff line change
@@ -14,19 +14,21 @@ import { FC, useMemo } from 'react';
1414

1515
import { OrderlyDeposit, PendingButton } from '~/components';
1616
import { useIsTestnet } from '~/hooks';
17-
import { supportedChainIds, usdFormatter } from '~/utils';
17+
import { supportedEvmChainIds, supportedSolanaChainIds, usdFormatter } from '~/utils';
1818

1919
export const Assets: FC = () => {
2020
const [isTestnet] = useIsTestnet();
2121
const collateral = useCollateral();
2222
const [chains] = useChains(isTestnet ? 'testnet' : 'mainnet', {
23-
filter: (item: API.Chain) => supportedChainIds.includes(item.network_infos?.chain_id)
23+
filter: (item: API.Chain) =>
24+
supportedEvmChainIds.includes(item.network_infos?.chain_id) ||
25+
supportedSolanaChainIds.includes(item.network_infos?.chain_id)
2426
});
2527
const account = useAccountInstance();
2628
const [_, customNotification] = useNotifications();
2729

2830
const token = useMemo(() => {
29-
return Array.isArray(chains) ? chains[0].token_infos[0] : undefined;
31+
return Array.isArray(chains) ? chains[0]?.token_infos[0] : undefined;
3032
}, [chains]);
3133
const [{ connectedChain }] = useSetChain();
3234
const deposit = useDeposit({

‎app/components/ConnectWalletButton.tsx

-18
This file was deleted.

‎app/components/CreateOrder.tsx

+5-5
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
import { useOrderEntry, useSymbolsInfo, useWithdraw } from '@orderly.network/hooks';
1+
import { useAccount, useOrderEntry, useSymbolsInfo, useWithdraw } from '@orderly.network/hooks';
22
import { OrderEntity, OrderSide, OrderType } from '@orderly.network/types';
33
import { Separator } from '@radix-ui/themes';
4-
import { useConnectWallet, useNotifications } from '@web3-onboard/react';
4+
import { useNotifications } from '@web3-onboard/react';
55
import { FC, useState } from 'react';
66
import { Controller, SubmitHandler, useForm } from 'react-hook-form';
77
import { match } from 'ts-pattern';
@@ -34,7 +34,7 @@ export const CreateOrder: FC<{
3434
defaultValues
3535
});
3636
const symbolsInfo = useSymbolsInfo();
37-
const [{ wallet }] = useConnectWallet();
37+
const { account } = useAccount();
3838
const { availableWithdraw } = useWithdraw();
3939
const { onSubmit, helper, maxQty, estLeverage, estLiqPrice } = useOrderEntry(
4040
{
@@ -253,11 +253,11 @@ export const CreateOrder: FC<{
253253
<button
254254
type="submit"
255255
disabled={loading}
256-
className={`relative py-2 font-size-5 bg-[var(--accent-9)] hover:bg-[var(--accent-10)] border-rd-1 border-0 ${wallet == null ? 'hidden' : ''}`}
256+
className={`relative py-2 font-size-5 bg-[var(--accent-9)] hover:bg-[var(--accent-10)] border-rd-1 border-0 ${account.address == null ? 'hidden' : ''}`}
257257
>
258258
{loading && <Spinner overlay={true} />} Create Order
259259
</button>
260-
{wallet == null && <ConnectWalletButton />}
260+
{account.address == null && <ConnectWalletButton />}
261261
</form>
262262
);
263263
};

‎app/components/NavBar.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ export const NavBar: FC = () => {
1313
};
1414

1515
return (
16-
<nav className="flex flex-self-stretch gap-sm flex-justify-end align-center">
16+
<nav className="w-full flex flex-self-stretch gap-sm flex-justify-end align-center">
1717
<h2 className="flex-auto m0">
1818
<Link to="/" className="color-unset">
1919
Orderly DEX

‎app/components/OrderlyConnect.tsx

+5-21
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import { useAccount } from '@orderly.network/hooks';
2-
import { AccountStatusEnum, ChainNamespace } from '@orderly.network/types';
2+
import { AccountStatusEnum } from '@orderly.network/types';
33
import { CheckCircledIcon, Cross1Icon } from '@radix-ui/react-icons';
44
import { Button, Dialog, Separator } from '@radix-ui/themes';
5-
import { useConnectWallet, useNotifications, useSetChain } from '@web3-onboard/react';
5+
import { useNotifications, useSetChain } from '@web3-onboard/react';
66
import { FC, useEffect, useState } from 'react';
77

88
import { WalletConnection, PendingButton } from '~/components';
@@ -12,7 +12,6 @@ let timer: number | undefined;
1212

1313
export const OrderlyConnect: FC = () => {
1414
const [open, setOpen] = useState(false);
15-
const [{ wallet }] = useConnectWallet();
1615
const [isTestnet] = useIsTestnet();
1716

1817
const { account, state } = useAccount();
@@ -30,27 +29,12 @@ export const OrderlyConnect: FC = () => {
3029
clearTimeout(timer);
3130
}
3231
timer = setTimeout(() => {
33-
if (state.status < AccountStatusEnum.EnableTrading && wallet != null) {
32+
if (state.status < AccountStatusEnum.EnableTrading && account.address != null) {
3433
setOpen(true);
3534
timer = undefined;
3635
}
3736
}, 3_000) as unknown as number;
38-
// eslint-disable-next-line react-hooks/exhaustive-deps
39-
}, [state, setOpen, wallet]);
40-
41-
useEffect(() => {
42-
if (!wallet || !connectedChain) return;
43-
account.setAddress(wallet.accounts[0].address, {
44-
chain: {
45-
id: connectedChain?.id,
46-
namespace: ChainNamespace.evm
47-
},
48-
provider: wallet.provider,
49-
wallet: {
50-
name: wallet.label
51-
}
52-
});
53-
}, [wallet, account, connectedChain]);
37+
}, [state, setOpen, account]);
5438

5539
const isRegistered = state.status >= AccountStatusEnum.SignedIn;
5640
const hasOrderlyKey = state.status >= AccountStatusEnum.EnableTrading;
@@ -121,7 +105,7 @@ export const OrderlyConnect: FC = () => {
121105
local storage and is unique per device.
122106
</span>
123107
<PendingButton
124-
disabled={hasOrderlyKey}
108+
disabled={hasOrderlyKey || !isRegistered}
125109
onClick={async () => {
126110
const { update } = customNotification({
127111
eventCode: 'orderlyKey',

‎app/components/OrderlyDeposit.tsx

+47-20
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,15 @@
11
import { useAccount, useChains, useDeposit, useWithdraw } from '@orderly.network/hooks';
2-
import { API } from '@orderly.network/types';
2+
import { API, ChainNamespace } from '@orderly.network/types';
33
import { Cross1Icon } from '@radix-ui/react-icons';
44
import { Button, Dialog, Tabs } from '@radix-ui/themes';
55
import { useNotifications, useSetChain } from '@web3-onboard/react';
66
import { FixedNumber } from 'ethers';
77
import { FC, useEffect, useMemo, useState } from 'react';
8+
import { match } from 'ts-pattern';
89

910
import { PendingButton, TokenInput } from '~/components';
1011
import { useIsTestnet } from '~/hooks';
11-
import { supportedChainIds } from '~/utils';
12+
import { supportedEvmChainIds, supportedSolanaChainIds } from '~/utils';
1213

1314
export const OrderlyDeposit: FC<{
1415
walletBalance: FixedNumber;
@@ -25,23 +26,25 @@ export const OrderlyDeposit: FC<{
2526
const [_, customNotification] = useNotifications();
2627

2728
const [isTestnet] = useIsTestnet();
28-
const { account } = useAccount();
29+
const { account, state } = useAccount();
2930
const [chains] = useChains(isTestnet ? 'testnet' : 'mainnet', {
30-
filter: (item: API.Chain) => supportedChainIds.includes(item.network_infos?.chain_id)
31+
filter: (item: API.Chain) =>
32+
supportedEvmChainIds.includes(item.network_infos?.chain_id) ||
33+
supportedSolanaChainIds.includes(item.network_infos?.chain_id)
3134
});
32-
const [{ connectedChain }] = useSetChain();
35+
const [{ connectedChain: connectedEvmChain }] = useSetChain();
3336
const token = useMemo(() => {
3437
return Array.isArray(chains)
3538
? chains
36-
.find((chain) => chain.network_infos.chain_id === Number(connectedChain?.id))
39+
.find((chain) => chain.network_infos.chain_id === Number(connectedEvmChain?.id))
3740
?.token_infos.find((t) => t.symbol === 'USDC')
3841
: undefined;
39-
}, [chains, connectedChain]);
42+
}, [chains, connectedEvmChain]);
4043
const deposit = useDeposit({
4144
address: token?.address,
4245
decimals: token?.decimals,
4346
srcToken: token?.symbol,
44-
srcChainId: Number(connectedChain?.id)
47+
srcChainId: Number(connectedEvmChain?.id)
4548
});
4649

4750
useEffect(() => {
@@ -221,27 +224,51 @@ export const OrderlyDeposit: FC<{
221224
: 'Withdraw'}
222225
</PendingButton>
223226

224-
{isTestnet && (
227+
{isTestnet && state.chainNamespace != null && (
225228
<PendingButton
226229
disabled={mintedTestUSDC}
227230
onClick={async () => {
231+
if (state.chainNamespace == null) return;
228232
const { update } = customNotification({
229233
eventCode: 'mint',
230234
type: 'pending',
231235
message: 'Minting 1k USDC on testnet...'
232236
});
233237
try {
234-
const res = await fetch('https://testnet-operator-evm.orderly.org/v1/faucet/usdc', {
235-
method: 'POST',
236-
headers: {
237-
'Content-Type': 'application/json'
238-
},
239-
body: JSON.stringify({
240-
broker_id: 'orderly',
241-
chain_id: String(Number(connectedChain?.id)),
242-
user_address: account.address
243-
})
244-
});
238+
const chainNamespace = state.chainNamespace;
239+
const res = await fetch(
240+
match(chainNamespace)
241+
.with(
242+
ChainNamespace.evm,
243+
() => 'https://testnet-operator-evm.orderly.org/v1/faucet/usdc'
244+
)
245+
.with(
246+
ChainNamespace.solana,
247+
() => 'https://testnet-operator-sol.orderly.org/v1/faucet/usdc'
248+
)
249+
.exhaustive(),
250+
{
251+
method: 'POST',
252+
headers: {
253+
'Content-Type': 'application/json'
254+
},
255+
body: match(chainNamespace)
256+
.with(ChainNamespace.evm, () =>
257+
JSON.stringify({
258+
broker_id: import.meta.env.VITE_BROKER_ID,
259+
chain_id: String(Number(account.chainId)),
260+
user_address: account.address
261+
})
262+
)
263+
.with(ChainNamespace.solana, () =>
264+
JSON.stringify({
265+
broker_id: import.meta.env.VITE_BROKER_ID,
266+
user_address: account.address
267+
})
268+
)
269+
.exhaustive()
270+
}
271+
);
245272
if (!res.ok) {
246273
throw new Error(res.status === 429 ? 'Too many requests' : res.statusText);
247274
}

‎app/components/StopOrder.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,6 @@ export const StopOrder: FC<{
5959
message: 'Creating order...'
6060
});
6161
try {
62-
console.log('getInput(data, position)', getInput(data, position));
6362
await onSubmit(getInput(data, position));
6463
update({
6564
eventCode: 'createStopOrderSuccess',

‎app/components/index.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
export * from './AdvancedChart';
22
export * from './Assets';
3-
export * from './ConnectWalletButton';
3+
export * from './wallet/ConnectWalletButton';
44
export * from './ClosePosition';
55
export * from './CreateOrder';
66
export * from './LightweightChart';
@@ -19,4 +19,4 @@ export * from './SymbolHeader';
1919
export * from './SymbolSelection';
2020
export * from './TokenInput';
2121
export * from './UpdatePosition';
22-
export * from './WalletConnection';
22+
export * from './wallet/WalletConnection';

0 commit comments

Comments
 (0)