Skip to content

Commit 39a4ac8

Browse files
committed
feat: update bridge with fuel connectors
1 parent 356dff0 commit 39a4ac8

19 files changed

+121
-517
lines changed

packages/app-explorer/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@
1515
"dependencies": {
1616
"@faker-js/faker": "8.4.0",
1717
"@fuel-explorer/graphql": "workspace:*",
18-
"@fuel-ts/math": "0.71.1",
18+
"@fuel-ts/math": "0.73.0",
1919
"@fuel-wallet/sdk": "0.14.3",
2020
"@fuels/assets": "0.1.4",
2121
"@fuels/ui": "workspace:*",
@@ -26,7 +26,7 @@
2626
"csstype": "3.1.3",
2727
"dayjs": "1.11.10",
2828
"framer-motion": "11.0.3",
29-
"fuels": "0.71.1",
29+
"fuels": "0.73.0",
3030
"geist": "1.2.1",
3131
"graphql": ">=16.8.1",
3232
"graphql-request": ">=6.1.0",

packages/app-portal/.env.production

+2
Original file line numberDiff line numberDiff line change
@@ -4,3 +4,5 @@ VITE_FUEL_VERSION=0.22.0
44
VITE_IS_PUBLIC_PREVIEW=true
55
VITE_WALLET_INSTALL=https://chrome.google.com/webstore/detail/fuel-wallet/dldjpboieedgcmpkchcjcbijingjcgok
66
VITE_WALLET_INSTALL_NEXT=https://next-wallet.fuel.network/docs/install/#install-from-source-code
7+
VITE_BLOCK_EXPLORER_URL=https://app.fuel.network/
8+
VITE_FUEL_PROVIDER_URL=https://beta-5.fuel.network/graphql

packages/app-portal/package.json

+4-5
Original file line numberDiff line numberDiff line change
@@ -17,11 +17,10 @@
1717
"@fuel-bridge/fungible-token": "next",
1818
"@fuel-bridge/message-predicates": "next",
1919
"@fuel-bridge/solidity-contracts": "next",
20-
"@fuel-ts/utils": "0.71.1",
2120
"@fuel-ui/css": "0.23.0",
2221
"@fuel-ui/react": "0.23.0",
23-
"@fuel-wallet/react": "0.14.3",
24-
"@fuel-wallet/sdk": "0.14.3",
22+
"@fuel-wallet/react": "0.15.2",
23+
"@fuel-wallet/sdk": "0.15.2",
2524
"@fuels/assets": "0.1.0",
2625
"@fuels/react-xstore": "0.0.8",
2726
"@hookform/resolvers": "^3.1.1",
@@ -31,7 +30,7 @@
3130
"date-fns": "^2.30.0",
3231
"dexie": "^3.2.4",
3332
"framer-motion": "^10.12.16",
34-
"fuels": "0.71.1",
33+
"fuels": "0.73.0",
3534
"react": "^18.2.0",
3635
"react-dom": "^18.2.0",
3736
"react-helmet": "^6.1.0",
@@ -43,7 +42,7 @@
4342
"yup": "^1.2.0"
4443
},
4544
"devDependencies": {
46-
"@fuel-wallet/playwright-utils": "0.14.3",
45+
"@fuel-wallet/playwright-utils": "0.15.2",
4746
"@storybook/addon-a11y": "^7.2.2",
4847
"@storybook/addon-actions": "^7.2.2",
4948
"@storybook/addon-essentials": "^7.2.2",

packages/app-portal/src/config.ts

+3
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,11 @@ export const {
1414
VITE_FUEL_FUNGIBLE_ASSET_ID,
1515
VITE_WALLET_INSTALL,
1616
VITE_WALLET_INSTALL_NEXT,
17+
VITE_FUEL_PROVIDER_URL,
18+
VITE_BLOCK_EXPLORER_URL,
1719
} = import.meta.env;
1820

21+
export const FUEL_PROVIDER = VITE_FUEL_PROVIDER_URL;
1922
export const IS_PREVIEW = import.meta.env.VITE_IS_PUBLIC_PREVIEW === 'true';
2023
export const IS_DEVELOPMENT = import.meta.env.DEV;
2124
export const IS_TEST = import.meta.env.MODE === 'test';

packages/app-portal/src/main.tsx

+6-3
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,11 @@ import './polyfills';
55

66
import { App } from './App';
77

8+
// ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
9+
// <React.StrictMode>
10+
// <App />
11+
// </React.StrictMode>,
12+
// );
813
ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
9-
<React.StrictMode>
10-
<App />
11-
</React.StrictMode>,
14+
<App />,
1215
);

packages/app-portal/src/routes.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { ecosystemRoutes } from './systems/Ecosystem/routes';
55
import { Pages } from './types';
66

