Skip to content

Commit

Permalink
chore: eth_sendTx
Browse files Browse the repository at this point in the history
  • Loading branch information
@jxom
jxom committed Feb 6, 2025
1 parent adac342 commit 492a747
Show file tree
Hide file tree
Showing 3 changed files with 109 additions and 42 deletions.
28 changes: 28 additions & 0 deletions app/src/routeTree.gen.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ import { Route as DialogDialogWalletconnectImport } from './routes/_dialog.dialo
import { Route as DialogDialogPersonalsignImport } from './routes/_dialog.dialog/personal_sign'
import { Route as DialogDialogExperimentalcreateAccountImport } from './routes/_dialog.dialog/experimental_createAccount'
import { Route as DialogDialogExperimentalauthorizeKeyImport } from './routes/_dialog.dialog/experimental_authorizeKey'
import { Route as DialogDialogEthsendTransactionImport } from './routes/_dialog.dialog/eth_sendTransaction'
import { Route as DialogDialogEthrequestAccountsImport } from './routes/_dialog.dialog/eth_requestAccounts'
import { Route as DialogDialogSplatImport } from './routes/_dialog.dialog/$'

Expand Down Expand Up @@ -67,6 +68,13 @@ const DialogDialogExperimentalauthorizeKeyRoute =
getParentRoute: () => DialogRoute,
} as any)

const DialogDialogEthsendTransactionRoute =
DialogDialogEthsendTransactionImport.update({
id: '/dialog/eth_sendTransaction',
path: '/dialog/eth_sendTransaction',
getParentRoute: () => DialogRoute,
} as any)

