Add Select UI for account.

components/Transaction/ui.tsx

@@ -38,28 +38,14 @@ export const TxUI: FC<UIProps> = ({
   switchToJson
 }) => {
   const { accounts } = useSnapshot(state)
-  const {
+  const { selectedAccount, selectedTransaction, txFields, selectedFlags, hookParameters, memos } =
-    selectedAccount,
+    txState
-    selectedDestAccount,
-    selectedTransaction,
-    txFields,
-    selectedFlags,
-    hookParameters,
-    memos
-  } = txState
 
   const accountOptions: SelectOption[] = accounts.map(acc => ({
     label: acc.name,
     value: acc.address
   }))
 
-  const destAccountOptions: SelectOption[] = accounts
-    .map(acc => ({
-      label: acc.name,
-      value: acc.address
-    }))
-    .filter(acc => acc.value !== selectedAccount?.value)
-
   const flagsOptions: SelectOption[] = Object.entries(
     getFlags(selectedTransaction?.value) || {}
   ).map(([label, value]) => ({
@@ -215,6 +201,7 @@ export const TxUI: FC<UIProps> = ({
             value = _value?.toString()
           }
 
+          const isAccount = typeIs(_value, 'object') && _value.$type === 'account'
           const isXrpAmount = typeIs(_value, 'object') && _value.$type === 'amount.xrp'
           const isTokenAmount = typeIs(_value, 'object') && _value.$type === 'amount.token'
           const isJson = typeof _value === 'object' && _value.$type === 'json'
@@ -303,6 +290,23 @@ export const TxUI: FC<UIProps> = ({
               </TxField>
             )
           }
+          if (isAccount) {
+            const label = accountOptions.find(a => a.value === value)?.label || value
+            return (
+              <TxField key={field} label={field}>
+                <Select
+                  instanceId={field}
+                  placeholder={`Select ${field} account`}
+                  options={accountOptions}
+                  value={{
+                    value,
+                    label
+                  }}
+                  onChange={(acc: any) => handleSetField(field, acc.value)}
+                />
+              </TxField>
+            )
+          }
           return (
             <TxField key={field} label={field}>
               {isJson ? (

state/actions/sendTransaction.tsx

@@ -10,7 +10,6 @@ interface TransactionOptions {
   TransactionType: string
   Account?: string
   Fee?: string
-  Destination?: string
   [index: string]: any
 }
 interface OtherOptions {

state/transactions.ts

@@ -130,7 +130,6 @@ export const modifyTxState = (
   return tx.state
 }
 
-// state to tx options
 export const prepareTransaction = (data: any) => {
   let options = { ...data }
 
@@ -145,7 +144,6 @@ export const prepareTransaction = (data: any) => {
         options[field] = undefined
       }
     }
-
     // amount.token
     if (_value.$type === 'amount.token') {
       if (typeIs(_value.$value, 'string')) {
@@ -156,7 +154,10 @@ export const prepareTransaction = (data: any) => {
         options[field] = undefined
       }
     }
-
+    // account
+    if (_value.$type === 'account') {
+      options[field] = _value.$value?.toString();
+    }
     // json
     if (_value.$type === 'json') {
       const val = _value.$value;
@@ -181,7 +182,6 @@ export const prepareTransaction = (data: any) => {
   return options
 }
 
-// editor value to state
 export const prepareState = (value: string, transactionType?: string) => {
   const options = parseJSON(value)
   if (!options) {
@@ -252,19 +252,27 @@ export const prepareState = (value: string, transactionType?: string) => {
     const isAmount = schemaVal &&
       typeIs(schemaVal, "object") &&
       schemaVal.$type.startsWith('amount.');
+    const isAccount = schemaVal &&
+      typeIs(schemaVal, "object") &&
+      schemaVal.$type.startsWith("account");
 
     if (isAmount && ["number", "string"].includes(typeof value)) {
       rest[field] = {
         $type: 'amount.xrp', // TODO narrow typed $type.
         $value: +value / 1000000 // ! maybe use bigint?
       }
-    }
+    } else if (isAmount && typeof value === 'object') {
-    else if (isAmount && typeof value === 'object') {
       rest[field] = {
         $type: 'amount.token',
         $value: value
       }
-    } else if (typeof value === 'object') {
+    } else if (isAccount) {
+      rest[field] = {
+        $type: "account",
+        $value: value?.toString()
+      }
+    }
+    else if (typeof value === 'object') {
       rest[field] = {
         $type: 'json',
         $value: value