77
export const routes = (
8-
<BrowserRouter basename="/portal">
8+
<BrowserRouter basename={import.meta.env.BASE_URL}>
99
<Routes>
1010
<Route>
1111
<Route path="*" element={<Navigate to={Pages.ecosystem} />} />

packages/app-portal/src/systems/Bridge/hooks/useBridgeTxs.tsx

+2-6
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ const selectors = {
2020

2121
export const useBridgeTxs = () => {
2222
const {
23-
hasWallet,
23+
isConnected,
2424
isLoadingConnection,
2525
provider: fuelProvider,
2626
address: fuelAddress,
@@ -39,18 +39,14 @@ export const useBridgeTxs = () => {
3939
const paginatedBridgeTxs = bridgeTxs?.slice(0, amountTxsToShow);
4040
const hasMorePages = (bridgeTxs?.length || 0) > amountTxsToShow;
4141

42-
const isConnected = !!fuelAddress?.toAddress();
43-
4442
return {
4543
handlers: {
4644
showMore: () => setAmountTxsToShow(amountTxsToShow + MAX_BY_PAGE),
4745
},
4846
bridgeTxs: paginatedBridgeTxs,
4947
isLoading,
5048
hasMorePages,
51-
shouldShowNotConnected: hasWallet
52-
? !isLoadingConnection && !isConnected && !isLoading
53-
: !hasWallet,
49+
shouldShowNotConnected: !isLoadingConnection && !isConnected && !isLoading,
5450
shouldShowEmpty:
5551
isConnected && !isLoading && bridgeTxs && bridgeTxs.length === 0,
5652
shouldShowList: !isLoading && isConnected && (bridgeTxs?.length || 0) > 0,

packages/app-portal/src/systems/Bridge/hooks/useExplorerLink.tsx

+6-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
1-
import { getBlockExplorerLink } from '@fuel-wallet/sdk';
1+
import { buildBlockExplorerUrl } from 'fuels';
22
import { useMemo } from 'react';
3+
import { FUEL_PROVIDER, VITE_BLOCK_EXPLORER_URL } from '~/config';
34

45
export type ExplorerLinkProps = {
56
network: 'ethereum' | 'fuel' | string | undefined;
@@ -15,9 +16,11 @@ export function useExplorerLink({
1516
if (network === 'ethereum') {
1617
return `https://sepolia.etherscan.io/tx/${id}`;
1718
}
18-
1919
if (network === 'fuel') {
20-
return getBlockExplorerLink({
20+
if (providerUrl === FUEL_PROVIDER) {
21+
return `${VITE_BLOCK_EXPLORER_URL}tx/${id}`;
22+
}
23+
return buildBlockExplorerUrl({
2124
path: `transaction/${id || ''}`,
2225
providerUrl,
2326
});

packages/app-portal/src/systems/Chains/eth/machines/txEthToFuelMachine.tsx

+5-3
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,8 @@ import type { GetReceiptsInfoReturn, TxEthToFuelInputs } from '../services';
1818
import { TxEthToFuelService } from '../services';
1919
import { EthTxCache } from '../utils';
2020

21+
const FUEL_MESSAGE_GET_INTERVAL = 10000;
22+
2123
type MachineContext = {
2224
ethTxId?: `0x${string}`;
2325
ethTxNonce?: BN;
@@ -185,7 +187,7 @@ export const txEthToFuelMachine = createMachine(
185187
waitingForRetryFuelMessage: {
186188
tags: ['isSettlementLoading', 'isSettlementSelected'],
187189
after: {
188-
2000: 'gettingFuelMessageStatus',
190+
[FUEL_MESSAGE_GET_INTERVAL]: 'gettingFuelMessageStatus',
189191
},
190192
},
191193
gettingFuelMessage: {
@@ -311,7 +313,7 @@ export const txEthToFuelMachine = createMachine(
311313
'isConfirmTransactionSelected',
312314
],
313315
after: {
314-
2000: 'gettingFuelMessageStatus',
316+
[FUEL_MESSAGE_GET_INTERVAL]: 'gettingFuelMessageStatus',
315317
},
316318
},
317319
done: {
@@ -363,7 +365,7 @@ export const txEthToFuelMachine = createMachine(
363365
duration: 5000,
364366
},
365367
);
366-
}, 2000);
368+
}, FUEL_MESSAGE_GET_INTERVAL);
367369
EthTxCache.removeTxCreated(ctx.ethTxId);
368370
}
369371
},

packages/app-portal/src/systems/Chains/fuel/containers/TxFuelToEthDialog.tsx

+2
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,8 @@ export function TxFuelToEthDialog() {
2323
txId: metadata.txId,
2424
});
2525

26+
console.log(amount);
27+
2628
return (
2729
<>
2830
<Dialog.Close aria-label="Close Transaction Dialog" />
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,2 @@
11
export * from './useFuelAccountConnection';
22
export * from './useTxFuelToEth';
3-
export * from './useHasFuelWallet';

packages/app-portal/src/systems/Chains/fuel/hooks/useBalance.tsx

-11
Original file line numberDiff line numberDiff line change
@@ -34,17 +34,6 @@ export const useBalance = ({
3434
},
3535
);
3636

37-
const listenerAccountFetcher = () => {
38-
query.refetch();
39-
};
40-
41-
useEffect(() => {
42-
window.addEventListener('focus', listenerAccountFetcher);
43-
return () => {
44-
window.removeEventListener('focus', listenerAccountFetcher);
45-
};
46-
}, []);
47-
4837
return {
4938
balance: query.data || undefined,
5039
...query,

packages/app-portal/src/systems/Chains/fuel/hooks/useFuelAccountConnection.tsx

+3-7
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import {
22
useAccount,
3-
useConnector,
3+
useConnectUI,
44
useDisconnect,
55
useFuel,
66
useIsConnected,
@@ -13,7 +13,6 @@ import type { AssetFuel } from '~/systems/Assets/utils';
1313
import { useFuelNetwork } from '~/systems/Settings/providers/FuelNetworkProvider';
1414

1515
import { useBalance } from './useBalance';
16-
import { useHasFuelWallet } from './useHasFuelWallet';
1716

1817
export const useFuelAccountConnection = (props?: { assetId?: string }) => {
1918
const { assetId } = props || {};
@@ -25,12 +24,10 @@ export const useFuelAccountConnection = (props?: { assetId?: string }) => {
2524
assetId,
2625
provider: fuelProvider,
2726
});
28-
const { hasWallet } = useHasFuelWallet();
2927
const { isLoading: isLoadingConnection } = useIsConnected();
30-
const { connect, error, isConnecting } = useConnector();
28+
const { connect, error, isConnecting } = useConnectUI();
3129
const { disconnect } = useDisconnect();
32-
// const { provider: fuelProvider } = useProvider();
33-
const { wallet } = useWallet({ address: account || '' });
30+
const { wallet } = useWallet(account);
3431

3532
const address = useMemo(
3633
() => (account ? Address.fromString(account) : undefined),
@@ -60,7 +57,6 @@ export const useFuelAccountConnection = (props?: { assetId?: string }) => {
6057
address,
6158
isConnected: !!account,
6259
error,
63-
hasWallet,
6460
isLoadingConnection,
6561
isConnecting,
6662
provider: fuelProvider,

packages/app-portal/src/systems/Chains/fuel/hooks/useHasFuelWallet.tsx

-20
This file was deleted.

packages/app-portal/src/systems/Chains/fuel/utils/contract.ts

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
1-
import { concatBytes } from '@fuel-ts/utils';
2-
import { ZeroBytes32, arrayify, hash } from 'fuels';
1+
import { ZeroBytes32, arrayify, concatBytes, hash } from 'fuels';
32

43
export function getContractTokenId(
54
contractId: `0x${string}`,
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,5 @@
1-
import {
2-
FUELET_CONNECTOR,
3-
FUEL_WALLET_CONNECTOR,
4-
FUEL_WALLET_DEVELOPMENT_CONNECTOR,
5-
FuelConnectorProvider,
6-
} from '@fuel-wallet/react';
1+
import { FuelProvider } from '@fuel-wallet/react';
2+
import { defaultConnectors } from '@fuel-wallet/sdk';
73
import type { ReactNode } from 'react';
84
import { IS_PREVIEW, IS_TEST } from '~/config';
95

@@ -13,17 +9,20 @@ type ProvidersProps = {
139
children: ReactNode;
1410
};
1511

16-
const connectors =
17-
IS_PREVIEW && !IS_TEST
18-
? [FUEL_WALLET_CONNECTOR, FUEL_WALLET_DEVELOPMENT_CONNECTOR]
19-
: [FUEL_WALLET_CONNECTOR, FUELET_CONNECTOR];
12+
const IS_DEV = IS_PREVIEW && !IS_TEST;
2013

2114
export function FuelConnectProvider({ children }: ProvidersProps) {
2215
const { theme } = useTheme();
2316

2417
return (
25-
<FuelConnectorProvider theme={theme} connectors={connectors}>
18+
<FuelProvider
19+
theme={theme}
20+
fuelConfig={{
21+
devMode: IS_DEV,
22+
connnectors: defaultConnectors(),
23+
}}
24+
>
2625
{children}
27-
</FuelConnectorProvider>
26+
</FuelProvider>
2827
);
2928
}

packages/app-portal/src/vite-env.d.ts

+2
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,8 @@ interface ImportMetaEnv {
1616
readonly VITE_IS_PUBLIC_PREVIEW: string;
1717
readonly VITE_WALLET_INSTALL: string;
1818
readonly VITE_WALLET_INSTALL_NEXT: string;
19+
readonly VITE_FUEL_PROVIDER_URL: string;
20+
readonly VITE_BLOCK_EXPLORER_URL: string;
1921
}
2022

2123
interface ImportMeta {

packages/app-portal/vite.config.ts

+5-2
Original file line numberDiff line numberDiff line change
@@ -5,11 +5,14 @@ import tsconfigPaths from 'vite-tsconfig-paths';
55

66
import './load.envs.js';
77

8-
const { PORT, CI } = process.env;
8+
const { PORT, NODE_ENV, CI } = process.env;
9+
10+
const basePortal = NODE_ENV === 'production' ? '/portal' : '/';
11+
process.env.BASE_URL = basePortal;
912

1013
// https://vitejs.dev/config/
1114
export default defineConfig({
12-
base: CI ? '/portal/' : '/',
15+
base: basePortal,
1316
server: {
1417
port: Number(PORT),
1518
},

0 commit comments

Comments
 (0)