@mictonode/widget 0.3.23 → 0.3.24

package/lib/components/TxDialog/index.vue

@@ -10,10 +10,11 @@ import {
     getTxByHash,
 } from '../../utils/http';
 import { BroadcastMode, Coin, CoinMetadata } from '../../utils/type';
-import { readWallet, isEvmChain } from '../../../lib/wallet/Wallet';
-import { walletErrorMessage } from '../../../lib/wallet/WalletError';
+import { isEvmChain } from '../../../lib/wallet/Wallet';
+import { normalizeWalletError } from '../../../lib/wallet/WalletError';
 import { createSessionClient } from '../../../lib/wallet/SessionClient';
 import { calculateFeeAmount } from './fee';
+import { parseTxParams } from './txParams';
 
 // cosmos sdk messages
 import Delegate from './messages/Delegate.vue';
@@ -90,7 +91,9 @@ const metadatas = ref({} as Record<string, CoinMetadata>);
 const emit = defineEmits(['submited', 'confirmed', 'view']);
 
 // functional variable
-const p = ref({} as { fees: Coin });
+const parsedParams = computed(() => parseTxParams(props.params));
+const invalidParamsMessage = 'Transaction parameters are invalid';
+const p = ref<{ fees?: Coin }>({});
 const view = ref('input'); // input, submitting
 const open = ref(false);
 const error = ref('');
