diff --git a/src/plugins/oSnap/components/TransactionBuilder/RawTransaction.vue b/src/plugins/oSnap/components/TransactionBuilder/RawTransaction.vue index 0ca452a6..357f8783 100644 --- a/src/plugins/oSnap/components/TransactionBuilder/RawTransaction.vue +++ b/src/plugins/oSnap/components/TransactionBuilder/RawTransaction.vue @@ -4,11 +4,12 @@ import { isAddress } from '@ethersproject/address'; import { isBigNumberish } from '@ethersproject/bignumber/lib/bignumber'; import { isHexString } from '@ethersproject/bytes'; import { RawTransaction } from '../../types'; -import { createRawTransaction } from '../../utils'; +import { createRawTransaction, parseValueInput } from '../../utils'; import AddressInput from '../Input/Address.vue'; const props = defineProps<{ transaction: RawTransaction; + setTransactionAsInvalid(): void; }>(); const emit = defineEmits<{ @@ -19,21 +20,12 @@ const to = ref(props.transaction.to ?? ''); const value = ref(props.transaction.value ?? '0'); const data = ref(props.transaction.data ?? '0x'); +const isValueValid = ref(true); + const isToValid = computed(() => { return to.value === '' || isAddress(to.value); }); -const isValueValid = computed(() => { - if (value.value === '') return true; - if (!isBigNumberish(value.value)) return false; - try { - parseAmount(value.value); - return true; - } catch (error) { - return false; - } -}); - const isDataValid = computed(() => { return data.value === '' || isHexString(data.value); }); @@ -43,14 +35,39 @@ watch(value, updateTransaction); watch(data, updateTransaction); function updateTransaction() { - if (!isToValid.value || !isValueValid.value || !isDataValid.value) return; + try { + if (!isToValid.value) { + throw new Error('"To" address invalid'); + } + if (!isValueValid.value) { + throw new Error('"Value" amount invalid invalid'); + } + if (!isDataValid.value) { + throw new Error('"Data" field invalid'); + } - const transaction = createRawTransaction({ - to: to.value, - value: value.value, - data: data.value - }); - emit('updateTransaction', transaction); + const transaction = createRawTransaction({ + to: to.value, + value: value.value, + data: data.value + }); + emit('updateTransaction', transaction); + } catch (error) { + console.error(error); + props.setTransactionAsInvalid(); + } +} + +function updateValue(newValue: string) { + try { + const parsed = parseValueInput(newValue); + value.value = parsed; + isValueValid.value = true; + } catch (error) { + isValueValid.value = false; + } finally { + updateTransaction(); + } } @@ -66,6 +83,7 @@ function updateTransaction() {