diff --git a/package.json b/package.json index 90c5f1c7..d98eafd5 100644 --- a/package.json +++ b/package.json @@ -35,11 +35,12 @@ "cross-fetch": "^3.1.5", "daisyui": "^2.51.6", "dayjs": "^1.11.7", + "lazy-load-vue3": "^1.3.0", "long": "^5.2.1", "md-editor-v3": "^2.8.1", "numeral": "^2.0.6", "osmojs": "^14.0.0-rc.0", - "ping-widget": "^0.0.4", + "ping-widget": "git+https://github.com/ping-pub/widget.git", "pinia": "^2.0.28", "postcss": "^8.4.23", "prismjs": "^1.29.0", diff --git a/src/components/dynamic/TextElement.vue b/src/components/dynamic/TextElement.vue index 7c9f5079..6e47043c 100644 --- a/src/components/dynamic/TextElement.vue +++ b/src/components/dynamic/TextElement.vue @@ -19,6 +19,50 @@ function isMD() { v-if="isMD()" :model-value="format.multiLine(value)" previewOnly + class="md-editor-recover" > {{ value }} + + \ No newline at end of file diff --git a/src/components/icons/IconWeb.vue b/src/components/icons/IconWeb.vue new file mode 100644 index 00000000..5e0cd0ca --- /dev/null +++ b/src/components/icons/IconWeb.vue @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/layouts/components/NavBarWallet.vue b/src/layouts/components/NavBarWallet.vue index df8c1ff7..aa7337e1 100644 --- a/src/layouts/components/NavBarWallet.vue +++ b/src/layouts/components/NavBarWallet.vue @@ -1,16 +1,23 @@ diff --git a/src/layouts/components/newFooter.vue b/src/layouts/components/newFooter.vue index 160c3d4a..3295ca87 100644 --- a/src/layouts/components/newFooter.vue +++ b/src/layouts/components/newFooter.vue @@ -31,4 +31,13 @@ > +
+ +
+ + diff --git a/src/main.ts b/src/main.ts index 4ab1ce78..d4d77977 100644 --- a/src/main.ts +++ b/src/main.ts @@ -11,6 +11,7 @@ import '@/plugins/vuetify/styles/styles.scss'; import '@/style.css'; import { createApp } from 'vue'; import { createPinia } from 'pinia'; +import LazyLoad from 'lazy-load-vue3'; // import router from "@/plugins/vuetify/router"; import router from './router'; import { useBaseStore } from './stores/useBaseStore'; @@ -25,7 +26,7 @@ app.use(vuetify); app.use(createPinia()); app.use(layoutsPlugin); app.use(router); - +app.use(LazyLoad, { component: true }); // Mount vue app app.mount('#app'); diff --git a/src/modules/[chain]/ibc/[connection_id].vue b/src/modules/[chain]/ibc/[connection_id].vue index 8c4f4136..2bd4a7ec 100644 --- a/src/modules/[chain]/ibc/[connection_id].vue +++ b/src/modules/[chain]/ibc/[connection_id].vue @@ -136,7 +136,16 @@ function color(v: string) { {{ v.version }} {{ v.ordering }} - {{ v.state }} +
+ + {{ v.state }} +
diff --git a/src/modules/[chain]/staking/[validator].vue b/src/modules/[chain]/staking/[validator].vue index d90a9823..179ab2a4 100644 --- a/src/modules/[chain]/staking/[validator].vue +++ b/src/modules/[chain]/staking/[validator].vue @@ -7,6 +7,7 @@ import { useStakingStore, } from '@/stores'; import { onMounted, computed, ref } from 'vue'; +import { Icon } from '@iconify/vue'; import ValidatorCommissionRate from '@/components/ValidatorCommissionRate.vue'; import { consensusPubkeyToHexAddress, @@ -132,31 +133,49 @@ onMounted(() => { diff --git a/src/modules/[chain]/statesync/index.vue b/src/modules/[chain]/statesync/index.vue index 296be8bf..41241b0f 100644 --- a/src/modules/[chain]/statesync/index.vue +++ b/src/modules/[chain]/statesync/index.vue @@ -38,9 +38,11 @@ onMounted(() => { diff --git a/src/pages/index.vue b/src/pages/index.vue index d1333c3d..57d2cf39 100644 --- a/src/pages/index.vue +++ b/src/pages/index.vue @@ -12,7 +12,8 @@ const dashboard = useDashboard(); dashboard.$subscribe((mutation, state) => { localStorage.setItem('favorite', JSON.stringify(state.favorite)); - dashboard.loadingPrices() + // TODO: cause endless loop + // dashboard.loadingPrices() }); const keywords = ref(''); const chains = computed(() => { diff --git a/src/stores/useWalletStore.ts b/src/stores/useWalletStore.ts index b0c9f2a4..82fc4c99 100644 --- a/src/stores/useWalletStore.ts +++ b/src/stores/useWalletStore.ts @@ -1,7 +1,12 @@ import { defineStore } from 'pinia'; import { useBlockchain } from './useBlockchain'; import { fromBech32, toBech32 } from '@cosmjs/encoding'; -import type { Delegation, Coin, UnbondingResponses, DelegatorRewards } from '@/types'; +import type { + Delegation, + Coin, + UnbondingResponses, + DelegatorRewards, +} from '@/types'; import { useStakingStore } from './useStakingStore'; export const useWalletStore = defineStore('walletStore', { @@ -18,77 +23,87 @@ export const useWalletStore = defineStore('walletStore', { return useBlockchain(); }, connectedWallet() { - const chainStore = useBlockchain() - const key = chainStore.defaultHDPath + const chainStore = useBlockchain(); + const key = chainStore.defaultHDPath; - const connected = JSON.parse(localStorage.getItem(key)||"{}") - return connected + const connected = JSON.parse(localStorage.getItem(key) || '{}'); + return connected; }, balanceOfStakingToken(): Coin { - const stakingStore = useStakingStore() - return this.balances.find( x => x.denom === stakingStore.params.bond_denom) || {amount: "0", denom: stakingStore.params.bond_denom} + const stakingStore = useStakingStore(); + return ( + this.balances.find( + (x) => x.denom === stakingStore.params.bond_denom + ) || { amount: '0', denom: stakingStore.params.bond_denom } + ); }, stakingAmount() { - let amt = 0 - let denom = '' + let amt = 0; + let denom = ''; this.delegations.forEach((i) => { - amt += Number(i.balance.amount) - denom = i.balance.denom - }) - return {amount: String(amt), denom} + amt += Number(i.balance.amount); + denom = i.balance.denom; + }); + return { amount: String(amt), denom }; }, rewardAmount() { - - const stakingStore = useStakingStore() - const reward = this.rewards.total?.find(x => x.denom === stakingStore.params.bond_denom) - return reward || {amount: "0", denom: stakingStore.params.bond_denom} + const stakingStore = useStakingStore(); + const reward = this.rewards.total?.find( + (x) => x.denom === stakingStore.params.bond_denom + ); + return reward || { amount: '0', denom: stakingStore.params.bond_denom }; }, unbondingAmount() { - let amt = 0 - let denom = '' + let amt = 0; + let denom = ''; this.unbonding.forEach((i) => { - i.entries.forEach(e => { - amt += Number(e.balance) - }) - }) + i.entries.forEach((e) => { + amt += Number(e.balance); + }); + }); - const stakingStore = useStakingStore() - return {amount: String(amt), denom: stakingStore.params.bond_denom} + const stakingStore = useStakingStore(); + return { amount: String(amt), denom: stakingStore.params.bond_denom }; }, currentAddress() { - if(this.connectedWallet.cosmosAddress) { - const {prefix, data} = fromBech32(this.connectedWallet.cosmosAddress); - const chainStore = useBlockchain() - return toBech32(chainStore.current?.bech32Prefix || prefix, data) - } else { - return "" - } - } + if (!this.connectedWallet?.cosmosAddress) return ''; + const { prefix, data } = fromBech32(this.connectedWallet.cosmosAddress); + const chainStore = useBlockchain(); + return toBech32(chainStore.current?.bech32Prefix || prefix, data); + }, }, actions: { async loadMyAsset() { - if(!this.currentAddress) return - this.blockchain.rpc.getBankBalances(this.currentAddress).then(x => { - this.balances = x.balances - }) - this.blockchain.rpc.getStakingDelegations(this.currentAddress).then(x => { - this.delegations = x.delegation_responses - }) - this.blockchain.rpc.getStakingDelegatorUnbonding(this.currentAddress).then(x => { - this.unbonding = x.unbonding_responses - }) - this.blockchain.rpc.getDistributionDelegatorRewards(this.currentAddress).then(x => { - this.rewards = x - }) + if (!this.currentAddress) return; + this.blockchain.rpc.getBankBalances(this.currentAddress).then((x) => { + this.balances = x.balances; + }); + this.blockchain.rpc + .getStakingDelegations(this.currentAddress) + .then((x) => { + this.delegations = x.delegation_responses; + }); + this.blockchain.rpc + .getStakingDelegatorUnbonding(this.currentAddress) + .then((x) => { + this.unbonding = x.unbonding_responses; + }); + this.blockchain.rpc + .getDistributionDelegatorRewards(this.currentAddress) + .then((x) => { + this.rewards = x; + }); }, myBalance() { - return this.blockchain.rpc.getBankBalances(this.currentAddress) + return this.blockchain.rpc.getBankBalances(this.currentAddress); }, myDelegations() { - return this.blockchain.rpc.getStakingDelegations(this.currentAddress) + return this.blockchain.rpc.getStakingDelegations(this.currentAddress); }, myUnbonding() { - return this.blockchain.rpc.getStakingDelegatorUnbonding(this.currentAddress) - } + return this.blockchain.rpc.getStakingDelegatorUnbonding( + this.currentAddress + ); + }, }, }); diff --git a/yarn.lock b/yarn.lock index 6641ae56..8c59e1ad 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5977,6 +5977,11 @@ knitwork@^1.0.0: resolved "https://registry.npmjs.org/knitwork/-/knitwork-1.0.0.tgz" integrity sha512-dWl0Dbjm6Xm+kDxhPQJsCBTxrJzuGl0aP9rhr+TG8D3l+GL90N8O8lYUi7dTSAN2uuDqCtNgb6aEuQH5wsiV8Q== +lazy-load-vue3@^1.3.0: + version "1.3.0" + resolved "https://registry.yarnpkg.com/lazy-load-vue3/-/lazy-load-vue3-1.3.0.tgz#6aaf573d1d09626ac11fec6b2de9fd07c0130ac0" + integrity sha512-IcyeMiDZrxzuIqqwkYkC+6RRQBdm0yTR0onIj6NITrWd6LaUlzzRmbvAmuzGB0g4H1HeVm/Oa0FokxD2lz9UAA== + ledger-cosmos-js@^2.1.8: version "2.1.8" resolved "https://registry.yarnpkg.com/ledger-cosmos-js/-/ledger-cosmos-js-2.1.8.tgz#b409ecd1e77f630e6fb212a9f602fe5c6e8f054b" @@ -6709,10 +6714,9 @@ pify@^3.0.0: resolved "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz" integrity sha512-C3FsVNH1udSEX48gGX1xfvwTWfsYWj5U+8/uK15BGzIGrKoUpghX8hWZwa/OFnakBiiVNmBvemTJR5mcy7iPcg== -ping-widget@^0.0.4: - version "0.0.4" - resolved "https://registry.yarnpkg.com/ping-widget/-/ping-widget-0.0.4.tgz#b42487cca64fe0be1a4e89c6f300630e3bcae987" - integrity sha512-FLzhgd/b+QZt2H7TucmLu8ZXiQh6Op07Usw78XlXBYVwXFtaI5PisKXzV6TftkEa5l8Q1YKMA5d8a8FwLe17HA== +"ping-widget@git+https://github.com/ping-pub/widget.git": + version "0.0.5" + resolved "git+https://github.com/ping-pub/widget.git#11de05f773e60430f332fb77b4a37e5ae8c681b2" dependencies: "@cosmjs/amino" "^0.30.1" "@cosmjs/ledger-amino" "^0.30.1"