const DialogDialogEthrequestAccountsRoute =
DialogDialogEthrequestAccountsImport.update({
id: '/dialog/eth_requestAccounts',
Expand Down Expand Up @@ -112,6 +120,13 @@ declare module '@tanstack/react-router' {
preLoaderRoute: typeof DialogDialogEthrequestAccountsImport
parentRoute: typeof DialogImport
}
'/_dialog/dialog/eth_sendTransaction': {
id: '/_dialog/dialog/eth_sendTransaction'
path: '/dialog/eth_sendTransaction'
fullPath: '/dialog/eth_sendTransaction'
preLoaderRoute: typeof DialogDialogEthsendTransactionImport
parentRoute: typeof DialogImport
}
'/_dialog/dialog/experimental_authorizeKey': {
id: '/_dialog/dialog/experimental_authorizeKey'
path: '/dialog/experimental_authorizeKey'
Expand Down Expand Up @@ -155,6 +170,7 @@ declare module '@tanstack/react-router' {
interface DialogRouteChildren {
DialogDialogSplatRoute: typeof DialogDialogSplatRoute
DialogDialogEthrequestAccountsRoute: typeof DialogDialogEthrequestAccountsRoute
DialogDialogEthsendTransactionRoute: typeof DialogDialogEthsendTransactionRoute
DialogDialogExperimentalauthorizeKeyRoute: typeof DialogDialogExperimentalauthorizeKeyRoute
DialogDialogExperimentalcreateAccountRoute: typeof DialogDialogExperimentalcreateAccountRoute
DialogDialogPersonalsignRoute: typeof DialogDialogPersonalsignRoute
Expand All @@ -165,6 +181,7 @@ interface DialogRouteChildren {
const DialogRouteChildren: DialogRouteChildren = {
DialogDialogSplatRoute: DialogDialogSplatRoute,
DialogDialogEthrequestAccountsRoute: DialogDialogEthrequestAccountsRoute,
DialogDialogEthsendTransactionRoute: DialogDialogEthsendTransactionRoute,
DialogDialogExperimentalauthorizeKeyRoute:
DialogDialogExperimentalauthorizeKeyRoute,
DialogDialogExperimentalcreateAccountRoute:
Expand All @@ -182,6 +199,7 @@ export interface FileRoutesByFullPath {
'': typeof DialogRouteWithChildren
'/dialog/$': typeof DialogDialogSplatRoute
'/dialog/eth_requestAccounts': typeof DialogDialogEthrequestAccountsRoute
'/dialog/eth_sendTransaction': typeof DialogDialogEthsendTransactionRoute
'/dialog/experimental_authorizeKey': typeof DialogDialogExperimentalauthorizeKeyRoute
'/dialog/experimental_createAccount': typeof DialogDialogExperimentalcreateAccountRoute
'/dialog/personal_sign': typeof DialogDialogPersonalsignRoute
Expand All @@ -194,6 +212,7 @@ export interface FileRoutesByTo {
'': typeof DialogRouteWithChildren
'/dialog/$': typeof DialogDialogSplatRoute
'/dialog/eth_requestAccounts': typeof DialogDialogEthrequestAccountsRoute
'/dialog/eth_sendTransaction': typeof DialogDialogEthsendTransactionRoute
'/dialog/experimental_authorizeKey': typeof DialogDialogExperimentalauthorizeKeyRoute
'/dialog/experimental_createAccount': typeof DialogDialogExperimentalcreateAccountRoute
'/dialog/personal_sign': typeof DialogDialogPersonalsignRoute
Expand All @@ -207,6 +226,7 @@ export interface FileRoutesById {
'/_dialog': typeof DialogRouteWithChildren
'/_dialog/dialog/$': typeof DialogDialogSplatRoute
'/_dialog/dialog/eth_requestAccounts': typeof DialogDialogEthrequestAccountsRoute
'/_dialog/dialog/eth_sendTransaction': typeof DialogDialogEthsendTransactionRoute
'/_dialog/dialog/experimental_authorizeKey': typeof DialogDialogExperimentalauthorizeKeyRoute
'/_dialog/dialog/experimental_createAccount': typeof DialogDialogExperimentalcreateAccountRoute
'/_dialog/dialog/personal_sign': typeof DialogDialogPersonalsignRoute
Expand All @@ -221,6 +241,7 @@ export interface FileRouteTypes {
| ''
| '/dialog/$'
| '/dialog/eth_requestAccounts'
| '/dialog/eth_sendTransaction'
| '/dialog/experimental_authorizeKey'
| '/dialog/experimental_createAccount'
| '/dialog/personal_sign'
Expand All @@ -232,6 +253,7 @@ export interface FileRouteTypes {
| ''
| '/dialog/$'
| '/dialog/eth_requestAccounts'
| '/dialog/eth_sendTransaction'
| '/dialog/experimental_authorizeKey'
| '/dialog/experimental_createAccount'
| '/dialog/personal_sign'
Expand All @@ -243,6 +265,7 @@ export interface FileRouteTypes {
| '/_dialog'
| '/_dialog/dialog/$'
| '/_dialog/dialog/eth_requestAccounts'
| '/_dialog/dialog/eth_sendTransaction'
| '/_dialog/dialog/experimental_authorizeKey'
| '/_dialog/dialog/experimental_createAccount'
| '/_dialog/dialog/personal_sign'
Expand Down Expand Up @@ -283,6 +306,7 @@ export const routeTree = rootRoute
"children": [
"/_dialog/dialog/$",
"/_dialog/dialog/eth_requestAccounts",
"/_dialog/dialog/eth_sendTransaction",
"/_dialog/dialog/experimental_authorizeKey",
"/_dialog/dialog/experimental_createAccount",
"/_dialog/dialog/personal_sign",
Expand All @@ -298,6 +322,10 @@ export const routeTree = rootRoute
"filePath": "_dialog.dialog/eth_requestAccounts.tsx",
"parent": "/_dialog"
},
"/_dialog/dialog/eth_sendTransaction": {
"filePath": "_dialog.dialog/eth_sendTransaction.tsx",
"parent": "/_dialog"
},
"/_dialog/dialog/experimental_authorizeKey": {
"filePath": "_dialog.dialog/experimental_authorizeKey.tsx",
"parent": "/_dialog"
Expand Down
97 changes: 55 additions & 42 deletions app/src/routes/_dialog.dialog/-components/TransactionRequest.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,9 +55,9 @@ export function TransactionRequest(props: TransactionRequest.Props) {
<Layout loading={respond.isPending} loadingTitle="Sending...">
<Layout.Header>
<Layout.Header.Default
title="Transaction Request"
title="Action Request"
icon={simulate.status === 'error' ? TriangleAlert : Star}
content={<>Review the transaction to send below.</>}
content={<>Review the action to perform below.</>}
variant={simulate.status === 'error' ? 'destructive' : 'default'}
/>
</Layout.Header>
Expand All @@ -72,54 +72,67 @@ export function TransactionRequest(props: TransactionRequest.Props) {
)}

{simulate.status === 'success' && (
<div className="space-y-2 rounded-lg bg-gray3 p-3">
{balances.map((balance) => {
const { token, value } = balance
if (value.diff === BigInt(0)) return null

const { decimals, symbol } = token

const receiving = value.diff > BigInt(0)
const formatted = ValueFormatter.format(value.diff, decimals)

const Icon = receiving ? ArrowDownLeft : ArrowUpRight

return (
<div key={token.address} className="flex gap-2 font-medium">
<div
className={cx(
'flex size-[24px] items-center justify-center rounded-full',
{
'bg-green4': receiving,
'bg-red4': !receiving,
},
)}
>
<Icon
className={cx('size-4 text-current', {
'text-green10': receiving,
'text-red10': !receiving,
})}
/>
</div>
<div>
{receiving ? 'Receive' : 'Send'}{' '}
<span className={receiving ? 'text-green10' : 'text-red10'}>
{formatted}
</span>{' '}
{symbol}
<div className="space-y-3 rounded-lg bg-gray3 p-3">
<div className="space-y-2">
{balances.map((balance) => {
const { token, value } = balance
if (value.diff === BigInt(0)) return null

const { decimals, symbol } = token

const receiving = value.diff > BigInt(0)
const formatted = ValueFormatter.format(value.diff, decimals)

const Icon = receiving ? ArrowDownLeft : ArrowUpRight

return (
<div key={token.address} className="flex gap-2 font-medium">
<div
className={cx(
'flex size-[24px] items-center justify-center rounded-full',
{
'bg-green4': receiving,
'bg-red4': !receiving,
},
)}
>
<Icon
className={cx('size-4 text-current', {
'text-green10': receiving,
'text-red10': !receiving,
})}
/>
</div>
<div>
{receiving ? 'Receive' : 'Send'}{' '}
<span
className={receiving ? 'text-green10' : 'text-red10'}
>
{formatted}
</span>{' '}
{symbol}
</div>
</div>
</div>
)
})}
)
})}
</div>

{/* <div className="h-[1px] w-full bg-gray6" />
<div className="space-y-1">
<div className="flex justify-between font-medium text-[14px]">
<span className="text-[14px] text-gray10">Fees</span>
<span>TODO</span>
</div>
</div> */}
</div>
)}

{simulate.status === 'error' && (
<div className="rounded-lg bg-red3 px-3 py-2 text-red10">
<div className="font-medium text-[14px]">Error</div>
<div className="text-[14px] text-gray12">
An error occurred while simulating the transaction. Contact{' '}
An error occurred while simulating the action. Contact{' '}
<span className="font-medium">{origin?.hostname}</span> for more
information.
</div>
Expand Down
26 changes: 26 additions & 0 deletions app/src/routes/_dialog.dialog/eth_sendTransaction.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
import { createFileRoute } from '@tanstack/react-router'
import { Hex, type RpcSchema } from 'ox'
import type { RpcSchema as porto_RpcSchema } from 'porto'

import { TransactionRequest } from './-components/TransactionRequest'

export const Route = createFileRoute('/_dialog/dialog/eth_sendTransaction')({
component: RouteComponent,
validateSearch(
search,
): RpcSchema.ExtractParams<porto_RpcSchema.Schema, 'eth_sendTransaction'> {
return search as never
},
})

function RouteComponent() {
const { 0: parameters } = Route.useSearch() ?? {}
const { chainId, data, to, value } = parameters

return (
<TransactionRequest
calls={[{ data, to: to!, value }]}
chainId={chainId ? Hex.toNumber(chainId) : undefined}
/>
)
}

0 comments on commit 492a747

Please sign in to comment.