Merge pull request #45 from ethereum-optimism/01-09-feat_add_l1_to_l2…

…_bridge

feat: add l1 to l2 bridge

packages/cli/src/actions/deployCreateXCreate2.ts

@@ -1,4 +1,4 @@
-import {zodSupportedNetwork} from '@/superchain-registry/fetchChainList';
+import {zodSupportedNetwork} from '@/superchain-registry/fetchSuperchainRegistryChainList';
 import {zodPrivateKey} from '@/validators/schemas';
 import {option} from 'pastel';
 

packages/cli/src/actions/verifyContract.ts

@@ -1,4 +1,4 @@
-import {zodSupportedNetwork} from '@/superchain-registry/fetchChainList';
+import {zodSupportedNetwork} from '@/superchain-registry/fetchSuperchainRegistryChainList';
 import {zodAddress} from '@/validators/schemas';
 
 import {option} from 'pastel';

packages/cli/src/bridge-wizard/BridgeWizard.tsx

@@ -4,9 +4,12 @@ import {
 	useBridgeWizardStore,
 } from '@/bridge-wizard/bridgeWizardStore';
 import {EnterAmount} from '@/bridge-wizard/EnterAmount';
+import {EnterRecipient} from '@/bridge-wizard/EnterRecipient';
 import {SelectChains} from '@/bridge-wizard/SelectChains';
 import {SelectNetwork} from '@/bridge-wizard/SelectNetwork';
+import BridgeEntrypoint from '@/commands/bridge';
 import {useSaveWizardProgress} from '@/hooks/useSaveWizardProgress';
+import {SupportedNetwork} from '@/superchain-registry/fetchSuperchainRegistryChainList';
 import {Box, Text} from 'ink';
 
 type StepStatus = 'done' | 'current' | 'upcoming';
