@lukso/transaction-view-headless 0.4.3-dev.a07a66f → 0.4.3-dev.e33b252

package/ARG_ACCESS_PATTERN.md

@@ -1,265 +0,0 @@
-# Accessing Transaction Arguments - Correct Pattern
-
-## Current Structure (As of Latest Version)
-
-Transaction arguments are stored in an `args` array with this structure:
-
-```typescript
-interface DecoderResult {
-  // ...
-  args: Array<{
-    name: string           // Argument name (e.g., "from", "to", "amount")
-    type: string           // Solidity type (e.g., "address", "uint256")
-    value: any             // The actual value
-    internalType?: string  // Internal type if different (rarely used)
-  }>
-}
-```
-
-## ❌ Old Pattern (Don't Use)
-
-```typescript
-// OLD - namedArgs is deprecated
-const from = transaction.namedArgs?.from
-const to = transaction.namedArgs?.to
-const amount = transaction.namedArgs?.amount
-```
-
-## ✅ Correct Pattern
-
-### Use the Built-in Helper
-
-The `@lukso/transaction-decoder` package exports a `getArgByName` helper:
-
-```typescript
-import { getArgByName } from '@lukso/transaction-decoder'
-
-// Get individual args
-const from = getArgByName(transaction.args, 'from') as string | undefined
-const to = getArgByName(transaction.args, 'to') as string | undefined
-const amount = getArgByName(transaction.args, 'amount') as bigint | undefined
-const force = (getArgByName(transaction.args, 'force') as boolean) ?? false
-const data = (getArgByName(transaction.args, 'data') as string) ?? '0x'
-```
-
-### Implementation (for reference)
-
-```typescript
-/**
- * Get argument value by name from transaction args array
- * Already exported from @lukso/transaction-decoder
- */
-export function getArgByName(
-  args: ArrayArgs | undefined,
-  name: string
-): unknown {
-  if (!args) return undefined
-  const arg = args.find((arg) => arg.name === name)
-  return arg?.value
-}
-```
-
-### In View Components
-
-```typescript
-import { getArgByName } from '@lukso/transaction-decoder'
-import { dispatchHeaderInfo, dispatchTransactionModification } from '@lukso/transaction-view-headless'
-
-@customElement('lsp7-transfer-view')
-export class LSP7TransferView extends CoreLitElement {
-  @property({ type: Object }) transaction!: DecoderResult
-
-  connectedCallback() {
-    super.connectedCallback()
-
-    // Emit header info
-    dispatchHeaderInfo(this, {
-      from: getArgByName(this.transaction.args, 'from') as string,
-      to: getArgByName(this.transaction.args, 'to') as string,
-      title: 'LSP7 Transfer'
-    })
-  }
-
-  private handleForceChange(checked: boolean) {
-    // Re-encode with updated argument
-    const newData = encodeFunctionData({
-      abi: LSP7_ABI,
-      functionName: 'transfer',
-      args: [
-        getArgByName(this.transaction.args, 'from'),
-        getArgByName(this.transaction.args, 'to'),
-        getArgByName(this.transaction.args, 'amount'),
-        checked,  // <-- modified
-        getArgByName(this.transaction.args, 'data') ?? '0x'
-      ]
-    })
-
-    dispatchTransactionModification(this, {
-      data: newData,
-      transactionIndex: this.index,
-      reason: 'User enabled force transfer',
-      userInitiated: true
-    })
-  }
-}
-```
-
-### In Recomposition Logic
-
-```typescript
-import { getArgByName } from '@lukso/transaction-decoder'
-
-private async recomposeWrapper(wrapper: DecoderResult): Promise<string> {
-  switch (wrapper.functionName) {
-    case 'execute':
-      return encodeFunctionData({
-        abi: UP_ABI,
-        functionName: 'execute',
-        args: [
-          getArgByName(wrapper.args, 'operationType') as number,
-          getArgByName(wrapper.args, 'target') as string,
-          getArgByName(wrapper.args, 'value') as bigint,
-          wrapper.children[0].data  // <-- updated child data
-        ]
-      })
-
-    case 'executeBatch':
-      return encodeFunctionData({
-        abi: UP_ABI,
-        functionName: 'executeBatch',
-        args: [
-          getArgByName(wrapper.args, 'operationTypes') as number[],
-          getArgByName(wrapper.args, 'targets') as string[],
-          getArgByName(wrapper.args, 'values') as bigint[],
-          wrapper.children.map(child => child.data)  // <-- updated children
-        ]
-      })
-
-    case 'executeRelayCall':
-      return encodeFunctionData({
-        abi: KEY_MANAGER_ABI,
-        functionName: 'executeRelayCall',
-        args: [
-          getArgByName(wrapper.args, 'signature') as string,
-          getArgByName(wrapper.args, 'nonce') as bigint,
-          getArgByName(wrapper.args, 'validityTimestamps') as bigint,
-          wrapper.children[0].data  // <-- updated execute/executeBatch
-        ]
-      })
-  }
-}
-```
-
-## Migration Guide
-
-### Before (namedArgs - deprecated)
-
-```typescript
-// Header info
-dispatchHeaderInfo(this, {
-  from: this.transaction.namedArgs?.from,
-  to: this.transaction.namedArgs?.to
-})
-
-// Recompose wrapper
-encodeFunctionData({
-  abi: UP_ABI,
-  functionName: 'execute',
-  args: [
-    wrapper.namedArgs.operationType,
-    wrapper.namedArgs.target,
-    wrapper.namedArgs.value,
-    wrapper.children[0].data
-  ]
-})
-```
-
-### After (args array with getArgByName)
-
-```typescript
-import { getArgByName } from '@lukso/transaction-decoder'
-
-// Header info
-dispatchHeaderInfo(this, {
-  from: getArgByName(this.transaction.args, 'from') as string,
-  to: getArgByName(this.transaction.args, 'to') as string
-})
-
-// Recompose wrapper
-encodeFunctionData({
-  abi: UP_ABI,
-  functionName: 'execute',
-  args: [
-    getArgByName(wrapper.args, 'operationType') as number,
-    getArgByName(wrapper.args, 'target') as string,
-    getArgByName(wrapper.args, 'value') as bigint,
-    wrapper.children[0].data
-  ]
-})
-```
-
-## Type Safety
-
-For better type safety, you can create typed getters:
-
-```typescript
-class TransactionArgHelper {
-  constructor(private tx: DecoderResult) {}
-
-  getString(name: string): string | undefined {
-    return this.tx.args?.find(arg => arg.name === name)?.value as string
-  }
-
-  getBigInt(name: string): bigint | undefined {
-    return this.tx.args?.find(arg => arg.name === name)?.value as bigint
-  }
-
-  getBoolean(name: string): boolean | undefined {
-    return this.tx.args?.find(arg => arg.name === name)?.value as boolean
-  }
-
-  getAddress(name: string): string | undefined {
-    return this.getString(name)  // Addresses are strings
-  }
-
-  getArray<T>(name: string): T[] | undefined {
-    return this.tx.args?.find(arg => arg.name === name)?.value as T[]
-  }
-}
-
-// Usage
-const helper = new TransactionArgHelper(transaction)
-const from = helper.getAddress('from')
-const amount = helper.getBigInt('amount')
-const force = helper.getBoolean('force') ?? false
-```
-
-## Summary
-
-**Key Change**: `transaction.namedArgs.foo` → `getArgByName(transaction.args, 'foo')`
-
-**Always use `getArgByName` from `@lukso/transaction-decoder` to access arguments by name from the `args` array.**
-
-### Quick Reference
-
-```typescript
-import { getArgByName } from '@lukso/transaction-decoder'
-
-// Extract args
-const from = getArgByName(transaction.args, 'from') as string
-const to = getArgByName(transaction.args, 'to') as string
-const amount = getArgByName(transaction.args, 'amount') as bigint
-const force = (getArgByName(transaction.args, 'force') as boolean) ?? false
-
-// In recomposition
-encodeFunctionData({
-  abi: UP_ABI,
-  functionName: 'execute',
-  args: [
-    getArgByName(wrapper.args, 'operationType') as number,
-    getArgByName(wrapper.args, 'target') as string,
-    getArgByName(wrapper.args, 'value') as bigint,
-    wrapper.children[0].data
-  ]
-})
-```