fix: convert AVMBytes template parameters from base64 to Uint8Array

Author: mrcointreau

src/features/abi-methods/mappers/avm-value.ts

@@ -1,10 +1,10 @@
 import { AVMType } from '@algorandfoundation/algokit-utils/types/app-arc56'
 import { base64ToUtf8, base64ToUtf8IfValid } from '@/utils/base64-to-utf8'
-import { AvmValue, DecodedAvmType, DecodedAvmValue } from '../models'
+import { AvmFormItemValue, DecodedAvmType, DecodedAvmValue } from '../models'
 import algosdk from 'algosdk'
 import { base64ToBytes } from '@/utils/base64-to-bytes'
 
-export const asAvmValue = (type: AVMType, base64Value: string): AvmValue => {
+export const asAvmValue = (type: AVMType, base64Value: string): AvmFormItemValue => {
   if (type === 'AVMUint64') {
     return algosdk.ABIType.from('uint64').decode(base64ToBytes(base64Value)) as bigint
   }

src/features/abi-methods/mappers/form-item-mappers.ts

@@ -144,6 +144,13 @@ export const avmTypeToFormItem = (formFieldHelper: FormFieldHelper<any>, type: A
       field: `${path}`,
     })
   }
+  if (type === 'AVMBytes') {
+    return formFieldHelper.textField({
+      label: 'Value',
+      field: `${path}`,
+      helpText: 'A base64 encoded bytes value',
+    })
+  }
   return formFieldHelper.textField({
     label: 'Value',
     field: `${path}`,

src/features/abi-methods/mappers/form-item-value-mappers.ts

@@ -2,10 +2,11 @@ import algosdk from 'algosdk'
 import { base64ToBytes } from '@/utils/base64-to-bytes'
 import { AddressOrNfd } from '@/features/transaction-wizard/models'
 import { bigIntToFixedPointDecimalString, fixedPointDecimalStringToBigInt } from '@/features/abi-methods/mappers/ufixed-mappers'
-import { DynamicArrayFormItemValue, AbiFormItemValue } from '../models'
+import { DynamicArrayFormItemValue, AbiFormItemValue, AvmValue, AvmFormItemValue } from '../models'
 import { uint8ArrayToBase64 } from '@/utils/uint8-array-to-base64'
 import { base64ToUtf8 } from '@/utils/base64-to-utf8'
 import { asAddressOrNfd } from '@/features/transaction-wizard/mappers/as-address-or-nfd'
+import { AVMType } from '@algorandfoundation/algokit-utils/types/app-arc56'
 
 export const abiFormItemValueToABIValue = (type: algosdk.ABIArgumentType, value: AbiFormItemValue): algosdk.ABIValue => {
   if (type instanceof algosdk.ABIUfixedType) {
@@ -68,3 +69,17 @@ export const asAbiFormItemValue = (type: algosdk.ABIType, value: algosdk.ABIValu
 
   throw new Error(`Unknown type ${type}`)
 }
+
+export const avmFormItemValueToAVMValue = (type: AVMType, value: AvmFormItemValue): AvmValue => {
+  if (type === 'AVMBytes') {
+    return base64ToBytes(value as string)
+  }
+  return value
+}
+
+export const asAvmFormItemValue = (type: AVMType, value: AvmValue): AvmFormItemValue => {
+  if (type === 'AVMBytes') {
+    return uint8ArrayToBase64(value as Uint8Array)
+  }
+  return value as AvmFormItemValue
+}

src/features/abi-methods/models/index.ts

@@ -96,7 +96,9 @@ export type DynamicArrayFormItemValue = {
 
 export type AbiFormItemValue = string | boolean | bigint | number | AddressOrNfd | AbiFormItemValue[] | DynamicArrayFormItemValue[]
 
-export type AvmValue = bigint | string
+export type AvmFormItemValue = string | bigint
+
+export type AvmValue = Uint8Array | bigint | string
 
 export enum DecodedAvmType {
   String = 'String',

src/features/app-interfaces/components/create/deploy-app.tsx

@@ -51,7 +51,7 @@ const getTealTemplateParams = (templateParams: ReturnType<typeof useCreateAppInt
         }
       } else if ('abiType' in templateParam) {
         acc[templateParam.name] = templateParam.abiType.encode(templateParam.value)
-      } else {
+      } else if ('avmType' in templateParam) {
         acc[templateParam.name] = templateParam.value
       }
       return acc

src/features/app-interfaces/components/create/deployment-details.tsx

@@ -20,8 +20,8 @@ import { asArc56AppSpec } from '@/features/applications/mappers'
 import { TealTemplateParamField, TealUnknownTypeTemplateParamFieldValue } from '../../models'
 import { asTealTemplateParamField } from '@/features/app-interfaces/mappers'
 import { getTemplateParamDefinition } from '../../utils/get-template-param-field-definition'
-import { ABITypeTemplateParam, TemplateParamType, UnknownTypeTemplateParam } from '../../data/types'
-import { AbiFormItemValue, AvmValue } from '@/features/abi-methods/models'
+import { ABITypeTemplateParam, AVMTypeTemplateParam, TemplateParamType, UnknownTypeTemplateParam } from '../../data/types'
+import { AbiFormItemValue, AvmFormItemValue } from '@/features/abi-methods/models'
 
 export const UPDATABLE_TEMPLATE_VAR_NAME = 'UPDATABLE'
 export const DELETABLE_TEMPLATE_VAR_NAME = 'DELETABLE'
@@ -170,7 +170,7 @@ export function DeploymentDetails({ machine }: Props) {
     (values: z.infer<typeof formSchema>) => {
       const templateParamValues = templateParamFields.map((f) => {
         const value = values[f.path as keyof z.infer<typeof formSchema>]
-        return f.toTemplateParam(value as (TealUnknownTypeTemplateParamFieldValue & AvmValue) & AbiFormItemValue)
+        return f.toTemplateParam(value as (TealUnknownTypeTemplateParamFieldValue & AvmFormItemValue) & AbiFormItemValue)
       })
 
       send({
@@ -201,7 +201,7 @@ export function DeploymentDetails({ machine }: Props) {
       return {
         ...acc,
         [field.path]: state.context.templateParams
-          ? field.fromTemplateParam(state.context.templateParams[index] as UnknownTypeTemplateParam & ABITypeTemplateParam)
+          ? field.fromTemplateParam(state.context.templateParams[index] as UnknownTypeTemplateParam & AVMTypeTemplateParam & ABITypeTemplateParam)
           : 'defaultValue' in field
             ? field.defaultValue
             : {

src/features/app-interfaces/data/types/index.ts

@@ -2,7 +2,7 @@ import { AvmValue } from '@/features/abi-methods/models'
 import { AlgoAppSpec as Arc32AppSpec } from '@/features/app-interfaces/data/types/arc-32/application'
 import { AbiContract as Arc4AppSpec } from '@/features/app-interfaces/data/types/arc-32/application'
 import { ApplicationId } from '@/features/applications/data/types'
-import { Arc56Contract } from '@algorandfoundation/algokit-utils/types/app-arc56'
+import { Arc56Contract, AVMType } from '@algorandfoundation/algokit-utils/types/app-arc56'
 import algosdk from 'algosdk'
 
 export enum AppSpecStandard {
@@ -48,6 +48,7 @@ export type UnknownTypeTemplateParam = {
 }
 export type AVMTypeTemplateParam = {
   name: string
+  avmType: AVMType
   value: AvmValue
 }
 export type ABITypeTemplateParam = {

src/features/app-interfaces/mappers/index.tsx

@@ -20,6 +20,8 @@ import {
   avmTypeToFormFieldSchema,
   avmTypeToFormItem,
   asAbiFormItemValue,
+  avmFormItemValueToAVMValue,
+  asAvmFormItemValue,
 } from '@/features/abi-methods/mappers'
 import { Arc56Contract, AVMType } from '@algorandfoundation/algokit-utils/types/app-arc56'
 import algosdk from 'algosdk'
@@ -32,7 +34,7 @@ import { zfd } from 'zod-form-data'
 import { TemplateParamForm } from '../components/create/template-param-form'
 import { Label } from '@/features/common/components/label'
 import { isAVMType } from '@/features/app-interfaces/utils/is-avm-type'
-import { AbiFormItemValue, AvmValue } from '@/features/abi-methods/models'
+import { AbiFormItemValue, AvmFormItemValue } from '@/features/abi-methods/models'
 
 export const parseAsAppSpec = async (
   file: File,
@@ -115,7 +117,7 @@ export const asTealTemplateParamField = ({
   name: string
   type?: algosdk.ABIType | AVMType
   struct?: StructDefinition
-  defaultValue?: AbiFormItemValue | AvmValue
+  defaultValue?: AbiFormItemValue | AvmFormItemValue
 }): TealTemplateParamField => {
   if (!type) {
     return {
@@ -160,14 +162,15 @@ export const asTealTemplateParamField = ({
           </>
         )
       },
-      toTemplateParam: (value: AvmValue) =>
+      toTemplateParam: (value: AvmFormItemValue) =>
         ({
           name: name,
-          value: value,
+          avmType: type,
+          value: avmFormItemValueToAVMValue(type, value),
         }) satisfies AVMTypeTemplateParam,
       fromTemplateParam: (templateParam: AVMTypeTemplateParam) =>
-        type === 'AVMUint64' ? BigInt(templateParam.value) : templateParam.value,
-      defaultValue: defaultValue as AvmValue,
+        asAvmFormItemValue(type, templateParam.value),
+      defaultValue: defaultValue as AvmFormItemValue,
     }
   }
 

src/features/app-interfaces/models/index.ts

@@ -11,7 +11,7 @@ import {
   AVMTypeTemplateParam,
 } from '@/features/app-interfaces/data/types'
 import { AVMType } from '@algorandfoundation/algokit-utils/types/app-arc56'
-import { AbiFormItemValue, AvmValue } from '@/features/abi-methods/models'
+import { AbiFormItemValue, AvmFormItemValue } from '@/features/abi-methods/models'
 
 export type TealTemplateParamField =
   | {
@@ -28,9 +28,9 @@ export type TealTemplateParamField =
       type: AVMType
       fieldSchema: z.ZodTypeAny
       createField: (helper: FormFieldHelper<any>) => React.JSX.Element | undefined
-      toTemplateParam: (value: AvmValue) => AVMTypeTemplateParam
-      fromTemplateParam: (templateParam: AVMTypeTemplateParam) => AvmValue
-      defaultValue?: AvmValue
+      toTemplateParam: (value: AvmFormItemValue) => AVMTypeTemplateParam
+      fromTemplateParam: (templateParam: AVMTypeTemplateParam) => AvmFormItemValue
+      defaultValue?: AvmFormItemValue
     }
   | {
       name: string
@@ -48,8 +48,8 @@ export type TealTemplateParamDefinition = {
   name: string
   type?: algosdk.ABIType | AVMType
   struct?: StructDefinition
-  defaultValue?: AbiFormItemValue | AvmValue
+  defaultValue?: AbiFormItemValue | AvmFormItemValue
 }
 
 export type TealUnknownTypeTemplateParamFieldValue = { type: TemplateParamType; value: string }
-export type TealTemplateParamFieldValue = AbiFormItemValue | TealUnknownTypeTemplateParamFieldValue | AvmValue
+export type TealTemplateParamFieldValue = AbiFormItemValue | TealUnknownTypeTemplateParamFieldValue | AvmFormItemValue