@@ -73,11 +76,13 @@ const WizardProgressForStep = ({stepId}: {stepId: BridgeWizardStepId}) => {
 const WizardProgress = () => {
 	const {steps, wizardState} = useBridgeWizardStore();
 	if (wizardState.stepId === 'completed') {
-		return (
-			<Box>
-				<Text>Completed</Text>
-			</Box>
-		);
+		const options = {
+			network: wizardState.network as SupportedNetwork,
+			chains: wizardState.chains,
+			amount: wizardState.amount,
+			recipient: wizardState.recipient,
+		};
+		return <BridgeEntrypoint options={options} />;
 	}
 	return (
 		<Box flexDirection="column">
@@ -109,6 +114,7 @@ export const BridgeWizard = () => {
 			<WizardProgress />
 
 			<Box flexDirection="column">
+				{stepId === 'enter-recipient' && <EnterRecipient />}
 				{stepId === 'select-network' && <SelectNetwork />}
 				{stepId === 'select-chains' && <SelectChains />}
 				{stepId === 'enter-amount' && <EnterAmount />}

packages/cli/src/bridge-wizard/EnterAmount.tsx

@@ -45,10 +45,10 @@ export const EnterAmount = () => {
 
 	const {data: balance, isLoading: isLoadingBalance} = useBalance(
 		wizardState.network,
-		wizardState.address,
+		wizardState.recipient,
 	);
 
-	const numChains = wizardState.chainIds.length;
+	const numChains = wizardState.chains.length;
 
 	return (
 		<Box flexDirection="column" gap={1}>

packages/cli/src/bridge-wizard/EnterRecipient.tsx

@@ -0,0 +1,47 @@
+import {Box, Text} from 'ink';
+import {TextInput} from '@inkjs/ui';
+
+import {useBridgeWizardStore} from '@/bridge-wizard/bridgeWizardStore';
+import {useState} from 'react';
+import {isAddress} from 'viem';
+import {zodAddress} from '@/validators/schemas';
+
+export const EnterRecipient = () => {
+	const {submitEnterRecipient} = useBridgeWizardStore();
+
+	const [errorMessage, setErrorMessage] = useState<string>('');
+	const [resetKey, setResetKey] = useState(0);
+
+	return (
+		<Box flexDirection="column">
+			<Box>
+				<Text>Enter the recipient address:</Text>
+			</Box>
+			<TextInput
+				key={resetKey}
+				onSubmit={address => {
+					if (!isAddress(address)) {
+						setErrorMessage('Invalid address: must start with 0x');
+						setResetKey(prev => prev + 1);
+						return;
+					}
+
+					const result = zodAddress.safeParse(address);
+
+					if (!result.success) {
+						setErrorMessage(result.error.message);
+						setResetKey(prev => prev + 1);
+						return;
+					}
+
+					submitEnterRecipient({recipient: result.data});
+				}}
+			/>
+			{errorMessage && (
+				<Box>
+					<Text color="red">{errorMessage ? `❌ ${errorMessage}` : ' '}</Text>
+				</Box>
+			)}
+		</Box>
+	);
+};

packages/cli/src/bridge-wizard/SelectChains.tsx

@@ -1,5 +1,5 @@
 import {useBridgeWizardStore} from '@/bridge-wizard/bridgeWizardStore';
-import {useChainConfig} from '@/queries/chainConfig';
+import {useSuperchainRegistryChainList} from '@/queries/superchainRegistryChainList';
 import {MultiSelect, Spinner} from '@inkjs/ui';
 import {Box, Text} from 'ink';
 import {useState} from 'react';
@@ -15,7 +15,7 @@ export const SelectChains = () => {
 		data: chains,
 		isLoading: isLoadingChains,
 		error: loadChainsError,
-	} = useChainConfig();
+	} = useSuperchainRegistryChainList();
 
 	const [errorMessage, setErrorMessage] = useState<string | null>(null);
 
@@ -67,16 +67,15 @@ export const SelectChains = () => {
 					.filter(chain => chain.parent.chain === wizardState.network)
 					.map(chain => ({
 						label: `${chain.name} (${chain.chainId})`,
-						value: chain.chainId.toString(),
+						value: chain.identifier.split('/')[1]!,
 					}))}
-				onSubmit={chainIdStrs => {
-					if (chainIdStrs.length === 0) {
+				onSubmit={chainNames => {
+					if (chainNames.length === 0) {
 						setErrorMessage('You must select at least one chain');
 						return;
 					}
-					submitSelectChains({
-						chainIds: chainIdStrs.map(Number),
-					});
+
+					submitSelectChains({chains: chainNames});
 				}}
 			/>
 			{errorMessage && <Text color="red">{errorMessage}</Text>}

packages/cli/src/bridge-wizard/SelectNetwork.tsx

@@ -1,5 +1,5 @@
 import {useBridgeWizardStore} from '@/bridge-wizard/bridgeWizardStore';
-import {SupportedNetwork} from '@/utils/superchainRegistry';
+import {SupportedNetwork} from '@/superchain-registry/fetchSuperchainRegistryChainList';
 import {Select} from '@inkjs/ui';
 import {Box, Text} from 'ink';
 

packages/cli/src/bridge-wizard/bridgeWizardStore.ts

@@ -1,34 +1,33 @@
 import {defineWizard, InferStepId} from '@/wizard-builder/defineWizard';
 import {z} from 'zod';
 import {formatEther} from 'viem';
-import {Address as ZodAddress} from 'abitype/zod';
 import {createWizardStore} from '@/wizard-builder/createWizardStore';
+import {zodAddress} from '@/validators/schemas';
 
 const bridgeWizard = defineWizard()
 	.addStep({
-		id: 'select-network',
+		id: 'enter-recipient',
 		schema: z.object({
-			network: z.string(),
+			recipient: zodAddress,
 		}),
-		title: 'Select Network',
-		getSummary: state => `${state.network}`,
+		title: 'Enter Recipient',
+		getSummary: () => '',
 	})
 	.addStep({
-		id: 'enter-private-key',
+		id: 'select-network',
 		schema: z.object({
-			privateKey: z.string(),
-			address: ZodAddress,
+			network: z.string(),
 		}),
-		title: 'Enter Private Key',
-		getSummary: state => `${state.address}`,
+		title: 'Select Network',
+		getSummary: state => `${state.network}`,
 	})
 	.addStep({
 		id: 'select-chains',
 		schema: z.object({
-			chainIds: z.array(z.number()),
+			chains: z.array(z.string()),
 		}),
 		title: 'Select Chains',
-		getSummary: state => `${state.chainIds.join(', ')}`,
+		getSummary: state => `${state.chains.join(', ')}`,
 	})
 	.addStep({
 		id: 'enter-amount',
@@ -39,9 +38,9 @@ const bridgeWizard = defineWizard()
 		getSummary: state => {
 			const perChainAmount = Number(formatEther(state.amount)).toFixed(2);
 			const totalAmount = Number(
-				formatEther(state.amount * BigInt(state.chainIds.length)),
+				formatEther(state.amount * BigInt(state.chains.length)),
 			).toFixed(2);
-			return `${perChainAmount} ETH × ${state.chainIds.length} chains = ${totalAmount} ETH total`;
+			return `${perChainAmount} ETH × ${state.chains.length} chains = ${totalAmount} ETH total`;
 		},
 	})
 	.build();