Add transaction decoder tool

Author: solidsnakedev

docs/app/tools/tx-decoder/page.tsx

@@ -0,0 +1,21 @@
+import { TransactionDecoder } from "./transaction-decoder"
+import type { Metadata } from 'next'
+
+export const metadata: Metadata = {
+  title: 'Transaction Decoder | Evolution SDK',
+  description: 'Decode Cardano transactions from CBOR hex format',
+}
+
+export default function TransactionDecoderPage() {
+  return (
+    <div className="container mx-auto px-4 py-8 max-w-6xl">
+      <div className="mb-8">
+        <h1 className="text-4xl font-bold mb-4">Transaction Decoder</h1>
+        <p className="text-muted-foreground text-lg">
+          Decode Cardano transactions from CBOR hex format. Paste your transaction hex below to inspect its contents.
+        </p>
+      </div>
+      <TransactionDecoder />
+    </div>
+  )
+}

docs/app/tools/tx-decoder/transaction-decoder.tsx

@@ -0,0 +1,75 @@
+'use client'
+
+import { useState } from 'react'
+import { Core } from "@evolution-sdk/evolution"
+
+export function TransactionDecoder() {
+  const [txHex, setTxHex] = useState("")
+  const [decodedJson, setDecodedJson] = useState<string>("")
+  const [error, setError] = useState<string | null>(null)
+
+  const decodeTx = async () => {
+    setError(null)
+    setDecodedJson("")
+
+    try {
+      const cleanHex = txHex.trim().replace(/\s+/g, '')
+      
+      if (!cleanHex) {
+        setError("Please enter a transaction CBOR hex string")
+        return
+      }
+      
+      const tx = Core.Transaction.fromCBORHex(cleanHex)
+      const json = JSON.stringify(tx.toJSON(), (key, value) =>
+        typeof value === 'bigint' ? value.toString() : value
+      , 2)
+      setDecodedJson(json)
+    } catch (err) {
+      console.error('Decode error:', err)
+      setError(err instanceof Error ? err.message : "Failed to decode transaction")
+    }
+  }
+
+  return (
+    <div className="space-y-6">
+      <div className="space-y-4">
+        <button
+          onClick={decodeTx}
+          className="px-4 py-2 bg-primary text-primary-foreground rounded-md hover:bg-primary/90 transition-colors"
+        >
+          Decode Transaction
+        </button>
+
+        <div className="space-y-2">
+          <label htmlFor="tx-hex" className="block text-sm font-medium">
+            Transaction CBOR Hex
+          </label>
+          <textarea
+            id="tx-hex"
+            value={txHex}
+            onChange={(e) => setTxHex(e.target.value)}
+            placeholder="Paste transaction CBOR hex here..."
+            className="w-full h-32 px-3 py-2 bg-background border border-border rounded-md font-mono text-sm resize-y focus:outline-none focus:ring-2 focus:ring-ring"
+          />
+        </div>
+      </div>
+
+      {error && (
+        <div className="p-4 bg-destructive/10 border border-destructive/20 rounded-md">
+          <p className="text-destructive font-medium">Error decoding transaction:</p>
+          <p className="text-destructive/80 text-sm mt-1">{error}</p>
+        </div>
+      )}
+
+      {decodedJson && (
+        <div className="space-y-2">
+          <label className="block text-sm font-medium">Decoded Transaction (JSON)</label>
+          <pre className="w-full p-4 bg-muted border border-border rounded-md overflow-auto max-h-[600px] text-sm">
+            <code>{decodedJson}</code>
+          </pre>
+        </div>
+      )}
+    </div>
+  )
+}

docs/content/docs/index.mdx

@@ -22,6 +22,11 @@ import { Card, Cards } from 'fumadocs-ui/components/card'
     description="Understand the philosophy and design principles behind Evolution SDK"
     href="/docs/introduction/why-evolution"
   />
+  <Card
+    title="Transaction Decoder"
+    description="Decode CBOR transaction hex into readable JSON format"
+    href="/tools/tx-decoder"
+  />
   <Card
     title="Examples"
     description="Explore real-world examples and common patterns"

docs/next-env.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
-import "./.next/types/routes.d.ts";
+import "./out/dev/types/routes.d.ts";
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

docs/next.config.mjs

@@ -17,6 +17,12 @@ const config = {
     unoptimized: true,
   },
   serverExternalPackages: ['typescript', 'twoslash'],
+  turbopack: {
+    // Redirect imports to use built dist/ instead of src/ TypeScript files
+    resolveAlias: {
+      '@evolution-sdk/evolution': '../packages/evolution/dist/index.js',
+    },
+  },
 }
 
 export default withMDX(config)

docs/package.json

@@ -22,10 +22,10 @@
     "next-themes": "^0.4.6",
     "react": "^19.2.0",
     "react-dom": "^19.2.0",
-    "twoslash": "^0.3.4"
+    "twoslash": "^0.3.4",
+    "@evolution-sdk/evolution": "workspace:*"
   },
   "devDependencies": {
-    "@evolution-sdk/evolution": "workspace:*",
     "@shikijs/twoslash": "^3.14.0",
     "@tailwindcss/postcss": "^4.1.12",
     "@types/mdx": "^2.0.13",

docs/tsconfig.json

@@ -26,12 +26,6 @@
       "@/*": [
         "./*"
       ],
-      "@evolution-sdk/evolution": [
-        "../packages/evolution/src/index.ts"
-      ],
-      "@evolution-sdk/evolution/*": [
-        "../packages/evolution/src/*"
-      ]
     },
     "plugins": [
       {
@@ -51,4 +45,4 @@
   "exclude": [
     "node_modules"
   ]
-}
+}

packages/evolution/src/index.ts

@@ -3,8 +3,6 @@ export * as Address from "./sdk/Address.js"
 export * as AddressDetails from "./sdk/AddressDetails.js"
 export * from "./sdk/client/Client.js"
 export { createClient } from "./sdk/client/ClientImpl.js"
-export * as Devnet from "./sdk/Devnet/Devnet.js"
-export * as DevnetDefault from "./sdk/Devnet/DevnetDefault.js"
 export { runEffect } from "./utils/effect-runtime.js"
 export * as FeeValidation from "./utils/FeeValidation.js"
 export { Effect, Either, pipe, Schema } from "effect"