Fix chain ID selection in playground

3loop · Nov 11, 2024 · 0a6ccc9 · 0a6ccc9
1 parent bfcbb7d
commit 0a6ccc9
Show file tree

Hide file tree

Showing 9 changed files with 28 additions and 17 deletions.
diff --git a/apps/web/src/app/calldata/[chainID]/page.tsx b/apps/web/src/app/calldata/[chainID]/page.tsx
@@ -0,0 +1,6 @@
+import * as React from 'react'
+import DecodingForm from '@/app/calldata/form'
+
+export default async function CalldataPage({ params }: { params: { chainID: number } }) {
+  return <DecodingForm chainID={params.chainID} />
+}
diff --git a/apps/web/src/app/decode/[chainID]/[hash]/form.tsx b/apps/web/src/app/decode/[chainID]/[hash]/form.tsx
@@ -10,20 +10,20 @@ import { NetworkSelect } from '@/components/ui/network-select'
 import { ExampleTransactions } from '@/components/ui/examples'
 
 interface FormProps {
-  currentChainID: number
+  chainID: number
   decoded?: DecodedTransaction
   currentHash?: string
 }
 
 const PATH = 'decode'
 
-export default function DecodingForm({ decoded, currentHash, currentChainID }: FormProps) {
+export default function DecodingForm({ decoded, currentHash, chainID }: FormProps) {
   const router = useRouter()
 
   const onSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault()
     const hash = (e.target as any).hash.value
-    router.push(`/${PATH}/${currentChainID}/${hash}`)
+    router.push(`/${PATH}/${chainID}/${hash}`)
   }
 
   return (
@@ -33,7 +33,7 @@ export default function DecodingForm({ decoded, currentHash, currentChainID }: F
           <div className="flex w-full lg:items-center gap-2 flex-col lg:flex-row">
             <div>
               <NetworkSelect
-                defaultValue={currentChainID.toString()}
+                defaultValue={chainID.toString()}
                 onValueChange={(value) => {
                   const hash = currentHash || ''
                   router.push(`/${PATH}/${value}/${hash}`)

diff --git a/apps/web/src/app/decode/[chainID]/[hash]/page.tsx b/apps/web/src/app/decode/[chainID]/[hash]/page.tsx
@@ -9,8 +9,8 @@ export default async function TransactionPage({ params }: { params: { hash: stri
   })
 
   if (!decoded || !decoded.toAddress) {
-    return <DecodingForm currentHash={params.hash} currentChainID={params.chainID} />
+    return <DecodingForm currentHash={params.hash} chainID={params.chainID} />
   }
 
-  return <DecodingForm decoded={decoded} currentHash={params.hash} currentChainID={params.chainID} />
+  return <DecodingForm decoded={decoded} currentHash={params.hash} chainID={params.chainID} />
 }
diff --git a/apps/web/src/app/decode/[chainID]/page.tsx b/apps/web/src/app/decode/[chainID]/page.tsx
@@ -0,0 +1,6 @@
+import * as React from 'react'
+import DecodingForm from './[hash]/form'
+
+export default async function TransactionPage({ params }: { params: { chainID: number } }) {
+  return <DecodingForm chainID={params.chainID} />
+}
diff --git a/apps/web/src/app/decode/page.tsx b/apps/web/src/app/decode/page.tsx
@@ -4,5 +4,5 @@ import DecodingForm from './[chainID]/[hash]/form'
 import { DEFAULT_CHAIN_ID } from '../data'
 
 export default function TransactionsPlayground() {
-  return <DecodingForm currentChainID={DEFAULT_CHAIN_ID} />
+  return <DecodingForm chainID={DEFAULT_CHAIN_ID} />
 }
diff --git a/apps/web/src/app/interpret/[chainID]/[hash]/form.tsx b/apps/web/src/app/interpret/[chainID]/[hash]/form.tsx
@@ -1,9 +1,8 @@
 'use client'
 import * as React from 'react'
 import { Label } from '@/components/ui/label'
-import { DEFAULT_CHAIN_ID, geSidebarNavItems, EXAMPLE_TXS, INTERPRETER_REPO } from '@/app/data'
+import { EXAMPLE_TXS, INTERPRETER_REPO } from '@/app/data'
 import { useLocalStorage } from 'usehooks-ts'
-import { SidebarNav } from '@/components/ui/sidebar-nav'
 import { PlayIcon } from '@radix-ui/react-icons'
 import { Input } from '@/components/ui/input'
 import { Button } from '@/components/ui/button'
@@ -16,14 +15,14 @@ import { fallbackInterpreter, getInterpreter } from '@3loop/transaction-interpre
 import { ExampleTransactions } from '@/components/ui/examples'
 
 interface FormProps {
-  currentChainID: number
+  chainID: number
   decoded?: DecodedTransaction
   currentHash?: string
 }
 
 const PATH = 'interpret'
 
-export default function DecodingForm({ decoded, currentHash, currentChainID }: FormProps) {
+export default function DecodingForm({ decoded, currentHash, chainID }: FormProps) {
   const [result, setResult] = React.useState<Interpretation>()
   const [persistedSchema, setSchema] = useLocalStorage(decoded?.toAddress ?? 'unknown', '')
 
@@ -44,7 +43,7 @@ export default function DecodingForm({ decoded, currentHash, currentChainID }: F
   const onSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault()
     const hash = (e.target as any).hash.value
-    router.push(`/${PATH}/${currentChainID}/${hash}`)
+    router.push(`/${PATH}/${chainID}/${hash}`)
   }
 
   const onRun = React.useCallback(() => {
@@ -84,7 +83,7 @@ export default function DecodingForm({ decoded, currentHash, currentChainID }: F
           <div className="flex w-full lg:items-center gap-2 flex-col lg:flex-row">
             <div>
               <NetworkSelect
-                defaultValue={currentChainID.toString()}
+                defaultValue={chainID.toString()}
                 onValueChange={(value) => {
                   const hash = currentHash || ''
                   router.push(`/${PATH}/${value}/${hash}`)

diff --git a/apps/web/src/app/interpret/[chainID]/[hash]/page.tsx b/apps/web/src/app/interpret/[chainID]/[hash]/page.tsx
@@ -9,8 +9,8 @@ export default async function TransactionPage({ params }: { params: { hash: stri
   })
 
   if (!decoded || !decoded.toAddress) {
-    return <DecodingForm currentHash={params.hash} currentChainID={params.chainID} />
+    return <DecodingForm currentHash={params.hash} chainID={params.chainID} />
   }
 
-  return <DecodingForm decoded={decoded} currentHash={params.hash} currentChainID={params.chainID} />
+  return <DecodingForm decoded={decoded} currentHash={params.hash} chainID={params.chainID} />
 }
diff --git a/apps/web/src/app/interpret/[chainID]/page.tsx b/apps/web/src/app/interpret/[chainID]/page.tsx
@@ -3,5 +3,5 @@ import * as React from 'react'
 import DecodingForm from './[hash]/form'
 
 export default function TransactionsPlayground({ params }: { params: { chainID: number } }) {
-  return <DecodingForm currentChainID={params.chainID} />
+  return <DecodingForm chainID={params.chainID} />
 }
diff --git a/apps/web/src/app/interpret/page.tsx b/apps/web/src/app/interpret/page.tsx
@@ -4,5 +4,5 @@ import DecodingForm from './[chainID]/[hash]/form'
 import { DEFAULT_CHAIN_ID } from '../data'
 
 export default function TransactionsPlayground() {
-  return <DecodingForm currentChainID={DEFAULT_CHAIN_ID} />
+  return <DecodingForm chainID={DEFAULT_CHAIN_ID} />
 }