@@ -110,10 +113,18 @@ const chainId = ref('cosmoshub-4');
 const broadcast = ref(BroadcastMode.SYNC);
 
 async function initData() {
+    sending.value = false;
+    error.value = '';
+    p.value = parsedParams.value.value as { fees?: Coin };
+
+    if (parsedParams.value.issue) {
+        error.value = invalidParamsMessage;
+        return;
+    }
+
     if (open.value && props.endpoint && props.sender) {
         metadatas.value = {}
         view.value = 'input';
-        p.value = JSON.parse(props.params || '{}')
         memo.value = props.type?.toLowerCase() === 'send' ? '' : 'mictonode.com'
 
         feeAmount.value = Number(p.value?.fees?.amount || 2000)
@@ -150,9 +161,7 @@ async function initData() {
                     x.assets.forEach(a => {
                         metadatas.value[a.base] = a as CoinMetadata
                     })
-                }).catch(() => {
-                    console.log(`Chain: ${props.registryName } was not found on Cosmos Registry`)
-                })
+                }).catch(() => {})
             }
             getLatestBlock(props.endpoint).then((x) => {
                 chainId.value = x.block.header.chain_id;
@@ -182,13 +191,29 @@ async function initData() {
     }
 }
 async function sendTx() {
-    try {
-        if (!props.sender) throw new Error('Sender should not be empty!');
-        if (!props.endpoint) throw new Error('Endpoint is empty');
-        if (!feeDenom.value) throw new Error('Fee Denom is empty');
-        if (!msgBox.value.isValid.ok)
-            throw new Error(msgBox.value.isValid.error);
+    if (parsedParams.value.issue) {
+        error.value = invalidParamsMessage;
+        return;
+    }
 
+    if (!props.sender) {
+        error.value = 'Sender should not be empty!';
+        return;
+    }
+    if (!props.endpoint) {
+        error.value = 'Endpoint is empty';
+        return;
+    }
+    if (!feeDenom.value) {
+        error.value = 'Fee Denom is empty';
+        return;
+    }
+    if (!msgBox.value.isValid.ok) {
+        error.value = msgBox.value.isValid.error;
+        return;
+    }
+
+    try {
         const client = createSessionClient(props.hdPath, {
             chainId: chainId.value,
         });
@@ -216,8 +241,6 @@ async function sendTx() {
             },
             preserveFee: props.gasPrice !== undefined,
         };
-        // console.log('tx:', tx);
-
         if(!advance.value) {
             await client.simulate(props.endpoint, tx, broadcast.value).then(gas => {
                 // update tx gas
@@ -248,10 +271,7 @@ async function sendTx() {
         });
     } catch (cause) {
         sending.value = false;
-        error.value = walletErrorMessage(
-            cause,
-            readWallet(props.hdPath).wallet
-        );
+        error.value = normalizeWalletError(cause).message;
     }
 }
 
@@ -324,7 +344,7 @@ function fetchTx(tx: string) {
                 <div v-if="sender">
                     <div v-if="view === 'input'">
                         <component :is="msgType" ref="msgBox" :endpoint="endpoint" :sender="sender" :balances="balance"
-                            :metadata="metadatas" :params="props.params" />
+                            :metadata="metadatas" :params="parsedParams.value" />
                         <form class="space-y-6" action="#" method="POST">
                             <div :class="advance ? '' : 'hidden'">
                                 <div class="form-control">

package/lib/components/TxDialog/messages/Delegate.vue

@@ -8,15 +8,21 @@ import {
 import { decimal2percent } from '../../../utils/format';
 import { Coin, CoinMetadata } from '../../../utils/type';
 import { TokenUnitConverter } from '../../../utils/TokenUnitConverter';
+import type { TxParams } from '../txParams';
+
+type ValidatorParams = { validator_address?: string };
 
 const props = defineProps({
     endpoint: { type: String, required: true },
     sender: { type: String, required: true },
     balances: Object as PropType<Coin[]>,
     metadata: Object as PropType<Record<string, CoinMetadata>>,
-    params: String,
+    params: {
+        type: Object as PropType<TxParams>,
+        default: () => ({}),
+    },
 });
-const params = computed(() => JSON.parse(props.params || '{}'));
+const params = computed(() => props.params as ValidatorParams);
 
 const validator = ref('');
 

package/lib/components/TxDialog/messages/Deposit.vue

@@ -3,16 +3,22 @@ import { PropType, computed, onMounted, ref } from 'vue';
 import { Coin, CoinMetadata } from '../../../utils/type';
 import { getStakingParam } from '../../../utils/http';
 import { TokenUnitConverter } from '../../../utils/TokenUnitConverter';
+import type { TxParams } from '../txParams';
+
+type ProposalParams = { proposal_id?: string | number };
 
 const props = defineProps({
     endpoint: {type: String, required: true },
     sender: {type: String, required: true},
     balances: Object as PropType<Coin[]>,
     metadata: Object as PropType<Record<string, CoinMetadata>>,
-    params: String,
+    params: {
+        type: Object as PropType<TxParams>,
+        default: () => ({}),
+    },
 });
 
-const params = computed(() => JSON.parse(props.params || "{}"))
+const params = computed(() => props.params as ProposalParams)
 const denom = ref("")
 const amount = ref("")
 const amountDenom = ref("")
@@ -94,4 +100,4 @@ defineExpose({msgs, isValid, initial})
             </label>
         </div>
     </div>
-</template>
+</template>

package/lib/components/TxDialog/messages/Redelegate.vue

@@ -4,14 +4,21 @@ import { getActiveValidators, getDelegations, getInactiveValidators, getStakingP
 import { decimal2percent } from '../../../utils/format'
 import { Coin, CoinMetadata } from '../../../utils/type';
 import { TokenUnitConverter } from '../../../utils/TokenUnitConverter';
+import type { TxParams } from '../txParams';
+
+type ValidatorParams = { validator_address?: string };
+
 const props = defineProps({
     endpoint: {type: String, required: true },
     sender: {type: String, required: true},
     balances: Object as PropType<Coin[]>,
     metadata: Object as PropType<Record<string, CoinMetadata>>,
-    params: String,
+    params: {
+        type: Object as PropType<TxParams>,
+        default: () => ({}),
+    },
 });
-const params = computed(() => JSON.parse(props.params || "{}"))
+const params = computed(() => props.params as ValidatorParams)
 
 const validator = ref('')
 
@@ -158,4 +165,4 @@ defineExpose({msgs, isValid, initial})
             {{ error }}
         </div>
     </div>
-</template>
+</template>

package/lib/components/TxDialog/messages/Send.vue

@@ -5,12 +5,16 @@ import {
 } from '../../../utils/http';
 import { Coin, CoinMetadata } from '../../../utils/type';
 import { TokenUnitConverter } from '../../../utils/TokenUnitConverter';
+import type { TxParams } from '../txParams';
 const props = defineProps({
     endpoint: { type: String, required: true },
     sender: { type: String, required: true },
     balances: Object as PropType<Coin[]>,
     metadata: Object as PropType<Record<string, CoinMetadata>>,
-    params: String,
+    params: {
+        type: Object as PropType<TxParams>,
+        default: () => ({}),
+    },
 });
 
 const amount = ref('');
@@ -85,7 +89,8 @@ const isValid = computed(() => {
 
 
 function initial() {
-    denom.value = props.params?.fees?.denom || '';
+    denom.value =
+        (props.params.fees as { denom?: string } | undefined)?.denom || '';
     // getStakingParam(props.endpoint).then((x) => {
     //     denom.value = x.params?.bond_denom;
     // });

package/lib/components/TxDialog/messages/Transfer.vue

@@ -7,16 +7,22 @@ import { IBCPath } from '@ping-pub/chain-registry-client/dist/types';
 import dayjs from 'dayjs';
 import utc from 'dayjs/plugin/utc';
 import { TokenUnitConverter } from '../../../utils/TokenUnitConverter';
+import type { TxParams } from '../txParams';
 dayjs.extend(utc);
 
+type TransferParams = { chain_name?: string };
+
 const props = defineProps({
     endpoint: { type: String, required: true },
     sender: { type: String, required: true },
     balances: Object as PropType<Coin[]>,
     metadata: Object as PropType<Record<string, CoinMetadata>>,
-    params: String,
+    params: {
+        type: Object as PropType<TxParams>,
+        default: () => ({}),
+    },
 });
-const params = computed(() => JSON.parse(props.params || "{}"))
+const params = computed(() => props.params as TransferParams)
 const chainName = params.value.chain_name;
 
 const amount = ref('');

package/lib/components/TxDialog/messages/Unbond.vue

@@ -3,15 +3,21 @@ import { PropType, computed, onMounted, ref } from 'vue';
 import { getDelegations } from '../../../utils/http'
 import { Coin, CoinMetadata } from '../../../utils/type';
 import { TokenUnitConverter } from '../../../utils/TokenUnitConverter';
+import type { TxParams } from '../txParams';
+
+type ValidatorParams = { validator_address?: string };
 
 const props = defineProps({
     endpoint: {type: String, required: true },
     sender: {type: String, required: true},
     metadata: Object as PropType<Record<string, CoinMetadata>>,
-    params: String,
+    params: {
+        type: Object as PropType<TxParams>,
+        default: () => ({}),
+    },
 });
 
-const params = computed(() => JSON.parse(props.params || "{}"))
+const params = computed(() => props.params as ValidatorParams)
 const delegation = ref({} as {balance: Coin, delegation: {delegator_address: string, shares: string, validator_address: string}})
 const amount = ref("")
 const amountDenom = ref("")
@@ -101,4 +107,4 @@ defineExpose({msgs, isValid, initial})
         </div>
         <div class="text-error">{{ error }}</div>
     </div>
-</template>
+</template>

package/lib/components/TxDialog/messages/Vote.vue

@@ -1,14 +1,20 @@
 <script lang="ts" setup>
 import { PropType, computed, ref } from 'vue';
 import { CoinMetadata } from '../../../utils/type';
+import type { TxParams } from '../txParams';
+
+type ProposalParams = { proposal_id?: string | number };
 
 const props = defineProps({
     endpoint: { type: String, required: true },
     sender: { type: String, required: true },
-    params: String,
+    params: {
+        type: Object as PropType<TxParams>,
+        default: () => ({}),
+    },
 });
 
-const params = computed(() => JSON.parse(props.params || "{}"))
+const params = computed(() => props.params as ProposalParams)
 const option = ref("1")
 
 const msgs = computed(() => {
@@ -60,4 +66,4 @@ defineExpose({msgs, isValid, initial})
             </div>
         </div>
     </div>
-</template>
+</template>

package/lib/components/TxDialog/messages/Withdraw.vue

@@ -1,11 +1,16 @@
 <script lang="ts" setup>
 import { computed, onMounted, ref } from 'vue';
+import type { PropType } from 'vue';
 import { getDelegateRewards } from '../../../utils/http'
+import type { TxParams } from '../txParams';
 
 const props = defineProps({
     endpoint: { type: String, required: true },
     sender: { type: String, required: true },
-    params: String,
+    params: {
+        type: Object as PropType<TxParams>,
+        default: () => ({}),
+    },
 });
 
 const rewards = ref([] as { reward: { amount: string, denom: string }, validator_address: string }[])
@@ -53,4 +58,4 @@ defineExpose({ msgs, isValid, initial })
             <input :value="sender" type="text" class="text-gray-600 dark:text-white input border" />
         </div>
     </div>
-</template>
+</template>

package/lib/components/TxDialog/messages/WithdrawCommission.vue

@@ -1,14 +1,21 @@
 <script lang="ts" setup>
 import { computed, ref } from 'vue';
+import type { PropType } from 'vue';
 import { getDelegateRewards } from '../../../utils/http';
+import type { TxParams } from '../txParams';
+
+type ValidatorParams = { validator_address?: string };
 
 const props = defineProps({
   endpoint: { type: String, required: true },
   sender: { type: String, required: true },
-  params: String,
+  params: {
+    type: Object as PropType<TxParams>,
+    default: () => ({}),
+  },
 });
 
-const params = computed(() => JSON.parse(props.params || "{}"))
+const params = computed(() => props.params as ValidatorParams)
 const rewards = ref([] as { reward: { amount: string, denom: string }, validator_address: string }[])
 
 const msgs = computed(() => {
@@ -72,4 +79,4 @@ defineExpose({ msgs, isValid, initial })
       <input :value="sender" type="text" class="text-gray-600 dark:text-white input border" />
     </div>
   </div>
-</template>
+</template>

package/lib/components/TxDialog/txParams.ts

@@ -0,0 +1,30 @@
+export type TxParams = Record<string, unknown>;
+export type TxParamsIssue = 'invalid-json' | 'invalid-shape';
+
+export interface TxParamsResult {
+  value: TxParams;
+  issue?: TxParamsIssue;
+}
+
+function isTxParams(value: unknown): value is TxParams {
+  return (
+    typeof value === 'object' &&
+    value !== null &&
+    !Array.isArray(value)
+  );
+}
+
+export function parseTxParams(raw?: string): TxParamsResult {
+  if (!raw?.trim()) return { value: {} };
+
+  let parsed: unknown;
+  try {
+    parsed = JSON.parse(raw);
+  } catch {
+    return { value: {}, issue: 'invalid-json' };
+  }
+
+  return isTxParams(parsed)
+    ? { value: parsed }
+    : { value: {}, issue: 'invalid-shape' };
+}

package/lib/components/TxDialog/wasm/ClearAdmin.vue

@@ -1,14 +1,21 @@
 <script lang="ts" setup>
 import { computed, ref } from 'vue';
+import type { PropType } from 'vue';
 import { toBase64 } from '@cosmjs/encoding'
+import type { TxParams } from '../txParams';
+
+type ContractParams = { contract?: string };
 
 const props = defineProps({
     endpoint: { type: String, required: true },
     sender: { type: String, required: true },
-    params: String,
+    params: {
+        type: Object as PropType<TxParams>,
+        default: () => ({}),
+    },
 });
 
-const params = computed(() => JSON.parse(props.params || "{}"))
+const params = computed(() => props.params as ContractParams)
 
 const msgs = computed(() => {
     return [{
@@ -53,4 +60,4 @@ defineExpose({msgs, isValid, initial})
             <input type="text" readonly class="text-gray-600 dark:text-white input border" :value="params.contract" />
         </div>
     </div>
-</template>
+</template>

package/lib/components/TxDialog/wasm/ExecuteContract.vue

@@ -2,18 +2,24 @@
 import { Coin } from '@cosmjs/amino';
 import { PropType, computed, ref } from 'vue';
 import type { CoinMetadata } from '../../../utils/type';
+import type { TxParams } from '../txParams';
+
+type ExecuteParams = { contract?: string; execution?: unknown };
 
 const props = defineProps({
     endpoint: { type: String, required: true },
     sender: { type: String, required: true },
     balances: Object as PropType<Coin[]>,
     metadata: Object as PropType<Record<string, CoinMetadata>>,
-    params: String,
+    params: {
+        type: Object as PropType<TxParams>,
+        default: () => ({}),
+    },
 });
 
-const parsed = computed(() => JSON.parse(props.params || "{}"))
+const params = computed(() => props.params as ExecuteParams)
 
-const contract = ref(parsed.value.contract)
+const contract = ref(params.value.contract || "")
 const funds = ref([] as Coin[])
 const msg = ref("")
 
@@ -55,7 +61,7 @@ const isValid = computed(() => {
 })
 
 function initial() {
-    msg.value = JSON.stringify(parsed.value.execution) || ""
+    msg.value = JSON.stringify(params.value.execution) || ""
 }
 
 defineExpose({msgs, isValid, initial})
@@ -96,4 +102,4 @@ defineExpose({msgs, isValid, initial})
             </label>
         </div>
     </div>
-</template>
+</template>

package/lib/components/TxDialog/wasm/InstantiateContract.vue

@@ -3,16 +3,22 @@ import { Coin } from '@cosmjs/amino';
 import { PropType, computed, ref } from 'vue';
 import { toBase64 } from '@cosmjs/encoding'
 import { CoinMetadata } from '../../../utils/type';
+import type { TxParams } from '../txParams';
+
+type InstantiateParams = { codeId?: string | number };
 
 const props = defineProps({
     endpoint: { type: String, required: true },
     sender: { type: String, required: true },
     balances: Object as PropType<Coin[]>,
     metadata: Object as PropType<Record<string, CoinMetadata>>,
-    params: String,
+    params: {
+        type: Object as PropType<TxParams>,
+        default: () => ({}),
+    },
 });
 
-const params = computed(() => JSON.parse(props.params || "{}"))
+const params = computed(() => props.params as InstantiateParams)
 
 const admin = ref("")
 const label = ref("")
@@ -106,4 +112,4 @@ defineExpose({msgs, isValid, initial})
             </label>
         </div>
     </div>
-</template>
+</template>

package/lib/components/TxDialog/wasm/MigrateContract.vue

@@ -1,14 +1,21 @@
 <script lang="ts" setup>
 import { computed, ref } from 'vue';
+import type { PropType } from 'vue';
 import { toBase64 } from '@cosmjs/encoding'
+import type { TxParams } from '../txParams';
+
+type ContractParams = { contract?: string };
 
 const props = defineProps({
     endpoint: { type: String, required: true },
     sender: { type: String, required: true },
-    params: String,
+    params: {
+        type: Object as PropType<TxParams>,
+        default: () => ({}),
+    },
 });
 
-const params = computed(() => JSON.parse(props.params || "{}"))
+const params = computed(() => props.params as ContractParams)
 
 const codeId = ref("")
 const msg = ref("{}")
@@ -74,4 +81,4 @@ defineExpose({msgs, isValid, initial})
             <textarea v-model="msg" placeholder="{config: {}}" class="text-gray-600 dark:text-white textarea border"></textarea>
         </div>
     </div>
-</template>
+</template>

package/lib/components/TxDialog/wasm/MigrateContract2.vue

@@ -1,14 +1,21 @@
 <script lang="ts" setup>
 import { computed, ref } from 'vue';
+import type { PropType } from 'vue';
 import { toBase64 } from '@cosmjs/encoding'
+import type { TxParams } from '../txParams';
+
+type ContractParams = { contract?: string };
 
 const props = defineProps({
     endpoint: { type: String, required: true },
     sender: { type: String, required: true },
-    params: String,
+    params: {
+        type: Object as PropType<TxParams>,
+        default: () => ({}),
+    },
 });
 
-const params = computed(() => JSON.parse(props.params || "{}"))
+const params = computed(() => props.params as ContractParams)
 
 const codeId = ref("")
 const msg = ref("")
@@ -74,4 +81,4 @@ defineExpose({msgs, isValid, initial})
             <textarea v-model="msg" placeholder="{config: {}}" class="text-gray-600 dark:text-white textarea border"></textarea>
         </div>
     </div>
-</template>
+</template>

package/lib/components/TxDialog/wasm/StoreCode.vue

@@ -1,11 +1,15 @@
 <script lang="ts" setup>
 import { PropType, computed, ref } from 'vue';
 import * as fflate from 'fflate';
+import type { TxParams } from '../txParams';
 
 const props = defineProps({
     endpoint: { type: String, required: true },
     sender: { type: String, required: true },
-    params: String,
+    params: {
+        type: Object as PropType<TxParams>,
+        default: () => ({}),
+    },
 });
 
 const bytecode = ref(new Uint8Array())
@@ -98,4 +102,4 @@ defineExpose({msgs, isValid, initial})
             <input type="file" class="file-input" @change="loadWasm"/>
         </div>
     </div>
-</template>
+</template>

package/lib/components/TxDialog/wasm/UpdateAdmin.vue

@@ -1,14 +1,21 @@
 <script lang="ts" setup>
 import { computed, ref } from 'vue';
+import type { PropType } from 'vue';
 import { toBase64 } from '@cosmjs/encoding'
+import type { TxParams } from '../txParams';
+
+type ContractParams = { contract?: string };
 
 const props = defineProps({
     endpoint: { type: String, required: true },
     sender: { type: String, required: true },
-    params: String,
+    params: {
+        type: Object as PropType<TxParams>,
+        default: () => ({}),
+    },
 });
 
-const params = computed(() => JSON.parse(props.params || "{}"))
+const params = computed(() => props.params as ContractParams)
 
 const newAdmin = ref("")
 const msg = ref("")
@@ -72,4 +79,4 @@ defineExpose({msgs, isValid, initial})
         </div>
 
     </div>
-</template>
+</template>

package/lib/wallet/UniClient.ts

@@ -124,7 +124,6 @@ export class UniClient {
     //         tx
     //         // txBytes: Tx.encode(tx).finish(),
     //     });
-    //     console.log(tx, request)
     //     return await post(url, request)
     // }