re-organized directory structure

examples/vue-example/README.md

@@ -3,21 +3,26 @@ This example demonstrates the usage of Vue composables provided by [@interchain-
 ## Directory Structure
 ```
 ├── src/
-│   ├── codegen                   # generated by `telescope`, vue composables included
+│   ├── codegen                     # containing vue composables generated by `telescope`
 │   ├── components/
 │   │   ├── asset-list/
 │   │   ├── authz/
+│   │   ├── provide-liquidity/
+│   │   ├── stake-tokens/
 │   │   └── voting/
 │   ├── composables/
 │   │   ├── asset-list/
 │   │   ├── authz/
-│   │   ├── voting/
-│   │   ├── useAssets.ts          # get assets by chainName
-│   │   ├── useInjectiveClient.ts # get injective signing client by chainName
-│   │   └── useStargazeClient.ts  # get stargaze signing client by chainName
+│   │   ├── common/
+│   │   ├── injective/
+│   │   ├── provide-liquidity/
+│   │   ├── stake-tokens/
+│   │   └── voting/
 │   ├── utils/
 │   │   ├── asset-list/
 │   │   ├── authz/
+│   │   ├── provide-liquidity/
+│   │   ├── stake-tokens/
 │   │   └── voting/
 │   ├── views/
 │   │   ├── asset-list.vue
@@ -98,10 +103,28 @@ cosmos.bank.v1beta1.useBalance
 ```ts
 /cosmos.bank.v1beta1.MsgSend
 ```
-### Provide Liquidity
-- **Completion Status:** ⏳ In Progress...
-
 ### Stake tokens
+- **Completion Status:** ⏳ In Progress... 50% done.
+- **Functionalities:**  
+  - all validators display
+  - validators display for a specified address 
+  - claimable rewards display
+  - staked tokens display for a specified chain
+  - claim rewards
+  - manage validators
+- **Telescope generated `Vue Composables` Used:**
+```ts
+cosmos.mint.v1beta.useAnnualProvisions
+cosmos.distribution.v1beta1.useParams
+cosmos.distribution.v1beta1.useDelegationTotalRewards
+codegen.cosmos.staking.v1beta1.useDelegatorValidators
+cosmos.staking.v1beta1.useParams
+```
+- **`msgType`s are signAndBroadcasted:**
+```ts
+```
+
+### Provide Liquidity
 - **Completion Status:** ⏳ In Progress...
 
 ### Swap tokens

examples/vue-example/src/components/asset-list/assets-overview.vue

@@ -4,13 +4,13 @@ import SingleChain from './single-chain.vue';
 import { useTotalAssets } from '../../composables/asset-list/useTotalAssets';
 import { PrettyAsset } from '../../views/asset-list.vue'
 import { truncDecimals, formatDollarValue, AvailableItem, prettyAssetToTransferItem } from '../../utils/asset-list/format';
-import { useAssets } from '../../composables/useAssets';
+import { useAssets } from '../../composables/common/useAssets';
 import DropdownTransferModal from './dropdown-transfer-modal.vue'
 import RowTransferModal from './row-transfer-modal.vue';
 import BigNumber from 'bignumber.js';
 import { useDisclosure } from '../../composables/asset-list/useDisclosure';
 import { CoinDenom, Transfer } from '../../utils/asset-list/types';
-import { useChainUtils } from '../../composables/useChainUtils';
+import { useChainUtils } from '../../composables/common/useChainUtils';
 import { Coin } from 'osmojs/cosmos/base/v1beta1/coin';
 
 export type TransferValues = typeof Transfer[keyof typeof Transfer];

examples/vue-example/src/components/asset-list/transfer-modal-body.vue

@@ -4,12 +4,12 @@ import { defineProps, computed, ref } from 'vue';
 import { Transfer } from '../../utils/asset-list/types';
 import { useBalance } from '../../composables/asset-list/useBalance';
 import BigNumber from 'bignumber.js'
-import { useChainUtils } from '../../composables/useChainUtils';
+import { useChainUtils } from '../../composables/common/useChainUtils';
 import { IProps } from './row-transfer-modal.vue';
 import AssetWithdrawTokens from './asset-withdraw-tokens.vue';
 import { coins, StdFee } from '@cosmjs/amino';
 import { ibc, cosmos } from 'osmojs';
-import { useStargateClient } from '../../composables/useStargateClient';
+import { useStargateClient } from '../../composables/common/useStargateClient';
 
 const {
     transfer

examples/vue-example/src/components/authz/grant-modal.vue

@@ -6,12 +6,12 @@ import { useChain } from '@interchain-kit/vue';
 import { useAuthzTx } from '../../composables/authz/useAuthzTx';
 import { coin } from '@cosmjs/amino';
 import { shiftDigits } from '../../utils/authz/calc';
-import { useAssets } from '../../composables/useAssets';
+import { useAssets } from '../../composables/common/useAssets';
 import dayjs from 'dayjs';
 import { SendAuthorization } from "../../codegen/cosmos/bank/v1beta1/authz";
 import { GenericAuthorization } from 'osmojs/cosmos/authz/v1beta1/authz';
 import { MsgGrant } from '../../codegen/cosmos/authz/v1beta1/tx';
-import { useValidators } from '../../composables/useValidators';
+import { useValidators } from '../../composables/common/useValidators';
 import { AuthorizationType, StakeAuthorization } from '../../codegen/cosmos/staking/v1beta1/authz';
 
 type GrantModalProps = {

examples/vue-example/src/components/provide-liquidity/overview.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { computed, ref, watch } from 'vue'
-import { usePrices } from '../../composables/usePrices';
-import { useAssets } from '../../composables/useAssets';
+import { usePrices } from '../../composables/common/usePrices';
+import { useAssets } from '../../composables/common/useAssets';
 import { useEpochs } from '../../composables/provide-liquidity/useEpochs';
 import dayjs from 'dayjs';
 import duration from 'dayjs/plugin/duration';

examples/vue-example/src/components/stake-tokens/overview.vue

@@ -2,8 +2,8 @@
 import { Box} from '@interchain-ui/vue'
 import { ref, defineProps, computed } from 'vue'
 import { ParsedRewards } from '../../utils/stake-tokens/staking';
-import { Prices } from '../../composables/usePrices';
-import { useAssets } from '../../composables/useAssets';
+import { Prices } from '../../composables/common/usePrices';
+import { useAssets } from '../../composables/common/useAssets';
 import { sum, calcDollarValue, isGreaterThanZero } from '../../utils/stake-tokens/math';
 const props = defineProps<{
   balance: string,

examples/vue-example/src/components/voting/proposal.vue

@@ -5,7 +5,7 @@ import { Proposal, ProposalStatus } from '../../codegen/cosmos/gov/v1/gov'
 import { formatDate } from '../../utils/voting';
 import { useVoting } from '../../composables/voting/useVoting';
 import { exponentiate, percent } from '../../utils/voting';
-import { useAssets } from '../../composables/useAssets';
+import { useAssets } from '../../composables/common/useAssets';
 export interface Votes {
   [key: string]: number;
 }

examples/vue-example/src/composables/asset-list/useBalance.ts

@@ -1,7 +1,7 @@
 import { computed, Ref, watch } from 'vue'
 import { useChain } from '@interchain-kit/vue'
 import { osmosis } from 'osmojs'
-import { useAssets } from '../useAssets'
+import { useAssets } from '../common/useAssets'
 import { useQuery } from '@tanstack/vue-query'
 
 export const useBalance = (chainName: Ref<string>, displayDenom?: string) => {

examples/vue-example/src/composables/asset-list/useTotalAssets.ts

@@ -1,10 +1,10 @@
 import { useChain } from '@interchain-kit/vue'
 import { Ref, computed } from 'vue'
 import { useBalances, useDelegations, useLockedCoins, usePools } from './useOsmosQueries'
-import { usePrices } from '../usePrices'
+import { usePrices } from '../common/usePrices'
 import BigNumber from 'bignumber.js';
-import { usePoolUtils } from '../usePoolUtils';
-import { useChainUtils } from '../useChainUtils';
+import { usePoolUtils } from '../common/usePoolUtils';
+import { useChainUtils } from '../common/useChainUtils';
 
 export const useTotalAssets = (chainName: Ref<string>) => {
   const { rpcEndpoint, address } = useChain(chainName)

examples/vue-example/src/composables/authz/useAuthzTx.ts

@@ -6,9 +6,9 @@ import { StakeAuthorization } from "../../codegen/cosmos/staking/v1beta1/authz";
 import { Permission } from "../../utils/authz/permissions";
 import { Ref } from 'vue'
 import { useChain } from "@interchain-kit/vue";
-import { useStargateClient } from "../useStargateClient";
+import { useStargateClient } from "../common/useStargateClient";
 import { coins, StdFee } from "@cosmjs/amino";
-import { useAssets } from "../useAssets";
+import { useAssets } from "../common/useAssets";
 
 export type GrantMsg =
   | {

examples/vue-example/src/composables/useBalance.ts → examples/vue-example/src/composables/common/useBalance.ts

@@ -1,9 +1,9 @@
 import { Ref, computed } from 'vue'
 import { useChain } from '@interchain-kit/vue'
-import { useRpcClient } from '../codegen';
-import { createRpcQueryHooks } from '../codegen/cosmos/bank/v1beta1/query.rpc.Query';
+import { useRpcClient } from '../../codegen';
+import { createRpcQueryHooks } from '../../codegen/cosmos/bank/v1beta1/query.rpc.Query';
 import { useAssets } from './useAssets';
-import { shiftDigits } from '../utils/stake-tokens/math';
+import { shiftDigits } from '../../utils/stake-tokens/math';
 
 export const useBalance = (chainName: Ref<string>) => {
   const { rpcEndpoint, address } = useChain(chainName)

examples/vue-example/src/composables/useBalances.ts → examples/vue-example/src/composables/common/useBalances.ts

@@ -1,7 +1,7 @@
 import { Ref, computed } from 'vue'
 import { useChain } from '@interchain-kit/vue'
-import { useRpcClient } from '../codegen';
-import { createRpcQueryHooks } from '../codegen/cosmos/bank/v1beta1/query.rpc.Query';
+import { useRpcClient } from '../../codegen';
+import { createRpcQueryHooks } from '../../codegen/cosmos/bank/v1beta1/query.rpc.Query';
 
 export const getPagination = (limit: bigint) => ({
   limit,

examples/vue-example/src/composables/useChainUtils.ts → examples/vue-example/src/composables/common/useChainUtils.ts

@@ -6,7 +6,7 @@ import { Asset } from '@chain-registry/types';
 import { ibc } from 'chain-registry'
 import { Coin } from 'osmojs/cosmos/base/v1beta1/coin';
 import BigNumber from 'bignumber.js'
-import { CoinDenom, CoinSymbol, Exponent, PriceHash } from '../utils/asset-list/types';
+import { CoinDenom, CoinSymbol, Exponent, PriceHash } from '../../utils/asset-list/types';
 
 
 export const useChainUtils = (chainName: Ref<string>) => {

examples/vue-example/src/composables/useDelegatorDelegations.ts → examples/vue-example/src/composables/common/useDelegatorDelegations.ts

@@ -1,8 +1,8 @@
 import { Ref, computed } from 'vue'
 import { useChain } from '@interchain-kit/vue'
-import { useRpcClient } from '../codegen';
-import { createRpcQueryHooks } from '../codegen/cosmos/staking/v1beta1/query.rpc.Query';
-import { ParsedDelegations, parseDelegations } from '../utils/stake-tokens/staking';
+import { useRpcClient } from '../../codegen';
+import { createRpcQueryHooks } from '../../codegen/cosmos/staking/v1beta1/query.rpc.Query';
+import { ParsedDelegations, parseDelegations } from '../../utils/stake-tokens/staking';
 import { useAssets } from './useAssets';
 
 export const useDelegationDelegators = (chainName: Ref<string>) => {

examples/vue-example/src/composables/useInjectiveClient.ts → examples/vue-example/src/composables/common/useInjectiveClient.ts

@@ -3,7 +3,7 @@ import { Ref, computed, ref, watch } from 'vue'
 import { ExtensionWallet } from '@interchain-kit/core'
 import { useChain, useWalletManager } from '@interchain-kit/vue'
 import { toEncoders, toConverters } from '@interchainjs/cosmos/utils';
-import { MsgSend } from '../codegen/cosmos/bank/v1beta1/tx';
+import { MsgSend } from '../../codegen/cosmos/bank/v1beta1/tx';
 
 export const useInjectiveClient = (chainName: Ref<string>) => {
   const { rpcEndpoint, chain } = useChain(chainName)

examples/vue-example/src/composables/usePool.ts → examples/vue-example/src/composables/common/usePool.ts

@@ -1,8 +1,8 @@
 import { Ref, computed } from 'vue'
 import { useChain } from '@interchain-kit/vue'
-import { useRpcClient } from '../codegen';
-import { createRpcQueryHooks } from '../codegen/cosmos/staking/v1beta1/query.rpc.Query';
-import { Pool } from '../codegen/cosmos/staking/v1beta1/staking';
+import { useRpcClient } from '../../codegen';
+import { createRpcQueryHooks } from '../../codegen/cosmos/staking/v1beta1/query.rpc.Query';
+import { Pool } from '../../codegen/cosmos/staking/v1beta1/staking';
 
 export const usePool = (chainName: Ref<string>) => {
   const { rpcEndpoint } = useChain(chainName)

examples/vue-example/src/composables/usePoolUtils.ts → examples/vue-example/src/composables/common/usePoolUtils.ts

@@ -1,11 +1,11 @@
 import { Coin } from "osmojs";
 // import { Pool } from "osmojs/osmosis/gamm/v1beta1/balancerPool";
 import BigNumber from 'bignumber.js';
-import { PriceHash } from "../utils/asset-list/types";
+import { PriceHash } from "../../utils/asset-list/types";
 import { useChainUtils } from "./useChainUtils";
 import { Ref } from 'vue'
-import { Pool } from "../codegen/osmosis/gamm/pool-models/balancer/balancerPool";
-import { Fee } from "./provide-liquidity/useFees";
+import { Pool } from "../../codegen/osmosis/gamm/pool-models/balancer/balancerPool";
+import { Fee } from "./../provide-liquidity/useFees";
 
 interface ExtendPoolProps {
   pool: Pool;

examples/vue-example/src/composables/usePools.ts → examples/vue-example/src/composables/common/usePools.ts

@@ -1,8 +1,8 @@
 import { Ref, computed } from 'vue'
 import { useChain } from '@interchain-kit/vue'
-import { useRpcClient } from '../codegen';
-import { createRpcQueryHooks } from '../codegen/osmosis/gamm/v1beta1/query.rpc.Query';
-import { Pool } from '../codegen/osmosis/gamm/pool-models/balancer/balancerPool';
+import { useRpcClient } from '../../codegen';
+import { createRpcQueryHooks } from '../../codegen/osmosis/gamm/v1beta1/query.rpc.Query';
+import { Pool } from '../../codegen/osmosis/gamm/pool-models/balancer/balancerPool';
 
 export const getPagination = (limit: bigint) => ({
   limit,

examples/vue-example/src/composables/useValidators.ts → examples/vue-example/src/composables/common/useValidators.ts

@@ -1,10 +1,10 @@
 import { useChain } from '@interchain-kit/vue'
 import { Ref, computed } from 'vue'
-import { useRpcClient } from '../codegen'
-import { cosmos } from '../codegen'
-import { createRpcQueryHooks } from '../codegen/cosmos/staking/v1beta1/query.rpc.Query'
+import { useRpcClient } from '../../codegen'
+import { cosmos } from '../../codegen'
+import { createRpcQueryHooks } from '../../codegen/cosmos/staking/v1beta1/query.rpc.Query'
 import BigNumber from 'bignumber.js';
-import { parseValidators } from '../utils/authz/staking'
+import { parseValidators } from '../../utils/authz/staking'
 
 export const useValidators = (chainName: Ref<string>) => {
   const { rpcEndpoint, address } = useChain(chainName)

examples/vue-example/src/composables/injective/useBalance.ts

@@ -3,7 +3,7 @@ import { Ref, computed } from 'vue'
 import { useChain } from '@interchain-kit/vue';
 import { useRpcClient } from '../../codegen';
 import { createRpcQueryHooks } from '../../codegen/cosmos/bank/v1beta1/query.rpc.Query';
-import { useAssets } from '../useAssets';
+import { useAssets } from '../common/useAssets';
 import BigNumber from "bignumber.js";
 
 export const useBalance = (chainName: Ref<string>) => {

examples/vue-example/src/composables/provide-liquidity/usePoolsData.ts

@@ -1,13 +1,13 @@
 import { Ref, computed } from 'vue'
 import { useChain } from '@interchain-kit/vue'
 import { useRpcClient } from '../../codegen';
-import { usePools } from '../usePools';
-import { useBalances } from '../useBalances';
-import { usePrices } from '../usePrices';
+import { usePools } from '../common/usePools';
+import { useBalances } from '../common/useBalances';
+import { usePrices } from '../common/usePrices';
 import { Pool } from '../../codegen/osmosis/gamm/pool-models/balancer/balancerPool';
 import { PriceHash } from '../../utils/asset-list/types';
-import { useAssets } from '../useAssets';
-import { usePoolUtils } from '../usePoolUtils';
+import { useAssets } from '../common/useAssets';
+import { usePoolUtils } from '../common/usePoolUtils';
 import { useFees } from './useFees';
 
 export const usePoolsData = (chainName: Ref<string>) => {

examples/vue-example/src/composables/stake-tokens/useDelegationTotalRewards.ts

@@ -3,7 +3,7 @@ import { useChain } from '@interchain-kit/vue'
 import { useRpcClient } from '../../codegen';
 import { createRpcQueryHooks } from '../../codegen/cosmos/distribution/v1beta1/query.rpc.Query';
 import { ParsedRewards, parseRewards } from '../../utils/stake-tokens/staking';
-import { useAssets } from '../useAssets';
+import { useAssets } from '../common/useAssets';
 
 export const useDelegationTotalRewards = (chainName: Ref<string>) => {
   const { rpcEndpoint, address } = useChain(chainName)

examples/vue-example/src/composables/stake-tokens/useStakingData.ts

@@ -1,16 +1,16 @@
 import { Ref, computed } from 'vue'
 import { useChain } from '@interchain-kit/vue'
 import { useRpcClient } from '../../codegen'
-import { useBalance } from '../useBalance'
+import { useBalance } from '../common/useBalance'
 import { useDelegationValidators } from './useDelegationValidators'
 import { useDelegationTotalRewards } from './useDelegationTotalRewards'
-import { useValidators } from '../useValidators'
-import { useDelegationDelegators } from '../useDelegatorDelegations'
+import { useValidators } from '../common/useValidators'
+import { useDelegationDelegators } from '../common/useDelegatorDelegations'
 import { useParams } from './useParams'
 import { useAnnualProvisions } from './useAnnualProvisions'
 import { useCommunityTax } from './useCommunityTax'
 import { calcTotalDelegation, extendValidators } from '../../utils/stake-tokens/staking'
-import { usePool } from '../usePool'
+import { usePool } from '../common/usePool'
 
 export const useStakingData = (chainName: Ref<string>) => {
   const { rpcEndpoint, address } = useChain(chainName)

examples/vue-example/src/composables/voting/useVoting.ts

@@ -3,8 +3,8 @@ import { Proposal } from "../../codegen/cosmos/gov/v1/gov";
 import { computed, ref, Ref } from 'vue'
 import { MessageComposer } from "../../codegen/cosmos/gov/v1/tx.registry";
 import { coins, StdFee } from "@cosmjs/amino";
-import { useAssets } from "../useAssets";
-import { useStargateClient } from "../useStargateClient";
+import { useAssets } from "../common/useAssets";
+import { useStargateClient } from "../common/useStargateClient";
 
 export type useVotingOptions = {
   chainName: Ref<string>;

examples/vue-example/src/utils/stake-tokens/math.ts

@@ -1,5 +1,5 @@
 import BigNumber from 'bignumber.js';
-import { Prices } from '../../composables/usePrices';
+import { Prices } from '../../composables/common/usePrices';
 
 export const shiftDigits = (
   num: string | number,

examples/vue-example/src/views/index.vue

@@ -12,6 +12,7 @@ import WalletSection from '../components/asset-list/wallet/wallet.vue'
   <div><router-link to="/voting">Go to voting</router-link></div>
   <div><router-link to="/injective">Go to injective</router-link></div>
   <div><router-link to="/provide-liquidity">Go to provide liquidity</router-link></div>
+  <div><router-link to="/stake-tokens">Stake Tokens</router-link></div>
 </Layout>
 </template>
 

examples/vue-example/src/views/injective.vue

@@ -4,7 +4,7 @@ import { computed, ref } from 'vue'
 import { useBalance } from '../composables/injective/useBalance';
 import { useChain } from '@interchain-kit/vue';
 import { cosmos } from '../codegen';
-import { useInjectiveClient } from '../composables/useInjectiveClient';
+import { useInjectiveClient } from '../composables/common/useInjectiveClient';
 
 const chainName = ref('injective')
 const injectiveClient = useInjectiveClient(chainName)

examples/vue-example/src/views/stake-tokens.vue

@@ -3,7 +3,7 @@ import { Box} from '@interchain-ui/vue'
 import { ref } from 'vue'
 import { useStakingData } from '../composables/stake-tokens/useStakingData';
 import Overview from '../components/stake-tokens/overview.vue';
-import { usePrices } from '../composables/usePrices';
+import { usePrices } from '../composables/common/usePrices';
 const chainName = ref('osmosis')
 const { rewards, balance, totalDelegated, allValidators } = useStakingData(chainName)
 const { prices } = usePrices(chainName)