Feat/optional sender

src/features/accounts/components/address-or-nfd-link.tsx

@@ -17,11 +17,12 @@ export type AddressOrNfdLinkProps = PropsWithChildren<{
   showCopyButton?: boolean
   showQRButton?: boolean
   nfd?: Nfd
+  autoPopulated?: boolean
 }>
 
 export const AddressOrNfdLink = fixedForwardRef(
   (
-    { address: _address, nfd, short, className, children, showCopyButton, showQRButton, ...rest }: AddressOrNfdLinkProps,
+    { address: _address, nfd, short, className, children, showCopyButton, showQRButton, autoPopulated, ...rest }: AddressOrNfdLinkProps,
     ref?: React.LegacyRef<HTMLAnchorElement>
   ) => {
     const [selectedNetwork] = useSelectedNetwork()
@@ -54,6 +55,12 @@ export const AddressOrNfdLink = fixedForwardRef(
     ) : (
       <div className="flex items-center overflow-hidden">
         {link}
+        {autoPopulated && (
+          <span className="group  ml-1 cursor-help text-yellow-500">
+            <span>?</span>
+            <div className="absolute z-10 hidden rounded-sm border-2 border-gray-300/20 p-1 group-hover:block">auto populated</div>
+          </span>
+        )}
         {showCopyButton && <CopyButton value={address} />}
         {showQRButton && <OpenAddressQRDialogButton address={address} />}
       </div>

src/features/common/components/description-list.tsx

@@ -3,6 +3,7 @@ import { cn } from '../utils'
 export type DescriptionListItems = {
   dt: string
   dd: string | number | bigint | boolean | React.JSX.Element[] | React.JSX.Element | undefined
+  highlightedDD?: boolean
 }[]
 
 type Props = {
@@ -16,7 +17,7 @@ export function DescriptionList({ items, dtClassName }: Props) {
       {items.map((item, index) => (
         <dl key={index} className={cn('grid grid-cols-subgrid col-span-2')}>
           <dt className={cn('font-medium', dtClassName)}>{item.dt}</dt>
-          <dd className={cn('overflow-ellipsis whitespace-normal overflow-hidden')}>
+          <dd className={cn('overflow-ellipsis whitespace-normal overflow-hidden', item.highlightedDD && 'font-medium text-green-500')}>
             {typeof item.dd === 'bigint' ? item.dd.toString() : item.dd}
           </dd>
         </dl>

src/features/forms/components/address-form-item.tsx

@@ -1,7 +1,7 @@
 import { FieldPath, useFormContext } from 'react-hook-form'
 import { FormItemProps } from '@/features/forms/components/form-item'
 import { TextFormItem } from './text-form-item'
-import { addressFieldSchema, optionalAddressFieldSchema } from '@/features/transaction-wizard/data/common'
+import { addressFieldSchema, optionalAddressFieldSchema, optionalSenderFieldShape } from '@/features/transaction-wizard/data/common'
 import { useDebounce } from 'use-debounce'
 import { isNfd, useLoadableForwardLookupNfdResult } from '@/features/nfd/data'
 import { useCallback, useEffect } from 'react'
@@ -11,6 +11,7 @@ import { z } from 'zod'
 
 export type AddressOrNfdFieldSchema = z.infer<typeof addressFieldSchema>
 export type OptionalAddressOrNfdFieldSchema = z.infer<typeof optionalAddressFieldSchema>
+export type OptionalSenderFieldSchema = z.infer<typeof optionalSenderFieldShape.sender>
 
 export interface AddressFieldProps<TSchema extends Record<string, unknown> = Record<string, unknown>>
   extends Omit<FormItemProps<TSchema>, 'children'> {

src/features/network/data/index.ts

@@ -30,14 +30,15 @@ export const allWalletProviderNames: Record<WalletId, string> = {
   pera: 'Pera',
   exodus: 'Exodus',
   lute: 'Lute',
-  // The below providers aren't used
   custom: 'Custom',
   kibisis: 'Kibisis',
   walletconnect: 'Wallet Connect',
   magic: 'Magic',
   biatec: 'Biatec',
 }
 
+export const FEE_SINK_ADDRESS = 'Y76M3MSY6DKBRHBL7C3NNDXGS5IIMQVQVUAB6MP4XEMMGVF2QWNPL226CA'
+
 export const defaultNetworkConfigs: Record<NetworkId, NetworkConfig> = {
   [localnetId]: {
     name: 'LocalNet',

src/features/transaction-wizard/components/account-close-transaction-builder.tsx

@@ -1,5 +1,10 @@
 import { numberSchema } from '@/features/forms/data/common'
-import { addressFieldSchema, commonSchema, optionalAddressFieldSchema, senderFieldSchema } from '../data/common'
+import {
+  addressFieldSchema,
+  commonSchema,
+  optionalAddressFieldSchema,
+  optionalSenderFieldShape,
+} from '@/features/transaction-wizard/data/common'
 import { z } from 'zod'
 import { useCallback, useMemo } from 'react'
 import { zfd } from 'zod-form-data'
@@ -18,14 +23,17 @@ import { TransactionBuilderNoteField } from './transaction-builder-note-field'
 import { asAddressOrNfd, asOptionalAddressOrNfd } from '../mappers/as-address-or-nfd'
 import { ActiveWalletAccount } from '@/features/wallet/types/active-wallet'
 
+import defineSenderAddress from '../utils/defineSenderAddress'
+import { useNetworkConfig } from '@/features/network/data'
+
 const senderLabel = 'Sender'
 const receiverLabel = 'Receiver'
 const closeRemainderToLabel = 'Close remainder to'
 
 const formSchema = z
   .object({
     ...commonSchema,
-    ...senderFieldSchema,
+    ...optionalSenderFieldShape,
     closeRemainderTo: addressFieldSchema,
     receiver: optionalAddressFieldSchema,
     amount: numberSchema(z.number({ required_error: 'Required', invalid_type_error: 'Required' }).min(0).optional()),
@@ -58,12 +66,14 @@ type Props = {
 }
 
 export function AccountCloseTransactionBuilder({ mode, transaction, activeAccount, onSubmit, onCancel }: Props) {
+  const { id: networkId } = useNetworkConfig()
+
   const submit = useCallback(
     async (data: z.infer<typeof formData>) => {
       onSubmit({
         id: transaction?.id ?? randomGuid(),
         type: BuildableTransactionType.AccountClose,
-        sender: data.sender,
+        sender: await defineSenderAddress(data.sender!, networkId),
         closeRemainderTo: data.closeRemainderTo,
         receiver: asOptionalAddressOrNfd(data.receiver),
         amount: data.amount,
@@ -72,7 +82,7 @@ export function AccountCloseTransactionBuilder({ mode, transaction, activeAccoun
         note: data.note,
       })
     },
-    [onSubmit, transaction?.id]
+    [onSubmit, transaction?.id, networkId]
   )
   const defaultValues = useMemo<Partial<z.infer<typeof formData>>>(() => {
     if (mode === TransactionBuilderMode.Edit && transaction) {

src/features/transaction-wizard/components/app-call-transaction-builder.tsx

@@ -1,6 +1,6 @@
 import algosdk from 'algosdk'
 import { bigIntSchema, numberSchema } from '@/features/forms/data/common'
-import { senderFieldSchema, commonSchema, onCompleteFieldSchema, onCompleteOptions } from '@/features/transaction-wizard/data/common'
+import { commonSchema, onCompleteFieldSchema, onCompleteOptions, optionalSenderFieldShape } from '@/features/transaction-wizard/data/common'
 import { z } from 'zod'
 import { zfd } from 'zod-form-data'
 import { Form } from '@/features/forms/components/form'
@@ -16,10 +16,12 @@ import { TransactionBuilderMode } from '../data'
 import { TransactionBuilderNoteField } from './transaction-builder-note-field'
 import { asAddressOrNfd } from '../mappers/as-address-or-nfd'
 import { ActiveWalletAccount } from '@/features/wallet/types/active-wallet'
+import defineSenderAddress from '../utils/defineSenderAddress'
+import { useNetworkConfig } from '@/features/network/data'
 
 const formData = zfd.formData({
   ...commonSchema,
-  ...senderFieldSchema,
+  ...optionalSenderFieldShape,
   ...onCompleteFieldSchema,
   applicationId: bigIntSchema(z.bigint({ required_error: 'Required', invalid_type_error: 'Required' })),
   extraProgramPages: numberSchema(z.number().min(0).max(3).optional()),
@@ -41,13 +43,14 @@ type Props = {
 }
 
 export function AppCallTransactionBuilder({ mode, transaction, activeAccount, defaultValues: _defaultValues, onSubmit, onCancel }: Props) {
+  const { id: networkId } = useNetworkConfig()
   const submit = useCallback(
     async (values: z.infer<typeof formData>) => {
       onSubmit({
         id: transaction?.id ?? randomGuid(),
         type: BuildableTransactionType.AppCall,
         applicationId: BigInt(values.applicationId),
-        sender: values.sender,
+        sender: await defineSenderAddress(values.sender!, networkId),
         onComplete: Number(values.onComplete),
         extraProgramPages: values.extraProgramPages,
         fee: values.fee,
@@ -56,7 +59,7 @@ export function AppCallTransactionBuilder({ mode, transaction, activeAccount, de
         note: values.note,
       })
     },
-    [onSubmit, transaction?.id]
+    [onSubmit, transaction?.id, networkId]
   )
 
   const defaultValues = useMemo<Partial<z.infer<typeof formData>>>(() => {

src/features/transaction-wizard/components/application-create-transaction-builder.tsx

@@ -1,10 +1,10 @@
 import algosdk from 'algosdk'
 import { numberSchema } from '@/features/forms/data/common'
 import {
-  senderFieldSchema,
   commonSchema,
   onCompleteOptionsForAppCreate,
   onCompleteForAppCreateFieldSchema,
+  optionalSenderFieldShape,
 } from '@/features/transaction-wizard/data/common'
 import { z } from 'zod'
 import { zfd } from 'zod-form-data'
@@ -22,9 +22,12 @@ import { TransactionBuilderNoteField } from './transaction-builder-note-field'
 import { asAddressOrNfd } from '../mappers/as-address-or-nfd'
 import { ActiveWalletAccount } from '@/features/wallet/types/active-wallet'
 
+import defineSenderAddress from '../utils/defineSenderAddress'
+import { useNetworkConfig } from '@/features/network/data'
+
 const formData = zfd.formData({
   ...commonSchema,
-  ...senderFieldSchema,
+  ...optionalSenderFieldShape,
   ...onCompleteForAppCreateFieldSchema,
   approvalProgram: zfd.text(z.string({ required_error: 'Required', invalid_type_error: 'Required' })),
   clearStateProgram: zfd.text(z.string({ required_error: 'Required', invalid_type_error: 'Required' })),
@@ -50,14 +53,16 @@ type Props = {
 }
 
 export function ApplicationCreateTransactionBuilder({ mode, transaction, activeAccount, onSubmit, onCancel }: Props) {
+  const { id: networkId } = useNetworkConfig()
+
   const submit = useCallback(
     async (values: z.infer<typeof formData>) => {
       onSubmit({
         id: transaction?.id ?? randomGuid(),
         type: BuildableTransactionType.ApplicationCreate,
         approvalProgram: values.approvalProgram,
         clearStateProgram: values.clearStateProgram,
-        sender: values.sender,
+        sender: await defineSenderAddress(values.sender!, networkId),
         onComplete: Number(values.onComplete),
         extraProgramPages: values.extraProgramPages,
         globalInts: values.globalInts,
@@ -70,7 +75,7 @@ export function ApplicationCreateTransactionBuilder({ mode, transaction, activeA
         note: values.note,
       })
     },
-    [onSubmit, transaction?.id]
+    [onSubmit, transaction?.id, networkId]
   )
 
   const defaultValues = useMemo<Partial<z.infer<typeof formData>>>(() => {

src/features/transaction-wizard/components/application-update-transaction-builder.tsx

@@ -1,5 +1,5 @@
 import { bigIntSchema } from '@/features/forms/data/common'
-import { senderFieldSchema, commonSchema } from '@/features/transaction-wizard/data/common'
+import { commonSchema, optionalSenderFieldShape } from '@/features/transaction-wizard/data/common'
 import { z } from 'zod'
 import { zfd } from 'zod-form-data'
 import { Form } from '@/features/forms/components/form'
@@ -15,10 +15,12 @@ import { TransactionBuilderMode } from '../data'
 import { TransactionBuilderNoteField } from './transaction-builder-note-field'
 import { asAddressOrNfd } from '../mappers/as-address-or-nfd'
 import { ActiveWalletAccount } from '@/features/wallet/types/active-wallet'
+import defineSenderAddress from '../utils/defineSenderAddress'
+import { useNetworkConfig } from '@/features/network/data'
 
 const formData = zfd.formData({
   ...commonSchema,
-  ...senderFieldSchema,
+  ...optionalSenderFieldShape,
   applicationId: bigIntSchema(z.bigint({ required_error: 'Required', invalid_type_error: 'Required' })),
   approvalProgram: zfd.text(z.string({ required_error: 'Required', invalid_type_error: 'Required' })),
   clearStateProgram: zfd.text(z.string({ required_error: 'Required', invalid_type_error: 'Required' })),
@@ -39,6 +41,8 @@ type Props = {
 }
 
 export function ApplicationUpdateTransactionBuilder({ mode, transaction, activeAccount, onSubmit, onCancel }: Props) {
+  const { id: networkId } = useNetworkConfig()
+
   const submit = useCallback(
     async (values: z.infer<typeof formData>) => {
       onSubmit({
@@ -47,14 +51,14 @@ export function ApplicationUpdateTransactionBuilder({ mode, transaction, activeA
         applicationId: BigInt(values.applicationId),
         approvalProgram: values.approvalProgram,
         clearStateProgram: values.clearStateProgram,
-        sender: values.sender,
+        sender: await defineSenderAddress(values.sender, networkId),
         fee: values.fee,
         validRounds: values.validRounds,
         args: values.args.map((arg) => arg.value),
         note: values.note,
       })
     },
-    [onSubmit, transaction?.id]
+    [onSubmit, transaction?.id, networkId]
   )
 
   const defaultValues = useMemo<Partial<z.infer<typeof formData>>>(() => {

src/features/transaction-wizard/components/asset-clawback-transaction-builder.tsx

@@ -1,5 +1,5 @@
 import { bigIntSchema, decimalSchema } from '@/features/forms/data/common'
-import { addressFieldSchema, commonSchema, receiverFieldSchema, senderFieldSchema } from '../data/common'
+import { addressFieldSchema, commonSchema, optionalSenderFieldShape, receiverFieldSchema } from '../data/common'
 import { z } from 'zod'
 import { useCallback, useEffect, useMemo, useState } from 'react'
 import { zfd } from 'zod-form-data'
@@ -22,13 +22,15 @@ import { useDebounce } from 'use-debounce'
 import { TransactionBuilderMode } from '../data'
 import { TransactionBuilderNoteField } from './transaction-builder-note-field'
 import { asAddressOrNfd } from '../mappers/as-address-or-nfd'
+import defineSenderAddress from '../utils/defineSenderAddress'
+import { useNetworkConfig } from '@/features/network/data'
 
 const clawbackTargetLabel = 'Clawback target'
 
 export const assetClawbackFormSchema = z
   .object({
     ...commonSchema,
-    ...senderFieldSchema,
+    ...optionalSenderFieldShape,
     ...receiverFieldSchema,
     clawbackTarget: addressFieldSchema,
     asset: z
@@ -180,13 +182,15 @@ type Props = {
 }
 
 export function AssetClawbackTransactionBuilder({ mode, transaction, onSubmit, onCancel }: Props) {
+  const { id: networkId } = useNetworkConfig()
+
   const submit = useCallback(
     async (data: z.infer<typeof formData>) => {
       onSubmit({
         id: transaction?.id ?? randomGuid(),
         type: BuildableTransactionType.AssetClawback,
         asset: data.asset,
-        sender: data.sender,
+        sender: await defineSenderAddress(data.sender, networkId),
         receiver: data.receiver,
         clawbackTarget: data.clawbackTarget,
         amount: data.amount!,
@@ -195,7 +199,7 @@ export function AssetClawbackTransactionBuilder({ mode, transaction, onSubmit, o
         note: data.note,
       })
     },
-    [onSubmit, transaction?.id]
+    [onSubmit, transaction?.id, networkId]
   )
   const defaultValues = useMemo<Partial<z.infer<typeof formData>>>(() => {
     if (mode === TransactionBuilderMode.Edit && transaction) {

src/features/transaction-wizard/components/asset-create-transaction-builder.tsx

@@ -1,5 +1,5 @@
 import { bigIntSchema, numberSchema } from '@/features/forms/data/common'
-import { commonSchema, optionalAddressFieldSchema, senderFieldSchema } from '../data/common'
+import { commonSchema, optionalAddressFieldSchema, optionalSenderFieldShape } from '../data/common'
 import { z } from 'zod'
 import { useCallback, useMemo } from 'react'
 import { zfd } from 'zod-form-data'
@@ -17,10 +17,12 @@ import { TransactionBuilderMode } from '../data'
 import { TransactionBuilderNoteField } from './transaction-builder-note-field'
 import { asAddressOrNfd, asOptionalAddressOrNfd } from '../mappers/as-address-or-nfd'
 import { ActiveWalletAccount } from '@/features/wallet/types/active-wallet'
+import defineSenderAddress from '../utils/defineSenderAddress'
+import { useNetworkConfig } from '@/features/network/data'
 
 export const assetCreateFormSchema = z.object({
   ...commonSchema,
-  ...senderFieldSchema,
+  ...optionalSenderFieldShape,
   total: bigIntSchema(z.bigint({ required_error: 'Required', invalid_type_error: 'Required' }).gt(BigInt(0), 'Must be greater than 0')),
   decimals: numberSchema(z.number({ required_error: 'Required', invalid_type_error: 'Required' }).min(0).max(19)),
   assetName: zfd.text(z.string().optional()),
@@ -124,6 +126,8 @@ type Props = {
 }
 
 export function AssetCreateTransactionBuilder({ mode, transaction, activeAccount, onSubmit, onCancel }: Props) {
+  const { id: networkId } = useNetworkConfig()
+
   const submit = useCallback(
     async (data: z.infer<typeof formData>) => {
       onSubmit({
@@ -133,7 +137,7 @@ export function AssetCreateTransactionBuilder({ mode, transaction, activeAccount
         unitName: data.unitName,
         total: data.total,
         decimals: data.decimals,
-        sender: data.sender,
+        sender: await defineSenderAddress(data.sender, networkId),
         manager: asOptionalAddressOrNfd(data.manager),
         reserve: asOptionalAddressOrNfd(data.reserve),
         freeze: asOptionalAddressOrNfd(data.freeze),
@@ -146,7 +150,7 @@ export function AssetCreateTransactionBuilder({ mode, transaction, activeAccount
         note: data.note,
       })
     },
-    [onSubmit, transaction?.id]
+    [onSubmit, transaction?.id, networkId]
   )
   const defaultValues = useMemo<Partial<z.infer<typeof formData>>>(() => {
     if (mode === TransactionBuilderMode.Edit && transaction) {